diff --git a/app/Http/Kernel.php b/app/Http/Kernel.php
index a95cd23b..0a4f3fa2 100644
--- a/app/Http/Kernel.php
+++ b/app/Http/Kernel.php
@@ -39,7 +39,7 @@ class Kernel extends HttpKernel
         ],
 
         'api' => [
-            'throttle:60,1',
+            // 'throttle:60,1',
             'bindings',
         ],
     ];
diff --git a/package-lock.json b/package-lock.json
index 301fb45b..e6eb4ff2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2814,6 +2814,7 @@
         "anymatch": "2.0.0",
         "async-each": "1.0.1",
         "braces": "2.3.2",
+        "fsevents": "1.2.4",
         "glob-parent": "3.1.0",
         "inherits": "2.0.3",
         "is-binary-path": "1.0.1",
@@ -5923,6 +5924,535 @@
       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
       "dev": true
     },
+    "fsevents": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.4.tgz",
+      "integrity": "sha512-z8H8/diyk76B7q5wg+Ud0+CqzcAF3mBBI/bA5ne5zrRUUIvNkJY//D3BqyH571KuAC4Nr7Rw7CjWX4r0y9DvNg==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "nan": "2.10.0",
+        "node-pre-gyp": "0.10.0"
+      },
+      "dependencies": {
+        "abbrev": {
+          "version": "1.1.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "ansi-regex": {
+          "version": "2.1.1",
+          "bundled": true,
+          "dev": true
+        },
+        "aproba": {
+          "version": "1.2.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "are-we-there-yet": {
+          "version": "1.1.4",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "delegates": "1.0.0",
+            "readable-stream": "2.3.6"
+          }
+        },
+        "balanced-match": {
+          "version": "1.0.0",
+          "bundled": true,
+          "dev": true
+        },
+        "brace-expansion": {
+          "version": "1.1.11",
+          "bundled": true,
+          "dev": true,
+          "requires": {
+            "balanced-match": "1.0.0",
+            "concat-map": "0.0.1"
+          }
+        },
+        "chownr": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "code-point-at": {
+          "version": "1.1.0",
+          "bundled": true,
+          "dev": true
+        },
+        "concat-map": {
+          "version": "0.0.1",
+          "bundled": true,
+          "dev": true
+        },
+        "console-control-strings": {
+          "version": "1.1.0",
+          "bundled": true,
+          "dev": true
+        },
+        "core-util-is": {
+          "version": "1.0.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "debug": {
+          "version": "2.6.9",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
+        "deep-extend": {
+          "version": "0.5.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "delegates": {
+          "version": "1.0.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "detect-libc": {
+          "version": "1.0.3",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "fs-minipass": {
+          "version": "1.2.5",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "minipass": "2.2.4"
+          }
+        },
+        "fs.realpath": {
+          "version": "1.0.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "gauge": {
+          "version": "2.7.4",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "aproba": "1.2.0",
+            "console-control-strings": "1.1.0",
+            "has-unicode": "2.0.1",
+            "object-assign": "4.1.1",
+            "signal-exit": "3.0.2",
+            "string-width": "1.0.2",
+            "strip-ansi": "3.0.1",
+            "wide-align": "1.1.2"
+          }
+        },
+        "glob": {
+          "version": "7.1.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "fs.realpath": "1.0.0",
+            "inflight": "1.0.6",
+            "inherits": "2.0.3",
+            "minimatch": "3.0.4",
+            "once": "1.4.0",
+            "path-is-absolute": "1.0.1"
+          }
+        },
+        "has-unicode": {
+          "version": "2.0.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "iconv-lite": {
+          "version": "0.4.21",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "safer-buffer": "2.1.2"
+          }
+        },
+        "ignore-walk": {
+          "version": "3.0.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "minimatch": "3.0.4"
+          }
+        },
+        "inflight": {
+          "version": "1.0.6",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "once": "1.4.0",
+            "wrappy": "1.0.2"
+          }
+        },
+        "inherits": {
+          "version": "2.0.3",
+          "bundled": true,
+          "dev": true
+        },
+        "ini": {
+          "version": "1.3.5",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "is-fullwidth-code-point": {
+          "version": "1.0.0",
+          "bundled": true,
+          "dev": true,
+          "requires": {
+            "number-is-nan": "1.0.1"
+          }
+        },
+        "isarray": {
+          "version": "1.0.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "minimatch": {
+          "version": "3.0.4",
+          "bundled": true,
+          "dev": true,
+          "requires": {
+            "brace-expansion": "1.1.11"
+          }
+        },
+        "minimist": {
+          "version": "0.0.8",
+          "bundled": true,
+          "dev": true
+        },
+        "minipass": {
+          "version": "2.2.4",
+          "bundled": true,
+          "dev": true,
+          "requires": {
+            "safe-buffer": "5.1.1",
+            "yallist": "3.0.2"
+          }
+        },
+        "minizlib": {
+          "version": "1.1.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "minipass": "2.2.4"
+          }
+        },
+        "mkdirp": {
+          "version": "0.5.1",
+          "bundled": true,
+          "dev": true,
+          "requires": {
+            "minimist": "0.0.8"
+          }
+        },
+        "ms": {
+          "version": "2.0.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "needle": {
+          "version": "2.2.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "debug": "2.6.9",
+            "iconv-lite": "0.4.21",
+            "sax": "1.2.4"
+          }
+        },
+        "node-pre-gyp": {
+          "version": "0.10.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "detect-libc": "1.0.3",
+            "mkdirp": "0.5.1",
+            "needle": "2.2.0",
+            "nopt": "4.0.1",
+            "npm-packlist": "1.1.10",
+            "npmlog": "4.1.2",
+            "rc": "1.2.7",
+            "rimraf": "2.6.2",
+            "semver": "5.5.0",
+            "tar": "4.4.1"
+          }
+        },
+        "nopt": {
+          "version": "4.0.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "abbrev": "1.1.1",
+            "osenv": "0.1.5"
+          }
+        },
+        "npm-bundled": {
+          "version": "1.0.3",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "npm-packlist": {
+          "version": "1.1.10",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "ignore-walk": "3.0.1",
+            "npm-bundled": "1.0.3"
+          }
+        },
+        "npmlog": {
+          "version": "4.1.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "are-we-there-yet": "1.1.4",
+            "console-control-strings": "1.1.0",
+            "gauge": "2.7.4",
+            "set-blocking": "2.0.0"
+          }
+        },
+        "number-is-nan": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dev": true
+        },
+        "object-assign": {
+          "version": "4.1.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "once": {
+          "version": "1.4.0",
+          "bundled": true,
+          "dev": true,
+          "requires": {
+            "wrappy": "1.0.2"
+          }
+        },
+        "os-homedir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "os-tmpdir": {
+          "version": "1.0.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "osenv": {
+          "version": "0.1.5",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "os-homedir": "1.0.2",
+            "os-tmpdir": "1.0.2"
+          }
+        },
+        "path-is-absolute": {
+          "version": "1.0.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "process-nextick-args": {
+          "version": "2.0.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "rc": {
+          "version": "1.2.7",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "deep-extend": "0.5.1",
+            "ini": "1.3.5",
+            "minimist": "1.2.0",
+            "strip-json-comments": "2.0.1"
+          },
+          "dependencies": {
+            "minimist": {
+              "version": "1.2.0",
+              "bundled": true,
+              "dev": true,
+              "optional": true
+            }
+          }
+        },
+        "readable-stream": {
+          "version": "2.3.6",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "core-util-is": "1.0.2",
+            "inherits": "2.0.3",
+            "isarray": "1.0.0",
+            "process-nextick-args": "2.0.0",
+            "safe-buffer": "5.1.1",
+            "string_decoder": "1.1.1",
+            "util-deprecate": "1.0.2"
+          }
+        },
+        "rimraf": {
+          "version": "2.6.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "glob": "7.1.2"
+          }
+        },
+        "safe-buffer": {
+          "version": "5.1.1",
+          "bundled": true,
+          "dev": true
+        },
+        "safer-buffer": {
+          "version": "2.1.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "sax": {
+          "version": "1.2.4",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "semver": {
+          "version": "5.5.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "set-blocking": {
+          "version": "2.0.0",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "signal-exit": {
+          "version": "3.0.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "string-width": {
+          "version": "1.0.2",
+          "bundled": true,
+          "dev": true,
+          "requires": {
+            "code-point-at": "1.1.0",
+            "is-fullwidth-code-point": "1.0.0",
+            "strip-ansi": "3.0.1"
+          }
+        },
+        "string_decoder": {
+          "version": "1.1.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "safe-buffer": "5.1.1"
+          }
+        },
+        "strip-ansi": {
+          "version": "3.0.1",
+          "bundled": true,
+          "dev": true,
+          "requires": {
+            "ansi-regex": "2.1.1"
+          }
+        },
+        "strip-json-comments": {
+          "version": "2.0.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "tar": {
+          "version": "4.4.1",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "chownr": "1.0.1",
+            "fs-minipass": "1.2.5",
+            "minipass": "2.2.4",
+            "minizlib": "1.1.0",
+            "mkdirp": "0.5.1",
+            "safe-buffer": "5.1.1",
+            "yallist": "3.0.2"
+          }
+        },
+        "util-deprecate": {
+          "version": "1.0.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true
+        },
+        "wide-align": {
+          "version": "1.1.2",
+          "bundled": true,
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "string-width": "1.0.2"
+          }
+        },
+        "wrappy": {
+          "version": "1.0.2",
+          "bundled": true,
+          "dev": true
+        },
+        "yallist": {
+          "version": "3.0.2",
+          "bundled": true,
+          "dev": true
+        }
+      }
+    },
     "fstream": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
diff --git a/package.json b/package.json
index 1a5f7bec..52478226 100644
--- a/package.json
+++ b/package.json
@@ -27,8 +27,10 @@
     "npm": "^6.0.1",
     "popper.js": "^1.14.1",
     "sweetalert2": "^7.15.1",
+    "vee-validate": "^2.1.0-beta.5",
     "vform": "^1.0.0",
     "vue": "^2.5.16",
+    "vue-axios": "^2.1.1",
     "vue-i18n": "^7.6.0",
     "vue-loader": "14.2.2",
     "vue-meta": "^1.4.4",
diff --git a/public/banklogo.png b/public/banklogo.png
old mode 100755
new mode 100644
diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js
index 45bea195..f2a29c9d 100644
--- a/resources/assets/js/app.js
+++ b/resources/assets/js/app.js
@@ -10,6 +10,9 @@ import locale from 'element-ui/lib/locale/lang/en'
 import '~/plugins'
 import '~/components'
 
+import VeeValidate from 'vee-validate';
+Vue.use(VeeValidate);
+
 Vue.config.productionTip = false
 
 Vue.use(ElementUI, { locale })
diff --git a/resources/assets/js/pages/settings/admin-china-bank.vue b/resources/assets/js/pages/settings/admin-china-bank.vue
index ae2a02d1..29f8a00f 100644
--- a/resources/assets/js/pages/settings/admin-china-bank.vue
+++ b/resources/assets/js/pages/settings/admin-china-bank.vue
@@ -103,6 +103,7 @@
             cnap: '7890po',
             bank_branch: 'Jawa'
         }],
+        chinaBankForm : [],
         EditDatadialogVisible: false,
         DeleteAdddialogVisible: false,
         AddDatadialogVisible: false,
diff --git a/resources/assets/js/pages/settings/admin-supplier.vue b/resources/assets/js/pages/settings/admin-supplier.vue
index ecd64cde..dde1ae12 100644
--- a/resources/assets/js/pages/settings/admin-supplier.vue
+++ b/resources/assets/js/pages/settings/admin-supplier.vue
@@ -1,98 +1,227 @@
 <template>
 <div>
-  <span align="center"><h4>Supplier Details</h4></span><br>
-    <el-table :data="tableData" border style="width: 100%">
-      <el-table-column prop="comp_name" label="Company Name"></el-table-column>
-      <el-table-column prop="reg_no" label="Registration No"></el-table-column>
-      <el-table-column prop="gst_no" label="GST No"></el-table-column>
-      <el-table-column prop="bank_name" label="Bank Name"></el-table-column>
-      <el-table-column prop="account_no" label="Account No"></el-table-column>
-      <el-table-column label="Action">
-          <template slot-scope="scope">
-              <el-button type="text" size="small" @click="EditSupplierdialogVisible = true">Edit</el-button>
-              <el-button type="text" size="small" @click="DeleteSupplierdialogVisible = true">Delete</el-button>
-          </template>
-      </el-table-column>
-    </el-table><br>
-    <div align="right">
-      <el-button type="primary" icon="el-icon-plus" @click="AddNewSupplierdialogVisible = true">Add New Supplier</el-button>
-    </div>
-    <!-- popup add new supplier -->
-      <el-dialog title="Add New Supplier" align="center" :visible.sync="AddNewSupplierdialogVisible" width="40%">
-          <el-form :label-position="right" label-width="150px">
-            <el-form-item label="Company Name"><el-input></el-input></el-form-item>
-            <el-form-item label="Registration No"><el-input></el-input></el-form-item>
-            <el-form-item label="GST No"><el-input></el-input></el-form-item>
-            <el-form-item label="Bank Name"><el-input></el-input></el-form-item>
-            <el-form-item label="Account No"><el-input></el-input></el-form-item>
-          </el-form>
-        <div align="center">
-            <el-button @click="AddNewSupplierdialogVisible = false">Cancel</el-button>
-            <el-button type="primary" @click="AddNewSupplierdialogVisible = false; DoneAddSupplierdialogVisible = true">OK</el-button>
-        </div>
-      </el-dialog>
-      <el-dialog align="center" :visible.sync="DoneAddSupplierdialogVisible" width="30%">
-        <span>Supplier Added Successfully</span><br><br>
-        <div align="center">
-            <el-button type="primary" @click="DoneAddSupplierdialogVisible = false">OK</el-button>
-        </div>
-      </el-dialog>
-    <!-- popup add new supplier end -->
-    <!-- popup edit supplier -->
-      <el-dialog title="Edit Supplier" align="center" :visible.sync="EditSupplierdialogVisible" width="40%">
-          <el-form :label-position="right" label-width="150px">
-            <el-form-item label="Company Name"><el-input></el-input></el-form-item>
-            <el-form-item label="Registration No"><el-input></el-input></el-form-item>
-            <el-form-item label="GST No"><el-input></el-input></el-form-item>
-            <el-form-item label="Bank Name"><el-input></el-input></el-form-item>
-            <el-form-item label="Account No"><el-input></el-input></el-form-item>
-          </el-form>
-        <div align="center">
-            <el-button @click="EditSupplierdialogVisible = false">Cancel</el-button>
-            <el-button type="primary" @click="EditSupplierdialogVisible = false; DoneUpdateSupplierdialogVisible = true">OK</el-button>
-        </div>
-      </el-dialog>
-      <el-dialog align="center" :visible.sync="DoneUpdateSupplierdialogVisible" width="30%">
-        <span>Supplier's Details Updated Successfully</span><br><br>
-        <div align="center">
-            <el-button type="primary" @click="DoneUpdateSupplierdialogVisible = false">OK</el-button>
-        </div>
-      </el-dialog>
-    <!-- popup edit supplier end -->
-    <!-- popup delete supplier -->
-      <el-dialog align="center" :visible.sync="DeleteSupplierdialogVisible" width="30%">
-        <span>Supplier's Details Deleted</span><br><br>
-        <div align="center">
-            <el-button type="primary" @click="DeleteSupplierdialogVisible = false">OK</el-button>
-        </div>
-      </el-dialog>
-    <!-- popup delete supplier end -->
+	<span align="center"><h4>Supplier Details</h4></span><br>
+		<el-table :data="tableData" border style="width: 100%">
+			<el-table-column prop="company_name" label="Company Name"></el-table-column>
+			<el-table-column prop="supplier_reg_no" label="Registration No"></el-table-column>
+			<el-table-column prop="gst_no" label="GST No"></el-table-column>
+			<el-table-column prop="bank_name" label="Bank Name"></el-table-column>
+			<el-table-column prop="acc_no" label="Account No"></el-table-column>
+			<el-table-column label="Action">
+				<template slot-scope="scope">
+					<el-button type="text" size="small" @click="PopOutEditSupplier(scope.$index)">Edit</el-button>
+					<el-button type="text" size="small" @click="DeleteSupplier(tableData[scope.$index].id)">Delete</el-button>
+				</template>
+			</el-table-column>
+		</el-table><br>
+		<div align="right">
+			<el-button type="primary" icon="el-icon-plus" @click="AddNewSupplierdialogVisible = true">Add New Supplier</el-button>
+		</div>
+		<!-- popup add new supplier -->
+			<el-dialog title="Add New Supplier" align="center" :visible.sync="AddNewSupplierdialogVisible" width="40%">
+				<el-form  label-width="150px" >
+					<el-form-item label="Company Name" :class="{'has-error': errors.has('company_name') }">
+						<el-input v-model="supplierForm.company_name" v-validate="'required|max:191'" name="company_name"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('company_name')">{{ errors.first('company_name') }}<br/></span>
+					</el-form-item>
+					<el-form-item label="Registration No" :class="{'has-error': errors.has('supplier_reg_no') }">
+						<el-input v-model="supplierForm.supplier_reg_no" v-validate="'required|max:191'" name="supplier_reg_no"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('supplier_reg_no')">{{ errors.first('supplier_reg_no') }}<br/></span>
+					</el-form-item>
+					<el-form-item label="GST No" :class="{'has-error': errors.has('gst_no') }">
+						<el-input v-model="supplierForm.gst_no" v-validate="'required|max:191'" name="gst_no"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('gst_no')">{{ errors.first('gst_no') }}<br/></span>
+					</el-form-item>
+					<el-form-item label="Bank Name":class="{'has-error': errors.has('bank_name') }">
+						<el-input v-model="supplierForm.bank_name" v-validate="'required|max:191'" name="bank_name"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('bank_name')">{{ errors.first('bank_name') }}<br/></span>
+					</el-form-item>
+					<el-form-item label="Account No":class="{'has-error': errors.has('acc_no') }">
+						<el-input v-model="supplierForm.acc_no" v-validate="'required|max:191'" name="acc_no"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('acc_no')">{{ errors.first('acc_no') }}<br/></span>
+					</el-form-item>
+				</el-form>
+				<div align="center">
+						<el-button @click="AddNewSupplierdialogVisible = false">Cancel</el-button>
+						<el-button type="primary" @click="CreateSupplier">OK</el-button>
+				</div>
+			</el-dialog>
+			<el-dialog align="center" :visible.sync="DoneAddSupplierdialogVisible" width="30%">
+				<span>Supplier Added Successfully</span><br><br>
+				<div align="center">
+						<el-button type="primary" @click="DoneAddSupplierdialogVisible = false;">OK</el-button>
+				</div>
+			</el-dialog>
+		<!-- popup add new supplier end -->
+		<!-- popup edit supplier -->
+			<el-dialog title="Edit Supplier" align="center" :visible.sync="EditSupplierdialogVisible" width="40%">
+					<el-form  label-width="150px" >
+					<el-form-item label="Company Name" :class="{'has-error': errors.has('company_name') }">
+						<el-input v-model="supplierForm.company_name" v-validate="'required|max:191'" name="company_name"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('company_name')">{{ errors.first('company_name') }}<br/></span>
+					</el-form-item>
+					<el-form-item label="Registration No" :class="{'has-error': errors.has('supplier_reg_no') }">
+						<el-input v-model="supplierForm.supplier_reg_no" v-validate="'required|max:191'" name="supplier_reg_no"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('supplier_reg_no')">{{ errors.first('supplier_reg_no') }}<br/></span>
+					</el-form-item>
+					<el-form-item label="GST No" :class="{'has-error': errors.has('gst_no') }">
+						<el-input v-model="supplierForm.gst_no" v-validate="'required|max:191'" name="gst_no"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('gst_no')">{{ errors.first('gst_no') }}<br/></span>
+					</el-form-item>
+					<el-form-item label="Bank Name":class="{'has-error': errors.has('bank_name') }">
+						<el-input v-model="supplierForm.bank_name" v-validate="'required|max:191'" name="bank_name"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('bank_name')">{{ errors.first('bank_name') }}<br/></span>
+					</el-form-item>
+					<el-form-item label="Account No":class="{'has-error': errors.has('acc_no') }">
+						<el-input v-model="supplierForm.acc_no" v-validate="'required|max:191'" name="acc_no"></el-input>
+						<span class="error-message text-danger" v-if="errors.has('acc_no')">{{ errors.first('acc_no') }}<br/></span>
+					</el-form-item>
+				</el-form>
+				<div align="center">
+						<el-button @click="EditSupplierdialogVisible = false">Cancel</el-button>
+						<el-button type="primary" @click="EditSupplier">OK</el-button>
+				</div>
+			</el-dialog>
+			<el-dialog align="center" :visible.sync="DoneUpdateSupplierdialogVisible" width="30%">
+				<span>Supplier's Details Updated Successfully</span><br><br>
+				<div align="center">
+						<el-button type="primary" @click="DoneUpdateSupplierdialogVisible = false">OK</el-button>
+				</div>
+			</el-dialog>
+		<!-- popup edit supplier end -->
+		<!-- popup delete supplier -->
+			<el-dialog align="center" :visible.sync="DeleteSupplierdialogVisible" width="30%">
+				<span>Supplier's Details Deleted</span><br><br>
+				<div align="center">
+						<el-button type="primary" @click="DeleteSupplierdialogVisible = false">OK</el-button>
+				</div>
+			</el-dialog>
+		<!-- popup delete supplier end -->
 </div>
 </template>
 
 <script>
-  export default {
-    data() {
-      return {
-        tableData: [{
-          comp_name: 'CIEF',
-          reg_no: '2134241',
-          gst_no: '214',
-          bank_name: 'myabank', 
-          account_no: '1242521', 
-        }, {
-          comp_name: 'iPhone',
-          reg_no: '123214',
-          gst_no: '3532',
-          bank_name: 'adyabank', 
-          account_no: '21421421', 
-        }],
-        AddNewSupplierdialogVisible: false,
-        EditSupplierdialogVisible: false,
-        DoneAddSupplierdialogVisible: false,
-        DoneUpdateSupplierdialogVisible: false,
-        DeleteSupplierdialogVisible: false
-      }
-    }
-  }
-</script>
\ No newline at end of file
+var axios = require('axios');
+var client = axios.create({
+  baseURL: 'http://localhost:8000'
+});
+
+	export default {
+		data() {
+			return {
+				tableData: [],
+				supplierForm : {
+					company_name: '',
+					supplier_reg_no: '',
+					gst_no: '',
+					bank_name: '', 
+					acc_no: '', 
+				},
+				AddNewSupplierdialogVisible: false,
+				EditSupplierdialogVisible: false,
+				DoneAddSupplierdialogVisible: false,
+				DoneUpdateSupplierdialogVisible: false,
+				DeleteSupplierdialogVisible: false,
+				currentEdit: -1,
+			}
+		},
+		beforeMount(){
+			this.UpdateTableData();
+		},
+		methods:{
+			CreateSupplier : function(){
+				this.AddNewSupplierdialogVisible = false; 
+				client.post('api/setting-supplier', this.supplierForm)
+				.then((response) => {
+					this.DoneAddSupplierdialogVisible = true;
+					this.ClearSupplierForm();
+				})
+				.catch((error) => {
+					console.log(error);
+					this.$message({
+						showClose: true,
+						message: 'Create Fail',
+						type: 'error',
+						duration: 10000
+					});
+					this.ClearSupplierForm();
+				});
+			},
+			UpdateTableData : function(){
+				client.get('api/setting-supplier', this.supplierForm)
+					.then((response) => {
+						this.tableData = response.data;
+						this.UpdateTableData();
+					})
+					.catch((error) => {
+						console.log(error);
+						this.$message({
+							showClose: true,
+							message: 'Fetch data fail',
+							type: 'error',
+							duration: 10000
+						});
+					})
+			},
+			DeleteSupplier : function(supplier_id){
+				this.DeleteSupplierdialogVisible = true;
+				client.delete('api/setting-supplier/' + supplier_id)
+					.then((response) => {
+						this.UpdateTableData();
+					})
+					.catch((error) => {
+						console.log(error);
+						this.$message({
+							showClose: true,
+							message: 'Delete data fail',
+							type: 'error',
+							duration: 10000
+						});
+					})
+			},
+			EditSupplier : function(){
+				this.EditSupplierdialogVisible = false; 
+				this.DoneUpdateSupplierdialogVisible = true;
+
+				client.put('api/setting-supplier/' + this.currentEdit, this.supplierForm)
+				.then((response) => {
+					this.UpdateTableData();
+				})
+				.catch((error) => {
+					console.log(error);
+					this.$message({
+						showClose: true,
+						message: 'Update Fail',
+						type: 'error',
+						duration: 10000
+					});
+				})
+			},
+			PopOutEditSupplier : function(supplier_id){
+				this.EditSupplierdialogVisible = true;
+				this.FillupSupplierForm(supplier_id);
+				this.currentEdit = this.tableData[supplier_id].id;
+			},
+			ClearSupplierForm : function(){
+				this.supplierForm.company_name = '';
+				this.supplierForm.supplier_reg_no = '';
+				this.supplierForm.gst_no = '';
+				this.supplierForm.bank_name = '';
+				this.supplierForm.acc_no = '';
+			},
+			FillupSupplierForm : function(supplier_id){
+				this.supplierForm.company_name = this.tableData[supplier_id].company_name;
+				this.supplierForm.supplier_reg_no = this.tableData[supplier_id].supplier_reg_no;
+				this.supplierForm.gst_no = this.tableData[supplier_id].gst_no;
+				this.supplierForm.bank_name = this.tableData[supplier_id].bank_name;
+				this.supplierForm.acc_no = this.tableData[supplier_id].acc_no;
+			}
+		}
+	}
+</script>
+<style type="text/css">
+	.error-message{
+		position: absolute;
+		left: 0;
+	}
+</style>
\ No newline at end of file
diff --git a/vendor/composer/autoload_static.php b/vendor/composer/autoload_static.php
index 93444711..1533987b 100644
--- a/vendor/composer/autoload_static.php
+++ b/vendor/composer/autoload_static.php
@@ -4,7 +4,7 @@
 
 namespace Composer\Autoload;
 
-class ComposerStaticInit186bbd0d0f979469b3a193511536d69e
+class ComposerStaticInit0eb1f3eb0d8144627e65b3e93f0783e4
 {
     public static $files = array (
         '6124b4c8570aa390c21fafd04a26c69f' => __DIR__ . '/..' . '/myclabs/deep-copy/src/DeepCopy/deep_copy.php',
@@ -4767,10 +4767,10 @@ class ComposerStaticInit186bbd0d0f979469b3a193511536d69e
     public static function getInitializer(ClassLoader $loader)
     {
         return \Closure::bind(function () use ($loader) {
-            $loader->prefixLengthsPsr4 = ComposerStaticInit186bbd0d0f979469b3a193511536d69e::$prefixLengthsPsr4;
-            $loader->prefixDirsPsr4 = ComposerStaticInit186bbd0d0f979469b3a193511536d69e::$prefixDirsPsr4;
-            $loader->prefixesPsr0 = ComposerStaticInit186bbd0d0f979469b3a193511536d69e::$prefixesPsr0;
-            $loader->classMap = ComposerStaticInit186bbd0d0f979469b3a193511536d69e::$classMap;
+            $loader->prefixLengthsPsr4 = ComposerStaticInit0eb1f3eb0d8144627e65b3e93f0783e4::$prefixLengthsPsr4;
+            $loader->prefixDirsPsr4 = ComposerStaticInit0eb1f3eb0d8144627e65b3e93f0783e4::$prefixDirsPsr4;
+            $loader->prefixesPsr0 = ComposerStaticInit0eb1f3eb0d8144627e65b3e93f0783e4::$prefixesPsr0;
+            $loader->classMap = ComposerStaticInit0eb1f3eb0d8144627e65b3e93f0783e4::$classMap;
 
         }, null, ClassLoader::class);
     }
diff --git a/yarn.lock b/yarn.lock
index bbadcb44..c0cf7c4d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3101,8 +3101,13 @@ ejs@^2.5.7:
   resolved "https://registry.yarnpkg.com/ejs/-/ejs-2.6.1.tgz#498ec0d495655abc6f23cd61868d926464071aa0"
 
 electron-to-chromium@^1.2.7, electron-to-chromium@^1.3.30, electron-to-chromium@^1.3.47:
+<<<<<<< HEAD
   version "1.3.51"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.51.tgz#6a42b49daaf7f22a5b37b991daf949f34dbdb9b5"
+=======
+  version "1.3.50"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.50.tgz#7438b76f92b41b919f3fbdd350fbd0757dacddf7"
+>>>>>>> cfa20eac166d2d74f65683dfddbb15d3da35f9ae
 
 element-ui@^2.3.9:
   version "2.4.3"
@@ -9792,6 +9797,13 @@ vary@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
 
+<<<<<<< HEAD
+=======
+vee-validate@^2.1.0-beta.5:
+  version "2.1.0-beta.5"
+  resolved "https://registry.yarnpkg.com/vee-validate/-/vee-validate-2.1.0-beta.5.tgz#311c4629face2383964beb06768b379500f25a69"
+
+>>>>>>> cfa20eac166d2d74f65683dfddbb15d3da35f9ae
 vendors@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/vendors/-/vendors-1.0.2.tgz#7fcb5eef9f5623b156bcea89ec37d63676f21801"
@@ -9866,6 +9878,13 @@ vm-browserify@0.0.4:
   dependencies:
     indexof "0.0.1"
 
+<<<<<<< HEAD
+=======
+vue-axios@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/vue-axios/-/vue-axios-2.1.1.tgz#6167f2db93065d9bcfc90e65d063ccf34f8b1d63"
+
+>>>>>>> cfa20eac166d2d74f65683dfddbb15d3da35f9ae
 vue-eslint-parser@^2.0.3:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz#c268c96c6d94cfe3d938a5f7593959b0ca3360d1"