Skip to content

Commit c2fcfdc

Browse files
w3bdesignw3bdesign
committed
Redirect to success page
1 parent 457c7ef commit c2fcfdc

File tree

7 files changed

+138
-29
lines changed

7 files changed

+138
-29
lines changed

‎public/css/app.css‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -856,6 +856,10 @@ video {
856856
height: 1rem;
857857
}
858858

859+
.h-64 {
860+
height: 16rem;
861+
}
862+
859863
.w-full {
860864
width: 100%;
861865
}

‎public/js/app.js‎

Lines changed: 85 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -20386,9 +20386,10 @@ __webpack_require__.r(__webpack_exports__);
2038620386
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
2038720387
/* harmony export */ });
2038820388
/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm-bundler.js");
20389-
/* harmony import */ var pinia__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! pinia */ "./node_modules/pinia/dist/pinia.esm-browser.js");
20389+
/* harmony import */ var pinia__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! pinia */ "./node_modules/pinia/dist/pinia.esm-browser.js");
2039020390
/* harmony import */ var _stripe_stripe_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @stripe/stripe-js */ "./node_modules/@stripe/stripe-js/dist/stripe.esm.js");
2039120391
/* harmony import */ var _store_useCart__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../store/useCart */ "./resources/js/store/useCart.js");
20392+
/* harmony import */ var _router__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../router */ "./resources/js/router/index.js");
2039220393
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
2039320394

2039420395
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -20407,6 +20408,7 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
2040720408

2040820409

2040920410

20411+
2041020412
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
2041120413
__name: 'OrderCheckout',
2041220414
setup: function setup(__props, _ref) {
@@ -20422,7 +20424,7 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
2042220424
});
2042320425
var store = (0,_store_useCart__WEBPACK_IMPORTED_MODULE_2__.useCart)();
2042420426

20425-
var _storeToRefs = (0,pinia__WEBPACK_IMPORTED_MODULE_3__.storeToRefs)(store),
20427+
var _storeToRefs = (0,pinia__WEBPACK_IMPORTED_MODULE_4__.storeToRefs)(store),
2042620428
getCartQuantity = _storeToRefs.getCartQuantity,
2042720429
getCustomerDetails = _storeToRefs.getCustomerDetails;
2042820430

@@ -20501,6 +20503,8 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
2050120503
localState.paymentIsProcessing = false;
2050220504
store.clearCart();
2050320505
store.clearCustomer();
20506+
store.saveOrderId(paymentMethod.id);
20507+
_router__WEBPACK_IMPORTED_MODULE_3__["default"].push("/success");
2050420508
}
2050520509
})["catch"](function () {
2050620510
localState.paymentIsProcessing = false;
@@ -20528,9 +20532,10 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
2052820532
checkout: checkout,
2052920533
reactive: vue__WEBPACK_IMPORTED_MODULE_0__.reactive,
2053020534
onMounted: vue__WEBPACK_IMPORTED_MODULE_0__.onMounted,
20531-
storeToRefs: pinia__WEBPACK_IMPORTED_MODULE_3__.storeToRefs,
20535+
storeToRefs: pinia__WEBPACK_IMPORTED_MODULE_4__.storeToRefs,
2053220536
loadStripe: _stripe_stripe_js__WEBPACK_IMPORTED_MODULE_1__.loadStripe,
20533-
useCart: _store_useCart__WEBPACK_IMPORTED_MODULE_2__.useCart
20537+
useCart: _store_useCart__WEBPACK_IMPORTED_MODULE_2__.useCart,
20538+
router: _router__WEBPACK_IMPORTED_MODULE_3__["default"]
2053420539
};
2053520540
Object.defineProperty(__returned__, '__isScriptSetup', {
2053620541
enumerable: false,
@@ -20819,6 +20824,41 @@ __webpack_require__.r(__webpack_exports__);
2081920824

2082020825
/***/ }),
2082120826

20827+
/***/ "./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/pages/Success.vue?vue&type=script&setup=true&lang=js":
20828+
/*!*******************************************************************************************************************************************************************************************************!*\
20829+
!*** ./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/pages/Success.vue?vue&type=script&setup=true&lang=js ***!
20830+
\*******************************************************************************************************************************************************************************************************/
20831+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
20832+
20833+
"use strict";
20834+
__webpack_require__.r(__webpack_exports__);
20835+
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
20836+
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
20837+
/* harmony export */ });
20838+
/* harmony import */ var _store_useCart__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../store/useCart */ "./resources/js/store/useCart.js");
20839+
20840+
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
20841+
__name: 'Success',
20842+
setup: function setup(__props, _ref) {
20843+
var expose = _ref.expose;
20844+
expose();
20845+
var store = (0,_store_useCart__WEBPACK_IMPORTED_MODULE_0__.useCart)();
20846+
var getOrderDetails = store.getOrderDetails;
20847+
var __returned__ = {
20848+
store: store,
20849+
getOrderDetails: getOrderDetails,
20850+
useCart: _store_useCart__WEBPACK_IMPORTED_MODULE_0__.useCart
20851+
};
20852+
Object.defineProperty(__returned__, '__isScriptSetup', {
20853+
enumerable: false,
20854+
value: true
20855+
});
20856+
return __returned__;
20857+
}
20858+
});
20859+
20860+
/***/ }),
20861+
2082220862
/***/ "./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/Checkout/CartSummary.vue?vue&type=template&id=92377930":
2082320863
/*!******************************************************************************************************************************************************************************************************************************************************************************************!*\
2082420864
!*** ./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/Checkout/CartSummary.vue?vue&type=template&id=92377930 ***!
@@ -21493,7 +21533,7 @@ var _hoisted_1 = {
2149321533
"data-carousel": "static"
2149421534
};
2149521535

21496-
var _hoisted_2 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createStaticVNode)("<div class=\"overflow-hidden relative h-56 rounded-lg sm:h-64 xl:h-80 2xl:h-96\"><!-- Item 1 --><div class=\"hidden duration-700 ease-in-out\" data-carousel-item><div class=\"flex items-start justify-center w-full px-6 tracking-wide\"><span class=\"z-40 absolute top-1/2 p-4 my-4 text-2xl text-black bg-white rounded-lg mt-4\">MacBook Air 14 In Store now!</span><img src=\"/images/Hero.jpg\" class=\"block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2\" alt=\"...\"></div></div><!-- Item 2 --><div class=\"hidden duration-700 ease-in-out\" data-carousel-item><img src=\"/images/Hero.jpg\" class=\"block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2\" alt=\"...\"></div><!-- Item 3 --><div class=\"hidden duration-700 ease-in-out\" data-carousel-item><img src=\"/images/Hero.jpg\" class=\"block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2\" alt=\"...\"></div></div>", 1);
21536+
var _hoisted_2 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createStaticVNode)("<div class=\"overflow-hidden relative h-56 rounded-lg sm:h-64 xl:h-80 2xl:h-96\"><!-- Item 1 --><div class=\"hidden duration-700 ease-in-out\" data-carousel-item><div class=\"flex items-start justify-center w-full px-6 tracking-wide\"><span class=\"z-40 absolute top-1/2 p-4 my-4 text-2xl text-black bg-white rounded-lg mt-4\">MacBook Air 12 In Store now!</span><img src=\"/images/Hero.jpg\" class=\"block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2\" alt=\"...\"></div></div><!-- Item 2 --><div class=\"hidden duration-700 ease-in-out\" data-carousel-item><div class=\"flex items-start justify-center w-full px-6 tracking-wide\"><span class=\"z-40 absolute top-1/2 p-4 my-4 text-2xl text-black bg-white rounded-lg mt-4\">MacBook Air 13 In Store now!</span><img src=\"/images/Hero.jpg\" class=\"block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2\" alt=\"...\"></div></div><!-- Item 3 --><div class=\"hidden duration-700 ease-in-out\" data-carousel-item><div class=\"flex items-start justify-center w-full px-6 tracking-wide\"><span class=\"z-40 absolute top-1/2 p-4 my-4 text-2xl text-black bg-white rounded-lg mt-4\">MacBook Air 14 In Store now!</span><img src=\"/images/Hero.jpg\" class=\"block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2\" alt=\"...\"></div></div></div>", 1);
2149721537

2149821538
var _hoisted_3 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)("div", {
2149921539
"class": "flex absolute bottom-5 left-1/2 z-30 space-x-3 -translate-x-1/2"
@@ -21968,8 +22008,18 @@ __webpack_require__.r(__webpack_exports__);
2196822008
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
2196922009
/* harmony export */ "render": () => (/* binding */ render)
2197022010
/* harmony export */ });
21971-
function render(_ctx, _cache) {
21972-
return " Great success ";
22011+
/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm-bundler.js");
22012+
22013+
var _hoisted_1 = {
22014+
key: 0
22015+
};
22016+
var _hoisted_2 = {
22017+
"class": "h-64 mt-24 p-6 text-3xl font-bold text-center"
22018+
};
22019+
function render(_ctx, _cache, $props, $setup, $data, $options) {
22020+
return $setup.getOrderDetails ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementBlock)("div", _hoisted_1, [(0,vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode)("h1", _hoisted_2, " Order completed with order ID #" + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($setup.getOrderDetails), 1
22021+
/* TEXT */
22022+
)])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true);
2197322023
}
2197422024

2197522025
/***/ }),
@@ -22281,6 +22331,9 @@ var useCart = (0,pinia__WEBPACK_IMPORTED_MODULE_0__.defineStore)("shopState", {
2228122331
saveCustomerDetails: function saveCustomerDetails(customer) {
2228222332
this.customer = customer;
2228322333
},
22334+
saveOrderId: function saveOrderId(order) {
22335+
this.order = order;
22336+
},
2228422337
getSingleProduct: function getSingleProduct(slug) {
2228522338
return this.products.find(function (product) {
2228622339
return product.slug === slug;
@@ -22293,6 +22346,9 @@ var useCart = (0,pinia__WEBPACK_IMPORTED_MODULE_0__.defineStore)("shopState", {
2229322346
return total + product.quantity;
2229422347
}, 0);
2229522348
},
22349+
getOrderDetails: function getOrderDetails() {
22350+
return this.order;
22351+
},
2229622352
getCartContent: function getCartContent() {
2229722353
return this.cart;
2229822354
},
@@ -24386,7 +24442,7 @@ __webpack_require__.r(__webpack_exports__);
2438624442

2438724443
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_0___default()(function(i){return i[1]});
2438824444
// Module
24389-
___CSS_LOADER_EXPORT___.push([module.id, "\n.cartQuantity[data-v-a5f35132] {\n@apply absolute w-6 h-6 pb-2 ml-16 -mt-12 text-center text-white bg-black rounded-full lg:ml-14;\n}\n.fade-enter-active[data-v-a5f35132],\r\n.fade-leave-active[data-v-a5f35132] {\r\n transition: all 1.5s ease;\n}\n.fade-enter-from[data-v-a5f35132],\r\n.fade-leave-to[data-v-a5f35132] {\r\n opacity: 0;\n}\r\n", ""]);
24445+
___CSS_LOADER_EXPORT___.push([module.id, "\n.fade-enter-active[data-v-a5f35132],\r\n.fade-leave-active[data-v-a5f35132] {\r\n transition: all 1.5s ease;\n}\n.fade-enter-from[data-v-a5f35132],\r\n.fade-leave-to[data-v-a5f35132] {\r\n opacity: 0;\n}\r\n", ""]);
2439024446
// Exports
2439124447
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
2439224448

@@ -49138,12 +49194,14 @@ __webpack_require__.r(__webpack_exports__);
4913849194
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
4913949195
/* harmony export */ });
4914049196
/* harmony import */ var _Success_vue_vue_type_template_id_9dc4c1ec__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Success.vue?vue&type=template&id=9dc4c1ec */ "./resources/js/pages/Success.vue?vue&type=template&id=9dc4c1ec");
49141-
/* harmony import */ var C_GitHub_laravel_vue_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./node_modules/vue-loader/dist/exportHelper.js */ "./node_modules/vue-loader/dist/exportHelper.js");
49197+
/* harmony import */ var _Success_vue_vue_type_script_setup_true_lang_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Success.vue?vue&type=script&setup=true&lang=js */ "./resources/js/pages/Success.vue?vue&type=script&setup=true&lang=js");
49198+
/* harmony import */ var C_GitHub_laravel_vue_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./node_modules/vue-loader/dist/exportHelper.js */ "./node_modules/vue-loader/dist/exportHelper.js");
49199+
49200+
4914249201

49143-
const script = {}
4914449202

4914549203
;
49146-
const __exports__ = /*#__PURE__*/(0,C_GitHub_laravel_vue_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_1__["default"])(script, [['render',_Success_vue_vue_type_template_id_9dc4c1ec__WEBPACK_IMPORTED_MODULE_0__.render],['__file',"resources/js/pages/Success.vue"]])
49204+
const __exports__ = /*#__PURE__*/(0,C_GitHub_laravel_vue_node_modules_vue_loader_dist_exportHelper_js__WEBPACK_IMPORTED_MODULE_2__["default"])(_Success_vue_vue_type_script_setup_true_lang_js__WEBPACK_IMPORTED_MODULE_1__["default"], [['render',_Success_vue_vue_type_template_id_9dc4c1ec__WEBPACK_IMPORTED_MODULE_0__.render],['__file',"resources/js/pages/Success.vue"]])
4914749205
/* hot reload */
4914849206
if (false) {}
4914949207

@@ -49310,6 +49368,22 @@ __webpack_require__.r(__webpack_exports__);
4931049368
/* harmony import */ var _node_modules_babel_loader_lib_index_js_clonedRuleSet_5_use_0_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_BaseTable_vue_vue_type_script_setup_true_lang_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!../../../../node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./BaseTable.vue?vue&type=script&setup=true&lang=js */ "./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/base/BaseTable.vue?vue&type=script&setup=true&lang=js");
4931149369

4931249370

49371+
/***/ }),
49372+
49373+
/***/ "./resources/js/pages/Success.vue?vue&type=script&setup=true&lang=js":
49374+
/*!***************************************************************************!*\
49375+
!*** ./resources/js/pages/Success.vue?vue&type=script&setup=true&lang=js ***!
49376+
\***************************************************************************/
49377+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
49378+
49379+
"use strict";
49380+
__webpack_require__.r(__webpack_exports__);
49381+
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
49382+
/* harmony export */ "default": () => (/* reexport safe */ _node_modules_babel_loader_lib_index_js_clonedRuleSet_5_use_0_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_Success_vue_vue_type_script_setup_true_lang_js__WEBPACK_IMPORTED_MODULE_0__["default"])
49383+
/* harmony export */ });
49384+
/* harmony import */ var _node_modules_babel_loader_lib_index_js_clonedRuleSet_5_use_0_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_Success_vue_vue_type_script_setup_true_lang_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!../../../node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./Success.vue?vue&type=script&setup=true&lang=js */ "./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/pages/Success.vue?vue&type=script&setup=true&lang=js");
49385+
49386+
4931349387
/***/ }),
4931449388

4931549389
/***/ "./resources/js/components/Checkout/CartSummary.vue?vue&type=template&id=92377930":

‎resources/js/components/Checkout/OrderCheckout.vue‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@ import { storeToRefs } from "pinia";
5252
import { loadStripe } from "@stripe/stripe-js";
5353
5454
import { useCart } from "../../store/useCart";
55+
import router from "../../router";
5556
5657
const localState = reactive({
5758
removingCartItem: false,
@@ -119,6 +120,8 @@ const checkout = async () => {
119120
localState.paymentIsProcessing = false;
120121
store.clearCart();
121122
store.clearCustomer();
123+
store.saveOrderId(paymentMethod.id);
124+
router.push("/success");
122125
}
123126
})
124127
.catch(() => {

‎resources/js/components/Header/Cart.vue‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,9 @@
99
aria-label="Cart"
1010
src="../../../img/svg/Cart.svg"
1111
/>
12-
<span class="absolute w-6 h-6 pb-2 ml-16 -mt-12 text-center text-white bg-black rounded-full lg:ml-14">
12+
<span
13+
class="absolute w-6 h-6 pb-2 ml-16 -mt-12 text-center text-white bg-black rounded-full lg:ml-14"
14+
>
1315
{{ getCartQuantity }}
1416
</span>
1517
<span>Total: {{ formatPrice(getCartTotal) }}</span>
@@ -31,10 +33,6 @@ const { getCartQuantity, getCartTotal } = storeToRefs(store);
3133
</script>
3234

3335
<style scoped>
34-
.cartQuantity {
35-
@apply absolute w-6 h-6 pb-2 ml-16 -mt-12 text-center text-white bg-black rounded-full lg:ml-14;
36-
}
37-
3836
.fade-enter-active,
3937
.fade-leave-active {
4038
transition: all 1.5s ease;

‎resources/js/components/Index/Carousel.vue‎

Lines changed: 23 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<div class="flex items-start justify-center w-full px-6 tracking-wide">
88
<span
99
class="z-40 absolute top-1/2 p-4 my-4 text-2xl text-black bg-white rounded-lg mt-4"
10-
>MacBook Air 14 In Store now!</span
10+
>MacBook Air 12 In Store now!</span
1111
>
1212
<img
1313
src="/images/Hero.jpg"
@@ -18,19 +18,31 @@
1818
</div>
1919
<!-- Item 2 -->
2020
<div class="hidden duration-700 ease-in-out" data-carousel-item>
21-
<img
22-
src="/images/Hero.jpg"
23-
class="block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2"
24-
alt="..."
25-
/>
21+
<div class="flex items-start justify-center w-full px-6 tracking-wide">
22+
<span
23+
class="z-40 absolute top-1/2 p-4 my-4 text-2xl text-black bg-white rounded-lg mt-4"
24+
>MacBook Air 13 In Store now!</span
25+
>
26+
<img
27+
src="/images/Hero.jpg"
28+
class="block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2"
29+
alt="..."
30+
/>
31+
</div>
2632
</div>
2733
<!-- Item 3 -->
2834
<div class="hidden duration-700 ease-in-out" data-carousel-item>
29-
<img
30-
src="/images/Hero.jpg"
31-
class="block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2"
32-
alt="..."
33-
/>
35+
<div class="flex items-start justify-center w-full px-6 tracking-wide">
36+
<span
37+
class="z-40 absolute top-1/2 p-4 my-4 text-2xl text-black bg-white rounded-lg mt-4"
38+
>MacBook Air 14 In Store now!</span
39+
>
40+
<img
41+
src="/images/Hero.jpg"
42+
class="block absolute top-1/2 left-1/2 w-full -translate-x-1/2 -translate-y-1/2"
43+
alt="..."
44+
/>
45+
</div>
3446
</div>
3547
</div>
3648
<!-- Slider indicators -->

‎resources/js/pages/Success.vue‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,15 @@
11
<template>
2-
Great success
3-
</template>
2+
<div v-if="getOrderDetails">
3+
<h1 class="h-64 mt-24 p-6 text-3xl font-bold text-center">
4+
Order completed with order ID #{{ getOrderDetails }}
5+
</h1>
6+
</div>
7+
</template>
8+
9+
<script setup>
10+
import { useCart } from "../store/useCart";
11+
12+
const store = useCart();
13+
14+
const { getOrderDetails } = store;
15+
</script>

0 commit comments

Comments
 (0)