fix(groups): remove outdated group FAQ modal
This commit is contained in:
Sabe Jones
@@ -1,377 +0,0 @@
|
||||
<template>
|
||||
<b-modal
|
||||
id="group-plan-overview"
|
||||
title="Empty"
|
||||
size="lg"
|
||||
hide-footer="hide-footer"
|
||||
>
|
||||
<div
|
||||
slot="modal-header"
|
||||
class="header-wrap text-center"
|
||||
>
|
||||
<h2 v-once>
|
||||
{{ $t('gettingStarted') }}
|
||||
</h2>
|
||||
<p v-once>
|
||||
{{ $t('congratsOnGroupPlan') }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div
|
||||
class="card"
|
||||
:class="{expanded: expandedQuestions.question1}"
|
||||
>
|
||||
<div class="question-head">
|
||||
<div class="q">
|
||||
Q.
|
||||
</div>
|
||||
<div class="title">
|
||||
{{ $t('whatsIncludedGroup') }}
|
||||
</div>
|
||||
<div
|
||||
class="arrow float-right"
|
||||
@click="toggle('question1')"
|
||||
>
|
||||
<div
|
||||
v-if="expandedQuestions.question1"
|
||||
class="svg-icon"
|
||||
v-html="icons.upIcon"
|
||||
></div>
|
||||
<div
|
||||
v-else
|
||||
class="svg-icon"
|
||||
v-html="icons.downIcon"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="expandedQuestions.question1"
|
||||
class="question-body"
|
||||
>
|
||||
<p>{{ $t('whatsIncludedGroupDesc') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div
|
||||
class="card"
|
||||
:class="{expanded: expandedQuestions.question2}"
|
||||
>
|
||||
<div class="question-head">
|
||||
<div class="q">
|
||||
Q.
|
||||
</div>
|
||||
<div class="title">
|
||||
{{ $t('howDoesBillingWork') }}
|
||||
</div>
|
||||
<div
|
||||
class="arrow float-right"
|
||||
@click="toggle('question2')"
|
||||
>
|
||||
<div
|
||||
v-if="expandedQuestions.question2"
|
||||
class="svg-icon"
|
||||
v-html="icons.upIcon"
|
||||
></div>
|
||||
<div
|
||||
v-else
|
||||
class="svg-icon"
|
||||
v-html="icons.downIcon"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="expandedQuestions.question2"
|
||||
class="question-body"
|
||||
>
|
||||
<p>{{ $t('howDoesBillingWorkDesc') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div
|
||||
class="card"
|
||||
:class="{expanded: expandedQuestions.question3}"
|
||||
>
|
||||
<div class="question-head">
|
||||
<div class="q">
|
||||
Q.
|
||||
</div>
|
||||
<div class="title">
|
||||
{{ $t('howToAssignTask') }}
|
||||
</div>
|
||||
<div
|
||||
class="arrow float-right"
|
||||
@click="toggle('question3')"
|
||||
>
|
||||
<div
|
||||
v-if="expandedQuestions.question3"
|
||||
class="svg-icon"
|
||||
v-html="icons.upIcon"
|
||||
></div>
|
||||
<div
|
||||
v-else
|
||||
class="svg-icon"
|
||||
v-html="icons.downIcon"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="expandedQuestions.question3"
|
||||
class="question-body"
|
||||
>
|
||||
<p>{{ $t('howToAssignTaskDesc') }}</p>
|
||||
<div class="assign-tasks image-example"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div
|
||||
class="card"
|
||||
:class="{expanded: expandedQuestions.question4}"
|
||||
>
|
||||
<div class="question-head">
|
||||
<div class="q">
|
||||
Q.
|
||||
</div>
|
||||
<div class="title">
|
||||
{{ $t('howToRequireApproval') }}
|
||||
</div>
|
||||
<div
|
||||
class="arrow float-right"
|
||||
@click="toggle('question4')"
|
||||
>
|
||||
<div
|
||||
v-if="expandedQuestions.question4"
|
||||
class="svg-icon"
|
||||
v-html="icons.upIcon"
|
||||
></div>
|
||||
<div
|
||||
v-else
|
||||
class="svg-icon"
|
||||
v-html="icons.downIcon"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="expandedQuestions.question4"
|
||||
class="question-body"
|
||||
>
|
||||
<p>{{ $t('howToRequireApprovalDesc') }}</p>
|
||||
<div class="requires-approval image-example"></div>
|
||||
<p>{{ $t('howToRequireApprovalDesc2') }}</p>
|
||||
<div class="approval-requested image-example"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div
|
||||
class="card"
|
||||
:class="{expanded: expandedQuestions.question5}"
|
||||
>
|
||||
<div class="question-head">
|
||||
<div class="q">
|
||||
Q.
|
||||
</div>
|
||||
<div class="title">
|
||||
{{ $t('whatIsGroupManager') }}
|
||||
</div>
|
||||
<div
|
||||
class="arrow float-right"
|
||||
@click="toggle('question5')"
|
||||
>
|
||||
<div
|
||||
v-if="expandedQuestions.question5"
|
||||
class="svg-icon"
|
||||
v-html="icons.upIcon"
|
||||
></div>
|
||||
<div
|
||||
v-else
|
||||
class="svg-icon"
|
||||
v-html="icons.downIcon"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="expandedQuestions.question5"
|
||||
class="question-body"
|
||||
>
|
||||
<p>{{ $t('whatIsGroupManagerDesc') }}</p>
|
||||
<div class="promote-leader image-example"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<button
|
||||
class="btn btn-primary close-button"
|
||||
@click="close()"
|
||||
>
|
||||
{{ $t('goToTaskBoard') }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</b-modal>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
#group-plan-overview___BV_modal_header_ {
|
||||
border-bottom: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import url('https://fonts.googleapis.com/css?family=Varela+Round');
|
||||
|
||||
.header-wrap {
|
||||
padding-left: 4em;
|
||||
padding-right: 4em;
|
||||
|
||||
h2 {
|
||||
font-size: 32px;
|
||||
font-weight: bold;
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #878190;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.row {
|
||||
margin-bottom: 2em;
|
||||
|
||||
.col-12 {
|
||||
margin-bottom: .5em;
|
||||
}
|
||||
}
|
||||
|
||||
.card.expanded {
|
||||
padding-bottom: 1em;
|
||||
|
||||
.title {
|
||||
color: #4f2a93;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
min-height: 60px;
|
||||
border-radius: 4px;
|
||||
background-color: #ffffff;
|
||||
border: none;
|
||||
box-shadow: 0 2px 2px 0 rgba(26, 24, 29, 0.16), 0 1px 4px 0 rgba(26, 24, 29, 0.12);
|
||||
|
||||
.question-head {
|
||||
.q {
|
||||
font-family: 'Varela Round', sans-serif;
|
||||
font-size: 20px;
|
||||
color: #a5a1ac;
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
div {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
margin: 1em;
|
||||
padding-top: .9em;
|
||||
|
||||
.svg-icon {
|
||||
width: 26px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.arrow:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.question-body {
|
||||
padding-left: 4.4em;
|
||||
padding-right: 4em;
|
||||
|
||||
p {
|
||||
color: #4e4a57;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.image-example {
|
||||
background-repeat: no-repeat;
|
||||
margin: 0 auto;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.assign-tasks {
|
||||
background-image: url('~@/assets/images/group-plans/assign-task@3x.png');
|
||||
width: 400px;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.requires-approval {
|
||||
background-image: url('~@/assets/images/group-plans/requires-approval@3x.png');
|
||||
width: 402px;
|
||||
height: 20px;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.approval-requested {
|
||||
background-image: url('~@/assets/images/group-plans/approval-requested@3x.png');
|
||||
width: 471px;
|
||||
height: 204px;
|
||||
}
|
||||
|
||||
.promote-leader {
|
||||
background-image: url('~@/assets/images/group-plans/promote-leader@3x.png');
|
||||
width: 423px;
|
||||
height: 185px;
|
||||
}
|
||||
|
||||
.close-button {
|
||||
margin-top: 1em;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import { mapState } from '@/libs/store';
|
||||
|
||||
import upIcon from '@/assets/svg/up.svg';
|
||||
import downIcon from '@/assets/svg/down.svg';
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
icons: Object.freeze({
|
||||
upIcon,
|
||||
downIcon,
|
||||
}),
|
||||
expandedQuestions: {
|
||||
question1: false,
|
||||
question2: false,
|
||||
question3: false,
|
||||
question4: false,
|
||||
question5: false,
|
||||
},
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapState({ user: 'user.data' }),
|
||||
},
|
||||
methods: {
|
||||
toggle (question) {
|
||||
this.expandedQuestions[question] = !this.expandedQuestions[question];
|
||||
},
|
||||
close () {
|
||||
this.$root.$emit('bv::hide::modal', 'group-plan-overview');
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -3,7 +3,6 @@
|
||||
class="standard-page"
|
||||
@click="openCreateBtn ? openCreateBtn = false : null"
|
||||
>
|
||||
<group-plan-overview-modal />
|
||||
<task-modal
|
||||
ref="taskModal"
|
||||
:task="workingTask"
|
||||
@@ -187,7 +186,6 @@ import taskDefaults from '@/../../common/script/libs/taskDefaults';
|
||||
import TaskColumn from '../tasks/column';
|
||||
import TaskModal from '../tasks/taskModal';
|
||||
import TaskSummary from '../tasks/taskSummary';
|
||||
import GroupPlanOverviewModal from './groupPlanOverviewModal';
|
||||
import toggleSwitch from '@/components/ui/toggleSwitch';
|
||||
|
||||
import sync from '../../mixins/sync';
|
||||
@@ -208,7 +206,6 @@ export default {
|
||||
TaskColumn,
|
||||
TaskModal,
|
||||
TaskSummary,
|
||||
GroupPlanOverviewModal,
|
||||
toggleSwitch,
|
||||
},
|
||||
mixins: [sync],
|
||||
@@ -309,10 +306,6 @@ export default {
|
||||
if (!this.searchId) this.searchId = this.groupId;
|
||||
this.load();
|
||||
|
||||
if (this.$route.query.showGroupOverview) {
|
||||
this.$root.$emit('bv::show::modal', 'group-plan-overview');
|
||||
}
|
||||
|
||||
this.$root.$on('habitica:team-sync', () => {
|
||||
this.loadTasks();
|
||||
this.loadGroupCompletedTodos();
|
||||
|
||||
@@ -37,15 +37,6 @@ export default function handleRedirect (to, from, next) {
|
||||
|
||||
const newGroup = newAppState.group;
|
||||
if (newGroup && newGroup._id) {
|
||||
// Handle new user signup
|
||||
if (newAppState.newSignup === true) {
|
||||
return next({
|
||||
name: 'groupPlanDetailTaskInformation',
|
||||
params: { groupId: newGroup._id },
|
||||
query: { showGroupOverview: 'true' },
|
||||
});
|
||||
}
|
||||
|
||||
return next({
|
||||
name: 'groupPlanDetailTaskInformation',
|
||||
params: { groupId: newGroup._id },
|
||||
|
||||
Reference in New Issue
Block a user