Merge branch 'dev' of git.treelet.net:crane/retailer-vue into beta
This commit is contained in:
sidharth
commit
e4e8a8dac8
|
|
@ -14,6 +14,47 @@ export default [
|
|||
redirect: '/b2b',
|
||||
component: () => import(/* webpackChunkName: "meModule" */ '@/components/retailer/layout/Layout.vue'),
|
||||
children: [
|
||||
|
||||
{
|
||||
path: 'order',
|
||||
name: 'BoxedOrderHistoryPage',
|
||||
component: () => import(/* webpackChunkName: "meModule" */ '@/routes/retailer/boxed_order_history.vue'),
|
||||
meta: {
|
||||
breadcrumb: {
|
||||
label: 'Boxed Order History Page',
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'personalized-order-summary',
|
||||
name: 'PersonalizedOrderSummaryPage',
|
||||
component: () => import(/* webpackChunkName: "meModule" */ '@/routes/retailer/personalized_order_status.vue'),
|
||||
meta: {
|
||||
breadcrumb: {
|
||||
label: 'Personalized Order Status Page',
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'resources',
|
||||
name: 'ResourcesPage',
|
||||
component: () => import(/* webpackChunkName: "meModule" */ '@/routes/retailer/resources.vue'),
|
||||
meta: {
|
||||
breadcrumb: {
|
||||
label: 'Resources Page',
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'pds',
|
||||
name: 'PDSPage',
|
||||
component: () => import(/* webpackChunkName: "meModule" */ '@/routes/retailer/pds.vue'),
|
||||
meta: {
|
||||
breadcrumb: {
|
||||
label: 'PDS Page',
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'b2b',
|
||||
name: 'AccountDashboard',
|
||||
|
|
@ -54,7 +95,6 @@ export default [
|
|||
},
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
path: 'my-orders',
|
||||
name: 'MyOrders',
|
||||
|
|
@ -130,6 +170,72 @@ export default [
|
|||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'boxed-products-ordering',
|
||||
name: 'BoxedProductsOrdering',
|
||||
component: () => import( /* webpackChunkName: "Resources" */'@/routes/retailer/boxed-products-ordering.vue'),
|
||||
meta: {
|
||||
"canonical": true,
|
||||
breadcrumb: {
|
||||
label: 'Boxed Products Ordering Page' ,
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'personalized-products-ordering',
|
||||
name: 'PersonalizedProductsOrdering',
|
||||
component: () => import( /* webpackChunkName: "Resources" */'@/routes/retailer/personalized-products-ordering.vue'),
|
||||
meta: {
|
||||
"canonical": true,
|
||||
breadcrumb: {
|
||||
label: 'Personalized Products Ordering Page' ,
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'marketing-tools-promotions',
|
||||
name: 'MarketingToolsPromotions',
|
||||
component: () => import( /* webpackChunkName: "Resources" */'@/routes/retailer/marketing-tools-promotions.vue'),
|
||||
meta: {
|
||||
"canonical": true,
|
||||
breadcrumb: {
|
||||
label: 'Marketing Tools Promotions Page' ,
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'retailer-communications',
|
||||
name: 'RetailerCommunications',
|
||||
component: () => import( /* webpackChunkName: "Resources" */'@/routes/retailer/retailer-communications.vue'),
|
||||
meta: {
|
||||
"canonical": true,
|
||||
breadcrumb: {
|
||||
label: 'Retailer Communications Page' ,
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'training',
|
||||
name: 'Training',
|
||||
component: () => import( /* webpackChunkName: "Resources" */'@/routes/retailer/training.vue'),
|
||||
meta: {
|
||||
"canonical": true,
|
||||
breadcrumb: {
|
||||
label: 'Training Page' ,
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'contact-us',
|
||||
name: 'ContactUs',
|
||||
component: () => import( /* webpackChunkName: "Resources" */'@/routes/retailer/contact-us.vue'),
|
||||
meta: {
|
||||
"canonical": true,
|
||||
breadcrumb: {
|
||||
label: 'Contact Us Page' ,
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
]
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1,218 +1,173 @@
|
|||
<template>
|
||||
<v-container>
|
||||
<v-overlay :value="cartProductsProgress" :opacity="0.8">
|
||||
<v-container>
|
||||
<v-container-fluid>
|
||||
<v-row class="pl-10 pr-10">
|
||||
<v-col cols="12" sm="12" md="12" lg="12" class="">
|
||||
<div class="h3 text-capitalize body-font1">Retailer dashboard</div>
|
||||
<div class="fontsize-18 py-5">
|
||||
<b>Holiday Cutoff:</b> The deadline to submit your personalized order
|
||||
to receive in time for christmas exired on 12/1.
|
||||
</div>
|
||||
|
||||
<v-row>
|
||||
<v-col cols="12" class="d-flex justify-center align-center">
|
||||
<div
|
||||
class="h3 white--text mt-10"
|
||||
>Please wait while fetching your profile details</div>
|
||||
<v-col cols="12" sm="12" md="6" lg="4">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none"
|
||||
:to="{ name: 'CheckoutPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="
|
||||
border
|
||||
height-130px
|
||||
v-btn--outlined
|
||||
d-flex
|
||||
justify-center
|
||||
align-center
|
||||
"
|
||||
>
|
||||
Boxed Order New Order
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</v-col>
|
||||
<v-col cols="12" class="d-flex justify-center align-center">
|
||||
<v-progress-circular
|
||||
indeterminate
|
||||
size="80"
|
||||
color="white"
|
||||
align="center"
|
||||
justify="center"
|
||||
></v-progress-circular>
|
||||
<v-col cols="12" sm="12" md="6" lg="4">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none"
|
||||
:to="{ name: 'BoxedOrderHistoryPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="
|
||||
border
|
||||
height-130px
|
||||
v-btn--outlined
|
||||
d-flex
|
||||
justify-center
|
||||
align-center
|
||||
"
|
||||
>
|
||||
Boxed Order History
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="12" md="6" lg="4">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none"
|
||||
:to="{ name: 'PersonalizedOrderSummaryPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="
|
||||
border
|
||||
height-130px
|
||||
v-btn--outlined
|
||||
d-flex
|
||||
justify-center
|
||||
align-center
|
||||
"
|
||||
>
|
||||
Personalized Order Status
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="12" md="6" lg="4">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none"
|
||||
:to="{ name: 'ResourcesPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="
|
||||
border
|
||||
height-130px
|
||||
v-btn--outlined
|
||||
d-flex
|
||||
justify-center
|
||||
align-center
|
||||
"
|
||||
>
|
||||
Resources
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="12" md="6" lg="4">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link target="_blank"
|
||||
class="text-decoration-none"
|
||||
:to="{ name: 'PDSPage' }"
|
||||
>
|
||||
<div
|
||||
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="
|
||||
border
|
||||
height-130px
|
||||
v-btn--outlined
|
||||
d-flex
|
||||
justify-center
|
||||
align-center
|
||||
"
|
||||
>
|
||||
PDS
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-overlay>
|
||||
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<!--<v-alert
|
||||
class="alert-box-outline"
|
||||
type="error"
|
||||
text
|
||||
dense
|
||||
v-if="errorMessage && hideShow"
|
||||
>{{errorMessage}}</v-alert>-->
|
||||
<!--<v-alert class="alert-box-outline" type="success" text dense v-if="successMessage && hideShow">
|
||||
{{successMessage}}
|
||||
</v-alert>-->
|
||||
<p class="mb-8 h2 body-font text-uppercase primary--text">My Dashboard</p>
|
||||
<div>
|
||||
<p class="mt-4 h3 body-font text-uppercase primary--text">Account Information</p>
|
||||
<div class="account-dashboard-line my-5"></div>
|
||||
<v-row class="mt-5" justify="center" v-if="inProgress">
|
||||
<v-progress-circular :size="60" color="primary" indeterminate></v-progress-circular>
|
||||
</v-row>
|
||||
<v-row class="mt-4" v-else>
|
||||
<v-col cols="12" sm="6" md="6" lg="6">
|
||||
<p class="body-font text-uppercase primary--text">Contact Information</p>
|
||||
<p class="mb-0 body-font">{{ basicInfo.firstname}} {{ basicInfo.lastname}}</p>
|
||||
<p class="body-font">{{ basicInfo.email}}</p>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none"
|
||||
:to="{name:'EditAccountInfo',params:{value:'false'}}"
|
||||
>
|
||||
<v-btn
|
||||
depressed
|
||||
large
|
||||
tile
|
||||
class="mr-3 my-3 body-font account-dashboard-button"
|
||||
:outlined="hover"
|
||||
:color="hover?'white':'primary'"
|
||||
:class="hover?'primary--text':'white--text'"
|
||||
>EDIT</v-btn>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
<!-- <router-link class="text-decoration-none" :to="{name:'EditAccountInfo',params:{value:'true'}}">
|
||||
<v-btn depressed large tile color="success" class="body-font my-2">CHANGE PASSWORD</v-btn>
|
||||
</router-link>-->
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="6" md="6" lg="6">
|
||||
<p class="body-font text-uppercase primary--text">Newsletters</p>
|
||||
<p v-if="basicInfo.extensionAttributes.isSubscribed" class="body-font">You are subscribed to our "Newsletter Subscription"</p>
|
||||
<p v-else class="body-font">You are not subscribed to our "Newsletter Subscription"</p>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link class="text-decoration-none" :to="{name:'NewsLetterSubscription'}">
|
||||
<v-btn
|
||||
depressed
|
||||
large
|
||||
tile
|
||||
:outlined="hover"
|
||||
:color="hover?'white':'primary'"
|
||||
:class="hover?'primary--text':'white--text'"
|
||||
class="body-font my-2 account-dashboard-button"
|
||||
>EDIT</v-btn>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</div>
|
||||
<div>
|
||||
<v-col>
|
||||
<v-row class="mt-4">
|
||||
<p class="h3 body-font text-uppercase primary--text mb-1 mr-3">Address Book</p>
|
||||
<!-- <v-hover>
|
||||
<router-link
|
||||
to
|
||||
@click.native="routeToPage('AddressBook')"
|
||||
class="mb-1 body-font mt-sm-3 mt-2 text-decoration-none primary-focus contentColor--text"
|
||||
>Manage Addressess</router-link>
|
||||
</v-hover>-->
|
||||
</v-row>
|
||||
</v-col>
|
||||
<div class="account-dashboard-line my-1"></div>
|
||||
<v-row class="mt-6" justify="center" v-if="inProgress">
|
||||
<v-progress-circular :size="60" color="primary" indeterminate></v-progress-circular>
|
||||
</v-row>
|
||||
<v-row class="mt-4" v-else>
|
||||
<v-col cols="12" sm="6" md="6" lg="6">
|
||||
<p class="body-font text-uppercase primary--text">Default Billing Address</p>
|
||||
<p
|
||||
class="body-font"
|
||||
v-if="!billingAddressDetails.address"
|
||||
>You have not set a default billing address.</p>
|
||||
<div v-else>
|
||||
<p class="body-font">You have set a default billing address.</p>
|
||||
<BillingAddressComponent :address="billingAddressDetails.address" />
|
||||
</div>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<v-btn
|
||||
@click="editAddress(billingAddressDetails.address,billingAddressDetails.index)"
|
||||
depressed
|
||||
large
|
||||
tile
|
||||
:outlined="hover"
|
||||
:color="hover?'white':'primary'"
|
||||
:class="hover?'primary--text':'white--text'"
|
||||
class="body-font my-2 account-dashboard-button"
|
||||
>EDIT</v-btn>
|
||||
</v-hover>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
<v-col cols="12" sm="6" md="6" lg="6">
|
||||
<p class="body-font text-uppercase primary--text">Default Shipping Address</p>
|
||||
<p
|
||||
class="body-font"
|
||||
v-if="!shippingAddressDetails.address"
|
||||
>You have not set a default shipping address.</p>
|
||||
<div v-else>
|
||||
<p class="body-font">You have set a default shipping address.</p>
|
||||
<ShippingAddressComponent :address="shippingAddressDetails.address" />
|
||||
</div>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<v-btn
|
||||
@click="editAddress(shippingAddressDetails.address,shippingAddressDetails.index)"
|
||||
depressed
|
||||
large
|
||||
tile
|
||||
:outlined="hover"
|
||||
:color="hover?'white':'primary'"
|
||||
:class="hover?'primary--text':'white--text'"
|
||||
class="body-font my-2 account-dashboard-button"
|
||||
>EDIT</v-btn>
|
||||
</v-hover>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-container-fluid>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
//import { mapState } from "vuex";
|
||||
|
||||
import { createHelpers } from "vuex-map-fields";
|
||||
import { loginInterrupt } from "@/services/nav";
|
||||
import BillingAddressComponent from "@/components/retailer/address/BillingAddressComponent";
|
||||
import ShippingAddressComponent from "@/components/retailer/address/ShippingAddressComponent";
|
||||
// import BillingAddressComponent from "@/components/retailer/address/BillingAddressComponent";
|
||||
// import ShippingAddressComponent from "@/components/retailer/address/ShippingAddressComponent";
|
||||
const { mapFields } = createHelpers({
|
||||
getterType: "accountOne/getField",
|
||||
mutationType: "accountOne/updateField"
|
||||
mutationType: "accountOne/updateField",
|
||||
});
|
||||
export default {
|
||||
name: "AccountDashboard",
|
||||
data() {
|
||||
return {
|
||||
hideShow: false
|
||||
hideShow: false,
|
||||
};
|
||||
},
|
||||
components: {
|
||||
BillingAddressComponent,
|
||||
ShippingAddressComponent
|
||||
// BillingAddressComponent,
|
||||
// ShippingAddressComponent
|
||||
},
|
||||
computed: {
|
||||
cartProductsProgress: function() {
|
||||
cartProductsProgress: function () {
|
||||
return this.$store.state.userCartProduct.cartProductsProgress;
|
||||
},
|
||||
basicInfo() {
|
||||
return this.$store.state.accountOne.one;
|
||||
},
|
||||
errorMessage: function() {
|
||||
errorMessage: function () {
|
||||
return this.$store.state.accountOne.errorMessage;
|
||||
},
|
||||
shippingAddressDetails: function() {
|
||||
shippingAddressDetails: function () {
|
||||
return this.$store.state.accountOne.shippingAddressDetails;
|
||||
},
|
||||
billingAddressDetails: function() {
|
||||
billingAddressDetails: function () {
|
||||
return this.$store.state.accountOne.billingAddressDetails;
|
||||
},
|
||||
addresses: function() {
|
||||
addresses: function () {
|
||||
return this.$store.state.accountOne.addresses;
|
||||
},
|
||||
inProgress: function() {
|
||||
inProgress: function () {
|
||||
return this.$store.state.accountOne.inProgress;
|
||||
},
|
||||
/*addressLength: function(){
|
||||
|
|
@ -220,26 +175,25 @@ export default {
|
|||
return this.basicInfo.addresses.length;
|
||||
return 0;
|
||||
},*/
|
||||
successMessage: function() {
|
||||
successMessage: function () {
|
||||
return this.$store.state.accountOne.successMessage;
|
||||
},
|
||||
...mapFields(["newsLetterSubscription", "addressIndex"]),
|
||||
userAuth: function() {
|
||||
userAuth: function () {
|
||||
return this.$store.state.auth.userAuth;
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
|
||||
editAccount() {
|
||||
this.$router.push({
|
||||
name: "EditAccountInfo"
|
||||
name: "EditAccountInfo",
|
||||
});
|
||||
},
|
||||
routeToPage(pageName) {
|
||||
setTimeout(() => {
|
||||
this.$router.push({
|
||||
name: pageName,
|
||||
params: { address: "shipping" }
|
||||
params: { address: "shipping" },
|
||||
});
|
||||
}, 50);
|
||||
},
|
||||
|
|
@ -256,9 +210,9 @@ export default {
|
|||
localStorage.setItem("cr_meCurrentPage", "accountDashboard");
|
||||
this.$router.push({
|
||||
name: "EditAddressBook",
|
||||
params: { addressId: addressId }
|
||||
params: { addressId: addressId },
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
created() {
|
||||
if (!this.userAuth) {
|
||||
|
|
@ -272,7 +226,6 @@ export default {
|
|||
setTimeout(() => {
|
||||
this.hideShow = false;
|
||||
}, 2000);
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style src="./account_dashboard.scss" lang="scss" scoped />
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
.subheading{
|
||||
border-bottom: 1px solid #111 ;
|
||||
|
||||
display: inline;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
.subheading:hover{
|
||||
border-bottom: 1px solid #2c05da ;
|
||||
|
||||
}
|
||||
.padding-space{
|
||||
padding: 50px 0px 50px 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
<template>
|
||||
<v-container>
|
||||
<div class="h3 my-5 py-5 body-font1">Boxed Products & Ordering</div>
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
2021 Boxed Catalog
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
2021 Boxed Holiday Catalog
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
2021 Boxed Holiday Price List (Excel)
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
2021 Boxed Holiday Price List (PDF)
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Downton Abbey Catalog
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: 'ResourcesPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Back to Resources
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "BoxedProductsOrdering",
|
||||
};
|
||||
</script>
|
||||
|
||||
<style src="./boxed-products-ordering.scss" lang="scss" scoped/>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<template>
|
||||
<div>
|
||||
<p>this is boxed order history page</p>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'BoxedOrderHistoryPage',
|
||||
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.subheading{
|
||||
border-bottom: 1px solid #111 ;
|
||||
|
||||
display: inline;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
.subheading:hover{
|
||||
border-bottom: 1px solid #2c05da ;
|
||||
|
||||
}
|
||||
.padding-space{
|
||||
padding: 50px 0px 50px 0px;
|
||||
}
|
||||
.padding-space1{
|
||||
padding: 15px 0px 15px 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,258 @@
|
|||
<template>
|
||||
<v-container>
|
||||
<div class="h3 my-5 py-5 body-font1">Retailer Communications</div>
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Account Manager Contact List
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div class="padding-space1"><b>Crane Contacts for Retailers</b></div>
|
||||
<div>
|
||||
To help us respond to your request quickly, please reference the below
|
||||
contact information. By using the contact method appropriate for each
|
||||
request, we can reduce internal handling time and ensure it is sent to the
|
||||
correct department every time.
|
||||
</div>
|
||||
<div class="padding-space1"><b>Boxed Product Orders and Inquiries</b></div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:cranesocialpapers@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
cranesocialpapers@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div>Phone: 1-877-478-4849 or 413-664-2500</div>
|
||||
<div>Fax: 1-800-331-8660 or 413-684-7273</div>
|
||||
<div class="padding-space1">
|
||||
<b
|
||||
>Personalized Orders: New Order, Order Change, and Response to Order
|
||||
Delay Questions</b
|
||||
>
|
||||
</div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:cdsorders@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
cdsorders@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div>Fax: 1-800-411-4554 or 413-663-3092</div>
|
||||
<div class="padding-space1">
|
||||
<b>Personalized Product General Inquiries</b>
|
||||
</div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:cranecustomerservice@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
cranecustomerservice@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
Phone: 1-877-478-4849 or 413-664-2500</div>
|
||||
<div>Toll-free from Canada: 1-800-551-8321</div>
|
||||
<div class="padding-space1"><b>Custom Concierge Quote Request</b></div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:retailerconcierge@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
retailerconcierge@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div class="padding-space1"><b>Sample to Match</b></div>
|
||||
<div>Retailer Portal: Electronic Submissions</div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:cdsorders@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
cdsorders@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div class="padding-space1"><b>Crane PDS Help Desk</b></div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:pdshelpdesk@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
pdshelpdesk@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div>Phone: 1-800-206-8530</div>
|
||||
<div class="padding-space1"><b>Crane PDS Account Applications</b></div>
|
||||
<div>
|
||||
Retailers obtain applications from the Resources>Training section on the
|
||||
retailer portal and send to Crane Customer Service
|
||||
</div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:cranecustomerservice@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
cranecustomerservice@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div>Fax: 1-888-865-9715</div>
|
||||
<div class="padding-space1"><b>Crane Retailer Portal Support</b></div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:retailerportal@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
retailerportal@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div>Phone: 1-877-478-4849</div>
|
||||
<div class="padding-space1"><b>Etiquette Questions</b></div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:concierge@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
concierge@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div>Phone: 1-877-478-4849</div>
|
||||
<div class="padding-space1"><b>Find a Retailer Listings</b></div>
|
||||
<div>Contact Retailer Portal Help Desk</div>
|
||||
<div>
|
||||
Email:
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<a
|
||||
href="mailto:retailerportal@crane.com"
|
||||
class="text-decoration-none"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
retailerportal@crane.com
|
||||
</div>
|
||||
</a>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div class="padding-space1"><b>Engraved Dies</b></div>
|
||||
<div>Please use the address below for engraving dies:</div>
|
||||
<div>Crane Stationery</div>
|
||||
<div>Attn: Kitting Department</div>
|
||||
<div>461 Saratoga Street</div>
|
||||
<div>Cohoes, NY 12047</div>
|
||||
<div class="padding-space1"><b>Customer Service Mailing Address</b></div>
|
||||
<div>Please use the address below for mailed orders:</div>
|
||||
<div>Crane Stationery Returns</div>
|
||||
<div>461 Saratoga Street</div>
|
||||
<div>Cohoes, NY 12047</div>
|
||||
<div class="padding-space1"><b>Customer Service Hours</b></div>
|
||||
<div>Monday - Friday 9:00am - 6:00pm EST</div>
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: 'ResourcesPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Back to Resources
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "ContactUs",
|
||||
};
|
||||
</script>
|
||||
|
||||
<style src="./contact-us.scss" lang="scss" scoped/>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.subheading{
|
||||
border-bottom: 1px solid #111 ;
|
||||
|
||||
display: inline;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
.subheading:hover{
|
||||
border-bottom: 1px solid #2c05da ;
|
||||
|
||||
}
|
||||
.padding-space{
|
||||
padding: 50px 0px 0px 0px;
|
||||
}
|
||||
.padding-space1{
|
||||
padding: 10px 0px 0px 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
|
||||
|
||||
<template>
|
||||
<v-container>
|
||||
<div class="h3 my-5 py-5 body-font1">Marketing Tools & Promotions</div>
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Marketing Collateral
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div class="padding-space1">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Promotions - Album, Boxed
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div class="padding-space1">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Imagery & Logos
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: 'ResourcesPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Back to Resources
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "MarketingToolsPromotions",
|
||||
};
|
||||
</script>
|
||||
|
||||
<style src="./marketing-tools-promotions.scss" lang="scss" scoped/>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<p>this is PDS page</p>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name : "PDSPage"
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.subheading{
|
||||
border-bottom: 1px solid #111 ;
|
||||
|
||||
display: inline;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
.subheading:hover{
|
||||
border-bottom: 1px solid #2c05da ;
|
||||
|
||||
}
|
||||
.padding-space{
|
||||
padding: 50px 0px 0px 0px;
|
||||
}
|
||||
.padding-space1{
|
||||
padding: 10px 0px 0px 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,94 @@
|
|||
|
||||
<template>
|
||||
<v-container>
|
||||
<div class="h3 my-5 py-5 body-font1">Personalized Products & Ordering</div>
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Personalized Albums
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div class="padding-space1">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Concierge Services
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div class="padding-space1">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Crane Stationery Design Elements
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div class="padding-space1">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Engraving Die Form
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: 'ResourcesPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Back to Resources
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "PersonalizedProductsOrdering",
|
||||
};
|
||||
</script>
|
||||
|
||||
<style src="./personalized-products-ordering.scss" lang="scss" scoped/>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
iframe{
|
||||
border: none !important;
|
||||
}
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
|
||||
<template>
|
||||
<v-container>
|
||||
<div class="h3 py-5 body-font1">Personalized Order Status</div>
|
||||
<div class="pt-5">
|
||||
The Estimated Ship Date is based on the approximate number of business
|
||||
days, after proof approval, that your order will ship.
|
||||
<div class="pl-4 pt-4">
|
||||
Please note that it does not currently reflect shortened time frames for
|
||||
Sympathy and Birth orders.
|
||||
</div>
|
||||
<div class="pl-4 pb-4">
|
||||
Multi-process, custom and other complex orders may experience delays
|
||||
beyond this range.
|
||||
</div>
|
||||
Package tracking information is provided by the shipping carrier. Tracking
|
||||
details will be made available when the shipping carrier has processed
|
||||
your package.
|
||||
</div>
|
||||
<iframe
|
||||
class="my-5"
|
||||
:src="url"
|
||||
:height="frameHeight"
|
||||
:width="frameWidth"
|
||||
></iframe>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "PersonalizedOrderSummaryPage",
|
||||
data() {
|
||||
return {
|
||||
url: "https://orderexplorer.crane.com//OrderExplorer/?account=customer",
|
||||
frameHeight: "800px",
|
||||
frameWidth: "100%",
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style src="./personalized_order_status.scss" lang="scss" scoped/>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
.padding-space{
|
||||
padding: 2px 0px 45px 0px !important;
|
||||
}
|
||||
.subheading{
|
||||
border-bottom: 1px solid #111 ;
|
||||
display: inline;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
.subheading:hover{
|
||||
border-bottom: 1px solid #2c05da ;
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,89 @@
|
|||
<template>
|
||||
<v-container >
|
||||
<div class="h3 my-5 py-5 body-font1">Resources</div>
|
||||
|
||||
<v-hover v-slot:default="{ hover }" >
|
||||
<router-link class="text-decoration-none whyteTmin10-font" :to="{ name: 'BoxedProductsOrdering' }">
|
||||
<div :class="hover ? 'primary--text' : 'black--text'" class="subheading " >
|
||||
Boxed Products & Ordering
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
<div class="padding-space ">Boxed product catalogs, price lists and order forms</div>
|
||||
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link class="text-decoration-none " :to="{ name: 'PersonalizedProductsOrdering' }">
|
||||
<div :class="hover ? 'primary--text' : 'black--text'" class="subheading">
|
||||
Personalized Products & Ordering
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
<div class="pt-1">Electronic order form and wedding program template downloads</div>
|
||||
<div class="padding-space">
|
||||
Album PDF's design elements information, custom information and supplied
|
||||
art guidelines
|
||||
</div>
|
||||
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link class="text-decoration-none " :to="{ name: 'MarketingToolsPromotions' }">
|
||||
<div :class="hover ? 'primary--text' : 'black--text'" class="subheading">
|
||||
Marketing Tools & Promotions
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
<div class="padding-space">
|
||||
Promotion details, marketing collateral, album imagery, and brand logos
|
||||
</div>
|
||||
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link class="text-decoration-none " :to="{ name: 'RetailerCommunications' }">
|
||||
<div :class="hover ? 'primary--text' : 'black--text'" class="subheading">
|
||||
Retailer Communications
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
<div class="padding-space">
|
||||
Archive of amil communications about service levels, product and pricing
|
||||
announcements, monthly marketing emails and more
|
||||
</div>
|
||||
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link class="text-decoration-none " :to="{ name: 'Training' }">
|
||||
<div :class="hover ? 'primary--text' : 'black--text'" class="subheading">
|
||||
Training
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
<div class="pt-1">Upcoming Training calendar and sign-up details</div>
|
||||
<div class="padding-space">
|
||||
Archive of training materials for PDS, Retailer Portal and the Universal
|
||||
Order Form
|
||||
</div>
|
||||
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link class="text-decoration-none " :to="{ name: 'ContactUs' }">
|
||||
<div :class="hover ? 'primary--text' : 'black--text'" class="subheading">
|
||||
Contact Us
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
<div class="padding-space">
|
||||
Account Manager contact list, and Customer Service, PDS and Retailer
|
||||
Portal Support contat information and hours of operation
|
||||
</div>
|
||||
|
||||
<v-hover v-slot:default="{ hover }" >
|
||||
<router-link class="text-decoration-none padding-space" :to="{ name: 'AccountDashboard'}">
|
||||
<div :class="hover ? 'primary--text' : 'black--text'" class="subheading">
|
||||
Back to Retailer Portal Dashboard
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "ResourcesPage",
|
||||
};
|
||||
</script>
|
||||
<style src="./resources.scss" lang="scss" scoped/>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.subheading{
|
||||
border-bottom: 1px solid #111 ;
|
||||
|
||||
display: inline;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
.subheading:hover{
|
||||
border-bottom: 1px solid #2c05da ;
|
||||
|
||||
}
|
||||
.padding-space{
|
||||
padding: 50px 0px 0px 0px;
|
||||
}
|
||||
.padding-space1{
|
||||
padding: 10px 0px 0px 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
|
||||
|
||||
<template>
|
||||
<v-container>
|
||||
<div class="h3 my-5 py-5 body-font1">Retailer Communications</div>
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Service Levels
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="padding-space">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: 'ResourcesPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Back to Resources
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "RetailerCommunications",
|
||||
};
|
||||
</script>
|
||||
|
||||
<style src="./retailer-communications.scss" lang="scss" scoped/>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
.subheading{
|
||||
border-bottom: 1px solid #111 ;
|
||||
|
||||
display: inline;
|
||||
transition: all 0.1s ease-in-out;
|
||||
}
|
||||
.subheading:hover{
|
||||
border-bottom: 1px solid #2c05da ;
|
||||
|
||||
}
|
||||
.padding-space{
|
||||
padding: 50px 0px 0px 0px;
|
||||
}
|
||||
.padding-space1{
|
||||
padding: 50px 0px 20px 0px;
|
||||
}
|
||||
|
|
@ -0,0 +1,274 @@
|
|||
|
||||
|
||||
|
||||
<template>
|
||||
<v-container>
|
||||
<div class="h3 my-5 py-5 body-font1">Training</div>
|
||||
<div><b>PDS Training Materials</b></div>
|
||||
<div class="padding-space">PDS Documentation</div>
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Crane's PDS Basic Guide
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Crane's PDS Holiday Basic Guide
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Crane's PDS Basic Q&A
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Crane's PDS Advanced Guide
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Crane's PDS Advanced Q&A
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Crane Wedding Reference Guide
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div class="padding-space">PDS Video Tutorials</div>
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Video Demonstration - Placing a PDS Order
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
PDS Holiday Order in a few steps
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Multi Browser PDS
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div class="padding-space">PDS Sign Up Forms</div>
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
PDS Usage Agreement
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Account Sign Up Form
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div class="padding-space1"><b>Retailer Portal Training Materials</b></div>
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Retailer Portal Training Overview
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Retailer Portal FAQ
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
How to Place a Boxed Order
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
<div class="padding-space1"><b>Universal Order Form Training Materials</b></div>
|
||||
<div >
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font "
|
||||
:to="{ name: '' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading "
|
||||
>
|
||||
Alternate Characters Reference Sheet
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="padding-space1"><b>Sign Up for Training</b></div>
|
||||
<div>No training sessions are currently scheduled at this time.</div>
|
||||
|
||||
|
||||
<div class="padding-space1">
|
||||
<v-hover v-slot:default="{ hover }">
|
||||
<router-link
|
||||
class="text-decoration-none whyteTmin10-font"
|
||||
:to="{ name: 'ResourcesPage' }"
|
||||
>
|
||||
<div
|
||||
:class="hover ? 'primary--text' : 'black--text'"
|
||||
class="subheading"
|
||||
>
|
||||
Back to Resources
|
||||
</div>
|
||||
</router-link>
|
||||
</v-hover>
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: "Training",
|
||||
};
|
||||
</script>
|
||||
|
||||
<style src="./training.scss" lang="scss" scoped/>
|
||||
|
|
@ -9,6 +9,8 @@
|
|||
}
|
||||
|
||||
@import './custom_functions.scss';
|
||||
@import url('https://fonts.googleapis.com/css2?family=PT+Serif:wght@400;700&display=swap');
|
||||
|
||||
@font-face {
|
||||
font-family: 'Whyte-Regular';
|
||||
src: url('../assets/font/Whyte-Regular.woff2') format("woff2");
|
||||
|
|
@ -42,6 +44,9 @@
|
|||
.body-font {
|
||||
font-family: 'Whyte-Book', sans-serif;
|
||||
}
|
||||
.body-font1 {
|
||||
font-family: 'PT Serif', serif;
|
||||
}
|
||||
.regular-font {
|
||||
font-family: 'Whyte-Regular', sans-serif;
|
||||
}
|
||||
|
|
@ -158,6 +163,7 @@
|
|||
.background-cloud {
|
||||
background-color: #CEE4F2;
|
||||
}
|
||||
|
||||
.fontsize-10 {
|
||||
font-size: 0.625rem;
|
||||
}
|
||||
|
|
@ -274,6 +280,10 @@
|
|||
.height-100 {
|
||||
height: 100vh;
|
||||
}
|
||||
.height-130px{
|
||||
height: 130px;
|
||||
}
|
||||
|
||||
// end vue-tel-input css end
|
||||
@include mq(xs) {
|
||||
.h1 {
|
||||
|
|
|
|||
Loading…
Reference in New Issue