Feat (tracking): Create tracking page in Shop Interface

- Create tracking page
- Update readme
- Add link to tracking page on order page
see #5

README.md

@@ -2,7 +2,8 @@
 This extension used for calculating shipping rate with the USPS services.
 ## Features
 - Calculate shipping rate with USPS services.
-- Track your shipment by tracking number.
+- Track your shipment by tracking number in Admin Interface.
+- Track your shipment by tracking number in Shop Interface.
 ## Requirements
 - [Bagisto v1.2](https://github.com/bagisto/bagisto)
 - [vinceg/usps-php-api](https://packagist.org/packages/vinceg/usps-php-api)
@@ -20,6 +21,10 @@ composer dump-autoload
 5. Go to `https://<your-site>/admin/configuration/sales/carriers`.
 6. Make sure that **Marketplace USPS** is active and press save.
 7. Go to `https://<your-site>/admin/configuration/sales/shipping` and add shipping address.
+8. Run the following command
+```php
+php artisan vendor:publish --all
+```
 
 Your customers are now able to select the new shipping method.
 
@@ -48,8 +53,11 @@ Your customers are now able to select the new shipping method.
 
 ## Guide
 
-### Track your shipment by tracking number.
+### Track your shipment by tracking number in Admin Interface.
 - Go to `https://<your-site>/admin/sales/tracking/{tracking-number}`.
 
+### Track your shipment by tracking number in Shop Interface.
+- Go to `https://<your-site>/customer/account/orders/{order-id}/tracking`.
+
 ### Get shipment infomations
 - Use `uspsTrackById($trackingIds)` method to get shipment infomations with `trackingIds` are tracking number array.

package.json

@@ -0,0 +1,30 @@
+{
+  "private": true,
+  "scripts": {
+    "dev": "npm run development",
+    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
+    "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
+    "watch-poll": "cross-env npm run watch -- --watch-poll --progress",
+    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
+    "prod": "npm run production",
+    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
+  },
+  "devDependencies": {
+    "axios": "^0.19.0",
+    "cross-env": "^6.0.3",
+    "jquery": "^3.4.1",
+    "laravel-mix": "^5.0.0",
+    "laravel-mix-merge-manifest": "^0.1.2",
+    "sass": "^1.24.4",
+    "sass-loader": "^8.0.0",
+    "vue": "^2.6.11",
+    "vue-template-compiler": "^2.6.11"
+  },
+  "dependencies": {
+    "accounting": "^0.4.1",
+    "ez-plus": "^1.2.1",
+    "vee-validate": "^2.2.15",
+    "vue-flatpickr": "^2.3.0",
+    "vue-slider-component": "^3.1.0"
+  }
+}

publishable/assets/icomoon/selection.json

@@ -0,0 +1 @@
+{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M794.624 366.24c-5.952-8.896-15.936-14.24-26.624-14.24h-32c-17.696 0-32 14.304-32 32v192c0 17.696 14.304 32 32 32h128c17.696 0 32-14.304 32-32v-48c0-6.304-1.888-12.512-5.376-17.76l-96-144zM864 576h-128v-192h32l96 144v48zM1007.872 490.752l-128-192c-17.856-26.784-47.744-42.752-79.872-42.752h-128v-64c0-52.928-43.072-96-96-96h-480c-52.928 0-96 43.072-96 96v352c0 52.928 43.072 96 96 96v0 96c0 52.928 43.072 96 96 96h36.544c14.304 55.072 64 96 123.488 96 59.424 0 109.12-40.928 123.424-96h169.024c14.304 55.072 64 96 123.488 96 59.424 0 109.12-40.928 123.424-96h36.608c52.928 0 96-43.072 96-96v-192c0-19.008-5.568-37.44-16.128-53.248zM96 576c-17.664 0-32-14.304-32-32v-352c0-17.696 14.336-32 32-32h480c17.696 0 32 14.304 32 32v352c0 17.696-14.304 32-32 32h-480zM352.032 864c-35.36 0-64-28.672-64-64s28.64-64 64-64c35.328 0 64 28.672 64 64s-28.704 64-64 64zM768 864c-35.36 0-64-28.672-64-64s28.64-64 64-64c35.328 0 64 28.672 64 64s-28.672 64-64 64zM960 736c0 17.696-14.304 32-32 32h-36.576c-14.304-55.072-64-96-123.424-96-59.488 0-109.184 40.928-123.488 96h-169.024c-14.304-55.072-64-96-123.424-96-59.488 0-109.184 40.928-123.488 96h-36.576c-17.664 0-32-14.304-32-32v-96h416c52.928 0 96-43.072 96-96v-224h128c10.688 0 20.672 5.344 26.624 14.24l128 192c3.488 5.248 5.376 11.456 5.376 17.76v192z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["truck","transport","transaction","shipping"],"grid":32},"attrs":[{}],"properties":{"order":8,"id":0,"prevSize":32,"code":59652,"name":"truck"},"setIdx":0,"setId":2,"iconIdx":0}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showCodes":true,"showQuickUse":true,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"icon-","metadata":{"fontFamily":"icomoon"},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false},"imagePref":{"prefix":"icon-","png":true,"useClassSelector":true,"color":0,"bgColor":16777215,"name":"icomoon","classSelector":".icon"},"historySize":50,"gridSize":16,"showGrid":true}}

publishable/assets/mix-manifest.json

@@ -0,0 +1,4 @@
+{
+    "/js/shipping.js": "/js/shipping.js?id=bf58a857d1dc0b9196b6",
+    "/css/shipping.css": "/css/shipping.css?id=de79e44769cc7a39975c"
+}

src/Http/Controllers/Admin/TrackingController.php

@@ -35,6 +35,9 @@ public function view($trackingId)
     {
         $trackings = uspsTrackById([$trackingId]);
 
+        if (! empty($trackings['message']))
+            $trackings['message'] = str_replace('<SUP>&reg;</SUP>', '', $trackings['message']);
+
         return view($this->_config['view'], compact('trackings', 'trackingId'));
     }
 }

src/Http/Controllers/Shop/TrackingController.php

@@ -0,0 +1,48 @@
+<?php
+
+namespace GGPHP\Shipping\Http\Controllers\Shop;
+
+use Webkul\Shop\Http\Controllers\Controller;
+use Webkul\Sales\Repositories\OrderRepository;
+
+class TrackingController extends Controller
+{
+    protected $_config;
+
+    protected $orderRepository;
+
+    /**
+     * Create a new controller instance
+     *
+     * @return void
+     */
+    public function __construct(OrderRepository $orderRepository)
+    {
+        $this->middleware('customer');
+
+        $this->orderRepository = $orderRepository;
+
+        parent::__construct();
+    }
+
+    /**
+     * Show the view for the specified resource.
+     *
+     * @param  int  $orderId
+     * @return \Illuminate\View\View
+     */
+    public function view($orderId)
+    {
+        $order = $this->orderRepository->findOrFail($orderId);
+        $shipments = $order->shipments()->get()->toArray();
+        $trackings = $shipments ? uspsTrackById(array_column($shipments, 'track_number')) : [];
+
+        if (! empty($shipments) && count($shipments) == 1 && ! isset($trackings['status']))
+            $trackings = [$trackings];
+
+        if (! empty($trackings['message']))
+            $trackings['message'] = str_replace('<SUP>&reg;</SUP>', '', $trackings['message']);
+
+        return view($this->_config['view'], compact('trackings', 'order'));
+    }
+}

src/Http/routes.php

@@ -3,19 +3,36 @@
 // Admin Routes
 Route::group(['middleware' => ['web']], function () {
     Route::prefix(config('app.admin_url'))->group(function () {
-        // Admin Routes
         Route::group(['namespace' => 'GGPHP\Shipping\Http\Controllers\Admin', 'middleware' => ['admin']], function () {
             // Sales Routes
             Route::prefix('sales')->group(function () {
                 // Tracking Routes
                 Route::get('tracking/{id}', 'TrackingController@view')->defaults('_config', [
-                    'view' => 'ggphp-shipping::tracking.view',
+                    'view' => 'ggphp-shipping::admin.tracking.view',
                 ]);
             });
         });
     });
 });
 
+// Shop Routes
+Route::group(['middleware' => ['web', 'locale', 'theme', 'currency']], function () {
+    Route::namespace('GGPHP\Shipping\Http\Controllers\Shop')->group(function () {
+        // Customer routes
+        Route::prefix('customer')->group(function () {
+            // Auth Routes
+            Route::group(['middleware' => ['customer']], function () {
+                // Customer account
+                Route::prefix('account')->group(function () {
+                    Route::get('orders/{id}/tracking', 'TrackingController@view')->defaults('_config', [
+                        'view' => 'ggphp-shipping::shop.tracking.view'
+                    ])->name('customer.orders.tracking');
+                });
+            });
+        });
+    });
+});
+
 // API Routes
 Route::group(['prefix' => 'api'], function ($router) {
     Route::group(['namespace' => 'GGPHP\Shipping\Http\Controllers\API',

src/Providers/EventServiceProvider.php

@@ -0,0 +1,25 @@
+<?php
+
+namespace GGPHP\Shipping\Providers;
+
+use Illuminate\Support\ServiceProvider;
+use Illuminate\Support\Facades\Event;
+
+class EventServiceProvider extends ServiceProvider
+{
+    /**
+     * Bootstrap services.
+     *
+     * @return void
+     */
+    public function boot()
+    {
+        Event::listen(['bagisto.shop.layout.head'], function($viewRenderEventManager) {
+            $viewRenderEventManager->addTemplate('ggphp-shipping::shop.style');
+        });
+
+        Event::listen(['bagisto.shop.layout.body.after'], function($viewRenderEventManager) {
+            $viewRenderEventManager->addTemplate('ggphp-shipping::shop.script');
+        });
+    }
+}

src/Providers/ShippingServiceProvider.php

@@ -13,12 +13,18 @@ class ShippingServiceProvider extends ServiceProvider
      */
     public function boot()
     {
+        $this->publishes([
+            __DIR__ . '/../../publishable/assets' => public_path('vendor/ggphp/shipping/assets'),
+        ], 'public');
+
         $this->loadRoutesFrom(__DIR__ . '/../Http/routes.php');
 
         $this->loadTranslationsFrom(__DIR__ . '/../Resources/lang', 'ggphp');
 
         $this->loadViewsFrom(__DIR__ . '/../Resources/views', 'ggphp-shipping');
 
+        $this->app->register(EventServiceProvider::class);
+
         $this->app->register(USPSServiceProvider::class);
     }
 }

src/Resources/assets/icomoon/selection.json

@@ -0,0 +1 @@
+{"IcoMoonType":"selection","icons":[{"icon":{"paths":["M794.624 366.24c-5.952-8.896-15.936-14.24-26.624-14.24h-32c-17.696 0-32 14.304-32 32v192c0 17.696 14.304 32 32 32h128c17.696 0 32-14.304 32-32v-48c0-6.304-1.888-12.512-5.376-17.76l-96-144zM864 576h-128v-192h32l96 144v48zM1007.872 490.752l-128-192c-17.856-26.784-47.744-42.752-79.872-42.752h-128v-64c0-52.928-43.072-96-96-96h-480c-52.928 0-96 43.072-96 96v352c0 52.928 43.072 96 96 96v0 96c0 52.928 43.072 96 96 96h36.544c14.304 55.072 64 96 123.488 96 59.424 0 109.12-40.928 123.424-96h169.024c14.304 55.072 64 96 123.488 96 59.424 0 109.12-40.928 123.424-96h36.608c52.928 0 96-43.072 96-96v-192c0-19.008-5.568-37.44-16.128-53.248zM96 576c-17.664 0-32-14.304-32-32v-352c0-17.696 14.336-32 32-32h480c17.696 0 32 14.304 32 32v352c0 17.696-14.304 32-32 32h-480zM352.032 864c-35.36 0-64-28.672-64-64s28.64-64 64-64c35.328 0 64 28.672 64 64s-28.704 64-64 64zM768 864c-35.36 0-64-28.672-64-64s28.64-64 64-64c35.328 0 64 28.672 64 64s-28.672 64-64 64zM960 736c0 17.696-14.304 32-32 32h-36.576c-14.304-55.072-64-96-123.424-96-59.488 0-109.184 40.928-123.488 96h-169.024c-14.304-55.072-64-96-123.424-96-59.488 0-109.184 40.928-123.488 96h-36.576c-17.664 0-32-14.304-32-32v-96h416c52.928 0 96-43.072 96-96v-224h128c10.688 0 20.672 5.344 26.624 14.24l128 192c3.488 5.248 5.376 11.456 5.376 17.76v192z"],"attrs":[{}],"isMulticolor":false,"isMulticolor2":false,"tags":["truck","transport","transaction","shipping"],"grid":32},"attrs":[{}],"properties":{"order":8,"id":0,"prevSize":32,"code":59652,"name":"truck"},"setIdx":0,"setId":2,"iconIdx":0}],"height":1024,"metadata":{"name":"icomoon"},"preferences":{"showGlyphs":true,"showCodes":true,"showQuickUse":true,"showQuickUse2":true,"showSVGs":true,"fontPref":{"prefix":"icon-","metadata":{"fontFamily":"icomoon"},"metrics":{"emSize":1024,"baseline":6.25,"whitespace":50},"embed":false},"imagePref":{"prefix":"icon-","png":true,"useClassSelector":true,"color":0,"bgColor":16777215,"name":"icomoon","classSelector":".icon"},"historySize":50,"gridSize":16,"showGrid":true}}

src/Resources/assets/js/app.js

@@ -0,0 +1,9 @@
+$(function() {
+    $('.account-items-list table tbody tr').each(function() {
+        var id = $(this).find('td:nth-child(1)').text();
+        var status = $(this).find('td span.badge').text();
+        var link = window.location.origin + '/customer/account/orders/' + id + '/tracking';
+        if (status == 'Completed')
+            $(this).find('td.actions a').after('<a href="' + link + '"><span class="icon icon-truck"></span></a>');
+    });
+});