diff --git a/src/main/ui/static/shopify/auth/shopify.auth.js b/src/main/ui/static/shopify/auth/shopify.auth.js
index 2add776c0..ef69b3cee 100644
--- a/src/main/ui/static/shopify/auth/shopify.auth.js
+++ b/src/main/ui/static/shopify/auth/shopify.auth.js
@@ -1,6 +1,6 @@
 define(['angular', 'uiRouter', 'uiBootstrap'], function (angular) {
         'use strict';
-        var module = angular.module('shopify.auth', ['ui.router', 'ui.bootstrap']);
+        var module = angular.module('shopify.auth', ['ui.router', 'ui.bootstrap', 'ngMessages']);
         module.config(['$stateProvider', function ($stateProvider) {
             $stateProvider.state('shopify', {
                 url: '/shopify',
@@ -21,45 +21,199 @@ define(['angular', 'uiRouter', 'uiBootstrap'], function (angular) {
             });
         }]);
 
-        module.controller('ShopifyRootController',['$scope','$http','$state',function ($scope, $http, $state) {
+        module.controller('ShopifyRootController', ['$scope', '$http', '$state', function ($scope, $http, $state) {
             if ($state.is('shopify')) {
                 $state.go('shopify.auth')
             }
         }])
 
-        module.controller('ShopifyAuthController',['$scope','$http','$state', function ($scope, $http, $state) {
+        module.controller('ShopifyAuthController', ['$scope', '$http', '$state', function ($scope, $http, $state) {
             var that = $scope;
             that.store = {
                 loginId: ''
             }
             that.validStoreLoginId = function () {
-                $http.get("/shopify/store/exist",{params: that.store}).then(function (res) {
+                $http.get("/shopify/store/exist", {params: that.store}).then(function (res) {
                     if (res.data) {
                         $state.go('shopify.login', {userId: that.store.loginId});
-                    }else {
+                    } else {
                         $state.go('shopify.register', {userId: that.store.loginId});
                     }
                 })
             }
         }]);
 
-        module.controller('ShopifyLoginController',['$scope','$http','$state', function ($scope, $http, $state) {
-            var that =  $scope;
+        module.controller('ShopifyLoginController', ['$scope', '$http', '$state', function ($scope, $http, $state) {
+            var that = $scope;
             that.model = {
                 shop: '',
                 loginId: '',
                 password: ''
             }
             that.activeShopifyMerchant = function () {
-                $http.post("/shopify/auth/permission",that.model).then(function (res) {
-                    console.log("permissionUrl",res.data.url)
+                $http.post("/shopify/auth/permission", that.model).then(function (res) {
+                    console.log("permissionUrl", res.data.url)
                     location.href = res.data.url
                 })
             }
         }]);
 
-        module.controller('ShopifyRegisterController',['$scope','$http','$state', function ($scope, $http, $state) {
+        module.controller('ShopifyRegisterController', ['$scope', '$http', '$state', function ($scope, $http, $state) {
+            var stateMap = [
+                {
+                    "label": "ACT",
+                    "value": "ACT"
+                },
+                {
+                    "label": "NSW",
+                    "value": "NSW"
+                },
+                {
+                    "label": "NT",
+                    "value": "NT"
+                },
+                {
+                    "label": "QLD",
+                    "value": "QLD"
+                },
+                {
+                    "label": "SA",
+                    "value": "SA"
+                },
+                {
+                    "label": "TAS",
+                    "value": "TAS"
+                },
+                {
+                    "label": "VIC",
+                    "value": "VIC"
+                },
+                {
+                    "label": "WA",
+                    "value": "WA"
+                }
+            ];
+            var industryMap = [
+                {
+                    "label": "Shoes&Garments",
+                    "value": "343"
+                },
+                {
+                    "label": "Comprehensive mall",
+                    "value": "484"
+                },
+                {
+                    "label": "Food",
+                    "value": "485"
+                },
+                {
+                    "label": "Cosmetics",
+                    "value": "486"
+                },
+                {
+                    "label": "Maternal and infant",
+                    "value": "487"
+                },
+                {
+                    "label": "Digital appliance",
+                    "value": "488"
+                },
+                {
+                    "label": "Logistics",
+                    "value": "489"
+                },
+                {
+                    "label": "Education Industry",
+                    "value": "490"
+                },
+                {
+                    "label": "Hotel Industry",
+                    "value": "491"
+                },
+                {
+                    "label": "Stationery/office supplies",
+                    "value": "492"
+                },
+                {
+                    "label": "Air Ticket",
+                    "value": "493"
+                },
+                {
+                    "label": "Other trade industry",
+                    "value": "494"
+                }, {
+                    "label": "Overseas Education",
+                    "value": "528"
+                },
+                {
+                    "label": "Travel ticket",
+                    "value": "529"
+                },
+                {
+                    "label": "Car rental",
+                    "value": "530"
+                },
+                {
+                    "label": "International Conference",
+                    "value": "531"
+                },
+                {
+                    "label": "Software",
+                    "value": "532"
+                },
+                {
+                    "label": "Medical Service",
+                    "value": "533"
+                }
+            ];
+            $scope.states = angular.copy(stateMap);
+            $scope.industries = angular.copy(industryMap);
+            $scope.partner = {};
+            $scope.saveForm = function (form) {
+                if (form.$invalid) {
+                    angular.forEach(form, function (item, key) {
+                        if (key.indexOf('$') < 0) {
+                            item.$dirty = true;
+                        }
+                    });
+                    return;
+                }
+                if ($scope.partner.password != $scope.partner.password_again) {
+                    $scope.resError = 'Inconsistent passwords';
+                    return;
+                }
+                $('#login-btn').attr('disabled', true);
 
+                const paymentMerchant = {
+                    companyName: $scope.partner.companyName,
+                    address: $scope.partner.address,
+                    suburb: $scope.partner.suburb,
+                    postcode: $scope.partner.postcode,
+                    state: $scope.partner.state,
+                    country: $scope.partner.country,
+                    contactPerson: $scope.partner.contactPerson,
+                    contactPhone: $scope.partner.contactPhone,
+                    contactEmail: $scope.partner.contactEmail
+                }
+                const PaymentAccountCommand = {
+                    loginId: $scope.partner.loginId,
+                    password: $scope.partner.password
+                }
+                const param = {
+                    paymentMerchant,
+                    PaymentAccountCommand,
+                    shopifyShop: $scope.partner.shopifyShop
+                }
+                console.log("参数：", param)
+                $http.post('shopify/store/register', param).then(function (resp) {
+                    // alert("Registered merchant application has been submitted successfully");
+                    // location.href = 'partner_register_success.html';
+                }, function (resp) {
+                    alert(resp.data.message);
+                    $scope.resError = resp.data.message;
+                    $('#login-btn').attr('disabled', false);
+                });
+            };
         }]);
 
         return module;
diff --git a/src/main/ui/static/shopify/auth/templates/shopify_register.html b/src/main/ui/static/shopify/auth/templates/shopify_register.html
index 29541b3ca..1c86c1811 100644
--- a/src/main/ui/static/shopify/auth/templates/shopify_register.html
+++ b/src/main/ui/static/shopify/auth/templates/shopify_register.html
@@ -3,9 +3,13 @@
 <head>
     <meta charset="UTF-8">
     <title>Title</title>
-
+    <script type="text/javascript" src="../../../../static/lib/jquery/jquery-2.1.4.min.js"></script>
+    <script type="text/javascript" src="../../../../static/lib/angularjs/angular.min.js"></script>
+    <script type="text/javascript" src="../../../../static/lib/angularjs/angular-messages.js"></script>
+    <script type="text/javascript" src="../../../../static/lib/bootstrap/js/bootstrap.min.js"></script>
+    <script type="text/javascript" src="../../../../static/lib/blocs.min.js"></script>
     <style>
-        .col-centered{
+        .col-centered {
             float: none;
             margin: 0 auto;
         }
@@ -17,12 +21,150 @@
 </head>
 <body>
 <div class="row">
-    <div class="col-md-3 col-centered">
+    <div class="col-md-5 col-centered">
         <div class="panel panel-default">
             <div class="panel-body outer-container">
-                <h3 class="text-center m-t-40">
+                <h3 class="text-center m-t-40" style="margin-bottom: 20px">
                     Register
                 </h3>
+                <form novalidate name="partnerForm" action="" method="post">
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.loginId.$invalid && partnerForm.loginId.$dirty}">
+                        <input type="text" class="form-control" ng-model="partner.loginId" name="loginId"
+                               placeholder="Login ID" required>
+                        <div  ng-messages="partnerForm.loginId.$error"
+                             ng-if="partnerForm.loginId.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.password.$invalid && partnerForm.password.$dirty}">
+                        <input type="password" class="form-control" ng-model="partner.password" name="password"
+                               placeholder="Password" required>
+                        <div  ng-messages="partnerForm.password.$error"
+                             ng-if="partnerForm.password.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.password_again.$invalid && partnerForm.password_again.$dirty}">
+                        <input type="password" class="form-control" ng-model="partner.password_again" name="password_again"
+                               placeholder="Enter the password again" required>
+                        <div  ng-messages="partnerForm.password_again.$error"
+                             ng-if="partnerForm.password_again.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.shopifyShop.$invalid && partnerForm.shopifyShop.$dirty}">
+                        <input type="text" class="form-control" ng-model="partner.shopifyShop" name="shopifyShop"
+                               placeholder="Shop" required>
+                        <p class="help-block">Example: geek-test-shop.myshopify.com</p>
+                        <div  ng-messages="partnerForm.shopifyShop.$error"
+                              ng-if="partnerForm.shopifyShop.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.companyName.$invalid && partnerForm.companyName.$dirty}">
+                        <input type="text" class="form-control" ng-model="partner.companyName" name="companyName"
+                               placeholder="Store Name /Company Name" required maxlength="15">
+                        <div  ng-messages="partnerForm.companyName.$error"
+                             ng-if="partnerForm.companyName.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.address.$invalid && partnerForm.address.$dirty}">
+                        <textarea class="form-control" ng-model="partner.address" placeholder="Address" name="address"
+                                  required></textarea>
+                        <div  ng-messages="partnerForm.address.$error"
+                             ng-if="partnerForm.address.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.suburb.$invalid && partnerForm.suburb.$dirty}">
+                        <input class="form-control" ng-model="partner.suburb" placeholder="Suburb" name="suburb"
+                               required >
+                        <div  ng-messages="partnerForm.suburb.$error"
+                             ng-if="partnerForm.suburb.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.postcode.$invalid && partnerForm.postcode.$dirty}">
+                        <input class="form-control" ng-model="partner.postcode" placeholder="Postcode"
+                               name="postcode"
+                               required>
+                        <div  ng-messages="partnerForm.postcode.$error"
+                             ng-if="partnerForm.postcode.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.state.$invalid && partnerForm.state.$dirty}">
+                        <select class="form-control" name="state"
+                                ng-model="partner.state"
+                                id="state-input" required
+                                ng-options="state.value as state.label for state in states">
+                            <option value="">State</option>
+                        </select>
+                        <div  ng-messages="partnerForm.state.$error"
+                             ng-if="partnerForm.state.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.contactPerson.$invalid && partnerForm.contactPerson.$dirty}">
+                        <input class="form-control" ng-model="partner.contactPerson" placeholder="Contact Person"
+                               required maxlength="50" name="contactPerson">
+                        <div  ng-messages="partnerForm.contactPerson.$error"
+                             ng-if="partnerForm.contactPerson.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.contactPhone.$invalid && partnerForm.contactPhone.$dirty}">
+                        <input class="form-control" ng-model="partner.contactPhone" placeholder="Contact Phone"
+                               required maxlength="20" name="contactPhone">
+                        <div  ng-messages="partnerForm.contactPhone.$error"
+                             ng-if="partnerForm.contactPhone.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+                    <div class="form-group has-feedback"
+                         ng-class="{'has-error':partnerForm.contactEmail.$invalid && partnerForm.contactEmail.$dirty}">
+                        <input class="form-control" ng-model="partner.contactEmail" placeholder="Email" required
+                               maxlength="50" name="contactEmail">
+                        <div  ng-messages="partnerForm.contactEmail.$error"
+                             ng-if="partnerForm.contactEmail.$dirty">
+                            <p class="small text-danger" ng-message="required">Required Field</p>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-xs-12 margin-bottom">
+                            <button type="button" id="login-btn" class="btn btn-success btn-block btn-flat"
+                                    ng-click="saveForm(partnerForm)">Submit
+                            </button>
+                            <div>
+                                <p ng-if="resError" style="padding: 6px 12px;font-size: 14px;"
+                                   class="small text-danger">{{resError}}</p>
+                            </div>
+                        </div>
+                    </div>
+                </form>
             </div>
         </div>
     </div>