diff --git a/.env b/.env
index b5c472a..9cf9296 100644
--- a/.env
+++ b/.env
@@ -1,3 +1,3 @@
 NODE_ENV=production
 VUE_APP_PREVIEW=false
-VUE_APP_API_BASE_URL=/api
\ No newline at end of file
+VUE_APP_API_BASE_URL=/dawa
\ No newline at end of file
diff --git a/.env.development b/.env.development
index 166c0bc..03732b7 100644
--- a/.env.development
+++ b/.env.development
@@ -1,3 +1,3 @@
 NODE_ENV=development
 VUE_APP_PREVIEW=true
-VUE_APP_API_BASE_URL=/api
\ No newline at end of file
+VUE_APP_API_BASE_URL=/dawa
\ No newline at end of file
diff --git a/.env.preview b/.env.preview
index a9e44c8..1cc1dbf 100644
--- a/.env.preview
+++ b/.env.preview
@@ -1,3 +1,3 @@
 NODE_ENV=production
 VUE_APP_PREVIEW=true
-VUE_APP_API_BASE_URL=/api
\ No newline at end of file
+VUE_APP_API_BASE_URL=/dawa
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 2f68367..136474a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3073,6 +3073,15 @@
       "integrity": "sha512-aT6camzM4xEA54YVJYSqxz1kv4IHnQZRtThJJHhUMRExaU5spC7jX5ugSwTaTgJliIgs4VhZOk7htClvQ/LmRA==",
       "dev": true
     },
+    "adler-32": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/adler-32/-/adler-32-1.2.0.tgz",
+      "integrity": "sha1-aj5r8KY5ALoVZSgIyxXGgT0aXyU=",
+      "requires": {
+        "exit-on-epipe": "~1.0.1",
+        "printj": "~1.1.0"
+      }
+    },
     "ajv": {
       "version": "6.12.6",
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
@@ -3953,6 +3962,11 @@
         "file-uri-to-path": "1.0.0"
       }
     },
+    "blob.js": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/blob.js/-/blob.js-1.0.1.tgz",
+      "integrity": "sha1-VHtEmyUshVMT6De1PRW0HQAOodI="
+    },
     "bluebird": {
       "version": "3.7.2",
       "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
@@ -4446,6 +4460,16 @@
         "lazy-cache": "^1.0.3"
       }
     },
+    "cfb": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/cfb/-/cfb-1.2.0.tgz",
+      "integrity": "sha512-sXMvHsKCICVR3Naq+J556K+ExBo9n50iKl6LGarlnvuA2035uMlGA/qVrc0wQtow5P1vJEw9UyrKLCbtIKz+TQ==",
+      "requires": {
+        "adler-32": "~1.2.0",
+        "crc-32": "~1.2.0",
+        "printj": "~1.1.2"
+      }
+    },
     "chalk": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@@ -4855,6 +4879,22 @@
         }
       }
     },
+    "codepage": {
+      "version": "1.14.0",
+      "resolved": "https://registry.npmjs.org/codepage/-/codepage-1.14.0.tgz",
+      "integrity": "sha1-jL4lSBMjVZ19MHVxsP/5HnodL5k=",
+      "requires": {
+        "commander": "~2.14.1",
+        "exit-on-epipe": "~1.0.1"
+      },
+      "dependencies": {
+        "commander": {
+          "version": "2.14.1",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.14.1.tgz",
+          "integrity": "sha512-+YR16o3rK53SmWHU3rEM3tPAh2rwb1yPcQX5irVn7mb0gXbwuCCrnkbV5+PBfETdfg1vui07nM6PCG1zndcjQw=="
+        }
+      }
+    },
     "collection-visit": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/collection-visit/-/collection-visit-1.0.0.tgz",
@@ -5329,8 +5369,7 @@
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
-      "dev": true
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
     "cosmiconfig": {
       "version": "5.2.1",
@@ -5356,6 +5395,15 @@
         }
       }
     },
+    "crc-32": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/crc-32/-/crc-32-1.2.0.tgz",
+      "integrity": "sha512-1uBwHxF+Y/4yF5G48fwnKq6QsIXheor3ZLPT80yGBV1oEUwpPojlEhQbWKVw1VwcTQyMGHK1/XMmTjmlsmTTGA==",
+      "requires": {
+        "exit-on-epipe": "~1.0.1",
+        "printj": "~1.1.0"
+      }
+    },
     "create-ecdh": {
       "version": "4.0.4",
       "resolved": "https://registry.npmjs.org/create-ecdh/-/create-ecdh-4.0.4.tgz",
@@ -7439,6 +7487,11 @@
       "integrity": "sha1-BjJjj42HfMghB9MKD/8aF8uhzQw=",
       "dev": true
     },
+    "exit-on-epipe": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/exit-on-epipe/-/exit-on-epipe-1.0.1.tgz",
+      "integrity": "sha512-h2z5mrROTxce56S+pnvAV890uu7ls7f1kEvVGJbw1OlFH3/mlJ5bkXu0KRyW94v37zzHPiUd55iLn3DA7TjWpw=="
+    },
     "expand-brackets": {
       "version": "2.1.4",
       "resolved": "https://registry.npmjs.org/expand-brackets/-/expand-brackets-2.1.4.tgz",
@@ -7814,6 +7867,11 @@
         "schema-utils": "^2.5.0"
       }
     },
+    "file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
+    },
     "file-uri-to-path": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz",
@@ -8015,6 +8073,11 @@
       "integrity": "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==",
       "dev": true
     },
+    "frac": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/frac/-/frac-1.1.2.tgz",
+      "integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA=="
+    },
     "fragment-cache": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
@@ -8780,6 +8843,11 @@
       "dev": true,
       "optional": true
     },
+    "immediate": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
+      "integrity": "sha1-nbHb0Pr43m++D13V5Wu2BigN5ps="
+    },
     "import-cwd": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz",
@@ -10932,6 +11000,24 @@
         "nopt": "^5.0.0"
       }
     },
+    "js-export-excel": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/js-export-excel/-/js-export-excel-1.1.4.tgz",
+      "integrity": "sha512-19m7e3Gnn4CRfHXoFrLYj4fFfJ/KpvI7HRRn25p4GXYD+AlTV+1oU24NH6S904Ksi44tSx7futxhouOPAQ22oQ==",
+      "requires": {
+        "blob.js": "^1.0.1",
+        "file-saver": "^1.3.3",
+        "script-loader": "0.7.2",
+        "xlsx": "0.16.3"
+      },
+      "dependencies": {
+        "file-saver": {
+          "version": "1.3.8",
+          "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-1.3.8.tgz",
+          "integrity": "sha512-spKHSBQIxxS81N/O21WmuXA2F6wppUCsutpzenOeZzOCCJ5gEfcbqJP983IrpLXzYmXnMUa6J03SubcNPdKrlg=="
+        }
+      }
+    },
     "js-message": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
@@ -11104,6 +11190,17 @@
         "verror": "1.10.0"
       }
     },
+    "jszip": {
+      "version": "3.7.1",
+      "resolved": "https://registry.npmjs.org/jszip/-/jszip-3.7.1.tgz",
+      "integrity": "sha512-ghL0tz1XG9ZEmRMcEN2vt7xabrDdqHHeykgARpmZ0BiIctWxM47Vt63ZO2dnp4QYt/xJVLLy5Zv1l/xRdh2byg==",
+      "requires": {
+        "lie": "~3.3.0",
+        "pako": "~1.0.2",
+        "readable-stream": "~2.3.6",
+        "set-immediate-shim": "~1.0.1"
+      }
+    },
     "killable": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
@@ -11263,6 +11360,14 @@
         "type-check": "~0.3.2"
       }
     },
+    "lie": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/lie/-/lie-3.3.0.tgz",
+      "integrity": "sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==",
+      "requires": {
+        "immediate": "~3.0.5"
+      }
+    },
     "lines-and-columns": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.1.6.tgz",
@@ -12702,8 +12807,7 @@
     "pako": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
-      "integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==",
-      "dev": true
+      "integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw=="
     },
     "parallel-transform": {
       "version": "1.2.0",
@@ -13742,6 +13846,11 @@
         }
       }
     },
+    "printj": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/printj/-/printj-1.1.2.tgz",
+      "integrity": "sha512-zA2SmoLaxZyArQTOPj5LXecR+RagfPSU5Kw1qP+jkWeNlrq+eJZyY2oS68SU1Z/7/myXM4lo9716laOFAVStCQ=="
+    },
     "process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -13751,8 +13860,7 @@
     "process-nextick-args": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
-      "dev": true
+      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
     },
     "progress": {
       "version": "2.0.3",
@@ -13992,6 +14100,11 @@
         }
       }
     },
+    "raw-loader": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/raw-loader/-/raw-loader-0.5.1.tgz",
+      "integrity": "sha1-DD0L6u2KAclm2Xh793goElKpeao="
+    },
     "react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
@@ -14071,7 +14184,6 @@
       "version": "2.3.7",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
       "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
-      "dev": true,
       "requires": {
         "core-util-is": "~1.0.0",
         "inherits": "~2.0.3",
@@ -14085,8 +14197,7 @@
         "isarray": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-          "dev": true
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         }
       }
     },
@@ -14539,8 +14650,7 @@
     "safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-      "dev": true
+      "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
     },
     "safe-regex": {
       "version": "1.1.0",
@@ -14620,6 +14730,14 @@
         "ajv-keywords": "^3.5.2"
       }
     },
+    "script-loader": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/script-loader/-/script-loader-0.7.2.tgz",
+      "integrity": "sha512-UMNLEvgOAQuzK8ji8qIscM3GIrRCWN6MmMXGD4SD5l6cSycgGsCo0tX5xRnfQcoghqct0tjHjcykgI1PyBE2aA==",
+      "requires": {
+        "raw-loader": "~0.5.1"
+      }
+    },
     "select": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
@@ -14775,6 +14893,11 @@
       "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
       "dev": true
     },
+    "set-immediate-shim": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz",
+      "integrity": "sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E="
+    },
     "set-value": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.1.tgz",
@@ -15277,6 +15400,14 @@
       "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
       "dev": true
     },
+    "ssf": {
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/ssf/-/ssf-0.11.2.tgz",
+      "integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
+      "requires": {
+        "frac": "~1.1.2"
+      }
+    },
     "sshpk": {
       "version": "1.16.1",
       "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.16.1.tgz",
@@ -15507,7 +15638,6 @@
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
       "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-      "dev": true,
       "requires": {
         "safe-buffer": "~5.1.0"
       }
@@ -16474,8 +16604,7 @@
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
-      "dev": true
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
     },
     "util.promisify": {
       "version": "1.1.1",
@@ -17752,11 +17881,21 @@
       "resolved": "https://registry.npmjs.org/window-size/-/window-size-0.1.0.tgz",
       "integrity": "sha1-VDjNLqk7IC76Ohn+iIeu58lPnJ0="
     },
+    "wmf": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz",
+      "integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw=="
+    },
     "wolfy87-eventemitter": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/wolfy87-eventemitter/-/wolfy87-eventemitter-5.1.0.tgz",
       "integrity": "sha1-NcGsDdGsDBXjXZgVCPwiCEoToBE="
     },
+    "word": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/word/-/word-0.3.0.tgz",
+      "integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA=="
+    },
     "word-wrap": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",
@@ -17871,6 +18010,29 @@
         "async-limiter": "~1.0.0"
       }
     },
+    "xlsx": {
+      "version": "0.16.3",
+      "resolved": "https://registry.npmjs.org/xlsx/-/xlsx-0.16.3.tgz",
+      "integrity": "sha512-LInZ1OK6vpe+Em8XDZ5gDH3WixARwxI7UWc+3chLeafI6gUwECEgL43k4Tjbs1uRfkxpM7wQFy5DLE0hFBRqRw==",
+      "requires": {
+        "adler-32": "~1.2.0",
+        "cfb": "^1.1.4",
+        "codepage": "~1.14.0",
+        "commander": "~2.17.1",
+        "crc-32": "~1.2.0",
+        "exit-on-epipe": "~1.0.1",
+        "ssf": "~0.11.2",
+        "wmf": "~1.0.1",
+        "word": "~0.3.0"
+      },
+      "dependencies": {
+        "commander": {
+          "version": "2.17.1",
+          "resolved": "https://registry.npmjs.org/commander/-/commander-2.17.1.tgz",
+          "integrity": "sha512-wPMUt6FnH2yzG95SA6mzjQOEKUU3aLaDEmzs1ti+1E9h+CsrZghRlqEM/EJ4KscsQVG8uNN4uVreUeT8+drlgg=="
+        }
+      }
+    },
     "xml-name-validator": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-3.0.0.tgz",
diff --git a/package.json b/package.json
index b29405f..2176fb1 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,9 @@
     "axios": "^0.19.0",
     "core-js": "^3.1.2",
     "enquire.js": "^2.1.6",
+    "file-saver": "^2.0.5",
+    "js-export-excel": "^1.1.4",
+    "jszip": "^3.7.1",
     "lodash.clonedeep": "^4.5.0",
     "lodash.get": "^4.4.2",
     "lodash.pick": "^4.4.0",
diff --git a/src/App.vue b/src/App.vue
index 070f28a..1a4c900 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -20,7 +20,6 @@ export default {
       // 只是为了切换语言时，更新标题
       const { title } = this.$route.meta
       title && (setDocumentTitle(`${i18nRender(title)} - ${domTitle}`))
-
       return this.$i18n.getLocaleMessage(this.$store.getters.lang).antLocale
     }
   }
diff --git a/src/api/bms/brand.js b/src/api/bms/brand.js
new file mode 100644
index 0000000..1fa46ec
--- /dev/null
+++ b/src/api/bms/brand.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+const brandApi = {
+  add: '/bms/brand/add',
+  get: '/bms/brand/get',
+  update: '/bms/brand/update',
+  del: '/bms/brand/delete',
+  page: '/bms/brand/page',
+  list: '/bms/brand/listByCategory',
+  updateStatus: '/bms/brand/updateStatus'
+}
+
+export function brandAdd (params) {
+  return request({
+    url: brandApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function brandGet (params) {
+  return request({
+    url: brandApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function brandUpdate (params) {
+  return request({
+    url: brandApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function brandDelete (params) {
+  return request({
+    url: brandApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function brandPage (params) {
+  return request({
+    url: brandApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function brandList (params) {
+  return request({
+    url: brandApi.list,
+    method: 'post',
+    data: params
+  })
+}
+export function brandUpdateStatus (params) {
+  return request({
+    url: brandApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/businessModel.js b/src/api/bms/businessModel.js
new file mode 100644
index 0000000..799152f
--- /dev/null
+++ b/src/api/bms/businessModel.js
@@ -0,0 +1,45 @@
+import request from '@/utils/request'
+const businessModelApi = {
+  add: '/bms/businessModel/save',
+  get: '/bms/businessModel/get',
+  update: '/bms/businessModel/update',
+  del: '/bms/businessModel/delete',
+  page: '/bms/businessModel/page',
+  list: '/bms/businessModel/list'
+}
+
+export function add (params) {
+  return request({
+    url: businessModelApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function get (params) {
+  return request({
+    url: businessModelApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function update (params) {
+  return request({
+    url: businessModelApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function del (params) {
+  return request({
+    url: businessModelApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function list (params) {
+  return request({
+    url: businessModelApi.list,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/catalog.js b/src/api/bms/catalog.js
new file mode 100644
index 0000000..106712a
--- /dev/null
+++ b/src/api/bms/catalog.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+const catalogApi = {
+  add: '/bms/catalog/add',
+  update: '/bms/catalog/update',
+  del: '/bms/catalog/delete',
+  page: '/bms/catalog/page',
+  get: '/bms/catalog/get'
+}
+
+export function catalogAdd (params) {
+  return request({
+    url: catalogApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function catalogUpdate (params) {
+  return request({
+    url: catalogApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function catalogDel (params) {
+  return request({
+    url: catalogApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function catalogPage (params) {
+  return request({
+    url: catalogApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function catalogGet (params) {
+  return request({
+    url: catalogApi.get,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/category.js b/src/api/bms/category.js
new file mode 100644
index 0000000..817fe3c
--- /dev/null
+++ b/src/api/bms/category.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+const api = {
+  listStoreCategory: '/bms/category/listStoreCategory',
+  add: '/bms/category/add',
+  update: '/bms/category/update',
+  delete: '/bms/category/delete',
+  page: '/bms/category/pageCategory',
+  get: '/bms/category/get',
+  updateStatus: '/bms/category/updateStatus'
+}
+export function listStoreCategory (params) {
+  return request({
+    url: api.listStoreCategory,
+    method: 'post',
+    data: params
+  })
+}
+export function addCategory (params) {
+  return request({
+    url: api.add,
+    method: 'post',
+    data: params
+  })
+}
+export function updateCategory (params) {
+  return request({
+    url: api.update,
+    method: 'post',
+    data: params
+  })
+}
+export function deleteCategory (params) {
+  return request({
+    url: api.delete,
+    method: 'post',
+    data: params
+  })
+}
+export function pageCategory (params) {
+  return request({
+    url: api.page,
+    method: 'post',
+    data: params
+  })
+}
+export function getCategory (params) {
+  return request({
+    url: api.get,
+    method: 'post',
+    data: params
+  })
+}
+export function updateStatusCategory (params) {
+  return request({
+    url: api.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/corporation.js b/src/api/bms/corporation.js
new file mode 100644
index 0000000..8e7b3df
--- /dev/null
+++ b/src/api/bms/corporation.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+const CorporationApi = {
+  add: '/bms/corporation/add',
+  get: '/bms/corporation/get',
+  update: '/bms/corporation/update',
+  del: '/bms/corporation/delete',
+  page: '/bms/corporation/page',
+  list: '/bms/corporation/list',
+  updateStatus: '/bms/corporation/updateStatus'
+}
+export function corporationAdd (params) {
+  return request({
+    url: CorporationApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function corporationPage (params) {
+  return request({
+    url: CorporationApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function corporationUpdate (params) {
+  return request({
+    url: CorporationApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function corporationDelete (params) {
+  return request({
+    url: CorporationApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function corporationList (params) {
+  return request({
+    url: CorporationApi.list,
+    method: 'post',
+    data: params
+  })
+}
+export function corporationGet (params) {
+  return request({
+    url: CorporationApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function updateStatus (params) {
+  return request({
+    url: CorporationApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/deliverMethod.js b/src/api/bms/deliverMethod.js
new file mode 100644
index 0000000..5e24f3d
--- /dev/null
+++ b/src/api/bms/deliverMethod.js
@@ -0,0 +1,11 @@
+import request from '@/utils/request'
+const deliverMethodApi = {
+  list: '/bms/deliverMethod/list'
+}
+export function listDeliverMethod (params) {
+  return request({
+    url: deliverMethodApi.list,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/division.js b/src/api/bms/division.js
new file mode 100644
index 0000000..53ac6e9
--- /dev/null
+++ b/src/api/bms/division.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+const divisionApi = {
+  add: '/bms/division/save',
+  get: '/bms/division/get',
+  update: '/bms/division/update',
+  del: '/bms/division/delete',
+  listDivision: '/bms/division/listByParentCode'
+}
+export function divisionAdd (params) {
+  return request({
+    url: divisionApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function divisionGet (params) {
+  return request({
+    url: divisionApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function divisionUpdate (params) {
+  return request({
+    url: divisionApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function divisionDelete (params) {
+  return request({
+    url: divisionApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function listDivision (params) {
+  return request({
+    url: divisionApi.listDivision,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/mall.js b/src/api/bms/mall.js
new file mode 100644
index 0000000..4d7824d
--- /dev/null
+++ b/src/api/bms/mall.js
@@ -0,0 +1,78 @@
+import request from '@/utils/request'
+
+const api = {
+  add: '/bms/mall/save',
+  get: '/bms/mall/get',
+  update: '/bms/mall/update',
+  del: '/bms/mall/delete',
+  page: '/bms/mall/page',
+  list: '/bms/mall/list',
+  updateStatus: '/bms/mall/updateStatus',
+  corporationList: '/bms/corporation/list',
+  listByUserType: '/bms/mall/listByUserType'
+}
+export function add (params) {
+  return request({
+    url: api.add,
+    method: 'post',
+    data: params
+  })
+}
+export function get (params) {
+  return request({
+    url: api.get,
+    method: 'post',
+    data: params
+  })
+}
+export function update (params) {
+  return request({
+    url: api.update,
+    method: 'post',
+    data: params
+  })
+}
+export function del (params) {
+  return request({
+    url: api.del,
+    method: 'post',
+    data: params
+  })
+}
+export function page (params) {
+  return request({
+    url: api.page,
+    method: 'post',
+    data: params
+  })
+}
+export function list (params) {
+  return request({
+    url: api.list,
+    method: 'post',
+    data: params
+  })
+}
+export function updateStatus (params) {
+  return request({
+    url: api.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
+
+export function corporationList (params) {
+  return request({
+    url: api.corporationList,
+    method: 'post',
+    data: params
+  })
+}
+
+export function listByUserType (params) {
+  return request({
+    url: api.listByUserType,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/org.js b/src/api/bms/org.js
new file mode 100644
index 0000000..36ada2f
--- /dev/null
+++ b/src/api/bms/org.js
@@ -0,0 +1,20 @@
+import request from '@/utils/request'
+
+const orgApi = {
+  orgTreeGet: '/bms/org/getOrgTree',
+  orgByUserType: '/bms/org/getByUserType'
+}
+export function orgTreeGet (params) {
+  return request({
+    url: orgApi.orgTreeGet,
+    method: 'post',
+    data: params
+  })
+}
+export function orgByUserType (params) {
+  return request({
+    url: orgApi.orgByUserType,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/payMethod.js b/src/api/bms/payMethod.js
new file mode 100644
index 0000000..775a3fd
--- /dev/null
+++ b/src/api/bms/payMethod.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+const payMethodApi = {
+  add: '/bms/storePayMethod/add',
+  get: '/bms/storePayMethod/getById',
+  update: '/bms/storePayMethod/update',
+  del: '/bms/storePayMethod/delete',
+  list: '/bms/storePayMethod/list',
+  page: '/bms/storePayMethod/page'
+}
+
+export function storePayMethodAdd (params) {
+  return request({
+    url: payMethodApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function storePayMethodPage (params) {
+  return request({
+    url: payMethodApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function storePayMethodGet (params) {
+  return request({
+    url: payMethodApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function storePayMethodUpdate (params) {
+  return request({
+    url: payMethodApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function storePayMethodDelete (params) {
+  return request({
+    url: payMethodApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function storePayMethodList (params) {
+  return request({
+    url: payMethodApi.list,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/settlementAccount.js b/src/api/bms/settlementAccount.js
new file mode 100644
index 0000000..97e1f53
--- /dev/null
+++ b/src/api/bms/settlementAccount.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+const settlementAccountApi = {
+  add: '/bms/storeSettlementAccount/add',
+  get: '/bms/storeSettlementAccount/getById',
+  update: '/bms/storeSettlementAccount/update',
+  del: '/bms/storeSettlementAccount/delete',
+  list: '/bms/storeSettlementAccount/list',
+  page: '/bms/storeSettlementAccount/page'
+}
+
+export function settlementAccountAdd (params) {
+  return request({
+    url: settlementAccountApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function settlementAccountPage (params) {
+  return request({
+    url: settlementAccountApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function settlementAccountGet (params) {
+  return request({
+    url: settlementAccountApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function settlementAccountUpdate (params) {
+  return request({
+    url: settlementAccountApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function settlementAccountDelete (params) {
+  return request({
+    url: settlementAccountApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function settlementAccountList (params) {
+  return request({
+    url: settlementAccountApi.list,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/bms/store.js b/src/api/bms/store.js
new file mode 100644
index 0000000..afc38f5
--- /dev/null
+++ b/src/api/bms/store.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+
+const api = {
+  add: '/bms/store/add',
+  get: '/bms/store/get',
+  update: '/bms/store/update',
+  del: '/bms/store/delete',
+  page: '/bms/store/page',
+  list: '/bms/store/list',
+  updateStatus: '/bms/store/updateStatus'
+}
+export function storeAdd (params) {
+  return request({
+    url: api.add,
+    method: 'post',
+    data: params
+  })
+}
+export function storeGet (params) {
+  return request({
+    url: api.get,
+    method: 'post',
+    data: params
+  })
+}
+export function storeUpdate (params) {
+  return request({
+    url: api.update,
+    method: 'post',
+    data: params
+  })
+}
+export function storeDel (params) {
+  return request({
+    url: api.del,
+    method: 'post',
+    data: params
+  })
+}
+export function storePage (params) {
+  return request({
+    url: api.page,
+    method: 'post',
+    data: params
+  })
+}
+export function storeList (params) {
+  return request({
+    url: api.list,
+    method: 'post',
+    data: params
+  })
+}
+export function storeUpdateStatus (params) {
+  return request({
+    url: api.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/customer/customer.js b/src/api/customer/customer.js
new file mode 100644
index 0000000..41cbab4
--- /dev/null
+++ b/src/api/customer/customer.js
@@ -0,0 +1,78 @@
+import request from '@/utils/request'
+const customerApi = {
+  page: '/customer/customer/pageByNameAndMobile',
+  del: '/customer/customer/delete',
+  add: '/customer/customer/add',
+  update: '/customer/customer/update',
+  get: '/customer/customer/getById',
+  updateStatus: '/customer/customer/updateStatus',
+  getCategoryList: '/customer/customerCategory/listCategoryByName',
+  listCustomer: '/customer/customer/listByNameAndMobile'
+}
+
+export function customerAdd (params) {
+  return request({
+    url: customerApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function customerGet (params) {
+  return request({
+    url: customerApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function customerUpdate (params) {
+  return request({
+    url: customerApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function customerDelete (params) {
+  return request({
+    url: customerApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function customerPage (params) {
+  return request({
+    url: customerApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function customerUpdateStatus (params) {
+  return request({
+    url: customerApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
+export function categoryTypeList (params) {
+  return request({
+    url: customerApi.getCategoryList,
+    method: 'post',
+    data: params
+  })
+}
+export const genderMap = {
+  'MALE': '男',
+  'FEMALE': '女'
+}
+export const deliverTypeMap = {
+  'SELF': '自提',
+  'LOGISTICS': '发物流',
+  'DESIGNATED_PLACE': '送指定点',
+  'AUTO_CAR': '送车'
+}
+export function listCustomer (params) {
+  return request({
+    url: customerApi.listCustomer,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/dashboard/dashboard.js b/src/api/dashboard/dashboard.js
new file mode 100644
index 0000000..99807db
--- /dev/null
+++ b/src/api/dashboard/dashboard.js
@@ -0,0 +1,12 @@
+import request from '@/utils/request'
+const dashboardApi = {
+  get: '/security/dashboard/data'
+}
+
+export function dashboardGet (params) {
+  return request({
+    url: dashboardApi.get,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/file/file.js b/src/api/file/file.js
new file mode 100644
index 0000000..1cac0ba
--- /dev/null
+++ b/src/api/file/file.js
@@ -0,0 +1,14 @@
+import { axios } from '@/utils/request'
+const fileApi = {
+  add: '/file/file/add',
+  del: '/file/file/delete',
+  get: '/file/file/get',
+  upload: '/file/file/uploadFile'
+}
+export function fileUpload (formData) {
+  return axios.post(fileApi.upload, formData, {
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded'
+    }
+  })
+}
diff --git a/src/api/gms/goods.js b/src/api/gms/goods.js
new file mode 100644
index 0000000..8f8ee28
--- /dev/null
+++ b/src/api/gms/goods.js
@@ -0,0 +1,100 @@
+import request from '@/utils/request'
+const goodsApi = {
+  add: '/gms/goods/save',
+  get: '/gms/goods/getGoodsById',
+  update: '/gms/goods/update',
+  del: '/gms/goods/delete',
+  page: '/gms/goods/page',
+  list: '/gms/goods/list',
+  updateStatus: '/gms/goods/updateGoodsStatus',
+  checkGoodsCode: '/gms/goods/checkGoodsGoodsCodeUnique',
+  checkGoodsBarCode: '/gms/goods/checkGoodsGoodsBarCodeUnique',
+  goodsCount: '/gms/goods/countGoodsInfo',
+  detail: '/gms/goods/get',
+  listByStoreId: '/gms/goods/listByStoreId'
+}
+
+export function goodsAdd (params) {
+  return request({
+    url: goodsApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsGet (params) {
+  return request({
+    url: goodsApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsUpdate (params) {
+  return request({
+    url: goodsApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsDelete (params) {
+  return request({
+    url: goodsApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsPage (params) {
+  return request({
+    url: goodsApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsList (params) {
+  return request({
+    url: goodsApi.list,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsUpdateStatus (params) {
+  return request({
+    url: goodsApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsCheckGoodsCode (params) {
+  return request({
+    url: goodsApi.checkGoodsCode,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsCheckGoodsBarCode (params) {
+  return request({
+    url: goodsApi.checkGoodsBarCode,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsCount (params) {
+  return request({
+    url: goodsApi.goodsCount,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsDetail (params) {
+  return request({
+    url: goodsApi.detail,
+    method: 'post',
+    data: params
+  })
+}
+export function getGoodsListByStoreId (params) {
+  return request({
+    url: goodsApi.listByStoreId,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/gms/goodsCategory.js b/src/api/gms/goodsCategory.js
new file mode 100644
index 0000000..86ae1de
--- /dev/null
+++ b/src/api/gms/goodsCategory.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+const goodsCategoryApi = {
+  add: '/gms/goodsCategory/save',
+  get: '/gms/goodsCategory/get',
+  update: '/gms/goodsCategory/update',
+  del: '/gms/goodsCategory/delete',
+  list: '/gms/goodsCategory/listGoodsCategory',
+  updateStatus: '/gms/goodsCategory/updategoodsCategoryStatus'
+}
+
+export function goodsCategoryAdd (params) {
+  return request({
+    url: goodsCategoryApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsCategoryGet (params) {
+  return request({
+    url: goodsCategoryApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsCategoryUpdate (params) {
+  return request({
+    url: goodsCategoryApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsCategoryDelete (params) {
+  return request({
+    url: goodsCategoryApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsCategoryList (params) {
+  return request({
+    url: goodsCategoryApi.list,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsCategoryUpdateStatus (params) {
+  return request({
+    url: goodsCategoryApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/gms/goodsStock.js b/src/api/gms/goodsStock.js
new file mode 100644
index 0000000..f3319d7
--- /dev/null
+++ b/src/api/gms/goodsStock.js
@@ -0,0 +1,19 @@
+import request from '@/utils/request'
+const skuApi = {
+  page: '/gms/goods/pageGoodsStock',
+  exportExcel: '/gms/goods/exportGoodsStock'
+}
+export function pageGoodsStock (params) {
+  return request({
+    url: skuApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function exportStockExcel (params) {
+  return request({
+    url: skuApi.exportExcel,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/gms/goodsUnit.js b/src/api/gms/goodsUnit.js
new file mode 100644
index 0000000..8497df1
--- /dev/null
+++ b/src/api/gms/goodsUnit.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+const goodsUnitApi = {
+  add: '/gms/goodsUnit/save',
+  get: '/gms/goodsUnit/get',
+  update: '/gms/goodsUnit/update',
+  del: '/gms/goodsUnit/delete',
+  page: '/gms/goodsUnit/page',
+  list: '/gms/goodsUnit/list',
+  updateStatus: '/gms/goodsUnit/updategoodsUnitStatus'
+}
+
+export function goodsUnitAdd (params) {
+  return request({
+    url: goodsUnitApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsUnitGet (params) {
+  return request({
+    url: goodsUnitApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsUnitUpdate (params) {
+  return request({
+    url: goodsUnitApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsUnitDelete (params) {
+  return request({
+    url: goodsUnitApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsUnitPage (params) {
+  return request({
+    url: goodsUnitApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsUnitList (params) {
+  return request({
+    url: goodsUnitApi.list,
+    method: 'post',
+    data: params
+  })
+}
+export function goodsUnitUpdateStatus (params) {
+  return request({
+    url: goodsUnitApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/gms/salesProp.js b/src/api/gms/salesProp.js
new file mode 100644
index 0000000..0a6f2b5
--- /dev/null
+++ b/src/api/gms/salesProp.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+const salesPropApi = {
+  add: '/gms/salesProp/add',
+  get: '/gms/salesProp/get',
+  update: '/gms/salesProp/update',
+  del: '/gms/salesProp/delete',
+  page: '/gms/salesProp/page',
+  list: '/gms/salesProp/list'
+}
+
+export function salesPropAdd (params) {
+  return request({
+    url: salesPropApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropGet (params) {
+  return request({
+    url: salesPropApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropUpdate (params) {
+  return request({
+    url: salesPropApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropDelete (params) {
+  return request({
+    url: salesPropApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropPage (params) {
+  return request({
+    url: salesPropApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropList (params) {
+  return request({
+    url: salesPropApi.list,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/gms/salesPropValue.js b/src/api/gms/salesPropValue.js
new file mode 100644
index 0000000..86f77c1
--- /dev/null
+++ b/src/api/gms/salesPropValue.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+const salesPropValueApi = {
+  add: '/gms/salesPropValue/add',
+  get: '/gms/salesPropValue/get',
+  update: '/gms/salesPropValue/update',
+  del: '/gms/salesPropValue/delete',
+  page: '/gms/salesPropValue/page',
+  list: '/gms/salesPropValue/list'
+}
+
+export function salesPropValueAdd (params) {
+  return request({
+    url: salesPropValueApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropValueGet (params) {
+  return request({
+    url: salesPropValueApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropValueUpdate (params) {
+  return request({
+    url: salesPropValueApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropValueDelete (params) {
+  return request({
+    url: salesPropValueApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropValuePage (params) {
+  return request({
+    url: salesPropValueApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function salesPropValueList (params) {
+  return request({
+    url: salesPropValueApi.list,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/gms/sku.js b/src/api/gms/sku.js
new file mode 100644
index 0000000..30b07bb
--- /dev/null
+++ b/src/api/gms/sku.js
@@ -0,0 +1,84 @@
+import request from '@/utils/request'
+const skuApi = {
+  add: '/gms/sku/save',
+  get: '/gms/sku/get',
+  update: '/gms/sku/update',
+  del: '/gms/sku/delete',
+  page: '/gms/sku/page',
+  list: '/gms/sku/list',
+  getJsonSkuList: '/gms/sku/getJsonSkuListByParams',
+  getSalesPropForAdm: '/gms/sku/getSalesPropForAdm',
+  getSkuBySalesProp: '/gms/sku/getSkuBySalesProp',
+  getPropForAdm: '/gms/sku/getPropForAdm'
+}
+
+export function skuAdd (params) {
+  return request({
+    url: skuApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function skuGet (params) {
+  return request({
+    url: skuApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function skuUpdate (params) {
+  return request({
+    url: skuApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function skuDelete (params) {
+  return request({
+    url: skuApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function skuPage (params) {
+  return request({
+    url: skuApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function skuList (params) {
+  return request({
+    url: skuApi.list,
+    method: 'post',
+    data: params
+  })
+}
+export function skuGetJsonSkuList (params) {
+  return request({
+    url: skuApi.getJsonSkuList,
+    method: 'post',
+    data: params
+  })
+}
+export function getSalesPropForAdm (params) {
+  return request({
+    url: skuApi.getSalesPropForAdm,
+    method: 'post',
+    data: params
+  })
+}
+export function getSkuBySalesProp (params) {
+  return request({
+    url: skuApi.getSkuBySalesProp,
+    method: 'post',
+    data: params
+  })
+}
+export function getPropForAdm (params) {
+  return request({
+    url: skuApi.getPropForAdm,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/gms/skuStockChangeRecord.js b/src/api/gms/skuStockChangeRecord.js
new file mode 100644
index 0000000..0232239
--- /dev/null
+++ b/src/api/gms/skuStockChangeRecord.js
@@ -0,0 +1,36 @@
+import request from '@/utils/request'
+const skuStockChangeRecordApi = {
+  page: '/gms/skuStockChangeRecord/page',
+  get: '/gms/skuStockChangeRecord/get',
+  change: '/gms/skuStockChangeRecord/outOrInSkuStockChangeRecord',
+  cancel: '/gms/skuStockChangeRecord/cancelStockChangeRecord'
+}
+
+export function skuStockChangeRecordPage (params) {
+  return request({
+    url: skuStockChangeRecordApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function skuStockChangeRecordGet (params) {
+  return request({
+    url: skuStockChangeRecordApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function skuStockChangeRecordChange (params) {
+  return request({
+    url: skuStockChangeRecordApi.change,
+    method: 'post',
+    data: params
+  })
+}
+export function skuStockChangeRecordCancel (params) {
+  return request({
+    url: skuStockChangeRecordApi.cancel,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/gms/warehouse.js b/src/api/gms/warehouse.js
new file mode 100644
index 0000000..332bb89
--- /dev/null
+++ b/src/api/gms/warehouse.js
@@ -0,0 +1,19 @@
+import request from '@/utils/request'
+const skuApi = {
+  listWarehouse: '/gms/warehouse/listByParams',
+  findWarehouseListByStoreId: '/gms/warehouse/findWarehouseListByStoreId'
+}
+export function listWarehouse (params) {
+  return request({
+    url: skuApi.listWarehouse,
+    method: 'post',
+    data: params
+  })
+}
+export function listWarehouseByStoreId (params) {
+  return request({
+    url: skuApi.findWarehouseListByStoreId,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/login.js b/src/api/login.js
index ea04781..01285ec 100644
--- a/src/api/login.js
+++ b/src/api/login.js
@@ -1,7 +1,7 @@
 import request from '@/utils/request'
 
 const userApi = {
-  Login: '/auth/login',
+  Login: '/login',
   Logout: '/auth/logout',
   ForgePassword: '/auth/forge-password',
   Register: '/auth/register',
diff --git a/src/api/oms/salesOrder.js b/src/api/oms/salesOrder.js
new file mode 100644
index 0000000..0b31773
--- /dev/null
+++ b/src/api/oms/salesOrder.js
@@ -0,0 +1,46 @@
+import request from '@/utils/request'
+const salesOrderApi = {
+  page: '/oms/order/page',
+  get: '/oms/order/get',
+  salesOrderLinePage: '/oms/order/findSalesOrderLinePageBySalesOrderId',
+  exportSalesOrder: '/oms/order/exportSalesOrder',
+  createOrder: '/oms/order/createOrder'
+}
+
+export function salesOrderPage (params) {
+  return request({
+    url: salesOrderApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function salesOrderGet (params) {
+  return request({
+    url: salesOrderApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function salesOrderLinePage (params) {
+  return request({
+    url: salesOrderApi.salesOrderLinePage,
+    method: 'post',
+    data: params
+  })
+}
+export function exportSalesOrder (params) {
+  var result = request({
+    url: salesOrderApi.exportSalesOrder,
+    method: 'post',
+    data: params
+  })
+  return result
+}
+export function createOrder (params) {
+  var result = request({
+    url: salesOrderApi.createOrder,
+    method: 'post',
+    data: params
+  })
+  return result
+}
diff --git a/src/api/purchase/purchase.js b/src/api/purchase/purchase.js
new file mode 100644
index 0000000..736ba92
--- /dev/null
+++ b/src/api/purchase/purchase.js
@@ -0,0 +1,28 @@
+import request from '@/utils/request'
+const purchaseApi = {
+  page: '/purchase/purchaseOrder/pageByParams',
+  get: '/purchase/purchaseOrder/get',
+  purchaseOrderLinePage: '/purchase/purchaseOrder/findPurchaseOrderLineParamsByOrderId'
+}
+
+export function purchaseOrderPage (params) {
+  return request({
+    url: purchaseApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function purchaseOrderGet (params) {
+  return request({
+    url: purchaseApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function purchaseOrderLinePage (params) {
+  return request({
+    url: purchaseApi.purchaseOrderLinePage,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/accessToken.js b/src/api/security/accessToken.js
new file mode 100644
index 0000000..6db44d0
--- /dev/null
+++ b/src/api/security/accessToken.js
@@ -0,0 +1,12 @@
+import request from '@/utils/request'
+const accessTokenApi = {
+  get: '/security/accessToken/get'
+}
+
+export function get (params) {
+  return request({
+    url: accessTokenApi.get,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/app.js b/src/api/security/app.js
new file mode 100644
index 0000000..ce4d13a
--- /dev/null
+++ b/src/api/security/app.js
@@ -0,0 +1,67 @@
+import request from '@/utils/request'
+const appApi = {
+  add: '/security/app/save',
+  get: '/security/app/get',
+  update: '/security/app/update',
+  del: '/security/app/delete',
+  page: '/security/app/page',
+  updateStatus: '/security/app/updateStatus',
+  refresh: '/security/app/refreshAccessSecret'
+}
+
+export function appAdd (params) {
+  return request({
+    url: appApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function appGet (params) {
+  return request({
+    url: appApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function appUpdate (params) {
+  return request({
+    url: appApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function appDelete (params) {
+  return request({
+    url: appApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function appPage (params) {
+  return request({
+    url: appApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function appUpdateStatus (params) {
+  return request({
+    url: appApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
+export function refreshAccessSecret (params) {
+  return request({
+    url: appApi.refresh,
+    method: 'post',
+    data: params
+  })
+}
+export const appTypeMap = {
+  'ANDROID_APP': 'Android APP',
+  'A8_POS': 'POS A8版',
+  'IOS_APP': 'iPhone APP',
+  'OPENAPI': '开放接口',
+  'ADMIN': '管理后台'
+}
diff --git a/src/api/security/appVersion.js b/src/api/security/appVersion.js
new file mode 100644
index 0000000..9220752
--- /dev/null
+++ b/src/api/security/appVersion.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+const appVersionApi = {
+  add: '/security/appVersion/save',
+  update: '/security/appVersion/update',
+  del: '/security/appVersion/delete',
+  page: '/security/appVersion/page',
+  updateMustUpgrade: '/security/appVersion/updateMustUpgrade',
+  get: '/security/appVersion/getAppVersionById'
+}
+
+export function appVersionAdd (params) {
+  return request({
+    url: appVersionApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function appVersionUpdate (params) {
+  return request({
+    url: appVersionApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function appVersionDelete (params) {
+  return request({
+    url: appVersionApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function appVersionPage (params) {
+  return request({
+    url: appVersionApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function updateMustUpgrade (params) {
+  return request({
+    url: appVersionApi.updateMustUpgrade,
+    method: 'post',
+    data: params
+  })
+}
+export function appVersionGet (params) {
+  return request({
+    url: appVersionApi.get,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/cmsArticle.js b/src/api/security/cmsArticle.js
new file mode 100644
index 0000000..62d0f8d
--- /dev/null
+++ b/src/api/security/cmsArticle.js
@@ -0,0 +1,64 @@
+import request from '@/utils/request'
+const cmsArticleApi = {
+  add: '/security/cmsArticle/add',
+  get: '/security/cmsArticle/get',
+  update: '/security/cmsArticle/update',
+  del: '/security/cmsArticle/delete',
+  page: '/security/cmsArticle/page',
+  updateStatus: '/security/cmsArticle/updateStatus',
+  listByCode: '/security/cmsArticle/listByCode'
+}
+
+export function cmsArticleAdd (params) {
+  return request({
+    url: cmsArticleApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function cmsArticleGet (params) {
+  return request({
+    url: cmsArticleApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function cmsArticleUpdate (params) {
+  return request({
+    url: cmsArticleApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function cmsArticleDelete (params) {
+  return request({
+    url: cmsArticleApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function cmsArticlePage (params) {
+  return request({
+    url: cmsArticleApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function cmsArticleUpdateStatus (params) {
+  return request({
+    url: cmsArticleApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
+export function listByCode (params) {
+  return request({
+    url: cmsArticleApi.listByCode,
+    method: 'post',
+    data: params
+  })
+}
+export const articleTypeMap = {
+  0: '固化',
+  1: '自定义'
+}
diff --git a/src/api/security/deviceInfo.js b/src/api/security/deviceInfo.js
new file mode 100644
index 0000000..4fbbd52
--- /dev/null
+++ b/src/api/security/deviceInfo.js
@@ -0,0 +1,12 @@
+import request from '@/utils/request'
+const deviceInfoApi = {
+  page: '/security/deviceInfo/page'
+}
+
+export function page (params) {
+  return request({
+    url: deviceInfoApi.page,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/function.js b/src/api/security/function.js
new file mode 100644
index 0000000..b9248b3
--- /dev/null
+++ b/src/api/security/function.js
@@ -0,0 +1,52 @@
+import request from '@/utils/request'
+
+const api = {
+  add: '/security/function/add',
+  update: '/security/function/update',
+  del: '/security/function/delete',
+  page: '/security/function/page',
+  get: '/security/function/get',
+  functionCodeMap: '/security/function/getFunctionCodeMap'
+}
+export function functionAdd (params) {
+  return request({
+    url: api.add,
+    method: 'post',
+    data: params
+  })
+}
+export function functionUpdate (params) {
+  return request({
+    url: api.update,
+    method: 'post',
+    data: params
+  })
+}
+export function functionDel (params) {
+  return request({
+    url: api.del,
+    method: 'post',
+    data: params
+  })
+}
+export function functionPage (params) {
+  return request({
+    url: api.page,
+    method: 'post',
+    data: params
+  })
+}
+export function functionGet (params) {
+  return request({
+    url: api.get,
+    method: 'post',
+    data: params
+  })
+}
+export function functionCodeMap (params) {
+  return request({
+    url: api.functionCodeMap,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/functionCategory.js b/src/api/security/functionCategory.js
new file mode 100644
index 0000000..e73318b
--- /dev/null
+++ b/src/api/security/functionCategory.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+const functionCategoryApi = {
+  add: '/security/functionCategory/add',
+  update: '/security/functionCategory/update',
+  del: '/security/functionCategory/delete',
+  page: '/security/functionCategory/page',
+  get: '/security/functionCategory/get'
+}
+
+export function functionCategoryAdd (params) {
+  return request({
+    url: functionCategoryApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function functionCategoryUpdate (params) {
+  return request({
+    url: functionCategoryApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function functionCategoryDel (params) {
+  return request({
+    url: functionCategoryApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function functionCategoryPage (params) {
+  return request({
+    url: functionCategoryApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function functionCategoryGet (params) {
+  return request({
+    url: functionCategoryApi.get,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/functionResource.js b/src/api/security/functionResource.js
new file mode 100644
index 0000000..685c698
--- /dev/null
+++ b/src/api/security/functionResource.js
@@ -0,0 +1,21 @@
+import request from '@/utils/request'
+
+const functionResourceApi = {
+  add: '/security/functionResource/add',
+  del: '/security/functionResource/delete'
+}
+
+export function functionResourceAdd (params) {
+  return request({
+    url: functionResourceApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function functionResourceDelete (params) {
+  return request({
+    url: functionResourceApi.del,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/message.js b/src/api/security/message.js
new file mode 100644
index 0000000..4ba8c55
--- /dev/null
+++ b/src/api/security/message.js
@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+const messageApi = {
+  add: '/security/message/save',
+  get: '/security/message/get',
+  update: '/security/message/update',
+  del: '/security/message/delete',
+  page: '/security/message/page'
+}
+
+export function messageAdd (params) {
+  return request({
+    url: messageApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function messageGet (params) {
+  return request({
+    url: messageApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function messageUpdate (params) {
+  return request({
+    url: messageApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function messageDelete (params) {
+  return request({
+    url: messageApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function messagePage (params) {
+  return request({
+    url: messageApi.page,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/redis.js b/src/api/security/redis.js
new file mode 100644
index 0000000..22efbc5
--- /dev/null
+++ b/src/api/security/redis.js
@@ -0,0 +1,21 @@
+import request from '@/utils/request'
+const redisManageApi = {
+  page: '/security/redisManage/page',
+  deleteByParams: '/security/redisManage/delete'
+}
+
+export function page (params) {
+  return request({
+    url: redisManageApi.page,
+    method: 'post',
+    data: params
+  })
+}
+
+export function deleteByParams (params) {
+  return request({
+    url: redisManageApi.deleteByParams,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/resource.js b/src/api/security/resource.js
new file mode 100644
index 0000000..7d40bcd
--- /dev/null
+++ b/src/api/security/resource.js
@@ -0,0 +1,92 @@
+import request from '@/utils/request'
+
+const resourceApi = {
+  add: '/security/resource/add',
+  get: '/security/resource/get',
+  update: '/security/resource/update',
+  del: '/security/resource/delete',
+  updateStatus: '/security/resource/updateStatus',
+  list: '/security/resource/listByParentId',
+  listByUser: '/security/url/listByUser',
+  listAllResource: '/security/resource/listAllResource',
+  resourceByRoleId: '/security/resource/listAllResourceByRoleId',
+  listResourceByUser: '/security/resource/listResourceByLoginUser',
+  resourceByFunctionId: '/security/resource/listAllResourceByFunctionId'
+}
+
+export function resourceAdd (params) {
+  return request({
+    url: resourceApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function resourceGet (params) {
+  return request({
+    url: resourceApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function resourceUpdate (params) {
+  return request({
+    url: resourceApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function resourceDelete (params) {
+  return request({
+    url: resourceApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function resourceList (params) {
+  return request({
+    url: resourceApi.list,
+    method: 'post',
+    data: params
+  })
+}
+export function resourceListByUser (params) {
+  return request({
+    url: resourceApi.listByUser,
+    method: 'post',
+    data: params
+  })
+}
+export function resourceAll () {
+  return request({
+    url: resourceApi.listAllResource,
+    method: 'post'
+  })
+}
+export function resourceUpdateStatus (params) {
+  return request({
+    url: resourceApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
+export function resourceByRoleId (params) {
+  return request({
+    url: resourceApi.resourceByRoleId,
+    method: 'post',
+    data: params
+  })
+}
+export function listResourceByUser (params) {
+  return request({
+    url: resourceApi.listResourceByUser,
+    method: 'post',
+    data: params
+  })
+}
+export function resourceByFunctionId (params) {
+  return request({
+    url: resourceApi.resourceByFunctionId,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/role.js b/src/api/security/role.js
new file mode 100644
index 0000000..a54673d
--- /dev/null
+++ b/src/api/security/role.js
@@ -0,0 +1,61 @@
+import request from '@/utils/request'
+
+const roleApi = {
+  add: '/security/role/add',
+  get: '/security/role/get',
+  update: '/security/role/update',
+  del: '/security/role/delete',
+  page: '/security/role/page',
+  updateStatus: '/security/role/updateStatus',
+  rolesByUserId: '/security/role/listAllRoleByUserId'
+}
+
+export function roleAdd (params) {
+  return request({
+    url: roleApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function roleGet (params) {
+  return request({
+    url: roleApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function roleUpdate (params) {
+  return request({
+    url: roleApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function roleDelete (params) {
+  return request({
+    url: roleApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function rolePage (params) {
+  return request({
+    url: roleApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function roleUpdateStatus (params) {
+  return request({
+    url: roleApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
+export function rolesByUserId (params) {
+  return request({
+    url: roleApi.rolesByUserId,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/roleResource.js b/src/api/security/roleResource.js
new file mode 100644
index 0000000..4efc967
--- /dev/null
+++ b/src/api/security/roleResource.js
@@ -0,0 +1,21 @@
+import request from '@/utils/request'
+
+const roleResourceApi = {
+  add: '/security/roleResource/add',
+  del: '/security/roleResource/delete'
+}
+
+export function roleResourceAdd (params) {
+  return request({
+    url: roleResourceApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function roleResourceDelete (params) {
+  return request({
+    url: roleResourceApi.del,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/user.js b/src/api/security/user.js
new file mode 100644
index 0000000..21c2f8e
--- /dev/null
+++ b/src/api/security/user.js
@@ -0,0 +1,100 @@
+import request from '@/utils/request'
+
+const userApi = {
+  login: '/login',
+  logout: '/security/user/logout',
+  add: '/security/user/add',
+  get: '/security/user/getById',
+  update: '/security/user/update',
+  del: '/security/user/delete',
+  page: '/security/user/page',
+  updateEnabled: '/security/user/updateEnabled',
+  getListByOrgId: '/security/user/getListByOrgId',
+  getUserInfo: '/security/user/get'
+}
+
+const userPasswordApi = {
+  set: '/security/user/password/set',
+  update: '/security/user/password/update',
+  send: '/security/user/sendSecuritycode',
+  setById: '/security/user/password/setByUserId'
+}
+
+export function userLogin (params) {
+  return request({
+    url: userApi.login,
+    method: 'post',
+    data: params
+  })
+}
+
+export function userAdd (params) {
+  return request({
+    url: userApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function userGet (params) {
+  return request({
+    url: userApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function userUpdate (params) {
+  return request({
+    url: userApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function userDelete (params) {
+  return request({
+    url: userApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function userPage (params) {
+  return request({
+    url: userApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function userUpdateEnabled (params) {
+  return request({
+    url: userApi.updateEnabled,
+    method: 'post',
+    data: params
+  })
+}
+export function userPasswordSet (params) {
+  return request({
+    url: userPasswordApi.set,
+    method: 'post',
+    data: params
+  })
+}
+export function userPasswordSetById (params) {
+  return request({
+    url: userPasswordApi.setById,
+    method: 'post',
+    data: params
+  })
+}
+export function getListByOrgId (params) {
+  return request({
+    url: userApi.getListByOrgId,
+    method: 'post',
+    data: params
+  })
+}
+export function getUserInfo (params) {
+  return request({
+    url: userApi.getUserInfo,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/userFeedBack.js b/src/api/security/userFeedBack.js
new file mode 100644
index 0000000..6234795
--- /dev/null
+++ b/src/api/security/userFeedBack.js
@@ -0,0 +1,20 @@
+import request from '@/utils/request'
+const userFeedBackApi = {
+  page: '/security/user/feedback/pageUserFeedBack',
+  handleFeedBack: '/security/user/feedback/handleFeedBack'
+}
+
+export function UserFeedBackPage (params) {
+  return request({
+    url: userFeedBackApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function handleFeedBack (params) {
+  return request({
+    url: userFeedBackApi.handleFeedBack,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/security/userRole.js b/src/api/security/userRole.js
new file mode 100644
index 0000000..75bae92
--- /dev/null
+++ b/src/api/security/userRole.js
@@ -0,0 +1,21 @@
+import request from '@/utils/request'
+
+const userRoleApi = {
+  add: '/security/userRole/add',
+  del: '/security/userRole/delete'
+}
+
+export function userRoleAdd (params) {
+  return request({
+    url: userRoleApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function userRoleDelete (params) {
+  return request({
+    url: userRoleApi.del,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/api/supplier/supplier.js b/src/api/supplier/supplier.js
new file mode 100644
index 0000000..bc4c294
--- /dev/null
+++ b/src/api/supplier/supplier.js
@@ -0,0 +1,60 @@
+import request from '@/utils/request'
+const supplierApi = {
+  add: '/supplier/supplier/add',
+  get: '/supplier/supplier/getById',
+  update: '/supplier/supplier/update',
+  del: '/supplier/supplier/delete',
+  page: '/supplier/supplier/pageByParams',
+  updateStatus: '/supplier/supplier/updateStatus',
+  list: '/supplier/supplier/listSupplierByParams'
+}
+
+export function supplierAdd (params) {
+  return request({
+    url: supplierApi.add,
+    method: 'post',
+    data: params
+  })
+}
+export function supplierGet (params) {
+  return request({
+    url: supplierApi.get,
+    method: 'post',
+    data: params
+  })
+}
+export function supplierUpdate (params) {
+  return request({
+    url: supplierApi.update,
+    method: 'post',
+    data: params
+  })
+}
+export function supplierDelete (params) {
+  return request({
+    url: supplierApi.del,
+    method: 'post',
+    data: params
+  })
+}
+export function supplierPage (params) {
+  return request({
+    url: supplierApi.page,
+    method: 'post',
+    data: params
+  })
+}
+export function supplierUpdateStatus (params) {
+  return request({
+    url: supplierApi.updateStatus,
+    method: 'post',
+    data: params
+  })
+}
+export function supplierList (params) {
+  return request({
+    url: supplierApi.list,
+    method: 'post',
+    data: params
+  })
+}
diff --git a/src/components/AvatarList/Item.vue b/src/components/AvatarList/Item.vue
new file mode 100644
index 0000000..26e149e
--- /dev/null
+++ b/src/components/AvatarList/Item.vue
@@ -0,0 +1,46 @@
+<template>
+  <tooltip v-if="tips !== ''">
+    <template slot="title">{{ tips }}</template>
+    <avatar :size="avatarSize" :src="src" />
+  </tooltip>
+  <avatar v-else :size="avatarSize" :src="src" />
+</template>
+
+<script>
+import Avatar from 'ant-design-vue/es/avatar'
+import Tooltip from 'ant-design-vue/es/tooltip'
+
+export default {
+  name: 'AvatarItem',
+  components: {
+    Avatar,
+    Tooltip
+  },
+  props: {
+    tips: {
+      type: String,
+      default: '',
+      required: false
+    },
+    src: {
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    return {
+      size: this.$parent.size
+    }
+  },
+  computed: {
+    avatarSize () {
+      return this.size !== 'mini' && this.size || 20
+    }
+  },
+  watch: {
+    '$parent.size' (val) {
+      this.size = val
+    }
+  }
+}
+</script>
diff --git a/src/components/AvatarList/List.vue b/src/components/AvatarList/List.vue
new file mode 100644
index 0000000..446ceeb
--- /dev/null
+++ b/src/components/AvatarList/List.vue
@@ -0,0 +1,99 @@
+<!--
+<template>
+  <div :class="[prefixCls]">
+    <ul>
+      <slot></slot>
+      <template v-for="item in filterEmpty($slots.default).slice(0, 3)"></template>
+
+      <template v-if="maxLength > 0 && filterEmpty($slots.default).length > maxLength">
+        <avatar-item :size="size">
+          <avatar :size="size !== 'mini' && size || 20" :style="excessItemsStyle">{{ `+${maxLength}` }}</avatar>
+        </avatar-item>
+      </template>
+    </ul>
+  </div>
+</template>
+-->
+
+<script>
+import Avatar from 'ant-design-vue/es/avatar'
+import AvatarItem from './Item'
+import { filterEmpty } from '@/components/_util/util'
+
+export default {
+  AvatarItem,
+  name: 'AvatarList',
+  components: {
+    Avatar,
+    AvatarItem
+  },
+  props: {
+    prefixCls: {
+      type: String,
+      default: 'ant-pro-avatar-list'
+    },
+    /**
+       * 头像大小 类型: large、small 、mini, default
+       * 默认值: default
+       */
+    size: {
+      type: [String, Number],
+      default: 'default'
+    },
+    /**
+       * 要显示的最大项目
+       */
+    maxLength: {
+      type: Number,
+      default: 0
+    },
+    /**
+       * 多余的项目风格
+       */
+    excessItemsStyle: {
+      type: Object,
+      default: () => {
+        return {
+          color: '#f56a00',
+          backgroundColor: '#fde3cf'
+        }
+      }
+    }
+  },
+  data () {
+    return {}
+  },
+  methods: {
+    getItems (items) {
+      const classString = {
+        [`${this.prefixCls}-item`]: true,
+        [`${this.size}`]: true
+      }
+
+      if (this.maxLength > 0) {
+        items = items.slice(0, this.maxLength)
+        items.push((<Avatar size={ this.size } style={ this.excessItemsStyle }>{`+${this.maxLength}`}</Avatar>))
+      }
+      const itemList = items.map((item) => (
+        <li class={ classString }>{ item }</li>
+      ))
+      return itemList
+    }
+  },
+  render () {
+    const { prefixCls, size } = this.$props
+    const classString = {
+      [`${prefixCls}`]: true,
+      [`${size}`]: true
+    }
+    const items = filterEmpty(this.$slots.default)
+    const itemsDom = items && items.length ? <ul class={`${prefixCls}-items`}>{ this.getItems(items) }</ul> : null
+
+    return (
+      <div class={ classString }>
+        { itemsDom }
+      </div>
+    )
+  }
+}
+</script>
diff --git a/src/components/Charts/MiniBar.vue b/src/components/Charts/MiniBar.vue
index beac404..b5292f4 100644
--- a/src/components/Charts/MiniBar.vue
+++ b/src/components/Charts/MiniBar.vue
@@ -10,43 +10,20 @@
 </template>
 
 <script>
-import moment from 'moment'
-const data = []
-const beginDay = new Date().getTime()
-
-for (let i = 0; i < 10; i++) {
-  data.push({
-    x: moment(new Date(beginDay + 1000 * 60 * 60 * 24 * i)).format('YYYY-MM-DD'),
-    y: Math.round(Math.random() * 10)
-  })
-}
-
-const tooltip = [
-  'x*y',
-  (x, y) => ({
-    name: x,
-    value: y
-  })
-]
-
-const scale = [{
-  dataKey: 'x',
-  min: 2
-}, {
-  dataKey: 'y',
-  title: '时间',
-  min: 1,
-  max: 30
-}]
-
 export default {
   name: 'MiniBar',
+  props: {
+    data: {
+      type: Array,
+      required: true
+    },
+    height: {
+      type: Number,
+      default: 100
+    }
+  },
   data () {
     return {
-      data,
-      tooltip,
-      scale,
-      height: 100
     }
   }
 }
diff --git a/src/components/Charts/RankList.vue b/src/components/Charts/RankList.vue
index afb56a1..abd23db 100644
--- a/src/components/Charts/RankList.vue
+++ b/src/components/Charts/RankList.vue
@@ -14,7 +14,6 @@
 <script>
 export default {
   name: 'RankList',
-  // ['title', 'list']
   props: {
     title: {
       type: String,
@@ -29,23 +28,22 @@ export default {
 </script>
 
 <style lang="less" scoped>
-
   .rank {
-    padding: 0 32px 32px 72px;
-
+    .title{
+      padding: 10px 24px;
+      border-bottom: 1px solid #e8e8e8;
+      margin: 0;
+    }
     .list {
-      margin: 25px 0 0;
-      padding: 0;
+      padding: 20px 30px 30px 40px;
       list-style: none;
-
+      margin: 0;
       li {
         margin-top: 16px;
-
         span {
           color: rgba(0, 0, 0, .65);
           font-size: 14px;
           line-height: 22px;
-
           &:first-child {
             background-color: #f5f5f5;
             border-radius: 20px;
diff --git a/src/components/Charts/chart.less b/src/components/Charts/chart.less
index e04fa09..4ac1798 100644
--- a/src/components/Charts/chart.less
+++ b/src/components/Charts/chart.less
@@ -6,8 +6,5 @@
     position: absolute;
     bottom: -28px;
     width: 100%;
-
-/*    margin: 0 -5px;
-    overflow: hidden;*/
   }
 }
\ No newline at end of file
diff --git a/src/components/CountDown/CountDown.vue b/src/components/CountDown/CountDown.vue
new file mode 100644
index 0000000..575dd4a
--- /dev/null
+++ b/src/components/CountDown/CountDown.vue
@@ -0,0 +1,102 @@
+<template>
+  <span>
+    {{ lastTime | format }}
+  </span>
+</template>
+
+<script>
+
+function fixedZero (val) {
+  return val * 1 < 10 ? `0${val}` : val
+}
+
+export default {
+  name: 'CountDown',
+  props: {
+    format: {
+      type: Function,
+      default: undefined
+    },
+    target: {
+      type: [Date, Number],
+      required: true
+    },
+    onEnd: {
+      type: Function,
+      default: () => ({})
+    }
+  },
+  data () {
+    return {
+      dateTime: '0',
+      originTargetTime: 0,
+      lastTime: 0,
+      timer: 0,
+      interval: 1000
+    }
+  },
+  filters: {
+    format (time) {
+      const hours = 60 * 60 * 1000
+      const minutes = 60 * 1000
+
+      const h = Math.floor(time / hours)
+      const m = Math.floor((time - h * hours) / minutes)
+      const s = Math.floor((time - h * hours - m * minutes) / 1000)
+      return `${fixedZero(h)}:${fixedZero(m)}:${fixedZero(s)}`
+    }
+  },
+  created () {
+    this.initTime()
+    this.tick()
+  },
+  methods: {
+    initTime () {
+      let lastTime = 0
+      let targetTime = 0
+      this.originTargetTime = this.target
+      try {
+        if (Object.prototype.toString.call(this.target) === '[object Date]') {
+          targetTime = this.target
+        } else {
+          targetTime = new Date(this.target).getTime()
+        }
+      } catch (e) {
+        throw new Error('invalid target prop')
+      }
+
+      lastTime = targetTime - new Date().getTime()
+
+      this.lastTime = lastTime < 0 ? 0 : lastTime
+    },
+    tick () {
+      const { onEnd } = this
+
+      this.timer = setTimeout(() => {
+        if (this.lastTime < this.interval) {
+          clearTimeout(this.timer)
+          this.lastTime = 0
+          if (typeof onEnd === 'function') {
+            onEnd()
+          }
+        } else {
+          this.lastTime -= this.interval
+          this.tick()
+        }
+      }, this.interval)
+    }
+  },
+  beforeUpdate () {
+    if (this.originTargetTime !== this.target) {
+      this.initTime()
+    }
+  },
+  beforeDestroy () {
+    clearTimeout(this.timer)
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/components/CountDown/index.js b/src/components/CountDown/index.js
new file mode 100644
index 0000000..35e954f
--- /dev/null
+++ b/src/components/CountDown/index.js
@@ -0,0 +1,3 @@
+import CountDown from './CountDown'
+
+export default CountDown
diff --git a/src/components/CountDown/index.md b/src/components/CountDown/index.md
new file mode 100644
index 0000000..fd46809
--- /dev/null
+++ b/src/components/CountDown/index.md
@@ -0,0 +1,34 @@
+# CountDown 倒计时
+
+倒计时组件。
+
+
+
+引用方式：
+
+```javascript
+import CountDown from '@/components/CountDown/CountDown'
+
+export default {
+    components: {
+        CountDown
+    }
+}
+```
+
+
+
+## 代码演示  [demo](https://pro.loacg.com/test/home)
+
+```html
+<count-down :target="new Date().getTime() + 3000000" :on-end="onEndHandle" />
+```
+
+
+
+## API
+
+| 参数      | 说明                                      | 类型         | 默认值 |
+|----------|------------------------------------------|-------------|-------|
+| target | 目标时间 | Date | - |
+| onEnd |  倒计时结束回调 | funtion | -|
diff --git a/src/components/DescriptionList/DescriptionList.vue b/src/components/DescriptionList/DescriptionList.vue
new file mode 100644
index 0000000..7f98fec
--- /dev/null
+++ b/src/components/DescriptionList/DescriptionList.vue
@@ -0,0 +1,153 @@
+<template>
+  <div :class="['description-list', size, layout === 'vertical' ? 'vertical': 'horizontal']">
+    <div v-if="title" class="title">{{ title }}</div>
+    <a-row>
+      <slot></slot>
+    </a-row>
+  </div>
+</template>
+
+<script>
+import { Col } from 'ant-design-vue/es/grid/'
+
+const Item = {
+  name: 'DetailListItem',
+  props: {
+    term: {
+      type: String,
+      default: '',
+      required: false
+    }
+  },
+  inject: {
+    col: {
+      type: Number
+    }
+  },
+  render () {
+    return (
+      <Col {...{ props: responsive[this.col] }}>
+        <div class="term">{this.$props.term}</div>
+        <div class="content">{this.$slots.default}</div>
+      </Col>
+    )
+  }
+}
+
+const responsive = {
+  1: { xs: 24 },
+  2: { xs: 24, sm: 12 },
+  3: { xs: 24, sm: 12, md: 8 },
+  4: { xs: 24, sm: 12, md: 6 }
+}
+
+export default {
+  name: 'DetailList',
+  Item: Item,
+  components: {
+    Col
+  },
+  props: {
+    title: {
+      type: String,
+      default: '',
+      required: false
+    },
+    col: {
+      type: Number,
+      required: false,
+      default: 3
+    },
+    size: {
+      type: String,
+      required: false,
+      default: 'large'
+    },
+    layout: {
+      type: String,
+      required: false,
+      default: 'horizontal'
+    }
+  },
+  provide () {
+    return {
+      col: this.col > 4 ? 4 : this.col
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+
+  .description-list {
+
+    .title {
+      color: rgba(0,0,0,.85);
+      font-size: 14px;
+      font-weight: 500;
+      margin-bottom: 16px;
+    }
+
+    /deep/ .term {
+      color: rgba(0,0,0,.85);
+      display: table-cell;
+      line-height: 20px;
+      margin-right: 8px;
+      padding-bottom: 16px;
+      white-space: nowrap;
+
+      &:not(:empty):after {
+        content: ":";
+        margin: 0 8px 0 2px;
+        position: relative;
+        top: -.5px;
+      }
+    }
+
+    /deep/ .content {
+      color: rgba(0,0,0,.65);
+      display: table-cell;
+      min-height: 22px;
+      line-height: 22px;
+      padding-bottom: 16px;
+      width: 100%;
+      &:empty {
+        content: ' ';
+        height: 38px;
+        padding-bottom: 16px;
+      }
+    }
+
+    &.small {
+
+      .title {
+        font-size: 14px;
+        color: rgba(0, 0, 0, .65);
+        font-weight: normal;
+        margin-bottom: 12px;
+      }
+      /deep/ .term, .content {
+        padding-bottom: 8px;
+      }
+    }
+
+    &.large {
+      /deep/ .term, .content {
+        padding-bottom: 16px;
+      }
+
+      .title {
+        font-size: 16px;
+      }
+    }
+
+    &.vertical {
+      .term {
+        padding-bottom: 8px;
+      }
+      /deep/ .term, .content {
+        display: block;
+      }
+    }
+  }
+</style>
diff --git a/src/components/DescriptionList/index.js b/src/components/DescriptionList/index.js
new file mode 100644
index 0000000..7aed83d
--- /dev/null
+++ b/src/components/DescriptionList/index.js
@@ -0,0 +1,2 @@
+import DescriptionList from './DescriptionList'
+export default DescriptionList
diff --git a/src/components/Editor/QuillEditor.vue b/src/components/Editor/QuillEditor.vue
index 731701c..9e43a91 100644
--- a/src/components/Editor/QuillEditor.vue
+++ b/src/components/Editor/QuillEditor.vue
@@ -9,7 +9,6 @@
       @ready="onEditorReady($event)"
       @change="onEditorChange($event)">
     </quill-editor>
-
   </div>
 </template>
 
@@ -72,6 +71,7 @@ export default {
 
 /* 覆盖 quill 默认边框圆角为 ant 默认圆角，用于统一 ant 组件风格 */
 .ant-editor-quill {
+  line-height: initial;
   /deep/ .ql-toolbar.ql-snow {
     border-radius: @border-radius-base @border-radius-base 0 0;
   }
diff --git a/src/components/Editor/WangEditor.vue b/src/components/Editor/WangEditor.vue
index d9c71c7..5f50c26 100644
--- a/src/components/Editor/WangEditor.vue
+++ b/src/components/Editor/WangEditor.vue
@@ -1,11 +1,10 @@
 <template>
-  <div :class="prefixCls">
-    <div ref="editor" class="editor-wrapper"></div>
-  </div>
+  <div :class="prefixCls"><div ref="editor" class="editor-wrapper"></div></div>
 </template>
 
 <script>
 import WEditor from 'wangeditor'
+import { fileUpload } from '@/api/file/file'
 
 export default {
   name: 'WangEditor',
@@ -14,15 +13,19 @@ export default {
       type: String,
       default: 'ant-editor-wang'
     },
-    // eslint-disable-next-line
     value: {
-      type: String
+      type: String,
+      default: ''
+    },
+    groupName: {
+      type: String,
+      required: true
     }
   },
   data () {
     return {
       editor: null,
-      editorContent: null
+      editorContent: ''
     }
   },
   watch: {
@@ -35,12 +38,27 @@ export default {
     this.initEditor()
   },
   methods: {
+    content () {
+      return this.editorContent
+    },
     initEditor () {
       this.editor = new WEditor(this.$refs.editor)
-      // this.editor.onchangeTimeout = 200
-      this.editor.customConfig.onchange = (html) => {
+      this.editor.customConfig.uploadImgMaxLength = 10
+      this.editor.customConfig.zIndex = 100
+      this.editor.customConfig.customUploadImg = (files, insert) => {
+        const formData = new FormData()
+        files.forEach(file => {
+          formData.append('files', file)
+        })
+        formData.append('groupName', this.groupName)
+        fileUpload(formData).then((res) => {
+          res.data.forEach((url) => {
+            insert(url)
+          })
+        })
+      }
+      this.editor.customConfig.onchange = html => {
         this.editorContent = html
-        this.$emit('change', this.editorContent)
       }
       this.editor.create()
     }
@@ -48,10 +66,16 @@ export default {
 }
 </script>
 
-<style lang="less" scoped>
+<style>
 .ant-editor-wang {
   .editor-wrapper {
     text-align: left;
   }
 }
+.w-e-toolbar {
+  display: -ms-flexbox;
+  display: flex;
+  padding: 0 5px;
+  flex-wrap: wrap;
+}
 </style>
diff --git a/src/components/Exception/ExceptionPage.vue b/src/components/Exception/ExceptionPage.vue
new file mode 100644
index 0000000..132e346
--- /dev/null
+++ b/src/components/Exception/ExceptionPage.vue
@@ -0,0 +1,130 @@
+<template>
+  <div class="exception">
+    <div class="imgBlock">
+      <div class="imgEle" :style="{backgroundImage: `url(${config[type].img})`}">
+      </div>
+    </div>
+    <div class="content">
+      <h1>{{ config[type].title }}</h1>
+      <div class="desc">{{ config[type].desc }}</div>
+      <div class="actions">
+        <a-button type="primary" @click="handleToHome">返回首页</a-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import types from './type'
+
+export default {
+  name: 'Exception',
+  props: {
+    type: {
+      type: String,
+      default: '404'
+    }
+  },
+  data () {
+    return {
+      config: types
+    }
+  },
+  methods: {
+    handleToHome () {
+      this.$router.push({ name: 'dashboard' })
+    }
+  }
+}
+</script>
+<style lang="less">
+@import "~ant-design-vue/lib/style/index";
+
+.exception {
+  display: flex;
+  align-items: center;
+  height: 80%;
+  min-height: 500px;
+
+  .imgBlock {
+    flex: 0 0 62.5%;
+    width: 62.5%;
+    padding-right: 152px;
+    zoom: 1;
+    &::before,
+    &::after {
+      content: ' ';
+      display: table;
+    }
+    &::after {
+      clear: both;
+      height: 0;
+      font-size: 0;
+      visibility: hidden;
+    }
+  }
+
+  .imgEle {
+    float: right;
+    width: 100%;
+    max-width: 430px;
+    height: 360px;
+    background-repeat: no-repeat;
+    background-position: 50% 50%;
+    background-size: contain;
+  }
+
+  .content {
+    flex: auto;
+
+    h1 {
+      margin-bottom: 24px;
+      color: #434e59;
+      font-weight: 600;
+      font-size: 72px;
+      line-height: 72px;
+    }
+
+    .desc {
+      margin-bottom: 16px;
+      color: @text-color-secondary;
+      font-size: 20px;
+      line-height: 28px;
+    }
+
+    .actions {
+      button:not(:last-child) {
+        margin-right: 8px;
+      }
+    }
+  }
+}
+
+@media screen and (max-width: @screen-xl) {
+  .exception {
+    .imgBlock {
+      padding-right: 88px;
+    }
+  }
+}
+
+@media screen and (max-width: @screen-sm) {
+  .exception {
+    display: block;
+    text-align: center;
+    .imgBlock {
+      margin: 0 auto 24px;
+      padding-right: 0;
+    }
+  }
+}
+
+@media screen and (max-width: @screen-xs) {
+  .exception {
+    .imgBlock {
+      margin-bottom: -24px;
+      overflow: hidden;
+    }
+  }
+}
+</style>
diff --git a/src/components/Exception/index.js b/src/components/Exception/index.js
new file mode 100644
index 0000000..dda91be
--- /dev/null
+++ b/src/components/Exception/index.js
@@ -0,0 +1,2 @@
+import ExceptionPage from './ExceptionPage.vue'
+export default ExceptionPage
diff --git a/src/components/Exception/type.js b/src/components/Exception/type.js
new file mode 100644
index 0000000..39bc6be
--- /dev/null
+++ b/src/components/Exception/type.js
@@ -0,0 +1,28 @@
+const types = {
+  401: {
+    title: '401',
+    desc: '未登录或登录超时'
+  },
+  403: {
+    img: 'https://gw.alipayobjects.com/zos/rmsportal/wZcnGqRDyhPOEYFcZDnb.svg',
+    title: '403',
+    desc: '抱歉，你无权访问该页面'
+  },
+  404: {
+    img: 'https://gw.alipayobjects.com/zos/rmsportal/KpnpchXsobRgLElEozzI.svg',
+    title: '404',
+    desc: '抱歉，你访问的页面不存在或仍在开发中'
+  },
+  500: {
+    img: 'https://gw.alipayobjects.com/zos/rmsportal/RVRUAYdCGeYNBWoKiIwB.svg',
+    title: '500',
+    desc: '抱歉，服务器出错了'
+  },
+  503: {
+    img: 'https://gw.alipayobjects.com/zos/rmsportal/RVRUAYdCGeYNBWoKiIwB.svg',
+    title: '503',
+    desc: '抱歉，服务器出错了'
+  }
+}
+
+export default types
diff --git a/src/components/GlobalFooter/GlobalFooter.vue b/src/components/GlobalFooter/GlobalFooter.vue
new file mode 100644
index 0000000..5db47d4
--- /dev/null
+++ b/src/components/GlobalFooter/GlobalFooter.vue
@@ -0,0 +1,42 @@
+<template>
+  <div class="footer">
+    <div class="copyright"><a href="http://one.tcc-cloud.com/" target="_blank">TCC 西安研发中心出品</a></div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'GlobalFooter',
+  data () {
+    return {}
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.footer {
+  padding: 0 16px;
+  margin: 48px 0 24px;
+  text-align: center;
+
+  .links {
+    margin-bottom: 8px;
+
+    a {
+      color: rgba(0, 0, 0, 0.45);
+
+      &:hover {
+        color: rgba(0, 0, 0, 0.65);
+      }
+
+      &:not(:last-child) {
+        margin-right: 40px;
+      }
+    }
+  }
+  .copyright {
+    color: rgba(0, 0, 0, 0.45);
+    font-size: 14px;
+  }
+}
+</style>
diff --git a/src/components/GlobalFooter/index.js b/src/components/GlobalFooter/index.js
new file mode 100644
index 0000000..832e0bd
--- /dev/null
+++ b/src/components/GlobalFooter/index.js
@@ -0,0 +1,2 @@
+import GlobalFooter from './GlobalFooter'
+export default GlobalFooter
diff --git a/src/components/GlobalFooter/index.vue b/src/components/GlobalFooter/index.vue
index ee1e92c..28f0c3f 100644
--- a/src/components/GlobalFooter/index.vue
+++ b/src/components/GlobalFooter/index.vue
@@ -1,12 +1,8 @@
 <template>
   <global-footer class="footer custom-render">
-    <template v-slot:links>
-      <a href="https://www.github.com/vueComponent/pro-layout" target="_blank">Pro Layout</a>
-      <a href="https://www.github.com/vueComponent/ant-design-vue-pro" target="_blank">Github</a>
-      <a href="https://www.github.com/sendya/" target="_blank">@Sendya</a>
-    </template>
+    <template v-slot:links></template>
     <template v-slot:copyright>
-      <a href="https://github.com/vueComponent" target="_blank">vueComponent</a>
+      <a href="http://one.tcc-cloud.com/" target="_blank">TCC 西安研发中心出品</a>
     </template>
   </global-footer>
 </template>
diff --git a/src/components/GlobalHeader/AvatarDropdown.vue b/src/components/GlobalHeader/AvatarDropdown.vue
index 73e202e..36714da 100644
--- a/src/components/GlobalHeader/AvatarDropdown.vue
+++ b/src/components/GlobalHeader/AvatarDropdown.vue
@@ -1,18 +1,14 @@
 <template>
-  <a-dropdown v-if="currentUser && currentUser.name" placement="bottomRight">
+  <a-dropdown v-if="currentUser && currentUser.username" placement="bottomRight">
     <span class="ant-pro-account-avatar">
       <a-avatar size="small" src="https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png" class="antd-pro-global-header-index-avatar" />
-      <span>{{ currentUser.name }}</span>
+      <span>{{ currentUser.username }}</span>
     </span>
     <template v-slot:overlay>
-      <a-menu class="ant-pro-drop-down menu" :selected-keys="[]">
-        <a-menu-item v-if="menu" key="center" @click="handleToCenter">
-          <a-icon type="user" />
-          个人中心
-        </a-menu-item>
-        <a-menu-item v-if="menu" key="settings" @click="handleToSettings">
+      <a-menu class="ant-pro-drop-down menu">
+        <a-menu-item key="setting" @click="handlePassword">
           <a-icon type="setting" />
-          个人设置
+          修改密码
         </a-menu-item>
         <a-menu-divider v-if="menu" />
         <a-menu-item key="logout" @click="handleLogout">
@@ -28,10 +24,11 @@
 </template>
 
 <script>
-import { Modal } from 'ant-design-vue'
 
 export default {
   name: 'AvatarDropdown',
+  components: {
+  },
   props: {
     currentUser: {
       type: Object,
@@ -43,26 +40,20 @@ export default {
     }
   },
   methods: {
-    handleToCenter () {
-      this.$router.push({ path: '/account/center' })
-    },
-    handleToSettings () {
-      this.$router.push({ path: '/account/settings' })
-    },
     handleLogout (e) {
-      Modal.confirm({
+      this.$confirm({
         title: this.$t('layouts.usermenu.dialog.title'),
         content: this.$t('layouts.usermenu.dialog.content'),
         onOk: () => {
-          // return new Promise((resolve, reject) => {
-          //   setTimeout(Math.random() > 0.5 ? resolve : reject, 1500)
-          // }).catch(() => console.log('Oops errors!'))
           return this.$store.dispatch('Logout').then(() => {
             this.$router.push({ name: 'login' })
           })
         },
         onCancel () {}
       })
+    },
+    handlePassword () {
+      this.$emit('handlePassword')
     }
   }
 }
diff --git a/src/components/GlobalHeader/GlobalHeader.vue b/src/components/GlobalHeader/GlobalHeader.vue
new file mode 100644
index 0000000..f4490ec
--- /dev/null
+++ b/src/components/GlobalHeader/GlobalHeader.vue
@@ -0,0 +1,125 @@
+<template>
+  <transition name="showHeader">
+    <div v-if="visible" class="header-animat">
+      <a-layout-header
+        v-if="visible"
+        :class="[fixedHeader && 'ant-header-fixedHeader', sidebarOpened ? 'ant-header-side-opened' : 'ant-header-side-closed', ]"
+        :style="{ padding: '0' }">
+        <div v-if="mode === 'sidemenu'" class="header">
+          <a-icon v-if="device==='mobile'" class="trigger" :type="collapsed ? 'menu-fold' : 'menu-unfold'" @click="toggle"/>
+          <a-icon v-else class="trigger" :type="collapsed ? 'menu-unfold' : 'menu-fold'" @click="toggle"/>
+          <user-menu></user-menu>
+        </div>
+        <div v-else :class="['top-nav-header-index', theme]">
+          <div class="header-index-wide">
+            <div class="header-index-left">
+              <logo class="top-nav-header" :show-title="device !== 'mobile'"/>
+              <s-menu v-if="device !== 'mobile'" mode="horizontal" :menu="menus" :theme="theme" />
+              <a-icon v-else class="trigger" :type="collapsed ? 'menu-fold' : 'menu-unfold'" @click="toggle" />
+            </div>
+            <user-menu class="header-index-right"></user-menu>
+          </div>
+        </div>
+      </a-layout-header>
+    </div>
+  </transition>
+</template>
+
+<script>
+import UserMenu from '../tools/UserMenu'
+import SMenu from '../Menu/'
+import Logo from '../tools/Logo'
+import { mixin } from '@/utils/mixin'
+
+export default {
+  name: 'GlobalHeader',
+  components: {
+    UserMenu,
+    SMenu,
+    Logo
+  },
+  mixins: [mixin],
+  props: {
+    mode: {
+      type: String,
+      // sidemenu, topmenu
+      default: 'sidemenu'
+    },
+    menus: {
+      type: Array,
+      required: true
+    },
+    theme: {
+      type: String,
+      required: false,
+      default: 'dark'
+    },
+    collapsed: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    device: {
+      type: String,
+      required: false,
+      default: 'desktop'
+    }
+  },
+  data () {
+    return {
+      visible: true,
+      oldScrollTop: 0
+    }
+  },
+  mounted () {
+    document.addEventListener('scroll', this.handleScroll, { passive: true })
+  },
+  methods: {
+    handleScroll () {
+      if (!this.autoHideHeader) {
+        return
+      }
+
+      const scrollTop = document.body.scrollTop + document.documentElement.scrollTop
+      if (!this.ticking) {
+        this.ticking = true
+        requestAnimationFrame(() => {
+          if (this.oldScrollTop > scrollTop) {
+            this.visible = true
+          } else if (scrollTop > 300 && this.visible) {
+            this.visible = false
+          } else if (scrollTop < 300 && !this.visible) {
+            this.visible = true
+          }
+          this.oldScrollTop = scrollTop
+          this.ticking = false
+        })
+      }
+    },
+    toggle () {
+      this.$emit('toggle')
+    }
+  },
+  beforeDestroy () {
+    document.body.removeEventListener('scroll', this.handleScroll, true)
+  }
+}
+</script>
+
+<style lang="less">
+@import '../index.less';
+
+.header-animat{
+  position: relative;
+  z-index: @ant-global-header-zindex;
+}
+.showHeader-enter-active {
+  transition: all 0.25s ease;
+}
+.showHeader-leave-active {
+  transition: all 0.5s ease;
+}
+.showHeader-enter, .showHeader-leave-to {
+  opacity: 0;
+}
+</style>
diff --git a/src/components/GlobalHeader/RightContent.vue b/src/components/GlobalHeader/RightContent.vue
index 5d0bb80..8354c22 100644
--- a/src/components/GlobalHeader/RightContent.vue
+++ b/src/components/GlobalHeader/RightContent.vue
@@ -1,7 +1,8 @@
 <template>
   <div :class="wrpCls">
-    <avatar-dropdown :menu="showMenu" :current-user="currentUser" :class="prefixCls" />
+    <avatar-dropdown :menu="showMenu" :current-user="currentUser" :class="prefixCls" @handlePassword="handlePassword"/>
     <select-lang :class="prefixCls" />
+    <password-form ref="password"></password-form>
   </div>
 </template>
 
@@ -13,7 +14,8 @@ export default {
   name: 'RightContent',
   components: {
     AvatarDropdown,
-    SelectLang
+    SelectLang,
+    PasswordForm: () => import('@/components/PasswordForm')
   },
   props: {
     prefixCls: {
@@ -43,16 +45,17 @@ export default {
     wrpCls () {
       return {
         'ant-pro-global-header-index-right': true,
-        [`ant-pro-global-header-index-${(this.isMobile || !this.topMenu) ? 'light' : this.theme}`]: true
+        [`ant-pro-global-header-index-${this.isMobile || !this.topMenu ? 'light' : this.theme}`]: true
       }
     }
   },
-  mounted () {
-    setTimeout(() => {
-      this.currentUser = {
-        name: 'Serati Ma'
-      }
-    }, 1500)
+  created () {
+    this.currentUser = this.$store.getters.userInfo || { username: '***' }
+  },
+  methods: {
+    handlePassword () {
+      this.$refs.password.show(this.currentUser.userId)
+    }
   }
 }
 </script>
diff --git a/src/components/GlobalHeader/index.js b/src/components/GlobalHeader/index.js
new file mode 100644
index 0000000..0807c87
--- /dev/null
+++ b/src/components/GlobalHeader/index.js
@@ -0,0 +1,2 @@
+import GlobalHeader from './GlobalHeader'
+export default GlobalHeader
diff --git a/src/components/IconSelector/IconSelector.vue b/src/components/IconSelector/IconSelector.vue
index 810d297..7fd5238 100644
--- a/src/components/IconSelector/IconSelector.vue
+++ b/src/components/IconSelector/IconSelector.vue
@@ -22,9 +22,9 @@ export default {
       type: String,
       default: 'ant-pro-icon-selector'
     },
-    // eslint-disable-next-line
     value: {
-      type: String
+      type: String,
+      default: ''
     }
   },
   data () {
@@ -59,28 +59,21 @@ export default {
   }
 }
 </script>
-
 <style lang="less" scoped>
-  @import "../index.less";
-
-  ul{
-    list-style: none;
-    padding: 0;
-    overflow-y: scroll;
-    height: 250px;
-
-    li{
-      display: inline-block;
-      padding: @padding-sm;
-      margin: 3px 0;
-      border-radius: @border-radius-base;
-
-      &:hover, &.active{
-        // box-shadow: 0px 0px 5px 2px @primary-color;
-        cursor: pointer;
-        color: @white;
-        background-color: @primary-color;
-      }
+@import "../index.less";
+ul{
+  list-style: none;
+  padding: 0;
+  li{
+    display: inline-block;
+    padding: @padding-sm;
+    margin: 3px 0;
+    border-radius: @border-radius-base;
+    &:hover, &.active{
+      cursor: pointer;
+      color: @white;
+      background-color: @primary-color;
     }
   }
+}
 </style>
diff --git a/src/components/IconSelector/IconSelectorView.vue b/src/components/IconSelector/IconSelectorView.vue
new file mode 100644
index 0000000..fe9640e
--- /dev/null
+++ b/src/components/IconSelector/IconSelectorView.vue
@@ -0,0 +1,47 @@
+<template>
+  <a-drawer
+    title="图标选择"
+    width="640"
+    placement="right"
+    :visible="visible"
+    class="icon-select-view"
+    @close="onClose">
+    <icon-selector @change="handleIconChange"/>
+  </a-drawer>
+</template>
+
+<script>
+import IconSelector from './IconSelector'
+
+export default {
+	name: 'IconSelectorView',
+	components: {
+		IconSelector
+	},
+  data () {
+    return {
+      visible: false
+    }
+  },
+  methods: {
+    show () {
+      this.visible = true
+    },
+    onClose () {
+      this.visible = false
+    },
+    handleIconChange (icon) {
+      this.$emit('ok', icon)
+      this.onClose()
+    }
+  }
+}
+</script>
+<style scoped lang="less">
+.icon-select-view{
+  /deep/ .ant-drawer-body{
+    padding: 0;
+  }
+}
+
+</style>
diff --git a/src/components/IconSelector/icons.js b/src/components/IconSelector/icons.js
index 920f464..ce90fcc 100644
--- a/src/components/IconSelector/icons.js
+++ b/src/components/IconSelector/icons.js
@@ -16,7 +16,7 @@ export default [
   {
     key: 'editor',
     title: '编辑类图标',
-    icons: ['edit', 'form', 'copy', 'scissor', 'delete', 'snippets', 'diff', 'highlight', 'align-center', 'align-left', 'align-right', 'bg-colors', 'bold', 'italic', 'underline', 'strikethrough', 'redo', 'undo', 'zoom-in', 'zoom-out', 'font-colors', 'font-size', 'line-height', 'colum-height', 'dash', 'small-dash', 'sort-ascending', 'sort-descending', 'drag', 'ordered-list', 'radius-setting']
+    icons: ['edit', 'form', 'copy', 'scissor', 'delete', 'snippets', 'diff', 'highlight', 'align-center', 'align-left', 'align-right', 'bg-colors', 'bold', 'italic', 'underline', 'strikethrough', 'redo', 'undo', 'zoom-in', 'zoom-out', 'font-colors', 'font-size', 'line-height', 'column-height', 'dash', 'small-dash', 'sort-ascending', 'sort-descending', 'drag', 'ordered-list', 'radius-setting']
   },
   {
     key: 'data',
@@ -26,7 +26,7 @@ export default [
   {
     key: 'brand_logo',
     title: '网站通用图标',
-    icons: ['lock', 'unlock', 'bars', 'book', 'calendar', 'cloud', 'cloud-download', 'code', 'copy', 'credit-card', 'delete', 'desktop', 'download', 'ellipsis', 'file', 'file-text', 'file-unknown', 'file-pdf', 'file-word', 'file-excel', 'file-jpg', 'file-ppt', 'file-markdown', 'file-add', 'folder', 'folder-open', 'folder-add', 'hdd', 'frown', 'meh', 'smile', 'inbox', 'laptop', 'appstore', 'link', 'mail', 'mobile', 'notification', 'paper-clip', 'picture', 'poweroff', 'reload', 'search', 'setting', 'share-alt', 'shopping-cart', 'tablet', 'tag', 'tags', 'to-top', 'upload', 'user', 'video-camera', 'home', 'loading', 'loading-3-quarters', 'cloud-upload', 'star', 'heart', 'environment', 'eye', 'camera', 'save', 'team', 'solution', 'phone', 'filter', 'exception', 'export', 'customer-service', 'qrcode', 'scan', 'like', 'dislike', 'message', 'pay-circle', 'calculator', 'pushpin', 'bulb', 'select', 'switcher', 'rocket', 'bell', 'disconnect', 'database', 'compass', 'barcode', 'hourglass', 'key', 'flag', 'layout', 'printer', 'sound', 'usb', 'skin', 'tool', 'sync', 'wifi', 'car', 'schedule', 'user-add', 'user-delete', 'usergroup-add', 'usergroup-delete', 'man', 'woman', 'shop', 'gift', 'idcard', 'medicine-box', 'red-envelope', 'coffee', 'copyright', 'trademark', 'safety', 'wallet', 'bank', 'trophy', 'contacts', 'global', 'shake', 'api', 'fork', 'dashboard', 'table', 'profile', 'alert', 'audit', 'branches', 'build', 'border', 'crown', 'experiment', 'fire', 'money-collect', 'property-safety', 'read', 'reconciliation', 'rest', 'security-scan', 'insurance', 'interation', 'safety-certificate', 'project', 'thunderbolt', 'block', 'cluster', 'deployment-unit', 'dollar', 'euro', 'pound', 'file-done', 'file-exclamation', 'file-protect', 'file-search', 'file-sync', 'gateway', 'gold', 'robot', 'shopping']
+    icons: ['lock', 'unlock', 'bars', 'book', 'calendar', 'cloud', 'cloud-download', 'code', 'copy', 'credit-card', 'delete', 'desktop', 'download', 'ellipsis', 'file', 'file-text', 'file-unknown', 'file-pdf', 'file-word', 'file-excel', 'file-jpg', 'file-ppt', 'file-markdown', 'file-add', 'folder', 'folder-open', 'folder-add', 'hdd', 'frown', 'meh', 'smile', 'inbox', 'laptop', 'appstore', 'link', 'mail', 'mobile', 'notification', 'paper-clip', 'picture', 'poweroff', 'reload', 'search', 'setting', 'share-alt', 'shopping-cart', 'tablet', 'tag', 'tags', 'to-top', 'upload', 'user', 'video-camera', 'home', 'loading', 'loading-3-quarters', 'cloud-upload', 'star', 'heart', 'environment', 'eye', 'camera', 'save', 'team', 'solution', 'phone', 'filter', 'exception', 'export', 'customer-service', 'qrcode', 'scan', 'like', 'dislike', 'message', 'pay-circle', 'calculator', 'pushpin', 'bulb', 'select', 'switcher', 'rocket', 'bell', 'disconnect', 'database', 'compass', 'barcode', 'hourglass', 'key', 'flag', 'layout', 'printer', 'sound', 'usb', 'skin', 'tool', 'sync', 'wifi', 'car', 'schedule', 'user-add', 'user-delete', 'usergroup-add', 'usergroup-delete', 'man', 'woman', 'shop', 'gift', 'idcard', 'medicine-box', 'red-envelope', 'coffee', 'copyright', 'trademark', 'safety', 'wallet', 'bank', 'trophy', 'contacts', 'global', 'shake', 'api', 'fork', 'dashboard', 'table', 'profile', 'alert', 'audit', 'branches', 'build', 'border', 'crown', 'experiment', 'fire', 'money-collect', 'property-safety', 'read', 'reconciliation', 'rest', 'security-scan', 'insurance', 'interaction', 'safety-certificate', 'project', 'thunderbolt', 'block', 'cluster', 'deployment-unit', 'dollar', 'euro', 'pound', 'file-done', 'file-exclamation', 'file-protect', 'file-search', 'file-sync', 'gateway', 'gold', 'robot', 'shopping']
   },
   {
     key: 'application',
diff --git a/src/components/ImageUpload/index.vue b/src/components/ImageUpload/index.vue
new file mode 100644
index 0000000..73d404a
--- /dev/null
+++ b/src/components/ImageUpload/index.vue
@@ -0,0 +1,151 @@
+<template>
+  <div class="clearfix">
+    <a-upload
+      list-type="picture-card"
+      :multiple="true"
+      :file-list="fileList"
+      :before-upload="beforeUpload"
+      :preview-file="previewFile"
+      :remove="handleRemove"
+      @preview="handlePreview">
+      <div v-if="limit && fileList.length < limit">
+        <a-icon type="plus" />
+        <div class="ant-upload-text">上传文件</div>
+      </div>
+    </a-upload>
+    <a-modal :visible="previewVisible" :footer="null" @cancel="handleCancel">
+      <img alt="example" style="width: 100%" :src="previewImage" />
+    </a-modal>
+  </div>
+</template>
+<script>
+import Upload from 'ant-design-vue/lib/upload'
+import 'ant-design-vue/lib/upload/style'
+import { fileUpload } from '@/api/file/file'
+// function getBase64(file) {
+//   return new Promise((resolve, reject) => {
+//     const reader = new FileReader()
+//     reader.readAsDataURL(file)
+//     reader.onload = () => resolve(reader.result)
+//     reader.onerror = error => reject(error)
+//   })
+// }
+export default {
+  components: {
+    [Upload.name]: Upload
+  },
+  props: {
+    groupName: {
+      type: String,
+      default: ''
+    },
+    limit: {
+      type: Number,
+      default: 10
+    },
+    defaultList: {
+      type: Array,
+      default () {
+        return []
+      }
+    }
+  },
+  data () {
+    return {
+      uploading: false,
+      fileList: [],
+      previewVisible: false,
+      previewImage: ''
+    }
+  },
+  methods: {
+    previewFile (file) {
+      console.log(file)
+    },
+    clear () {
+      this.fileList = []
+    },
+    flush () {
+      this.clear()
+      this.defaultList.forEach((file, index) => {
+        this.fileList.push({
+            uid: index,
+            name: 'image.png',
+            status: 'done',
+            url: file
+        })
+      })
+    },
+    handleRemove (file) {
+      const index = this.fileList.indexOf(file)
+      const newFileList = this.fileList.slice()
+      newFileList.splice(index, 1)
+      this.fileList = newFileList
+    },
+    handleCancel () {
+      this.previewVisible = false
+    },
+    beforeUpload (file) {
+      this.fileList = [...this.fileList, file]
+      return false
+    },
+    async handlePreview (file) {
+      this.previewImage = file.url
+      this.previewVisible = true
+    },
+    submitUpload () {
+      return new Promise((resolve, reject) => {
+        const { fileList } = this
+        if (fileList.length === 0) {
+          resolve([])
+        } else {
+          const fileUrlArray = []
+          let count = 0
+          const formData = new FormData()
+          fileList.forEach(file => {
+            if (file instanceof File) {
+              formData.append('files', file)
+              count++
+            } else {
+              fileUrlArray.push(file.url)
+            }
+          })
+          formData.append('groupName', this.groupName)
+          if (count > 0) {
+            this.uploading = true
+            fileUpload(formData).then((res) => {
+              resolve(fileUrlArray.concat(res.data))
+              this.uploading = false
+            }, (err) => {
+              reject(err)
+              this.uploading = false
+            })
+          } else {
+            resolve(fileUrlArray)
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+<style scoped>
+/* you can make up upload button and sample style by using stylesheets */
+.ant-upload-select-picture-card i {
+  font-size: 32px;
+  color: #999;
+}
+
+.ant-upload-select-picture-card .ant-upload-text {
+  margin-top: 8px;
+  color: #666;
+}
+.ant-upload-list-picture-card .ant-upload-list-item{
+  width: 90px;
+  height: 90px;
+}
+.ant-upload.ant-upload-select-picture-card{
+  width: 90px;
+  height: 90px;
+}
+</style>
diff --git a/src/components/Menu/SideMenu.vue b/src/components/Menu/SideMenu.vue
new file mode 100644
index 0000000..62fb01d
--- /dev/null
+++ b/src/components/Menu/SideMenu.vue
@@ -0,0 +1,61 @@
+<template>
+  <a-layout-sider
+    :class="['sider', isDesktop() ? null : 'shadow', theme, fixSiderbar ? 'ant-fixed-sidemenu' : null ]"
+    width="256px"
+    :collapsible="collapsible"
+    v-model="collapsed"
+    :trigger="null">
+    <logo />
+    <s-menu
+      :collapsed="collapsed"
+      :menu="menus"
+      :theme="theme"
+      :mode="mode"
+      @select="onSelect"
+      style="padding: 16px 0px;"></s-menu>
+  </a-layout-sider>
+
+</template>
+
+<script>
+import Logo from '@/components/tools/Logo'
+import SMenu from './index'
+import { mixin, mixinDevice } from '@/utils/mixin'
+
+export default {
+  name: 'SideMenu',
+  components: { Logo, SMenu },
+  mixins: [mixin, mixinDevice],
+  props: {
+    mode: {
+      type: String,
+      required: false,
+      default: 'inline'
+    },
+    theme: {
+      type: String,
+      required: false,
+      default: 'dark'
+    },
+    collapsible: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    collapsed: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    menus: {
+      type: Array,
+      required: true
+    }
+  },
+  methods: {
+    onSelect (obj) {
+      this.$emit('menuSelect', obj)
+    }
+  }
+}
+</script>
diff --git a/src/components/Menu/index.js b/src/components/Menu/index.js
new file mode 100644
index 0000000..4348509
--- /dev/null
+++ b/src/components/Menu/index.js
@@ -0,0 +1,2 @@
+import SMenu from './menu'
+export default SMenu
diff --git a/src/components/Menu/menu.js b/src/components/Menu/menu.js
new file mode 100644
index 0000000..2b3f7a2
--- /dev/null
+++ b/src/components/Menu/menu.js
@@ -0,0 +1,177 @@
+import Menu from 'ant-design-vue/es/menu'
+import Icon from 'ant-design-vue/es/icon'
+
+export default {
+  name: 'SMenu',
+  props: {
+    menu: {
+      type: Array,
+      required: true
+    },
+    theme: {
+      type: String,
+      required: false,
+      default: 'dark'
+    },
+    mode: {
+      type: String,
+      required: false,
+      default: 'inline'
+    },
+    collapsed: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  data () {
+    return {
+      openKeys: [],
+      selectedKeys: [],
+      cachedOpenKeys: []
+    }
+  },
+  computed: {
+    rootSubmenuKeys: vm => {
+      const keys = []
+      vm.menu.forEach(item => keys.push(item.path))
+      return keys
+    }
+  },
+  mounted () {
+    this.updateMenu()
+  },
+  watch: {
+    collapsed (val) {
+      if (val) {
+        this.cachedOpenKeys = this.openKeys.concat()
+        this.openKeys = []
+      } else {
+        this.openKeys = this.cachedOpenKeys
+      }
+    },
+    $route: function () {
+      this.updateMenu()
+    }
+  },
+  methods: {
+    // select menu item
+    onOpenChange (openKeys) {
+      // 在水平模式下时执行，并且不再执行后续
+      if (this.mode === 'horizontal') {
+        this.openKeys = openKeys
+        return
+      }
+      // 非水平模式时
+      const latestOpenKey = openKeys.find(key => !this.openKeys.includes(key))
+      if (!this.rootSubmenuKeys.includes(latestOpenKey)) {
+        this.openKeys = openKeys
+      } else {
+        this.openKeys = latestOpenKey ? [latestOpenKey] : []
+      }
+    },
+    onSelect ({ item, key, selectedKeys }) {
+      this.selectedKeys = selectedKeys
+      this.$emit('select', { item, key, selectedKeys })
+    },
+    updateMenu () {
+      const routes = this.$route.matched.concat()
+      const { hidden } = this.$route.meta
+      if (routes.length >= 3 && hidden) {
+        routes.pop()
+        this.selectedKeys = [routes[routes.length - 1].path]
+      } else {
+        this.selectedKeys = [routes.pop().path]
+      }
+      const openKeys = []
+      if (this.mode === 'inline') {
+        routes.forEach(item => {
+          openKeys.push(item.path)
+        })
+      }
+
+      this.collapsed ? (this.cachedOpenKeys = openKeys) : (this.openKeys = openKeys)
+    },
+
+    // render
+    renderItem (menu) {
+      if (!menu.hidden) {
+        return menu.children && !menu.hideChildrenInMenu ? this.renderSubMenu(menu) : this.renderMenuItem(menu)
+      }
+      return null
+    },
+    renderMenuItem (menu) {
+      const target = menu.meta.target || null
+      const CustomTag = target && 'a' || 'router-link'
+      const props = { to: { name: menu.name } }
+      const attrs = { href: menu.path, target: menu.meta.target }
+
+      if (menu.children && menu.hideChildrenInMenu) {
+        // 把有子菜单的 并且 父菜单是要隐藏子菜单的
+        // 都给子菜单增加一个 hidden 属性
+        // 用来给刷新页面时， selectedKeys 做控制用
+        menu.children.forEach(item => {
+          item.meta = Object.assign(item.meta, { hidden: true })
+        })
+      }
+
+      return (
+        <Menu.Item {...{ key: menu.path }}>
+          <CustomTag {...{ props, attrs }}>
+            {this.renderIcon(menu.meta.icon)}
+            <span>{menu.meta.title}</span>
+          </CustomTag>
+        </Menu.Item>
+      )
+    },
+    renderSubMenu (menu) {
+      const itemArr = []
+      if (!menu.hideChildrenInMenu) {
+        menu.children.forEach(item => itemArr.push(this.renderItem(item)))
+      }
+      return (
+        <Menu.SubMenu {...{ key: menu.path }}>
+          <span slot="title">
+            {this.renderIcon(menu.meta.icon)}
+            <span>{menu.meta.title}</span>
+          </span>
+          {itemArr}
+        </Menu.SubMenu>
+      )
+    },
+    renderIcon (icon) {
+      if (icon === 'none' || icon === undefined) {
+        return null
+      }
+      const props = {}
+      typeof (icon) === 'object' ? props.component = icon : props.type = icon
+      return (
+        <Icon {... { props } }/>
+      )
+    }
+  },
+
+  render () {
+    const dynamicProps = {
+      props: {
+        mode: this.mode,
+        theme: this.theme,
+        openKeys: this.openKeys,
+        selectedKeys: this.selectedKeys
+      },
+      on: {
+        openChange: this.onOpenChange,
+        select: this.onSelect
+      }
+    }
+
+    const menuTree = this.menu.map(item => {
+      if (item.hidden) {
+        return null
+      }
+      return this.renderItem(item)
+    })
+
+    return (<Menu {...dynamicProps}>{menuTree}</Menu>)
+  }
+}
diff --git a/src/components/Menu/menu.render.js b/src/components/Menu/menu.render.js
new file mode 100644
index 0000000..011639f
--- /dev/null
+++ b/src/components/Menu/menu.render.js
@@ -0,0 +1,156 @@
+import Menu from 'ant-design-vue/es/menu'
+import Icon from 'ant-design-vue/es/icon'
+
+const { Item, SubMenu } = Menu
+
+export default {
+  name: 'SMenu',
+  props: {
+    menu: {
+      type: Array,
+      required: true
+    },
+    theme: {
+      type: String,
+      required: false,
+      default: 'dark'
+    },
+    mode: {
+      type: String,
+      required: false,
+      default: 'inline'
+    },
+    collapsed: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  data () {
+    return {
+      openKeys: [],
+      selectedKeys: [],
+      cachedOpenKeys: []
+    }
+  },
+  computed: {
+    rootSubmenuKeys: vm => {
+      const keys = []
+      vm.menu.forEach(item => keys.push(item.path))
+      return keys
+    }
+  },
+  created () {
+    this.updateMenu()
+  },
+  watch: {
+    collapsed (val) {
+      if (val) {
+        this.cachedOpenKeys = this.openKeys.concat()
+        this.openKeys = []
+      } else {
+        this.openKeys = this.cachedOpenKeys
+      }
+    },
+    $route: function () {
+      this.updateMenu()
+    }
+  },
+  methods: {
+    renderIcon: function (h, icon) {
+      if (icon === 'none' || icon === undefined) {
+        return null
+      }
+      const props = {}
+      typeof (icon) === 'object' ? props.component = icon : props.type = icon
+      return h(Icon, { props: { ...props } })
+    },
+    renderMenuItem: function (h, menu, pIndex, index) {
+      const target = menu.meta.target || null
+      return h(Item, { key: menu.path ? menu.path : 'item_' + pIndex + '_' + index }, [
+        h('router-link', { attrs: { to: { name: menu.name }, target: target } }, [
+          this.renderIcon(h, menu.meta.icon),
+          h('span', [menu.meta.title])
+        ])
+      ])
+    },
+    renderSubMenu: function (h, menu, pIndex, index) {
+      const this2_ = this
+      const subItem = [h('span', { slot: 'title' }, [this.renderIcon(h, menu.meta.icon), h('span', [menu.meta.title])])]
+      const itemArr = []
+      const pIndex_ = pIndex + '_' + index
+      console.log('menu', menu)
+      if (!menu.hideChildrenInMenu) {
+        menu.children.forEach(function (item, i) {
+          itemArr.push(this2_.renderItem(h, item, pIndex_, i))
+        })
+      }
+      return h(SubMenu, { key: menu.path ? menu.path : 'submenu_' + pIndex + '_' + index }, subItem.concat(itemArr))
+    },
+    renderItem: function (h, menu, pIndex, index) {
+      if (!menu.hidden) {
+        return menu.children && !menu.hideChildrenInMenu
+          ? this.renderSubMenu(h, menu, pIndex, index)
+          : this.renderMenuItem(h, menu, pIndex, index)
+      }
+    },
+    renderMenu: function (h, menuTree) {
+      const this2_ = this
+      const menuArr = []
+      menuTree.forEach(function (menu, i) {
+        if (!menu.hidden) {
+          menuArr.push(this2_.renderItem(h, menu, '0', i))
+        }
+      })
+      return menuArr
+    },
+    onOpenChange (openKeys) {
+      const latestOpenKey = openKeys.find(key => !this.openKeys.includes(key))
+      if (!this.rootSubmenuKeys.includes(latestOpenKey)) {
+        this.openKeys = openKeys
+      } else {
+        this.openKeys = latestOpenKey ? [latestOpenKey] : []
+      }
+    },
+    updateMenu () {
+      const routes = this.$route.matched.concat()
+
+      if (routes.length >= 4 && this.$route.meta.hidden) {
+        routes.pop()
+        this.selectedKeys = [routes[2].path]
+      } else {
+        this.selectedKeys = [routes.pop().path]
+      }
+
+      const openKeys = []
+      if (this.mode === 'inline') {
+        routes.forEach(item => {
+          openKeys.push(item.path)
+        })
+      }
+
+      this.collapsed ? (this.cachedOpenKeys = openKeys) : (this.openKeys = openKeys)
+    }
+  },
+  render (h) {
+    return h(
+      Menu,
+      {
+        props: {
+          theme: this.$props.theme,
+          mode: this.$props.mode,
+          openKeys: this.openKeys,
+          selectedKeys: this.selectedKeys
+        },
+        on: {
+          openChange: this.onOpenChange,
+          select: obj => {
+            this.selectedKeys = obj.selectedKeys
+            this.$emit('select', obj)
+          }
+        }
+      },
+      this.renderMenu(h, this.menu)
+    )
+  }
+}
diff --git a/src/components/PageHeader/PageHeader.vue b/src/components/PageHeader/PageHeader.vue
new file mode 100644
index 0000000..80e686e
--- /dev/null
+++ b/src/components/PageHeader/PageHeader.vue
@@ -0,0 +1,202 @@
+<template>
+  <div class="page-header">
+    <div class="page-header-index-wide">
+      <s-breadcrumb />
+      <div class="detail">
+        <div class="main" v-if="!$route.meta.hiddenHeaderContent">
+          <div class="row">
+            <img v-if="logo" :src="logo" class="logo"/>
+            <h1 v-if="title" class="title">{{ title }}</h1>
+            <div class="action">
+              <slot name="action"></slot>
+            </div>
+          </div>
+          <div class="row">
+            <div v-if="avatar" class="avatar">
+              <a-avatar :src="avatar" />
+            </div>
+            <div v-if="this.$slots.content" class="headerContent">
+              <slot name="content"></slot>
+            </div>
+            <div v-if="this.$slots.extra" class="extra">
+              <slot name="extra"></slot>
+            </div>
+          </div>
+          <div>
+            <slot name="pageMenu"></slot>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Breadcrumb from '@/components/tools/Breadcrumb'
+
+export default {
+  name: 'PageHeader',
+  components: {
+    's-breadcrumb': Breadcrumb
+  },
+  props: {
+    title: {
+      type: [String, Boolean],
+      default: true,
+      required: false
+    },
+    logo: {
+      type: String,
+      default: '',
+      required: false
+    },
+    avatar: {
+      type: String,
+      default: '',
+      required: false
+    }
+  },
+  data () {
+    return {}
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.page-header {
+  background: #fff;
+  padding: 16px 32px 0;
+  border-bottom: 1px solid #e8e8e8;
+
+  .breadcrumb {
+    margin-bottom: 16px;
+  }
+
+  .detail {
+    display: flex;
+    /*margin-bottom: 16px;*/
+
+    .avatar {
+      flex: 0 1 72px;
+      margin: 0 24px 8px 0;
+
+      & > span {
+        border-radius: 72px;
+        display: block;
+        width: 72px;
+        height: 72px;
+      }
+    }
+
+    .main {
+      width: 100%;
+      flex: 0 1 auto;
+
+      .row {
+        display: flex;
+        width: 100%;
+
+        .avatar {
+          margin-bottom: 16px;
+        }
+      }
+
+      .title {
+        font-size: 20px;
+        font-weight: 500;
+
+        font-size: 20px;
+        line-height: 28px;
+        font-weight: 500;
+        color: rgba(0, 0, 0, 0.85);
+        margin-bottom: 16px;
+        flex: auto;
+      }
+      .logo {
+        width: 28px;
+        height: 28px;
+        border-radius: 4px;
+        margin-right: 16px;
+      }
+      .content,
+      .headerContent {
+        flex: auto;
+        color: rgba(0, 0, 0, 0.45);
+        line-height: 22px;
+
+        .link {
+          margin-top: 16px;
+          line-height: 24px;
+
+          a {
+            font-size: 14px;
+            margin-right: 32px;
+          }
+        }
+      }
+      .extra {
+        flex: 0 1 auto;
+        margin-left: 88px;
+        min-width: 242px;
+        text-align: right;
+      }
+      .action {
+        margin-left: 56px;
+        min-width: 266px;
+        flex: 0 1 auto;
+        text-align: right;
+        &:empty {
+          display: none;
+        }
+      }
+    }
+  }
+}
+
+.mobile .page-header {
+  .main {
+    .row {
+      flex-wrap: wrap;
+
+      .avatar {
+        flex: 0 1 25%;
+        margin: 0 2% 8px 0;
+      }
+
+      .content,
+      .headerContent {
+        flex: 0 1 70%;
+
+        .link {
+          margin-top: 16px;
+          line-height: 24px;
+
+          a {
+            font-size: 14px;
+            margin-right: 10px;
+          }
+        }
+      }
+
+      .extra {
+        flex: 1 1 auto;
+        margin-left: 0;
+        min-width: 0;
+        text-align: right;
+      }
+
+      .action {
+        margin-left: unset;
+        min-width: 266px;
+        flex: 0 1 auto;
+        text-align: left;
+        margin-bottom: 12px;
+
+        &:empty {
+          display: none;
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/components/PageHeader/index.js b/src/components/PageHeader/index.js
new file mode 100644
index 0000000..ec1078c
--- /dev/null
+++ b/src/components/PageHeader/index.js
@@ -0,0 +1,2 @@
+import PageHeader from './PageHeader'
+export default PageHeader
diff --git a/src/components/PasswordForm/index.vue b/src/components/PasswordForm/index.vue
new file mode 100644
index 0000000..d82e8e2
--- /dev/null
+++ b/src/components/PasswordForm/index.vue
@@ -0,0 +1,102 @@
+<template>
+  <a-drawer :visible="visible" title="修改密码" :width="720" @close="onCancel">
+    <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
+      <a-row>
+        <a-col :span="24">
+          <a-form-model-item has-feedback label="密码" prop="pass">
+            <a-input v-model="form.pass" type="password" autocomplete="off" />
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+      <a-row>
+        <a-col :span="24">
+          <a-form-model-item has-feedback label="确认密码" prop="checkPass">
+            <a-input v-model="form.checkPass" type="password" autocomplete="off" />
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-form-model>
+    <div class="draw-button-container align-center">
+      <a-button @click="onCancel">取消</a-button>
+      <a-button type="primary" @click="onSubmit" :loading="loading">保存</a-button>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+import { userPasswordSetById } from '@/api/security/user'
+
+export default {
+  name: 'PasswordForm',
+  data () {
+    const validatePass = (rule, value, callback) => {
+      if (value === '') {
+        callback(new Error('请输入密码'))
+      } else {
+        if (this.form.checkPass !== '') {
+          this.$refs.ruleForm.validateField('checkPass')
+        }
+        callback()
+      }
+    }
+    const validatePass2 = (rule, value, callback) => {
+      if (value === '') {
+        callback(new Error('请确认密码'))
+      } else if (value !== this.form.pass) {
+        callback(new Error('两次密码不匹配'))
+      } else {
+        callback()
+      }
+    }
+    return {
+      visible: false,
+      labelCol: { span: 4 },
+      wrapperCol: { span: 16 },
+      form: {
+        pass: '',
+        checkPass: ''
+      },
+      rules: {
+        pass: [{ validator: validatePass, trigger: 'change' }],
+        checkPass: [{ validator: validatePass2, trigger: 'change' }]
+      },
+      loading: false,
+      userId: null
+    }
+  },
+  methods: {
+    show (id) {
+      this.userId = id
+      this.visible = true
+    },
+    onSubmit (e) {
+      if (this.loading) {
+        return false
+      }
+      this.loading = true
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          userPasswordSetById({
+            newPassword: this.form.pass,
+            userId: this.userId
+          }).then(data => {
+            this.onCancel()
+          }).finally(() => {
+            this.loading = false
+          })
+        } else {
+          this.loading = false
+          return false
+        }
+      })
+    },
+    onCancel () {
+      this.$refs.ruleForm.resetFields()
+      this.visible = false
+    },
+    onReset () {
+      this.$refs.ruleForm.resetFields()
+    }
+  }
+}
+</script>
diff --git a/src/components/Result/Result.vue b/src/components/Result/Result.vue
new file mode 100644
index 0000000..99f7f19
--- /dev/null
+++ b/src/components/Result/Result.vue
@@ -0,0 +1,109 @@
+<template>
+  <div class="result">
+    <div>
+      <a-icon :class="{ 'icon': true, [`${type}`]: true }" :type="localIsSuccess ? 'check-circle' : 'close-circle'"/>
+    </div>
+    <div class="title">
+      <slot name="title">
+        {{ title }}
+      </slot>
+    </div>
+    <div class="description">
+      <slot name="description">
+        {{ description }}
+      </slot>
+    </div>
+    <div class="extra" v-if="$slots.default">
+      <slot></slot>
+    </div>
+    <div class="action" v-if="$slots.action">
+      <slot name="action"></slot>
+    </div>
+  </div>
+</template>
+
+<script>
+const resultEnum = ['success', 'error']
+
+export default {
+  name: 'Result',
+  props: {
+    /** @Deprecated */
+    isSuccess: {
+      type: Boolean,
+      default: false
+    },
+    type: {
+      type: String,
+      default: resultEnum[0],
+      validator (val) {
+        return (val) => resultEnum.includes(val)
+      }
+    },
+    title: {
+      type: String,
+      default: ''
+    },
+    description: {
+      type: String,
+      default: ''
+    }
+  },
+  computed: {
+    localIsSuccess: function () {
+      return this.type === resultEnum[0]
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+  .result {
+    text-align: center;
+    width: 72%;
+    margin: 0 auto;
+    padding: 24px 0 8px;
+
+    .icon {
+      font-size: 72px;
+      line-height: 72px;
+      margin-bottom: 24px;
+    }
+    .success {
+      color: #52c41a;
+    }
+    .error {
+      color: red;
+    }
+    .title {
+      font-size: 24px;
+      color: rgba(0, 0, 0, .85);
+      font-weight: 500;
+      line-height: 32px;
+      margin-bottom: 16px;
+    }
+    .description {
+      font-size: 14px;
+      line-height: 22px;
+      color: rgba(0, 0, 0, 0.45);
+      margin-bottom: 24px;
+    }
+    .extra {
+      background: #fafafa;
+      padding: 24px 40px;
+      border-radius: 2px;
+      text-align: left;
+    }
+    .action {
+      margin-top: 32px;
+    }
+  }
+
+  .mobile {
+    .result {
+      width: 100%;
+      margin: 0 auto;
+      padding: unset;
+    }
+  }
+</style>
diff --git a/src/components/Result/index.js b/src/components/Result/index.js
new file mode 100644
index 0000000..51cb3b2
--- /dev/null
+++ b/src/components/Result/index.js
@@ -0,0 +1,2 @@
+import Result from './Result.vue'
+export default Result
diff --git a/src/components/SelectLang/index.jsx b/src/components/SelectLang/index.jsx
index b587427..6115d8d 100644
--- a/src/components/SelectLang/index.jsx
+++ b/src/components/SelectLang/index.jsx
@@ -4,19 +4,15 @@ import { Icon, Menu, Dropdown } from 'ant-design-vue'
 import { i18nRender } from '@/locales'
 import i18nMixin from '@/store/i18n-mixin'
 
-const locales = ['zh-CN', 'zh-TW', 'en-US', 'pt-BR']
+const locales = ['zh-CN', 'en-US']
 const languageLabels = {
   'zh-CN': '简体中文',
-  'zh-TW': '繁体中文',
-  'en-US': 'English',
-  'pt-BR': 'Português'
+  'en-US': 'English'
 }
 // eslint-disable-next-line
 const languageIcons = {
   'zh-CN': '🇨🇳',
-  'zh-TW': '🇭🇰',
-  'en-US': '🇺🇸',
-  'pt-BR': '🇧🇷'
+  'en-US': '🇺🇸'
 }
 
 const SelectLang = {
diff --git a/src/components/SettingDrawer/SettingDrawer.vue b/src/components/SettingDrawer/SettingDrawer.vue
index a21e96c..9b2c83f 100644
--- a/src/components/SettingDrawer/SettingDrawer.vue
+++ b/src/components/SettingDrawer/SettingDrawer.vue
@@ -176,6 +176,7 @@ import config from '@/config/defaultSettings'
 import { updateTheme, updateColorWeak, colorList } from './settingConfig'
 
 export default {
+  name: 'SettingDrawer',
   components: {
     SettingItem
   },
@@ -269,22 +270,17 @@ export default {
 </script>
 
 <style lang="less" scoped>
-
   .setting-drawer-index-content {
-
     .setting-drawer-index-blockChecbox {
       display: flex;
-
       .setting-drawer-index-item {
         margin-right: 16px;
         position: relative;
         border-radius: 4px;
         cursor: pointer;
-
         img {
           width: 48px;
         }
-
         .setting-drawer-index-selectIcon {
           position: absolute;
           top: 0;
@@ -311,13 +307,11 @@ export default {
       text-align: center;
       color: #fff;
       font-weight: 700;
-
       i {
         font-size: 14px;
       }
     }
   }
-
   .setting-drawer-index-handle {
     position: absolute;
     top: 240px;
@@ -334,7 +328,6 @@ export default {
     text-align: center;
     font-size: 16px;
     border-radius: 4px 0 0 4px;
-
     i {
       color: rgb(255, 255, 255);
       font-size: 20px;
diff --git a/src/components/SettingDrawer/settingConfig.js b/src/components/SettingDrawer/settingConfig.js
index 2cfab79..f724adb 100644
--- a/src/components/SettingDrawer/settingConfig.js
+++ b/src/components/SettingDrawer/settingConfig.js
@@ -31,6 +31,7 @@ const colorList = [
 ]
 
 const updateTheme = newPrimaryColor => {
+  console.log('正在切换主题！')
   const hideMessage = message.loading('正在切换主题！', 0)
   themeColor.changeColor(newPrimaryColor).finally(() => {
     setTimeout(() => {
diff --git a/src/components/SettingDrawer/themeColor.js b/src/components/SettingDrawer/themeColor.js
index 10dfbd4..9502f0f 100644
--- a/src/components/SettingDrawer/themeColor.js
+++ b/src/components/SettingDrawer/themeColor.js
@@ -16,7 +16,8 @@ export default {
     var options = {
       newColors: this.getAntdSerials(newColor), // new colors array, one-to-one corresponde with `matchColors`
       changeUrl (cssUrl) {
-        return `/${cssUrl}` // while router is not `hash` mode, it needs absolute path
+        console.log('cssUrl', process.env.VUE_APP_PUBLIC_PATH + `/${cssUrl}`)
+        return process.env.VUE_APP_PUBLIC_PATH + `/${cssUrl}` // while router is not `hash` mode, it needs absolute path
       }
     }
     return client.changer.changeColor(options, Promise)
diff --git a/src/components/Table/index.js b/src/components/Table/index.js
index d7f2371..b80e634 100644
--- a/src/components/Table/index.js
+++ b/src/components/Table/index.js
@@ -5,13 +5,14 @@ export default {
   data () {
     return {
       needTotalList: [],
-
       selectedRows: [],
       selectedRowKeys: [],
-
       localLoading: false,
       localDataSource: [],
-      localPagination: Object.assign({}, this.pagination)
+      localPagination: Object.assign({
+        showQuickJumper: true,
+        showTotal: total => `共 ${total} 条`
+      }, this.pagination)
     }
   },
   props: Object.assign({}, T.props, {
@@ -39,12 +40,6 @@ export default {
       type: String,
       default: 'default'
     },
-    /**
-     * alert: {
-     *   show: true,
-     *   clear: Function
-     * }
-     */
     alert: {
       type: [Object, Boolean],
       default: null
@@ -62,15 +57,6 @@ export default {
       type: String | Boolean,
       default: 'auto'
     },
-    /**
-     * enable page URI mode
-     *
-     * e.g:
-     * /users/1
-     * /users/2
-     * /users/3?queryParam=test
-     * ...
-     */
     pageURI: {
       type: Boolean,
       default: false
@@ -85,7 +71,6 @@ export default {
           pageNo: val
         })
       })
-      // change pagination, reset total data
       this.needTotalList = this.initTotalList(this.columns)
       this.selectedRowKeys = []
       this.selectedRows = []
@@ -138,7 +123,7 @@ export default {
     loadData (pagination, filters, sorter) {
       this.localLoading = true
       const parameter = Object.assign({
-        pageNo: (pagination && pagination.current) ||
+        pageIndex: (pagination && pagination.current) ||
           this.showPagination && this.localPagination.current || this.pageNum,
         pageSize: (pagination && pagination.pageSize) ||
           this.showPagination && this.localPagination.pageSize || this.pageSize
@@ -158,29 +143,21 @@ export default {
       if ((typeof result === 'object' || typeof result === 'function') && typeof result.then === 'function') {
         result.then(r => {
           this.localPagination = this.showPagination && Object.assign({}, this.localPagination, {
-            current: r.pageNo, // 返回结果中的当前分页数
-            total: r.totalCount, // 返回结果中的总记录数
+            current: this.pageSize, // 返回结果中的当前分页数
+            total: r.total, // 返回结果中的总记录数
             showSizeChanger: this.showSizeChanger,
             pageSize: (pagination && pagination.pageSize) ||
               this.localPagination.pageSize
           }) || false
           // 为防止删除数据后导致页面当前页面数据长度为 0 ,自动翻页到上一页
-          if (r.data.length === 0 && this.showPagination && this.localPagination.current > 1) {
+          if (r.rows.length === 0 && this.showPagination && this.localPagination.current > 1) {
             this.localPagination.current--
             this.loadData()
             return
           }
-
-          // 这里用于判断接口是否有返回 r.totalCount 且 this.showPagination = true 且 pageNo 和 pageSize 存在 且 totalCount 小于等于 pageNo * pageSize 的大小
-          // 当情况满足时，表示数据不满足分页大小，关闭 table 分页功能
-          try {
-            if ((['auto', true].includes(this.showPagination) && r.totalCount <= (r.pageNo * this.localPagination.pageSize))) {
-              this.localPagination.hideOnSinglePage = true
-            }
-          } catch (e) {
-            this.localPagination = false
-          }
-          this.localDataSource = r.data // 返回结果中的数组数据
+          this.localDataSource = r.rows // 返回结果中的数组数据
+          this.localLoading = false
+        }, () => {
           this.localLoading = false
         })
       }
diff --git a/src/components/global.less b/src/components/global.less
new file mode 100644
index 0000000..56a3a5b
--- /dev/null
+++ b/src/components/global.less
@@ -0,0 +1,515 @@
+@import './index.less';
+
+body {
+
+
+}
+
+#app {
+  height: 100%;
+
+  &.colorWeak {
+    filter: invert(80%);
+  }
+  &.userLayout {
+    overflow: auto;
+  }
+}
+
+.layout.ant-layout {
+  height: auto;
+  overflow-x: hidden;
+
+  &.mobile,
+  &.tablet {
+    .ant-layout-content {
+      .content {
+        margin: 24px 0 0;
+      }
+    }
+
+    /**
+     * ant-table-wrapper
+     * 覆盖的表格手机模式样式，如果想修改在手机上表格最低宽度，可以在这里改动
+     */
+    .ant-table-wrapper {
+      .ant-table-content {
+        overflow-y: auto;
+      }
+      .ant-table-body {
+        min-width: 800px;
+      }
+    }
+    .topmenu {
+      /* 必须为 topmenu  才能启用流式布局 */
+      &.content-width-Fluid {
+        .header-index-wide {
+          margin-left: 0;
+        }
+      }
+    }
+  }
+
+  &.mobile {
+    .sidemenu {
+      .ant-header-fixedHeader {
+        &.ant-header-side-opened,
+        &.ant-header-side-closed {
+          width: 100%;
+        }
+      }
+    }
+  }
+
+  &.ant-layout-has-sider {
+    flex-direction: row;
+  }
+
+  .trigger {
+    font-size: 20px;
+    line-height: 64px;
+    padding: 0 24px;
+    cursor: pointer;
+    transition: color 0.3s;
+    &:hover {
+      background: rgba(0, 0, 0, 0.025);
+    }
+  }
+
+  .topmenu {
+    .ant-header-fixedHeader {
+      position: fixed;
+      top: 0;
+      right: 0;
+      z-index: 9;
+      width: 100%;
+      transition: width 0.2s;
+
+      &.ant-header-side-opened {
+        width: 100%;
+      }
+
+      &.ant-header-side-closed {
+        width: 100%;
+      }
+    }
+    /* 必须为 topmenu  才能启用流式布局 */
+    &.content-width-Fluid {
+      .header-index-wide {
+        max-width: unset;
+        .header-index-left {
+          flex: 1 1 1000px;
+          .logo{
+            margin-left: 25px;
+          }
+          .ant-menu.ant-menu-horizontal{
+            max-width: calc(100vw - 190px - 238px - 25px);
+            flex: 1 1 calc(100vw - 190px - 238px - 25px);
+          }
+        }
+        .header-index-right{
+          margin-right:25px;
+        }
+      }
+
+      .page-header-index-wide {
+        max-width: unset;
+      }
+    }
+  }
+
+  .sidemenu {
+    .ant-header-fixedHeader {
+      position: fixed;
+      top: 0;
+      right: 0;
+      z-index: 9;
+      width: 100%;
+      transition: width 0.2s;
+
+      &.ant-header-side-opened {
+        width: calc(100% - 256px);
+      }
+
+      &.ant-header-side-closed {
+        width: calc(100% - 80px);
+      }
+    }
+  }
+
+  .header {
+    height: 64px;
+    padding: 0 12px 0 0;
+    background: #fff;
+    box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+    position: relative;
+  }
+
+  .header,
+  .top-nav-header-index {
+    .user-wrapper {
+      float: right;
+      height: 100%;
+
+      .action {
+        cursor: pointer;
+        padding: 0 12px;
+        display: inline-block;
+        transition: all 0.3s;
+        height: 100%;
+        color: rgba(0, 0, 0, 0.65);
+
+        &:hover {
+          background: rgba(0, 0, 0, 0.025);
+        }
+
+        .avatar {
+          margin: 20px 8px 20px 0;
+          color: #1890ff;
+          background: hsla(0, 0%, 100%, 0.85);
+          vertical-align: middle;
+        }
+
+        .icon {
+          font-size: 16px;
+          padding: 4px;
+        }
+      }
+    }
+
+    &.dark {
+      .user-wrapper {
+        .action {
+          color: rgba(255, 255, 255, 0.85);
+          a {
+            color: rgba(255, 255, 255, 0.85);
+          }
+
+          &:hover {
+            background: rgba(255, 255, 255, 0.16);
+          }
+        }
+      }
+    }
+  }
+
+  &.mobile,
+  &.tablet {
+    .top-nav-header-index {
+      .header-index-wide {
+        .header-index-left {
+          .trigger {
+            color: rgba(255, 255, 255, 0.85);
+            padding: 0 12px;
+          }
+
+          .logo.top-nav-header {
+            flex: 0 0 56px;
+            text-align: center;
+            line-height: 58px;
+            h1 {
+              display: none;
+            }
+          }
+        }
+      }
+
+      &.light {
+        .header-index-wide {
+          .header-index-left {
+            .trigger {
+              color: rgba(0, 0, 0, 0.65);
+            }
+          }
+        }
+        //
+      }
+    }
+  }
+
+  &.tablet {
+    // overflow: hidden; text-overflow:ellipsis; white-space: nowrap;
+    .top-nav-header-index {
+      .header-index-wide {
+        .header-index-left {
+          .logo > a {
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+          }
+        }
+        .ant-menu.ant-menu-horizontal {
+          flex: 1 1 auto;
+          white-space: normal;
+        }
+      }
+    }
+  }
+
+  .top-nav-header-index {
+    box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
+    position: relative;
+    transition: background 0.3s, width 0.2s;
+
+    .header-index-wide {
+      max-width: 1200px;
+      margin: auto;
+      padding-left: 0;
+      display: flex;
+      height: 64px;
+
+      .ant-menu.ant-menu-horizontal {
+        max-width: 835px;
+        flex: 0 1 835px;
+        border: none;
+        height: 64px;
+        line-height: 64px;
+      }
+
+      .header-index-left {
+        flex: 0 1 1000px;
+        display: flex;
+
+        .logo.top-nav-header {
+          flex: 0 0 165px;
+          width: 165px;
+          height: 64px;
+          position: relative;
+          line-height: 64px;
+          transition: all 0.3s;
+          overflow: hidden;
+
+          img,
+          svg {
+            display: inline-block;
+            vertical-align: middle;
+            height: 32px;
+            width: 32px;
+          }
+
+          h1 {
+            color: #fff;
+            display: inline-block;
+            vertical-align: top;
+            font-size: 16px;
+            margin: 0 0 0 12px;
+            font-weight: 400;
+          }
+        }
+      }
+
+      .header-index-right {
+        flex: 0 0 238px;
+        align-self: flex-end;
+        height: 64px;
+        overflow: hidden;
+
+        .content-box {
+          float: right;
+          .action {
+            max-width: 140px;
+            overflow: hidden;
+            text-overflow:ellipsis;
+            white-space:nowrap;
+          }
+        }
+      }
+    }
+
+    &.light {
+      background-color: #fff;
+
+      .header-index-wide {
+        .header-index-left {
+          .logo {
+            h1 {
+              color: #002140;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  // 内容区
+  .layout-content {
+    margin: 24px 24px 0px;
+    height: 100%;
+    height: 64px;
+    padding: 0 12px 0 0;
+  }
+
+  // footer
+  .ant-layout-footer {
+    padding: 0;
+  }
+}
+
+.topmenu {
+  .page-header-index-wide {
+    max-width: 1200px;
+    margin: 0 auto;
+  }
+}
+
+// drawer-sider 自定义
+.ant-drawer.drawer-sider {
+  .sider {
+    box-shadow: none;
+  }
+
+  &.dark {
+    .ant-drawer-content {
+      background-color: rgb(0, 21, 41);
+    }
+  }
+  &.light {
+    box-shadow: none;
+    .ant-drawer-content {
+      background-color: #fff;
+    }
+  }
+
+  .ant-drawer-body {
+    padding: 0;
+  }
+}
+
+// 菜单样式
+.sider {
+  box-shadow: 2px 0 6px rgba(0, 21, 41, 0.35);
+  position: relative;
+  z-index: @ant-global-sider-zindex;
+  min-height: 100vh;
+
+  .ant-layout-sider-children {
+    overflow-y: hidden;
+
+    &:hover {
+      overflow-y: auto;
+    }
+  }
+
+  &.ant-fixed-sidemenu {
+    position: fixed;
+    height: 100%;
+  }
+
+  .logo {
+    position: relative;
+    height: 64px;
+    padding-left: 24px;
+    overflow: hidden;
+    line-height: 64px;
+    background: #002140;
+    transition: all .3s;
+
+    img,
+    svg,
+    h1 {
+      display: inline-block;
+      vertical-align: middle;
+    }
+
+    img,
+    svg {
+      height: 32px;
+      width: 32px;
+    }
+
+    h1 {
+      color: #fff;
+      font-size: 20px;
+      margin: 0 0 0 12px;
+      font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
+      font-weight: 600;
+      vertical-align: middle;
+    }
+  }
+
+  &.light {
+    background-color: #fff;
+    box-shadow: 2px 0px 8px 0px rgba(29, 35, 41, 0.05);
+
+    .logo {
+      background: #fff;
+      box-shadow: 1px 1px 0px 0px #e8e8e8;
+
+      h1 {
+        color: unset;
+      }
+    }
+
+    .ant-menu-light {
+      border-right-color: transparent;
+    }
+  }
+}
+
+// 外置的样式控制
+.user-dropdown-menu {
+  span {
+    user-select: none;
+  }
+}
+.user-dropdown-menu-wrapper.ant-dropdown-menu {
+  padding: 4px 0;
+
+  .ant-dropdown-menu-item {
+    width: 160px;
+  }
+
+  .ant-dropdown-menu-item > .anticon:first-child,
+  .ant-dropdown-menu-item > a > .anticon:first-child,
+  .ant-dropdown-menu-submenu-title > .anticon:first-child .ant-dropdown-menu-submenu-title > a > .anticon:first-child {
+    min-width: 12px;
+    margin-right: 8px;
+  }
+}
+
+// 数据列表 样式
+.table-alert {
+  margin-bottom: 16px;
+}
+
+.table-page-search-wrapper {
+  .ant-form-inline {
+    .ant-form-item {
+      display: flex;
+      margin-bottom: 24px;
+      margin-right: 0;
+
+      .ant-form-item-control-wrapper {
+        flex: 1 1;
+        display: inline-block;
+        vertical-align: middle;
+      }
+
+      > .ant-form-item-label {
+        line-height: 32px;
+        padding-right: 8px;
+        width: auto;
+      }
+      .ant-form-item-control {
+        height: 32px;
+        line-height: 32px;
+      }
+    }
+  }
+
+  .table-page-search-submitButtons {
+    display: block;
+    margin-bottom: 24px;
+    white-space: nowrap;
+  }
+}
+
+.content {
+  .table-operator {
+    margin-bottom: 18px;
+
+    button {
+      margin-right: 8px;
+    }
+  }
+}
diff --git a/src/components/index.js b/src/components/index.js
index 401ae0d..5d4d9d4 100644
--- a/src/components/index.js
+++ b/src/components/index.js
@@ -16,7 +16,6 @@ import AvatarList from '@/components/AvatarList'
 import Ellipsis from '@/components/Ellipsis'
 import FooterToolbar from '@/components/FooterToolbar'
 import NumberInfo from '@/components/NumberInfo'
-import Tree from '@/components/Tree/Tree'
 import Trend from '@/components/Trend'
 import STable from '@/components/Table'
 import MultiTab from '@/components/MultiTab'
@@ -24,8 +23,8 @@ import IconSelector from '@/components/IconSelector'
 import TagSelect from '@/components/TagSelect'
 import StandardFormRow from '@/components/StandardFormRow'
 import ArticleListContent from '@/components/ArticleListContent'
-
 import Dialog from '@/components/Dialog'
+import ImageUpload from '@/components/ImageUpload'
 
 export {
   AvatarList,
@@ -44,13 +43,12 @@ export {
   Ellipsis,
   FooterToolbar,
   NumberInfo,
-  Tree,
   STable,
   MultiTab,
   IconSelector,
   TagSelect,
   StandardFormRow,
   ArticleListContent,
-
-  Dialog
+  Dialog,
+  ImageUpload
 }
diff --git a/src/components/tools/Breadcrumb.vue b/src/components/tools/Breadcrumb.vue
new file mode 100644
index 0000000..5093112
--- /dev/null
+++ b/src/components/tools/Breadcrumb.vue
@@ -0,0 +1,42 @@
+<template>
+  <a-breadcrumb class="breadcrumb">
+    <a-breadcrumb-item v-for="(item, index) in breadList" :key="item.name">
+      <router-link
+        v-if="item.name != name && index != 1"
+        :to="{ path: item.path === '' ? '/' : item.path }"
+      >{{ item.meta.title }}</router-link>
+      <span v-else>{{ item.meta.title }}</span>
+    </a-breadcrumb-item>
+  </a-breadcrumb>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      name: '',
+      breadList: []
+    }
+  },
+  created () {
+    this.getBreadcrumb()
+  },
+  methods: {
+    getBreadcrumb () {
+      this.breadList = []
+      this.name = this.$route.name
+      this.$route.matched.forEach(item => {
+        this.breadList.push(item)
+      })
+    }
+  },
+  watch: {
+    $route () {
+      this.getBreadcrumb()
+    }
+  }
+}
+</script>
+
+<style scoped>
+</style>
diff --git a/src/components/tools/DetailList.vue b/src/components/tools/DetailList.vue
new file mode 100644
index 0000000..6745a08
--- /dev/null
+++ b/src/components/tools/DetailList.vue
@@ -0,0 +1,5 @@
+<script>
+/* WARNING: 兼容老引入，请勿继续使用 */
+import DescriptionList from '@/components/DescriptionList'
+export default DescriptionList
+</script>
diff --git a/src/components/tools/HeadInfo.vue b/src/components/tools/HeadInfo.vue
new file mode 100644
index 0000000..7fbc692
--- /dev/null
+++ b/src/components/tools/HeadInfo.vue
@@ -0,0 +1,67 @@
+<template>
+  <div class="head-info" :class="center && 'center'">
+    <span>{{ title }}</span>
+    <p>{{ content }}</p>
+    <em v-if="bordered"/>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'HeadInfo',
+  props: {
+    title: {
+      type: String,
+      default: ''
+    },
+    content: {
+      type: String,
+      default: ''
+    },
+    bordered: {
+      type: Boolean,
+      default: false
+    },
+    center: {
+      type: Boolean,
+      default: true
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+  .head-info {
+    position: relative;
+    text-align: left;
+    padding: 0 32px 0 0;
+    min-width: 125px;
+
+    &.center {
+      text-align: center;
+      padding: 0 32px;
+    }
+
+    span {
+      color: rgba(0, 0, 0, .45);
+      display: inline-block;
+      font-size: 14px;
+      line-height: 22px;
+      margin-bottom: 4px;
+    }
+    p {
+      color: rgba(0, 0, 0, .85);
+      font-size: 24px;
+      line-height: 32px;
+      margin: 0;
+    }
+    em {
+      background-color: #e8e8e8;
+      position: absolute;
+      height: 56px;
+      width: 1px;
+      top: 0;
+      right: 0;
+    }
+  }
+</style>
diff --git a/src/components/tools/LangSelect.vue b/src/components/tools/LangSelect.vue
new file mode 100644
index 0000000..283f356
--- /dev/null
+++ b/src/components/tools/LangSelect.vue
@@ -0,0 +1,46 @@
+<template>
+  <a-dropdown>
+    <span class="action global-lang">
+      <a-icon type="global" style="font-size: 16px"/>
+    </span>
+    <a-menu slot="overlay" style="width: 150px;" @click="SwitchLang">
+      <a-menu-item key="zh-CN">
+        <a rel="noopener noreferrer">
+          <span role="img" aria-label="简体中文">🇨🇳</span> 简体中文
+        </a>
+      </a-menu-item>
+      <a-menu-item key="zh-TW">
+        <a rel="noopener noreferrer">
+          <span role="img" aria-label="繁体中文">🇭🇰</span> 繁体中文
+        </a>
+      </a-menu-item>
+      <a-menu-item key="en-US">
+        <a rel="noopener noreferrer">
+          <span role="img" aria-label="English">🇬🇧</span> English
+        </a>
+      </a-menu-item>
+      <a-menu-item key="pt-BR">
+        <a rel="noopener noreferrer">
+          <span role="img" aria-label="Português">🇧🇷</span> Português
+        </a>
+      </a-menu-item>
+    </a-menu>
+  </a-dropdown>
+</template>
+
+<script>
+// import { mixin as langMixin } from '@/store/i18n-mixin'
+
+export default {
+  name: 'LangSelect',
+  // mixins: [langMixin],
+  data () {
+    return {}
+  },
+  methods: {
+    // SwitchLang (row) {
+    //   this.setLang(row.key)
+    // }
+  }
+}
+</script>
diff --git a/src/components/tools/Logo.vue b/src/components/tools/Logo.vue
new file mode 100644
index 0000000..16d2090
--- /dev/null
+++ b/src/components/tools/Logo.vue
@@ -0,0 +1,31 @@
+<template>
+  <div class="logo">
+    <router-link :to="{name:'dashboard'}">
+      <LogoSvg alt="logo" />
+      <h1 v-if="showTitle">{{ title }}</h1>
+    </router-link>
+  </div>
+</template>
+
+<script>
+import LogoSvg from '@/assets/logo.svg?inline'
+
+export default {
+  name: 'Logo',
+  components: {
+    LogoSvg
+  },
+  props: {
+    title: {
+      type: String,
+      default: 'AntD',
+      required: false
+    },
+    showTitle: {
+      type: Boolean,
+      default: true,
+      required: false
+    }
+  }
+}
+</script>
diff --git a/src/components/tools/UserMenu.vue b/src/components/tools/UserMenu.vue
new file mode 100644
index 0000000..ac867cd
--- /dev/null
+++ b/src/components/tools/UserMenu.vue
@@ -0,0 +1,81 @@
+<template>
+  <div class="user-wrapper">
+    <div class="content-box">
+      <a href="https://pro.loacg.com/docs/getting-started" target="_blank">
+        <span class="action">
+          <a-icon type="question-circle-o"></a-icon>
+        </span>
+      </a>
+      <notice-icon class="action"/>
+      <a-dropdown>
+        <span class="action ant-dropdown-link user-dropdown-menu">
+          <a-avatar class="avatar" size="small" :src="avatar"/>
+          <span>{{ nickname }}</span>
+        </span>
+        <a-menu slot="overlay" class="user-dropdown-menu-wrapper">
+          <a-menu-item key="0">
+            <router-link :to="{ name: 'center' }">
+              <a-icon type="user"/>
+              <span>个人中心</span>
+            </router-link>
+          </a-menu-item>
+          <a-menu-item key="1">
+            <router-link :to="{ name: 'settings' }">
+              <a-icon type="setting"/>
+              <span>账户设置</span>
+            </router-link>
+          </a-menu-item>
+          <a-menu-item key="2" disabled>
+            <a-icon type="setting"/>
+            <span>测试</span>
+          </a-menu-item>
+          <a-menu-divider/>
+          <a-menu-item key="3">
+            <a href="javascript:;" @click="handleLogout">
+              <a-icon type="logout"/>
+              <span>退出登录</span>
+            </a>
+          </a-menu-item>
+        </a-menu>
+      </a-dropdown>
+    </div>
+  </div>
+</template>
+
+<script>
+import NoticeIcon from '@/components/NoticeIcon'
+import { mapActions, mapGetters } from 'vuex'
+
+export default {
+  name: 'UserMenu',
+  components: {
+    NoticeIcon
+  },
+  computed: {
+    ...mapGetters(['nickname', 'avatar'])
+  },
+  methods: {
+    ...mapActions(['Logout']),
+    handleLogout () {
+      this.$confirm({
+        title: '提示',
+        content: '真的要注销登录吗 ?',
+        onOk: () => {
+          return this.Logout({}).then(() => {
+            setTimeout(() => {
+              window.location.reload()
+            }, 16)
+          }).catch(err => {
+            this.$message.error({
+              title: '错误',
+              description: err.message
+            })
+          })
+        },
+        onCancel () {
+        }
+      })
+    }
+  }
+}
+</script>
diff --git a/src/components/tools/index.js b/src/components/tools/index.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/config/defaultSettings.js b/src/config/defaultSettings.js
index 70f9d1d..91268d5 100644
--- a/src/config/defaultSettings.js
+++ b/src/config/defaultSettings.js
@@ -14,8 +14,8 @@
 
 export default {
   navTheme: 'dark', // theme for nav menu
-  primaryColor: '#52C41A', // primary color of ant design
-  layout: 'sidemenu', // nav menu position: `sidemenu` or `topmenu`
+  primaryColor: '#5555ff', // primary color of ant design
+  layout: 'topmenu', // nav menu position: `sidemenu` or `topmenu`
   contentWidth: 'Fluid', // layout of content: `Fluid` or `Fixed`, only works when layout is topmenu
   fixedHeader: false, // sticky header
   fixSiderbar: false, // sticky siderbar
@@ -23,7 +23,7 @@ export default {
   menu: {
     locale: true
   },
-  title: 'Ant Design Pro',
+  title: '系统后台',
   pwa: false,
   iconfontUrl: '',
   production: process.env.NODE_ENV === 'production' && process.env.VUE_APP_PREVIEW !== 'true'
diff --git a/src/config/router.config.js b/src/config/router.config.js
index f4f7cf1..a59010a 100644
--- a/src/config/router.config.js
+++ b/src/config/router.config.js
@@ -8,7 +8,6 @@ const RouteView = {
 }
 
 export const asyncRouterMap = [
-
   {
     path: '/',
     name: 'index',
@@ -24,18 +23,6 @@ export const asyncRouterMap = [
         component: RouteView,
         meta: { title: 'menu.dashboard', keepAlive: true, icon: bxAnaalyse, permission: [ 'dashboard' ] },
         children: [
-          {
-            path: '/dashboard/analysis/:pageNo([1-9]\\d*)?',
-            name: 'Analysis',
-            component: () => import('@/views/dashboard/Analysis'),
-            meta: { title: 'menu.dashboard.analysis', keepAlive: false, permission: [ 'dashboard' ] }
-          },
-          // 外部链接
-          {
-            path: 'https://www.baidu.com/',
-            name: 'Monitor',
-            meta: { title: 'menu.dashboard.monitor', target: '_blank' }
-          },
           {
             path: '/dashboard/workplace',
             name: 'Workplace',
@@ -44,7 +31,56 @@ export const asyncRouterMap = [
           }
         ]
       },
-
+      // brand
+      {
+        path: '/brand',
+        name: 'brand',
+        redirect: '/brand/list',
+        component: RouteView,
+        meta: { title: '基础配置', keepAlive: true, icon: bxAnaalyse, permission: [ 'brand' ] },
+        children: [
+          {
+            path: '/brand/list',
+            name: 'BrandList',
+            component: () => import('@/views/brand/BrandList'),
+            meta: { title: '品牌管理', keepAlive: true, permission: [ 'brand' ] }
+          }
+        ]
+      },
+      // 权限管理
+      // {
+      //   path: '/security',
+      //   name: 'security',
+      //   redirect: '/security/user',
+      //   component: RouteView,
+      //   meta: { title: '系统设置', keepAlive: true, icon: bxAnaalyse, permission: [ 'security' ] },
+      //   children: [
+      //     {
+      //       path: '/security/user',
+      //       name: 'SecurityUser',
+      //       component: () => import('@/views/security/UserList'),
+      //       meta: { title: '用户管理', keepAlive: true, permission: [ 'security' ] }
+      //     },
+      //     {
+      //       path: '/security/role',
+      //       name: 'SecurityRole',
+      //       component: () => import('@/views/security/Role'),
+      //       meta: { title: '角色管理', keepAlive: true }
+      //     },
+      //     {
+      //       path: '/security/system',
+      //       name: 'SecuritySystem',
+      //       component: () => import('@/views/security/System'),
+      //       meta: { title: '系统角色管理', keepAlive: true }
+      //     },
+      //     {
+      //       path: '/security/list/permission',
+      //       name: 'SecurityPermission',
+      //       component: () => import('@/views/security/Permission'),
+      //       meta: { title: '权限列表', keepAlive: true }
+      //     }
+      //   ]
+      // },
       // forms
       {
         path: '/form',
@@ -52,12 +88,12 @@ export const asyncRouterMap = [
         component: RouteView,
         meta: { title: '表单页', icon: 'form', permission: [ 'form' ] },
         children: [
-          {
-            path: '/form/base-form',
-            name: 'BaseForm',
-            component: () => import('@/views/form/basicForm'),
-            meta: { title: '基础表单', keepAlive: true, permission: [ 'form' ] }
-          },
+          // {
+          //   path: '/form/base-form',
+          //   name: 'BaseForm',
+          //   component: () => import('@/views/form/basicForm/index'),
+          //   meta: { title: '基础表单', keepAlive: true, permission: [ 'form' ] }
+          // },
           {
             path: '/form/step-form',
             name: 'StepForm',
@@ -129,7 +165,6 @@ export const asyncRouterMap = [
           }
         ]
       },
-
       // profile
       {
         path: '/profile',
@@ -138,12 +173,12 @@ export const asyncRouterMap = [
         redirect: '/profile/basic',
         meta: { title: '详情页', icon: 'profile', permission: [ 'profile' ] },
         children: [
-          {
-            path: '/profile/basic',
-            name: 'ProfileBasic',
-            component: () => import('@/views/profile/basic'),
-            meta: { title: '基础详情页', permission: [ 'profile' ] }
-          },
+          // {
+          //   path: '/profile/basic',
+          //   name: 'ProfileBasic',
+          //   component: () => import('@/views/profile/basic/index'),
+          //   meta: { title: '基础详情页', permission: [ 'profile' ] }
+          // },
           {
             path: '/profile/advanced',
             name: 'ProfileAdvanced',
@@ -152,7 +187,6 @@ export const asyncRouterMap = [
           }
         ]
       },
-
       // result
       {
         path: '/result',
@@ -175,7 +209,6 @@ export const asyncRouterMap = [
           }
         ]
       },
-
       // Exception
       {
         path: '/exception',
@@ -204,7 +237,6 @@ export const asyncRouterMap = [
           }
         ]
       },
-
       // account
       {
         path: '/account',
@@ -213,12 +245,12 @@ export const asyncRouterMap = [
         name: 'account',
         meta: { title: '个人页', icon: 'user', keepAlive: true, permission: [ 'user' ] },
         children: [
-          {
-            path: '/account/center',
-            name: 'center',
-            component: () => import('@/views/account/center'),
-            meta: { title: '个人中心', keepAlive: true, permission: [ 'user' ] }
-          },
+          // {
+          //   path: '/account/center',
+          //   name: 'center',
+          //   component: () => import('@/views/account/center/Index'),
+          //   meta: { title: '个人中心', keepAlive: true, permission: [ 'user' ] }
+          // },
           {
             path: '/account/settings',
             name: 'settings',
@@ -260,14 +292,11 @@ export const asyncRouterMap = [
             ]
           }
         ]
-      }
-
-      // other
-      /*
+      },
       {
         path: '/other',
         name: 'otherPage',
-        component: PageView,
+        component: RouteView,
         meta: { title: '其他组件', icon: 'slack', permission: [ 'dashboard' ] },
         redirect: '/other/icon-selector',
         children: [
@@ -323,7 +352,6 @@ export const asyncRouterMap = [
           }
         ]
       }
-      */
     ]
   },
   {
@@ -345,17 +373,7 @@ export const constantRouterMap = [
       {
         path: 'login',
         name: 'login',
-        component: () => import(/* webpackChunkName: "user" */ '@/views/user/Login')
-      },
-      {
-        path: 'register',
-        name: 'register',
-        component: () => import(/* webpackChunkName: "user" */ '@/views/user/Register')
-      },
-      {
-        path: 'register-result',
-        name: 'registerResult',
-        component: () => import(/* webpackChunkName: "user" */ '@/views/user/RegisterResult')
+        component: () => import('@/views/security/user/UserLogin')
       },
       {
         path: 'recover',
@@ -364,10 +382,22 @@ export const constantRouterMap = [
       }
     ]
   },
-
+  {
+    path: '/brand',
+    component: BasicLayout,
+    redirect: '/brand/list',
+    meta: { title: '品牌管理' },
+    children: [
+      {
+        path: 'detail/:id',
+        name: 'BrandDetail',
+        component: () => import('@/views/brand/BrandDetail'),
+        meta: { title: '品牌详情', keepAlive: true, permission: [ 'brand' ] }
+      }
+    ]
+  },
   {
     path: '/404',
     component: () => import(/* webpackChunkName: "fail" */ '@/views/exception/404')
   }
-
 ]
diff --git a/src/core/bootstrap.js b/src/core/bootstrap.js
index f9b282c..d0a572a 100644
--- a/src/core/bootstrap.js
+++ b/src/core/bootstrap.js
@@ -1,20 +1,22 @@
 import store from '@/store'
 import storage from 'store'
 import {
-  ACCESS_TOKEN,
+  LOGIN_TOKEN,
+  USER_INFO,
   APP_LANGUAGE,
   TOGGLE_CONTENT_WIDTH,
   TOGGLE_FIXED_HEADER,
-  TOGGLE_FIXED_SIDEBAR, TOGGLE_HIDE_HEADER,
-  TOGGLE_LAYOUT, TOGGLE_NAV_THEME, TOGGLE_WEAK,
-  TOGGLE_COLOR, TOGGLE_MULTI_TAB
+  TOGGLE_FIXED_SIDEBAR,
+  TOGGLE_HIDE_HEADER,
+  TOGGLE_LAYOUT,
+  TOGGLE_NAV_THEME,
+  TOGGLE_WEAK,
+  TOGGLE_COLOR,
+  TOGGLE_MULTI_TAB
 } from '@/store/mutation-types'
-import { printANSI } from '@/utils/screenLog'
 import defaultSettings from '@/config/defaultSettings'
 
 export default function Initializer () {
-  printANSI() // 请自行移除该行.  please remove this line
-
   store.commit(TOGGLE_LAYOUT, storage.get(TOGGLE_LAYOUT, defaultSettings.layout))
   store.commit(TOGGLE_FIXED_HEADER, storage.get(TOGGLE_FIXED_HEADER, defaultSettings.fixedHeader))
   store.commit(TOGGLE_FIXED_SIDEBAR, storage.get(TOGGLE_FIXED_SIDEBAR, defaultSettings.fixSiderbar))
@@ -24,8 +26,7 @@ export default function Initializer () {
   store.commit(TOGGLE_WEAK, storage.get(TOGGLE_WEAK, defaultSettings.colorWeak))
   store.commit(TOGGLE_COLOR, storage.get(TOGGLE_COLOR, defaultSettings.primaryColor))
   store.commit(TOGGLE_MULTI_TAB, storage.get(TOGGLE_MULTI_TAB, defaultSettings.multiTab))
-  store.commit('SET_TOKEN', storage.get(ACCESS_TOKEN))
-
+  store.commit('SET_LOGIN_TOKEN', storage.get(LOGIN_TOKEN))
+  store.commit('SET_USER_INFO', storage.get(USER_INFO))
   store.dispatch('setLang', storage.get(APP_LANGUAGE, 'en-US'))
-  // last step
 }
diff --git a/src/core/lazy_use.js b/src/core/lazy_use.js
index c06e94a..6ef5725 100644
--- a/src/core/lazy_use.js
+++ b/src/core/lazy_use.js
@@ -19,7 +19,6 @@ import {
   Table,
   Tabs,
   Icon,
-  Badge,
   Popover,
   Dropdown,
   List,
@@ -35,16 +34,17 @@ import {
   Divider,
   DatePicker,
   TimePicker,
-  Upload,
   Progress,
-  Skeleton,
   Popconfirm,
   PageHeader,
   Result,
-  Statistic,
   Descriptions,
   message,
-  notification
+  notification,
+  FormModel,
+  Tree,
+  TreeSelect,
+  Collapse
 } from 'ant-design-vue'
 import Viser from 'viser-vue'
 
@@ -73,7 +73,6 @@ Vue.use(Modal)
 Vue.use(Table)
 Vue.use(Tabs)
 Vue.use(Icon)
-Vue.use(Badge)
 Vue.use(Popover)
 Vue.use(Dropdown)
 Vue.use(List)
@@ -89,14 +88,15 @@ Vue.use(Tag)
 Vue.use(Divider)
 Vue.use(DatePicker)
 Vue.use(TimePicker)
-Vue.use(Upload)
 Vue.use(Progress)
-Vue.use(Skeleton)
 Vue.use(Popconfirm)
 Vue.use(PageHeader)
 Vue.use(Result)
-Vue.use(Statistic)
 Vue.use(Descriptions)
+Vue.use(FormModel)
+Vue.use(Tree)
+Vue.use(TreeSelect)
+Vue.use(Collapse)
 
 Vue.prototype.$confirm = Modal.confirm
 Vue.prototype.$message = message
diff --git a/src/core/use.js b/src/core/use.js
index ba2eca2..e5dc657 100644
--- a/src/core/use.js
+++ b/src/core/use.js
@@ -7,21 +7,21 @@ import VueCropper from 'vue-cropper'
 import 'ant-design-vue/dist/antd.less'
 
 // ext library
-import VueClipboard from 'vue-clipboard2'
-import MultiTab from '@/components/MultiTab'
+// import VueClipboard from 'vue-clipboard2'
+// import MultiTab from '@/components/MultiTab'
 import PageLoading from '@/components/PageLoading'
-import PermissionHelper from '@/utils/helper/permission'
+// import PermissionHelper from '@/utils/helper/permission'
 // import '@/components/use'
-import './directives/action'
+// import './directives/action'
 
 VueClipboard.config.autoSetContainer = true
 
 Vue.use(Antd)
 Vue.use(Viser)
-Vue.use(MultiTab)
+// Vue.use(MultiTab)
 Vue.use(PageLoading)
-Vue.use(VueClipboard)
-Vue.use(PermissionHelper)
+// Vue.use(VueClipboard)
+// Vue.use(PermissionHelper)
 Vue.use(VueCropper)
 
 process.env.NODE_ENV !== 'production' && console.warn('[antd-pro] WARNING: Antd now use fulled imported.')
diff --git a/src/global.less b/src/global.less
index 0f2b102..8613467 100644
--- a/src/global.less
+++ b/src/global.less
@@ -2,7 +2,8 @@
 
 html,
 body,
-#app, #root {
+#app,
+#root {
   height: 100%;
 }
 
@@ -29,7 +30,12 @@ ul,
 ol {
   list-style: none;
 }
-
+.ant-btn + .ant-btn {
+  margin-left: 8px;
+}
+.ant-btn-right{
+  float: right;
+}
 // 数据列表 样式
 .table-alert {
   margin-bottom: 16px;
@@ -37,26 +43,22 @@ ol {
 // 数据列表 操作
 .table-operator {
   margin-bottom: 18px;
-
   button {
     margin-right: 8px;
   }
 }
 // 数据列表 搜索条件
 .table-page-search-wrapper {
-
   .ant-form-inline {
     .ant-form-item {
       display: flex;
       margin-bottom: 24px;
       margin-right: 0;
-
       .ant-form-item-control-wrapper {
         flex: 1 1;
         display: inline-block;
         vertical-align: middle;
       }
-
       > .ant-form-item-label {
         line-height: 32px;
         padding-right: 8px;
@@ -68,7 +70,6 @@ ol {
       }
     }
   }
-
   .table-page-search-submitButtons {
     display: block;
     margin-bottom: 24px;
@@ -92,3 +93,23 @@ ol {
     }
   }
 }
+.ant-drawer-body{
+  padding-bottom: 53px;
+}
+.draw-button-container {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  border-top: 1px solid #e9e9e9;
+  padding: 10px 16px;
+  background: #fff;
+  z-index: 1000;
+  text-align: right;
+  &.align-center {
+    text-align: center;
+  }
+  &.align-left {
+    text-align: left;
+  }
+}
diff --git a/src/layouts/BasicLayout.vue b/src/layouts/BasicLayout.vue
index dc68a9d..67679aa 100644
--- a/src/layouts/BasicLayout.vue
+++ b/src/layouts/BasicLayout.vue
@@ -11,14 +11,6 @@
     :i18nRender="i18nRender"
     v-bind="settings"
   >
-    <!-- Ads begin
-      广告代码 真实项目中请移除
-      production remove this Ads
-    -->
-    <ads v-if="isProPreviewSite && !collapsed"/>
-    <!-- Ads end -->
-
-    <setting-drawer :settings="settings" @change="handleSettingChange" />
     <template v-slot:rightContentRender>
       <right-content :top-menu="settings.layout === 'topmenu'" :is-mobile="isMobile" :theme="settings.theme" />
     </template>
@@ -30,7 +22,6 @@
 </template>
 
 <script>
-import { SettingDrawer, updateTheme } from '@ant-design-vue/pro-layout'
 import { i18nRender } from '@/locales'
 import { mapState } from 'vuex'
 import { SIDEBAR_TYPE, TOGGLE_MOBILE_TYPE } from '@/store/mutation-types'
@@ -38,23 +29,16 @@ import { SIDEBAR_TYPE, TOGGLE_MOBILE_TYPE } from '@/store/mutation-types'
 import defaultSettings from '@/config/defaultSettings'
 import RightContent from '@/components/GlobalHeader/RightContent'
 import GlobalFooter from '@/components/GlobalFooter'
-import Ads from '@/components/Other/CarbonAds'
 import LogoSvg from '../assets/logo.svg?inline'
 
 export default {
   name: 'BasicLayout',
   components: {
-    SettingDrawer,
     RightContent,
-    GlobalFooter,
-    Ads
+    GlobalFooter
   },
   data () {
     return {
-      // preview.pro.antdv.com only use.
-      isProPreviewSite: process.env.VUE_APP_PREVIEW === 'true' && process.env.NODE_ENV !== 'development',
-      // end
-
       // base
       menus: [],
       // 侧栏收起状态
@@ -72,13 +56,11 @@ export default {
         fixedHeader: defaultSettings.fixedHeader,
         fixSiderbar: defaultSettings.fixSiderbar,
         colorWeak: defaultSettings.colorWeak,
-
         hideHintAlert: false,
         hideCopyButton: false
       },
       // 媒体查询
       query: {},
-
       // 是否手机模式
       isMobile: false
     }
@@ -90,15 +72,15 @@ export default {
     })
   },
   created () {
-    const routes = this.mainMenu.find(item => item.path === '/')
-    this.menus = (routes && routes.children) || []
-    // 处理侧栏收起状态
-    this.$watch('collapsed', () => {
-      this.$store.commit(SIDEBAR_TYPE, this.collapsed)
-    })
-    this.$watch('isMobile', () => {
-      this.$store.commit(TOGGLE_MOBILE_TYPE, this.isMobile)
-    })
+   const routes = this.mainMenu.find(item => item.path === '/')
+   this.menus = (routes && routes.children) || []
+   // 处理侧栏收起状态
+   this.$watch('collapsed', () => {
+     this.$store.commit(SIDEBAR_TYPE, this.collapsed)
+   })
+   this.$watch('isMobile', () => {
+     this.$store.commit(TOGGLE_MOBILE_TYPE, this.isMobile)
+   })
   },
   mounted () {
     const userAgent = navigator.userAgent
@@ -110,12 +92,6 @@ export default {
         }, 16)
       })
     }
-
-    // first update color
-    // TIPS: THEME COLOR HANDLER!! PLEASE CHECK THAT!!
-    if (process.env.NODE_ENV !== 'production' || process.env.VUE_APP_PREVIEW === 'true') {
-      updateTheme(this.settings.primaryColor)
-    }
   },
   methods: {
     i18nRender,
@@ -135,23 +111,6 @@ export default {
     handleCollapse (val) {
       this.collapsed = val
     },
-    handleSettingChange ({ type, value }) {
-      console.log('type', type, value)
-      type && (this.settings[type] = value)
-      switch (type) {
-        case 'contentWidth':
-          this.settings[type] = value === 'Fixed'
-          break
-        case 'layout':
-          if (value === 'sidemenu') {
-            this.settings.contentWidth = false
-          } else {
-            this.settings.fixSiderbar = false
-            this.settings.contentWidth = true
-          }
-          break
-      }
-    },
     logoRender () {
       return <LogoSvg />
     }
diff --git a/src/layouts/UserLayout.vue b/src/layouts/UserLayout.vue
index 6f72ed3..3f14791 100644
--- a/src/layouts/UserLayout.vue
+++ b/src/layouts/UserLayout.vue
@@ -5,16 +5,11 @@
         <div class="header">
           <a href="/">
             <img src="~@/assets/logo.svg" class="logo" alt="logo">
-            <span class="title">Ant Design</span>
+            <span class="title">安全培训平台</span>
           </a>
         </div>
-        <div class="desc">
-          Ant Design 是西湖区最具影响力的 Web 设计规范
-        </div>
       </div>
-
       <router-view />
-
       <div class="footer">
         <div class="links">
           <a href="_self">帮助</a>
@@ -22,7 +17,7 @@
           <a href="_self">条款</a>
         </div>
         <div class="copyright">
-          Copyright &copy; 2018 vueComponent
+          Copyright &copy; 2021 DaoBang
         </div>
       </div>
     </div>
@@ -71,7 +66,7 @@ export default {
 
       .top {
         text-align: center;
-
+        margin-bottom: 40px;
         .header {
           height: 44px;
           line-height: 44px;
@@ -102,12 +97,6 @@ export default {
             top: 2px;
           }
         }
-        .desc {
-          font-size: 14px;
-          color: rgba(0, 0, 0, 0.45);
-          margin-top: 12px;
-          margin-bottom: 40px;
-        }
       }
 
       .main {
diff --git a/src/locales/index.js b/src/locales/index.js
index ce12b05..f1cab76 100644
--- a/src/locales/index.js
+++ b/src/locales/index.js
@@ -4,15 +4,15 @@ import storage from 'store'
 import moment from 'moment'
 
 // default lang
-import enUS from './lang/en-US'
+import zhCN from './lang/zh-CN.js'
 
 Vue.use(VueI18n)
 
-export const defaultLang = 'en-US'
+export const defaultLang = 'zh-CN'
 
 const messages = {
-  'en-US': {
-    ...enUS
+  'zh-CN': {
+    ...zhCN
   }
 }
 
@@ -27,7 +27,6 @@ const loadedLanguages = [defaultLang]
 
 function setI18nLanguage (lang) {
   i18n.locale = lang
-  // request.headers['Accept-Language'] = lang
   document.querySelector('html').setAttribute('lang', lang)
   return lang
 }
diff --git a/src/locales/lang/en-US.js b/src/locales/lang/en-US.js
index a6f440c..b6ba5ae 100644
--- a/src/locales/lang/en-US.js
+++ b/src/locales/lang/en-US.js
@@ -11,13 +11,9 @@ const locale = {
   'message': '-',
   'menu.home': 'Home',
   'menu.dashboard': 'Dashboard',
-  'menu.dashboard.analysis': 'Analysis',
-  'menu.dashboard.monitor': 'Monitor',
   'menu.dashboard.workplace': 'Workplace',
-
   'layouts.usermenu.dialog.title': 'Message',
   'layouts.usermenu.dialog.content': 'Do you really log-out.',
-
   'app.setting.pagestyle': 'Page style setting',
   'app.setting.pagestyle.light': 'Light style',
   'app.setting.pagestyle.dark': 'Dark style',
@@ -35,7 +31,7 @@ const locale = {
   'app.setting.weakmode': 'Weak Mode',
   'app.setting.copy': 'Copy Setting',
   'app.setting.loading': 'Loading theme',
-  'app.setting.copyinfo': 'copy success，please replace defaultSettings in src/models/setting.js',
+  'app.setting.copyinfo': 'copy success，please replace defaultSettings in src/config/defaultSetting.js',
   'app.setting.production.hint': 'Setting panel shows in development environment only, please manually modify'
 }
 
diff --git a/src/locales/lang/zh-CN.js b/src/locales/lang/zh-CN.js
index 11c2f48..68c2ea7 100644
--- a/src/locales/lang/zh-CN.js
+++ b/src/locales/lang/zh-CN.js
@@ -10,10 +10,29 @@ const components = {
 const locale = {
   'message': '-',
   'menu.home': '主页',
-  'menu.dashboard': '仪表盘',
-  'menu.dashboard.analysis': '分析页',
-  'menu.dashboard.monitor': '监控页',
-  'menu.dashboard.workplace': '工作台'
+  'menu.dashboard': '工作台',
+  'menu.dashboard.workplace': '工作台',
+  'layouts.usermenu.dialog.title': '退出登录',
+  'layouts.usermenu.dialog.content': '是否要退出登录？',
+  'app.setting.pagestyle': '页面样式设置',
+  'app.setting.pagestyle.light': '小清新',
+  'app.setting.pagestyle.dark': '简约黑',
+  'app.setting.pagestyle.realdark': '纯黑',
+  'app.setting.themecolor': '主题颜色',
+  'app.setting.navigationmode': '导航模式',
+  'app.setting.content-width': '内容宽度',
+  'app.setting.fixedheader': '头部固定',
+  'app.setting.fixedsidebar': '菜单固定',
+  'app.setting.sidemenu': '左侧菜单',
+  'app.setting.topmenu': '顶部菜单',
+  'app.setting.content-width.fixed': '固定',
+  'app.setting.content-width.fluid': '流式',
+  'app.setting.othersettings': '其他设置',
+  'app.setting.weakmode': '色盲模式',
+  'app.setting.copy': '复制',
+  'app.setting.loading': '加载主题',
+  'app.setting.copyinfo': '复制成功并覆盖 src/config/defaultSetting.js',
+  'app.setting.production.hint': '请根据个人喜好设置'
 }
 
 export default {
diff --git a/src/main.js b/src/main.js
index 19e92ec..d4b1854 100644
--- a/src/main.js
+++ b/src/main.js
@@ -9,26 +9,21 @@ import store from './store/'
 import i18n from './locales'
 import { VueAxios } from './utils/request'
 import ProLayout, { PageHeaderWrapper } from '@ant-design-vue/pro-layout'
-import themePluginConfig from '../config/themePluginConfig'
-
-// mock
-// WARNING: `mockjs` NOT SUPPORT `IE` PLEASE DO NOT USE IN `production` ENV.
-import './mock'
+// import themePluginConfig from '../config/themePluginConfig'
 
 import bootstrap from './core/bootstrap'
 import './core/lazy_use'
-import './permission' // permission control
+import './permission'
 import './utils/filter' // global filter
 import './global.less'
 
 Vue.config.productionTip = false
 
-// mount axios to `Vue.$http` and `this.$http`
 Vue.use(VueAxios)
 Vue.component('pro-layout', ProLayout)
 Vue.component('page-header-wrapper', PageHeaderWrapper)
 
-window.umi_plugin_ant_themeVar = themePluginConfig.theme
+// window.umi_plugin_ant_themeVar = themePluginConfig.theme
 
 new Vue({
   router,
diff --git a/src/permission.js b/src/permission.js
index 39a8270..eb2a0a7 100644
--- a/src/permission.js
+++ b/src/permission.js
@@ -3,66 +3,42 @@ import store from './store'
 import storage from 'store'
 import NProgress from 'nprogress' // progress bar
 import '@/components/NProgress/nprogress.less' // progress bar custom style
-import notification from 'ant-design-vue/es/notification'
 import { setDocumentTitle, domTitle } from '@/utils/domUtil'
-import { ACCESS_TOKEN } from '@/store/mutation-types'
+import { LOGIN_TOKEN } from '@/store/mutation-types'
 import { i18nRender } from '@/locales'
 
 NProgress.configure({ showSpinner: false }) // NProgress Configuration
 
-const whiteList = ['login', 'register', 'registerResult'] // no redirect whitelist
+const whiteList = ['login'] // no redirect whitelist
 const loginRoutePath = '/user/login'
 const defaultRoutePath = '/dashboard/workplace'
 
 router.beforeEach((to, from, next) => {
   NProgress.start() // start progress bar
   to.meta && (typeof to.meta.title !== 'undefined' && setDocumentTitle(`${i18nRender(to.meta.title)} - ${domTitle}`))
-  /* has token */
-  if (storage.get(ACCESS_TOKEN)) {
+  if (storage.get(LOGIN_TOKEN)) {
     if (to.path === loginRoutePath) {
       next({ path: defaultRoutePath })
       NProgress.done()
     } else {
-      // check login user.roles is null
-      if (store.getters.roles.length === 0) {
-        // request login userInfo
-        store
-          .dispatch('GetInfo')
-          .then(res => {
-            const roles = res.result && res.result.role
-            // generate dynamic router
-            store.dispatch('GenerateRoutes', { roles }).then(() => {
-              // 根据roles权限生成可访问的路由表
-              // 动态添加可访问路由表
-              router.addRoutes(store.getters.addRouters)
-              // 请求带有 redirect 重定向时，登录自动重定向到该地址
-              const redirect = decodeURIComponent(from.query.redirect || to.path)
-              if (to.path === redirect) {
-                // set the replace: true so the navigation will not leave a history record
-                next({ ...to, replace: true })
-              } else {
-                // 跳转到目的路由
-                next({ path: redirect })
-              }
-            })
-          })
-          .catch(() => {
-            notification.error({
-              message: '错误',
-              description: '请求用户信息失败，请重试'
-            })
-            // 失败时，获取用户信息失败时，调用登出，来清空历史保留信息
-            store.dispatch('Logout').then(() => {
-              next({ path: loginRoutePath, query: { redirect: to.fullPath } })
-            })
-          })
+      if (store.getters.addRouters.length === 0) {
+        store.dispatch('GenerateRoutes').then(() => {
+          router.addRoutes(store.getters.addRouters)
+          const redirect = decodeURIComponent(from.query.redirect || to.path)
+          if (to.path === redirect) {
+            next({ ...to, replace: true })
+          } else {
+            next({ path: redirect })
+          }
+        }, () => {
+          NProgress.done()
+        })
       } else {
         next()
       }
     }
   } else {
     if (whiteList.includes(to.name)) {
-      // 在免登录白名单，直接进入
       next()
     } else {
       next({ path: loginRoutePath, query: { redirect: to.fullPath } })
diff --git a/src/router/generator-routers.js b/src/router/generator-routers.js
index e77b320..61d4987 100644
--- a/src/router/generator-routers.js
+++ b/src/router/generator-routers.js
@@ -10,16 +10,14 @@ const constantRouterComponents = {
   BlankLayout: BlankLayout,
   RouteView: RouteView,
   PageView: PageView,
-  '403': () => import(/* webpackChunkName: "error" */ '@/views/exception/403'),
-  '404': () => import(/* webpackChunkName: "error" */ '@/views/exception/404'),
-  '500': () => import(/* webpackChunkName: "error" */ '@/views/exception/500'),
+  '403': () => import('@/views/exception/403'),
+  '404': () => import('@/views/exception/404'),
+  '500': () => import('@/views/exception/500'),
 
   // 你需要动态引入的页面组件
   'Workplace': () => import('@/views/dashboard/Workplace'),
-  'Analysis': () => import('@/views/dashboard/Analysis'),
-
   // form
-  'BasicForm': () => import('@/views/form/BasicForm'),
+  // 'BasicForm': () => import('@/views/form/basicForm/Index'),
   'StepForm': () => import('@/views/form/stepForm/StepForm'),
   'AdvanceForm': () => import('@/views/form/advancedForm/AdvancedForm'),
 
@@ -31,7 +29,7 @@ const constantRouterComponents = {
   'SearchArticles': () => import('@/views/list/search/Article'),
   'SearchProjects': () => import('@/views/list/search/Projects'),
   'SearchApplications': () => import('@/views/list/search/Applications'),
-  'ProfileBasic': () => import('@/views/profile/basic/Index'),
+  // 'ProfileBasic': () => import('@/views/profile/basic/Index'),
   'ProfileAdvanced': () => import('@/views/profile/advanced/Advanced'),
 
   // result
@@ -44,15 +42,13 @@ const constantRouterComponents = {
   'Exception500': () => import(/* webpackChunkName: "fail" */ '@/views/exception/500'),
 
   // account
-  'AccountCenter': () => import('@/views/account/center/Index'),
+  // 'AccountCenter': () => import('@/views/account/center/Index'),
   'AccountSettings': () => import('@/views/account/settings/Index'),
   'BaseSettings': () => import('@/views/account/settings/BaseSetting'),
   'SecuritySettings': () => import('@/views/account/settings/Security'),
   'CustomSettings': () => import('@/views/account/settings/Custom'),
   'BindingSettings': () => import('@/views/account/settings/Binding'),
-  'NotificationSettings': () => import('@/views/account/settings/Notification'),
-
-  'TestWork': () => import(/* webpackChunkName: "TestWork" */ '@/views/dashboard/TestWork')
+  'NotificationSettings': () => import('@/views/account/settings/Notification')
 }
 
 // 前端未找到页面路由（固定不用改）
@@ -81,7 +77,6 @@ const rootRouter = {
 export const generatorDynamicRouter = (token) => {
   return new Promise((resolve, reject) => {
     loginService.getCurrentUserNav(token).then(res => {
-      console.log('res', res)
       const { result } = res
       const menuNav = []
       const childrenNav = []
@@ -89,10 +84,10 @@ export const generatorDynamicRouter = (token) => {
       listToTree(result, childrenNav, 0)
       rootRouter.children = childrenNav
       menuNav.push(rootRouter)
-      console.log('menuNav', menuNav)
+      // console.log('menuNav', menuNav)
       const routers = generator(menuNav)
       routers.push(notFoundRouter)
-      console.log('routers', routers)
+      // console.log('routers', routers)
       resolve(routers)
     }).catch(err => {
       reject(err)
diff --git a/src/router/index.js b/src/router/index.js
index afda622..8b53d4d 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,6 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
-import { constantRouterMap } from '@/config/router.config'
+import { constantRouterMap, asyncRouterMap } from '@/config/router.config'
 
 // hack router push callback
 const originalPush = Router.prototype.push
@@ -13,5 +13,7 @@ Vue.use(Router)
 
 export default new Router({
   mode: 'history',
-  routes: constantRouterMap
+  base: process.env.BASE_URL,
+  scrollBehavior: () => ({ y: 0 }),
+  routes: constantRouterMap.concat(asyncRouterMap)
 })
diff --git a/src/store/app-mixin.js b/src/store/app-mixin.js
index c910ae9..0a7dd1b 100644
--- a/src/store/app-mixin.js
+++ b/src/store/app-mixin.js
@@ -11,7 +11,6 @@ const baseMixin = {
       fixedSidebar: state => state.app.fixedSidebar,
       contentWidth: state => state.app.contentWidth,
       autoHideHeader: state => state.app.autoHideHeader,
-
       isMobile: state => state.app.isMobile,
       sideCollapsed: state => state.app.sideCollapsed,
       multiTab: state => state.app.multiTab
diff --git a/src/store/getters.js b/src/store/getters.js
index 5a5ad70..28d18f2 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -3,12 +3,13 @@ const getters = {
   lang: state => state.app.lang,
   theme: state => state.app.theme,
   color: state => state.app.color,
-  token: state => state.user.token,
+  accessToken: state => state.accessToken.accessToken,
+  loginToken: state => state.user.loginToken,
   avatar: state => state.user.avatar,
   nickname: state => state.user.name,
   welcome: state => state.user.welcome,
   roles: state => state.user.roles,
-  userInfo: state => state.user.info,
+  userInfo: state => state.user.userInfo,
   addRouters: state => state.permission.addRouters,
   multiTab: state => state.app.multiTab
 }
diff --git a/src/store/index.js b/src/store/index.js
index e79c3cb..ff66385 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -3,12 +3,8 @@ import Vuex from 'vuex'
 
 import app from './modules/app'
 import user from './modules/user'
-
-// default router permission control
-import permission from './modules/permission'
-
-// dynamic router permission control (Experimental)
-// import permission from './modules/async-router'
+import accessToken from './modules/access-token'
+import permission from './modules/async-router'
 import getters from './getters'
 
 Vue.use(Vuex)
@@ -17,6 +13,7 @@ export default new Vuex.Store({
   modules: {
     app,
     user,
+    accessToken,
     permission
   },
   state: {
diff --git a/src/store/modules/access-token.js b/src/store/modules/access-token.js
new file mode 100644
index 0000000..05beb63
--- /dev/null
+++ b/src/store/modules/access-token.js
@@ -0,0 +1,53 @@
+import storage from 'store'
+import { get } from '@/api/security/accessToken'
+import { ACCESS_TOKEN } from '@/store/mutation-types'
+
+const accessToken = {
+  state: {
+    accessToken: ''
+  },
+  mutations: {
+    SET_ACCESS_TOKEN: (state, accessToken) => {
+      state.accessToken = accessToken
+    }
+  },
+  actions: {
+    GetAccessToken ({ commit }) {
+      return new Promise((resolve, reject) => {
+        get({
+          apiKey: process.env.VUE_APP_API_KEY,
+          apiSecret: process.env.VUE_APP_API_SECRET
+        }).then(response => {
+          const result = response.data
+          storage.set(ACCESS_TOKEN, result, 24 * 60 * 60 * 1000)
+          commit('SET_ACCESS_TOKEN', result)
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+    InitAccessToken ({ commit }) {
+      const token = storage.get(ACCESS_TOKEN)
+      if (token) {
+        commit('SET_ACCESS_TOKEN', token)
+        return
+      }
+      return new Promise((resolve, reject) => {
+        get({
+          apiKey: process.env.VUE_APP_API_KEY,
+          apiSecret: process.env.VUE_APP_API_SECRET
+        }).then(response => {
+          const result = response.data
+          storage.set(ACCESS_TOKEN, result, 24 * 60 * 60 * 1000)
+          commit('SET_ACCESS_TOKEN', result)
+          resolve()
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    }
+  }
+}
+
+export default accessToken
diff --git a/src/store/modules/app.js b/src/store/modules/app.js
index 6a0c6ef..a3ec761 100644
--- a/src/store/modules/app.js
+++ b/src/store/modules/app.js
@@ -29,7 +29,7 @@ const app = {
     color: '',
     weak: false,
     multiTab: true,
-    lang: 'en-US',
+    lang: 'zh-CN',
     _antLocale: {}
   },
   mutations: {
diff --git a/src/store/modules/async-router.js b/src/store/modules/async-router.js
index 014b323..61bfd61 100644
--- a/src/store/modules/async-router.js
+++ b/src/store/modules/async-router.js
@@ -6,8 +6,8 @@ import { generatorDynamicRouter } from '@/router/generator-routers'
 
 const permission = {
   state: {
-    routers: constantRouterMap,
-    addRouters: []
+    addRouters: [],
+    routers: constantRouterMap
   },
   mutations: {
     SET_ROUTERS: (state, routers) => {
@@ -16,12 +16,13 @@ const permission = {
     }
   },
   actions: {
-    GenerateRoutes ({ commit }, data) {
-      return new Promise(resolve => {
-        const { token } = data
-        generatorDynamicRouter(token).then(routers => {
+    GenerateRoutes ({ commit }) {
+      return new Promise((resolve, reject) => {
+        generatorDynamicRouter().then(routers => {
           commit('SET_ROUTERS', routers)
-          resolve()
+          resolve(routers)
+        }, (error) => {
+          reject(error)
         })
       })
     }
diff --git a/src/store/modules/user.js b/src/store/modules/user.js
index 9ad4b81..ff8d1a3 100644
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -1,99 +1,52 @@
 import storage from 'store'
-import { login, getInfo, logout } from '@/api/login'
-import { ACCESS_TOKEN } from '@/store/mutation-types'
-import { welcome } from '@/utils/util'
+import { userLogin } from '@/api/security/user'
+import { LOGIN_TOKEN, USER_INFO } from '@/store/mutation-types'
 
 const user = {
   state: {
-    token: '',
-    name: '',
-    welcome: '',
-    avatar: '',
-    roles: [],
-    info: {}
+    loginToken: '',
+    userInfo: {}
   },
-
   mutations: {
-    SET_TOKEN: (state, token) => {
-      state.token = token
+    SET_LOGIN_TOKEN: (state, loginToken) => {
+      state.loginToken = loginToken
     },
-    SET_NAME: (state, { name, welcome }) => {
-      state.name = name
-      state.welcome = welcome
-    },
-    SET_AVATAR: (state, avatar) => {
-      state.avatar = avatar
-    },
-    SET_ROLES: (state, roles) => {
-      state.roles = roles
-    },
-    SET_INFO: (state, info) => {
-      state.info = info
+    SET_USER_INFO: (state, userInfo) => {
+      state.userInfo = userInfo
     }
   },
-
   actions: {
     // 登录
     Login ({ commit }, userInfo) {
       return new Promise((resolve, reject) => {
-        login(userInfo).then(response => {
-          const result = response.result
-          storage.set(ACCESS_TOKEN, result.token, 7 * 24 * 60 * 60 * 1000)
-          commit('SET_TOKEN', result.token)
-          resolve()
-        }).catch(error => {
-          reject(error)
-        })
+				storage.set(LOGIN_TOKEN, '111111', 24 * 60 * 60 * 1000)
+				// storage.set(USER_INFO, result, 24 * 60 * 60 * 1000)
+				commit('SET_LOGIN_TOKEN', '111111')
+				// commit('SET_USER_INFO', result)
+				resolve()
+        // userLogin(userInfo).then(response => {
+        //   const result = response.data
+        //   storage.set(LOGIN_TOKEN, result.loginToken, 24 * 60 * 60 * 1000)
+        //   // storage.set(USER_INFO, result, 24 * 60 * 60 * 1000)
+        //   commit('SET_LOGIN_TOKEN', result.loginToken)
+        //   // commit('SET_USER_INFO', result)
+        //   resolve()
+        // }).catch(error => {
+        //   reject(error)
+        // })
       })
     },
-
-    // 获取用户信息
-    GetInfo ({ commit }) {
-      return new Promise((resolve, reject) => {
-        getInfo().then(response => {
-          const result = response.result
-
-          if (result.role && result.role.permissions.length > 0) {
-            const role = result.role
-            role.permissions = result.role.permissions
-            role.permissions.map(per => {
-              if (per.actionEntitySet != null && per.actionEntitySet.length > 0) {
-                const action = per.actionEntitySet.map(action => { return action.action })
-                per.actionList = action
-              }
-            })
-            role.permissionList = role.permissions.map(permission => { return permission.permissionId })
-            commit('SET_ROLES', result.role)
-            commit('SET_INFO', result)
-          } else {
-            reject(new Error('getInfo: roles must be a non-null array !'))
-          }
-
-          commit('SET_NAME', { name: result.name, welcome: welcome() })
-          commit('SET_AVATAR', result.avatar)
-
-          resolve(response)
-        }).catch(error => {
-          reject(error)
-        })
-      })
-    },
-
     // 登出
     Logout ({ commit, state }) {
       return new Promise((resolve) => {
-        logout(state.token).then(() => {
-          resolve()
-        }).catch(() => {
-          resolve()
-        }).finally(() => {
-          commit('SET_TOKEN', '')
-          commit('SET_ROLES', [])
-          storage.remove(ACCESS_TOKEN)
-        })
+				commit('SET_LOGIN_TOKEN', '')
+        commit('SET_USER_INFO', {})
+        commit('SET_ROUTERS', [])
+				storage.remove(LOGIN_TOKEN)
+        storage.remove(USER_INFO)
+				resolve()
       })
     }
-
   }
 }
 
diff --git a/src/store/mutation-types.js b/src/store/mutation-types.js
index 4439479..9ad0ef7 100644
--- a/src/store/mutation-types.js
+++ b/src/store/mutation-types.js
@@ -1,4 +1,5 @@
-export const ACCESS_TOKEN = 'Access-Token'
+export const LOGIN_TOKEN = 'LOGIN-TOKEN'
+export const USER_INFO = 'USER_INFO'
 
 export const SIDEBAR_TYPE = 'sidebar_type'
 export const TOGGLE_MOBILE_TYPE = 'is_mobile'
diff --git a/src/store/user-mixin.js b/src/store/user-mixin.js
new file mode 100644
index 0000000..390c54f
--- /dev/null
+++ b/src/store/user-mixin.js
@@ -0,0 +1,18 @@
+const userMixin = {
+  computed: {
+    isCorporation () {
+      const userInfo = this.$store.getters.userInfo
+      return userInfo && userInfo.type === 'CORPORATION'
+    },
+    isMall () {
+      const userInfo = this.$store.getters.userInfo
+      return userInfo && userInfo.type === 'MALL'
+    },
+    isStore () {
+      const userInfo = this.$store.getters.userInfo
+      return userInfo && userInfo.type === 'STORE'
+    }
+  }
+}
+
+export { userMixin }
diff --git a/src/utils/device.js b/src/utils/device.js
new file mode 100644
index 0000000..0f350f3
--- /dev/null
+++ b/src/utils/device.js
@@ -0,0 +1,33 @@
+import enquireJs from 'enquire.js'
+
+export const DEVICE_TYPE = {
+  DESKTOP: 'desktop',
+  TABLET: 'tablet',
+  MOBILE: 'mobile'
+}
+
+export const deviceEnquire = function (callback) {
+  const matchDesktop = {
+    match: () => {
+      callback && callback(DEVICE_TYPE.DESKTOP)
+    }
+  }
+
+  const matchLablet = {
+    match: () => {
+      callback && callback(DEVICE_TYPE.TABLET)
+    }
+  }
+
+  const matchMobile = {
+    match: () => {
+      callback && callback(DEVICE_TYPE.MOBILE)
+    }
+  }
+
+  // screen and (max-width: 1087.99px)
+  enquireJs
+    .register('screen and (max-width: 576px)', matchMobile)
+    .register('screen and (min-width: 576px) and (max-width: 1199px)', matchLablet)
+    .register('screen and (min-width: 1200px)', matchDesktop)
+}
diff --git a/src/utils/file.js b/src/utils/file.js
new file mode 100644
index 0000000..ff1eb5d
--- /dev/null
+++ b/src/utils/file.js
@@ -0,0 +1,44 @@
+import moment from 'moment'
+import ExportJsonExcel from 'js-export-excel'
+import JSZip from 'jszip'
+import { saveAs } from 'file-saver'
+
+export function exportExcel (name, exportData) {
+  var option = {}
+  var toExcel = {}
+  option.fileName = name + moment().format('YYYYMMDDHHmmss')
+  option.datas = [{
+    sheetData: exportData.sheetData,
+    sheetName: name,
+    sheetFilter: exportData.sheetFilter,
+    sheetHeader: exportData.sheetHeader,
+    columnWidths: [20, 20]
+  }]
+  toExcel = new ExportJsonExcel(option)
+  toExcel.saveExcel()
+}
+export function exportExcelZip (name, exportPageData) {
+    var zip = new JSZip()
+    exportPageData.forEach((item) => {
+      var option = {}
+      var toExcel = {}
+      option.fileName = name + item.pageNo
+      option.saveAsBlob = true
+      option.datas = [{
+        sheetData: item.sheetData,
+        sheetName: name + item.pageNo,
+        sheetFilter: item.sheetFilter,
+        sheetHeader: item.sheetHeader,
+        columnWidths: item.columnWidths
+      }]
+      toExcel = new ExportJsonExcel(option)
+      var file = toExcel.saveExcel()
+      zip.file(file.name, file)
+    })
+    zip.generateAsync({
+      type: 'blob'
+    }).then(function (content) {
+      // see FileSaver.js
+      saveAs(content, name + moment().format('YYYYMMDDHHmmss') + '.zip')
+    })
+}
diff --git a/src/utils/filter.js b/src/utils/filter.js
index 45702c6..a0b5ed5 100644
--- a/src/utils/filter.js
+++ b/src/utils/filter.js
@@ -11,10 +11,32 @@ Vue.filter('NumberFormat', function (value) {
   return intPartFormat
 })
 
+Vue.filter('AmountFormat', function (val) {
+  if (!val) {
+    return '0.00'
+  }
+  val = val.toString().replace(/\$|,/g, '')
+  var sign = false
+  if (val === Math.abs(val)) {
+    sign = true
+  }
+  val = Math.floor(val * 100 + 0.50000000001)
+  var cents = val % 100
+  val = Math.floor(val / 100).toString()
+  if (cents < 10) {
+    cents = '0' + cents
+  }
+  for (var i = 0; i < Math.floor((val.length - (1 + i)) / 3); i++) {
+    val = val.substring(0, val.length - (4 * i + 3)) + ',' + val.substring(val.length - (4 * i + 3))
+  }
+  return (sign ? '-' : '') + val + '.' + cents
+})
+
 Vue.filter('dayjs', function (dataStr, pattern = 'YYYY-MM-DD HH:mm:ss') {
   return moment(dataStr).format(pattern)
 })
 
-Vue.filter('moment', function (dataStr, pattern = 'YYYY-MM-DD HH:mm:ss') {
+Vue.filter('moment', (dataStr, pattern = 'YYYY-MM-DD HH:mm:ss') => {
+  if (!dataStr) return ''
   return moment(dataStr).format(pattern)
 })
diff --git a/src/utils/log.js b/src/utils/log.js
new file mode 100644
index 0000000..417c41c
--- /dev/null
+++ b/src/utils/log.js
@@ -0,0 +1,11 @@
+export function info (msg) {
+  console.log(msg)
+}
+export function error (msg) {
+  console.error(msg)
+}
+const Logger = {
+  info,
+  error
+}
+export default Logger
diff --git a/src/utils/mixin.js b/src/utils/mixin.js
new file mode 100644
index 0000000..217732d
--- /dev/null
+++ b/src/utils/mixin.js
@@ -0,0 +1,76 @@
+// import Vue from 'vue'
+import { deviceEnquire, DEVICE_TYPE } from '@/utils/device'
+import { mapState } from 'vuex'
+
+// const mixinsComputed = Vue.config.optionMergeStrategies.computed
+// const mixinsMethods = Vue.config.optionMergeStrategies.methods
+
+const mixin = {
+  computed: {
+    ...mapState({
+      layoutMode: state => state.app.layout,
+      navTheme: state => state.app.theme,
+      primaryColor: state => state.app.color,
+      colorWeak: state => state.app.weak,
+      fixedHeader: state => state.app.fixedHeader,
+      fixSiderbar: state => state.app.fixSiderbar,
+      fixSidebar: state => state.app.fixSiderbar,
+      contentWidth: state => state.app.contentWidth,
+      autoHideHeader: state => state.app.autoHideHeader,
+      sidebarOpened: state => state.app.sidebar,
+      multiTab: state => state.app.multiTab
+    })
+  },
+  methods: {
+    isTopMenu () {
+      return this.layoutMode === 'topmenu'
+    },
+    isSideMenu () {
+      return !this.isTopMenu()
+    }
+  }
+}
+
+const mixinDevice = {
+  computed: {
+    ...mapState({
+      device: state => state.app.device
+    })
+  },
+  methods: {
+    isMobile () {
+      return this.device === DEVICE_TYPE.MOBILE
+    },
+    isDesktop () {
+      return this.device === DEVICE_TYPE.DESKTOP
+    },
+    isTablet () {
+      return this.device === DEVICE_TYPE.TABLET
+    }
+  }
+}
+
+const AppDeviceEnquire = {
+  mounted () {
+    const { $store } = this
+    deviceEnquire(deviceType => {
+      switch (deviceType) {
+        case DEVICE_TYPE.DESKTOP:
+          $store.commit('TOGGLE_DEVICE', 'desktop')
+          $store.dispatch('setSidebar', true)
+          break
+        case DEVICE_TYPE.TABLET:
+          $store.commit('TOGGLE_DEVICE', 'tablet')
+          $store.dispatch('setSidebar', false)
+          break
+        case DEVICE_TYPE.MOBILE:
+        default:
+          $store.commit('TOGGLE_DEVICE', 'mobile')
+          $store.dispatch('setSidebar', true)
+          break
+      }
+    })
+  }
+}
+
+export { mixin, AppDeviceEnquire, mixinDevice }
diff --git a/src/utils/request.js b/src/utils/request.js
index 4e57f5e..20d5837 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -1,10 +1,24 @@
 import axios from 'axios'
+import router from '../router'
 import store from '@/store'
 import storage from 'store'
 import notification from 'ant-design-vue/es/notification'
 import { VueAxios } from './axios'
-import { ACCESS_TOKEN } from '@/store/mutation-types'
+import { LOGIN_TOKEN } from '@/store/mutation-types'
+import Exception from '@/components/Exception/type'
 
+const SUCCESS_CODE = '200'
+const INVALID_LOGIN_TOKEN_CODE = '0004'
+// const whiteList = ['/security/accessToken/get']
+const loginPath = '/user/login'
+
+const toast = (msg, description) => {
+  notification.error({
+    message: msg,
+    description: description
+  })
+}
+console.log(process.env.VUE_APP_API_BASE_URL)
 // 创建 axios 实例
 const request = axios.create({
   // API 请求的默认前缀
@@ -12,30 +26,18 @@ const request = axios.create({
   timeout: 6000 // 请求超时时间
 })
 
-// 异常拦截处理器
+// 处理网络异常
 const errorHandler = (error) => {
-  if (error.response) {
-    const data = error.response.data
-    // 从 localstorage 获取 token
-    const token = storage.get(ACCESS_TOKEN)
-    if (error.response.status === 403) {
-      notification.error({
-        message: 'Forbidden',
-        description: data.message
-      })
-    }
-    if (error.response.status === 401 && !(data.result && data.result.isLogin)) {
-      notification.error({
-        message: 'Unauthorized',
-        description: 'Authorization verification failed'
-      })
-      if (token) {
-        store.dispatch('Logout').then(() => {
-          setTimeout(() => {
-            window.location.reload()
-          }, 1500)
+  if (error.response && error.response.status) {
+    const status = error.response.status
+    if (status === 401) {
+      store.dispatch('Logout').then(() => {
+        router.push({
+          path: loginPath
         })
-      }
+      })
+    } else {
+      toast(status, Exception[status] ? Exception[status].desc : '访问接口服务异常')
     }
   }
   return Promise.reject(error)
@@ -43,18 +45,35 @@ const errorHandler = (error) => {
 
 // request interceptor
 request.interceptors.request.use(config => {
-  const token = storage.get(ACCESS_TOKEN)
-  // 如果 token 存在
-  // 让每个请求携带自定义 token 请根据实际情况自行修改
-  if (token) {
-    config.headers['Access-Token'] = token
+  const loginToken = storage.get(LOGIN_TOKEN)
+  if (loginToken) {
+    config.headers[LOGIN_TOKEN] = loginToken
+  }
+  if (config.method === 'post' && config.headers['Content-Type'] !== 'application/x-www-form-urlencoded') {
+    if (!config.data) {
+      config.data = {}
+    }
   }
   return config
 }, errorHandler)
 
 // response interceptor
 request.interceptors.response.use((response) => {
-  return response.data
+  console.log(response)
+  if (response.status === 200 && response.data.code === SUCCESS_CODE) {
+    return Promise.resolve(response.data)
+  } else if (response.data && response.data.code === INVALID_LOGIN_TOKEN_CODE) {
+    toast('认证失败:', '登录超时，请重新登录')
+    store.dispatch('Logout').then(() => {
+      router.push({
+        path: loginPath
+      })
+    })
+    return Promise.reject(new Error(INVALID_LOGIN_TOKEN_CODE))
+  } else {
+    if (response.data && response.data.msg) toast(response.data.msg)
+    return Promise.reject(response)
+  }
 }, errorHandler)
 
 const installer = {
diff --git a/src/utils/screenLog.js b/src/utils/screenLog.js
index 5011ef3..04ea8d7 100644
--- a/src/utils/screenLog.js
+++ b/src/utils/screenLog.js
@@ -1,18 +1,12 @@
 /* eslint-disable */
 export const printANSI = () => {
   // console.clear()
-  console.log('[Antd Pro] created()')
   // ASCII - ANSI Shadow
   let text = `
- █████╗ ███╗   ██╗████████╗██████╗     ██████╗ ██████╗  ██████╗ 
-██╔══██╗████╗  ██║╚══██╔══╝██╔══██╗    ██╔══██╗██╔══██╗██╔═══██╗
-███████║██╔██╗ ██║   ██║   ██║  ██║    ██████╔╝██████╔╝██║   ██║
-██╔══██║██║╚██╗██║   ██║   ██║  ██║    ██╔═══╝ ██╔══██╗██║   ██║
-██║  ██║██║ ╚████║   ██║   ██████╔╝    ██║     ██║  ██║╚██████╔╝
-╚═╝  ╚═╝╚═╝  ╚═══╝   ╚═╝   ╚═════╝     ╚═╝     ╚═╝  ╚═╝ ╚═════╝ 
-\t\t\t\t\tPublished ${APP_VERSION}-${GIT_HASH} @ antdv.com
-\t\t\t\t\tBuild date: ${BUILD_DATE}`
+╔═╗╔╗╔╔╦╗╔═╗╔═╗╔╦╗╔═╗╦═╗
+╠═╣║║║ ║ ║╣ ╠═╣ ║ ║╣ ╠╦╝
+╩ ╩╝╚╝ ╩ ╚═╝╩ ╩ ╩ ╚═╝╩╚═
+Published ${APP_VERSION}-${GIT_HASH} @ tcc.com
+Build date: ${BUILD_DATE}`
   console.log(`%c${text}`, 'color: #fc4d50')
-  console.log('%c感谢使用 Antd Vue Pro!', 'color: #000; font-size: 14px;    font-family: Hiragino Sans GB,Microsoft YaHei,\\\\5FAE\\8F6F\\96C5\\9ED1,Droid Sans Fallback,Source Sans,Wenquanyi Micro Hei,WenQuanYi Micro Hei Mono,WenQuanYi Zen Hei,Apple LiGothic Medium,SimHei,ST Heiti,WenQuanYi Zen Hei Sharp,sans-serif;')
-  console.log('%cThanks for using Antd Vue Pro!', 'color: #fff; font-size: 14px; font-weight: 300; text-shadow:#000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0;')
 }
diff --git a/src/utils/util.js b/src/utils/util.js
index 274ff18..2ba7c4e 100644
--- a/src/utils/util.js
+++ b/src/utils/util.js
@@ -65,3 +65,27 @@ export function removeLoadingAnimate (id = '', timeout = 1500) {
     document.body.removeChild(document.getElementById(id))
   }, timeout)
 }
+
+export function diffArray (arr1, arr2) {
+	return arr1.filter(function (val) { return arr2.indexOf(val) === -1 })
+}
+
+export function listToTree (list, tree, parentId) {
+  list.forEach(item => {
+    if (item.parentId === parentId) {
+      const child = {
+        ...item,
+        scopedSlots: {
+          icon: 'icon'
+        },
+        children: []
+      }
+      listToTree(list, child.children, item.id)
+      if (child.children.length <= 0) {
+        delete child.children
+      }
+      tree.push(child)
+    }
+  })
+  return tree
+}
diff --git a/src/views/brand/BrandDetail.vue b/src/views/brand/BrandDetail.vue
new file mode 100644
index 0000000..becb559
--- /dev/null
+++ b/src/views/brand/BrandDetail.vue
@@ -0,0 +1,43 @@
+<template>
+  <page-header-wrapper :title="false" content="界面详情介绍,不需要可删除.">
+    <a-card :bordered="false">
+      <a-descriptions title="品牌详情">
+        <a-descriptions-item label="名称">{{model.name}}</a-descriptions-item>
+        <a-descriptions-item label="编码">{{model.code}}</a-descriptions-item>
+        <a-descriptions-item label="状态">{{model.status | statusFilter}}</a-descriptions-item>
+        <a-descriptions-item label="创建时间">{{model.createdAt | moment}}</a-descriptions-item>
+        <a-descriptions-item label="排序">{{model.sortOrder}}</a-descriptions-item>
+      </a-descriptions>
+    </a-card>
+  </page-header-wrapper>
+</template>
+<script>
+import { brandGet } from '@/api/bms/brand'
+import { statusMap } from '@/views/status/statusMap'
+
+export default {
+  data () {
+    return {
+      id: null,
+      model: {}
+    }
+  },
+  filters: {
+    statusFilter (status) {
+      return statusMap[status]
+    }
+  },
+  methods: {
+    loadData () {
+      brandGet({ id: this.id }).then(data => {
+        this.model = data.data
+      })
+    }
+  },
+  created () {
+    const id = this.$route.params.id
+    this.id = id
+    this.loadData()
+  }
+}
+</script>
diff --git a/src/views/brand/BrandList.vue b/src/views/brand/BrandList.vue
new file mode 100644
index 0000000..7bd553b
--- /dev/null
+++ b/src/views/brand/BrandList.vue
@@ -0,0 +1,173 @@
+<template>
+  <page-header-wrapper :title="false" content="界面详情介绍,不需要可删除.">
+    <a-card :bordered="false">
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline">
+          <a-row :gutter="48">
+            <a-col :md="6" :sm="24">
+              <a-form-item label="名称">
+                <a-input v-model="queryParam.name" placeholder="请输入名称" @pressEnter="handleFefresh"/>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="状态">
+                <a-select v-model="queryParam.status" placeholder="请选择" default-value="0" @pressEnter="handleFefresh">
+                  <a-select-option value="">全部</a-select-option>
+                  <a-select-option v-for="(item, index) in statusMap" :key="index" :value="index">{{item}}</a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-button type="primary" @click="handleFefresh">查询</a-button>
+              <a-button @click="() => {queryParam = {}, handleFefresh()}">重置</a-button>
+            </a-col>
+            <a-col :md="6" :sm="24" align="right">
+              <a-button type="primary" @click="handleCreate">新增</a-button>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <s-table
+        ref="table"
+        size="default"
+        rowKey="id"
+        :columns="columns"
+        :data="loadData"
+        :rowSelection="rowSelection"
+      >
+        <template slot="time" slot-scope="text, record">{{record.createdAt | moment}}</template>
+        <template slot="tbStatus" slot-scope="text, record">
+          <a-switch checked-children="启用" un-checked-children="停用" v-model="record.status" @change="updateStatus(record.id, record.status)"/>
+        </template>
+        <template slot="action" slot-scope="text, record">
+          <a href="javascript:;" @click="handleEdit(record)">修改</a>
+          <a-divider type="vertical" />
+          <a-popconfirm title="是否删除?" @confirm="() => handleDelete(record)">
+            <a href="javascript:;">删除</a>
+          </a-popconfirm>
+          <a-divider type="vertical" />
+          <router-link :to="'/brand/detail/' + record.id">跳转详情</router-link>
+          <a-divider type="vertical" />
+          <a href="javascript:;" @click="handleDetail(record.id)">弹框详情</a>
+        </template>
+      </s-table>
+      <create-form ref="modal" @ok="handleOk" />
+      <brand-detail ref="detail"></brand-detail>
+    </a-card>
+  </page-header-wrapper>
+</template>
+
+<script>
+import notification from 'ant-design-vue/es/notification'
+import { brandPage, brandUpdateStatus, brandDelete } from '@/api/bms/brand'
+import { STable } from '@/components'
+import CreateForm from './modules/CreateForm'
+import BrandDetail from './modules/BrandDetail'
+import { statusMap } from '@/views/status/statusMap'
+
+export default {
+  name: 'BrandList',
+  components: {
+    STable,
+    CreateForm,
+    BrandDetail
+  },
+  data () {
+    return {
+      statusMap: statusMap,
+      queryParam: { name: '', status: '' },
+      selectedRowKeys: [], // 选中行的key 出选择框时需要配置
+      selectedRows: [], // 选中行的数据
+      columns: [
+        { title: '名称', width: 30, dataIndex: 'name', key: 'name' },
+        { title: '编码', width: 30, dataIndex: 'code', key: 'code' },
+        {
+          title: '创建时间',
+          width: 10,
+          key: 'createdAt',
+          align: 'center',
+          scopedSlots: { customRender: 'time' }
+        },
+        {
+          title: '状态',
+          width: 10,
+          key: 'tbStatus',
+          align: 'center',
+          scopedSlots: { customRender: 'tbStatus' }
+        },
+        {
+          title: '操作',
+          key: 'operation',
+          width: 10,
+          align: 'right',
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+      loadData: parameter => {
+        return brandPage(Object.assign(parameter, this.queryParam))
+          .then(res => {
+            const data = res.data
+            data.entities.forEach((item) => {
+              item.status = item.status === 1
+            })
+            return data
+          })
+      }
+    }
+  },
+  computed: {
+    rowSelection () {
+      return {
+        selectedRowKeys: this.selectedRowKeys,
+        onChange: this.onSelectChange
+      }
+    }
+  },
+  methods: {
+    // 修改状态
+    updateStatus (id, status) {
+      brandUpdateStatus({
+        id: id,
+        status: status ? 1 : 0
+      }).then(res => {
+        notification.success({
+          message: '操作成功',
+          duration: 1,
+          description: status ? '品牌已启用' : '品牌已停用'
+        })
+        this.$refs.table.refresh()
+      })
+    },
+    // 增
+    handleCreate () {
+      this.$refs.modal.add()
+    },
+    // 改
+    handleEdit (record) {
+      this.$refs.modal.edit(record)
+    },
+    // 删
+    handleDelete (record) {
+      brandDelete({ id: record.id }).then(() => {
+        this.loadData()
+      })
+    },
+    // 编辑后回调
+    handleOk () {
+      this.$refs.table.refresh()
+    },
+    // 详情
+    handleDetail (id) {
+      this.$refs.detail.show(id)
+    },
+    handleFefresh () {
+      this.$refs.table.refresh(true)
+    },
+    // 选择行
+    onSelectChange (selectedRowKeys, selectedRows) {
+      this.selectedRowKeys = selectedRowKeys
+      this.selectedRows = selectedRows
+    }
+  }
+}
+</script>
diff --git a/src/views/brand/modules/BrandDetail.vue b/src/views/brand/modules/BrandDetail.vue
new file mode 100644
index 0000000..1b7081c
--- /dev/null
+++ b/src/views/brand/modules/BrandDetail.vue
@@ -0,0 +1,48 @@
+<template>
+  <a-drawer
+    title="品牌详情"
+    width="640"
+    placement="right"
+    :visible="visible"
+    @close="onClose">
+    <a-descriptions :column="{ sm: 2, xs: 1 }">
+      <a-descriptions-item label="名称">{{ model.name }}</a-descriptions-item>
+      <a-descriptions-item label="编码">{{ model.code }}</a-descriptions-item>
+      <a-descriptions-item label="创建时间">{{ model.createdAt | moment('YYYY-MM-DD') }}</a-descriptions-item>
+      <a-descriptions-item label="上次修改时间">{{ model.updatedAt }}</a-descriptions-item>
+      <a-descriptions-item label="状态">{{ model.status | statusFilter }}</a-descriptions-item>
+      <a-descriptions-item label="排序">{{ model.sortOrder }}</a-descriptions-item>
+    </a-descriptions>
+  </a-drawer>
+</template>
+
+<script>
+import { brandGet } from '@/api/bms/brand'
+import { statusMap } from '@/views/status/statusMap'
+
+export default {
+  data () {
+    return {
+      visible: false,
+      model: {}
+    }
+  },
+  filters: {
+    statusFilter (status) {
+      return statusMap[status]
+    }
+  },
+  methods: {
+    show (id) {
+      this.visible = true
+      brandGet({ id: id }).then(data => {
+        this.model = data.data
+      })
+    },
+    onClose () {
+      this.model = {}
+      this.visible = false
+    }
+  }
+}
+</script>
diff --git a/src/views/brand/modules/CreateForm.vue b/src/views/brand/modules/CreateForm.vue
new file mode 100644
index 0000000..55903b2
--- /dev/null
+++ b/src/views/brand/modules/CreateForm.vue
@@ -0,0 +1,83 @@
+<template>
+  <a-modal centered v-model="visible" :title="modalTitle" @ok="onSubmit" @cancel="onCancel">
+    <template slot="footer">
+      <a-button key="cancel" @click="onCancel">取消</a-button>
+      <a-button key="submit" type="primary" @click="onSubmit">保存</a-button>
+    </template>
+    <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
+      <a-form-model-item ref="name" label="名称" prop="name">
+        <a-input v-model="form.name"/>
+      </a-form-model-item>
+    </a-form-model>
+  </a-modal>
+</template>
+
+<script>
+import { brandGet, brandAdd, brandUpdate } from '@/api/bms/brand'
+
+export default {
+  props: {
+    id: {
+      type: String,
+      default: undefined
+    }
+  },
+  data () {
+    return {
+      modalTitle: '新增',
+      visible: false,
+      labelCol: { span: 4 },
+      wrapperCol: { span: 16 },
+      form: {
+        name: ''
+      },
+      rules: {
+        name: [
+          { required: true, message: '请输入名称', trigger: 'blur' },
+          { min: 2, message: '长度不能小于2', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  methods: {
+    add () {
+      this.modalTitle = '新增'
+      this.visible = true
+    },
+    edit (obj) {
+      this.modalTitle = '修改'
+      this.visible = true
+      brandGet({ id: obj.id }).then(data => {
+        const form = data.data
+        this.form = form
+      })
+    },
+    onSubmit (e) {
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          if (this.form.id) {
+            brandUpdate(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            })
+          } else {
+            brandAdd(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            })
+          }
+        } else {
+          return false
+        }
+      })
+    },
+    onCancel () {
+      this.$refs.ruleForm.resetFields()
+      this.visible = false
+    },
+    onReset () {
+      this.$refs.ruleForm.resetFields()
+    }
+  }
+}
+</script>
diff --git a/src/views/dashboard/Workplace.vue b/src/views/dashboard/Workplace.vue
index 4663223..ffe08d8 100644
--- a/src/views/dashboard/Workplace.vue
+++ b/src/views/dashboard/Workplace.vue
@@ -1,5 +1,5 @@
 <template>
-  <page-header-wrapper>
+  <page-header-wrapper :title="false">
     <template v-slot:content>
       <div class="page-header-content">
         <div class="avatar">
@@ -9,112 +9,206 @@
           <div class="content-title">
             {{ timeFix }}，{{ user.name }}<span class="welcome-text">，{{ welcome }}</span>
           </div>
-          <div>前端工程师 | 蚂蚁金服 - 某某某事业群 - VUE平台</div>
         </div>
       </div>
     </template>
-    <template v-slot:extraContent>
-      <div class="extra-content">
-        <div class="stat-item">
-          <a-statistic title="项目数" :value="56" />
-        </div>
-        <div class="stat-item">
-          <a-statistic title="团队内排名" :value="8" suffix="/ 24" />
-        </div>
-        <div class="stat-item">
-          <a-statistic title="项目访问" :value="2223" />
-        </div>
-      </div>
-    </template>
-
-    <div>
-      <a-row :gutter="24">
-        <a-col :xl="16" :lg="24" :md="24" :sm="24" :xs="24">
-          <a-card
-            class="project-list"
-            :loading="loading"
-            style="margin-bottom: 24px;"
-            :bordered="false"
-            title="进行中的项目"
-            :body-style="{ padding: 0 }">
-            <a slot="extra">全部项目</a>
-            <div>
-              <a-card-grid class="project-card-grid" :key="i" v-for="(item, i) in projects">
-                <a-card :bordered="false" :body-style="{ padding: 0 }">
-                  <a-card-meta>
-                    <div slot="title" class="card-title">
-                      <a-avatar size="small" :src="item.cover"/>
-                      <a>{{ item.title }}</a>
-                    </div>
-                    <div slot="description" class="card-description">
-                      {{ item.description }}
-                    </div>
-                  </a-card-meta>
-                  <div class="project-item">
-                    <a href="/#/">科学搬砖组</a>
-                    <span class="datetime">9小时前</span>
-                  </div>
-                </a-card>
-              </a-card-grid>
+    <a-row :gutter="24">
+      <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
+        <chart-card :loading="loading" title="总销售额" total="￥126,560">
+          <a-tooltip title="指标说明" slot="action">
+            <a-icon type="info-circle-o" />
+          </a-tooltip>
+          <div>
+            <trend flag="up" style="margin-right: 16px;">
+              <span slot="term">周同比</span>
+              12%
+            </trend>
+            <trend flag="down">
+              <span slot="term">日同比</span>
+              11%
+            </trend>
+          </div>
+          <template slot="footer">日均销售额<span>￥ 234.56</span></template>
+        </chart-card>
+      </a-col>
+      <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
+        <chart-card :loading="loading" title="访问量" :total="8846 | NumberFormat">
+          <a-tooltip title="指标说明" slot="action">
+            <a-icon type="info-circle-o" />
+          </a-tooltip>
+          <div>
+            <mini-area />
+          </div>
+          <template slot="footer">日访问量<span> {{ '1234' | NumberFormat }}</span></template>
+        </chart-card>
+      </a-col>
+      <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
+        <chart-card :loading="loading" title="支付笔数" :total="6560 | NumberFormat">
+          <a-tooltip title="指标说明" slot="action">
+            <a-icon type="info-circle-o" />
+          </a-tooltip>
+          <div>
+            <mini-bar />
+          </div>
+          <template slot="footer">转化率 <span>60%</span></template>
+        </chart-card>
+      </a-col>
+      <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
+        <chart-card :loading="loading" title="运营活动效果" total="78%">
+          <a-tooltip title="指标说明" slot="action">
+            <a-icon type="info-circle-o" />
+          </a-tooltip>
+          <div>
+            <mini-progress color="rgb(19, 194, 194)" :target="80" :percentage="78" height="8px" />
+          </div>
+          <template slot="footer">
+            <trend flag="down" style="margin-right: 16px;">
+              <span slot="term">同周比</span>
+              12%
+            </trend>
+            <trend flag="up">
+              <span slot="term">日环比</span>
+              80%
+            </trend>
+          </template>
+        </chart-card>
+      </a-col>
+    </a-row>
+    <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
+      <div class="salesCard">
+        <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
+          <div class="extra-wrapper" slot="tabBarExtraContent">
+            <div class="extra-item">
+              <a>今日</a>
+              <a>本周</a>
+              <a>本月</a>
+              <a>本年</a>
+            </div>
+            <a-range-picker :style="{width: '256px'}" />
+          </div>
+          <a-tab-pane loading="true" tab="销售额" key="1">
+            <a-row>
+              <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+                <bar :data="barData" title="销售额排行" />
+              </a-col>
+              <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+                <rank-list title="门店销售排行榜" :list="rankList"/>
+              </a-col>
+            </a-row>
+          </a-tab-pane>
+          <a-tab-pane tab="访问量" key="2">
+            <a-row>
+              <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+                <bar :data="barData2" title="销售额趋势" />
+              </a-col>
+              <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+                <rank-list title="门店销售排行榜" :list="rankList"/>
+              </a-col>
+            </a-row>
+          </a-tab-pane>
+        </a-tabs>
+      </div>
+    </a-card>
+    <div class="antd-pro-pages-dashboard-analysis-twoColLayout" :class="!isMobile && 'desktop'">
+      <a-row :gutter="24" type="flex" :style="{ marginTop: '24px' }">
+        <a-col :xl="12" :lg="24" :md="24" :sm="24" :xs="24">
+          <a-card :loading="loading" :bordered="false" title="线上热门搜索" :style="{ height: '100%' }">
+            <a-dropdown :trigger="['click']" placement="bottomLeft" slot="extra">
+              <a class="ant-dropdown-link" href="#">
+                <a-icon type="ellipsis" />
+              </a>
+              <a-menu slot="overlay">
+                <a-menu-item>
+                  <a href="javascript:;">操作一</a>
+                </a-menu-item>
+                <a-menu-item>
+                  <a href="javascript:;">操作二</a>
+                </a-menu-item>
+              </a-menu>
+            </a-dropdown>
+            <a-row :gutter="68">
+              <a-col :xs="24" :sm="12" :style="{ marginBottom: ' 24px'}">
+                <number-info :total="12321" :sub-total="17.1">
+                  <span slot="subtitle">
+                    <span>搜索用户数</span>
+                    <a-tooltip title="指标说明" slot="action">
+                      <a-icon type="info-circle-o" :style="{ marginLeft: '8px' }" />
+                    </a-tooltip>
+                  </span>
+                </number-info>
+                <!-- miniChart -->
+                <div>
+                  <mini-smooth-area :style="{ height: '45px' }" :dataSource="searchUserData" :scale="searchUserScale" />
+                </div>
+              </a-col>
+              <a-col :xs="24" :sm="12" :style="{ marginBottom: ' 24px'}">
+                <number-info :total="2.7" :sub-total="26.2" status="down">
+                  <span slot="subtitle">
+                    <span>人均搜索次数</span>
+                    <a-tooltip title="指标说明" slot="action">
+                      <a-icon type="info-circle-o" :style="{ marginLeft: '8px' }" />
+                    </a-tooltip>
+                  </span>
+                </number-info>
+                <!-- miniChart -->
+                <div>
+                  <mini-smooth-area :style="{ height: '45px' }" :dataSource="searchUserData" :scale="searchUserScale" />
+                </div>
+              </a-col>
+            </a-row>
+            <div class="ant-table-wrapper">
+              <a-table
+                row-key="index"
+                size="small"
+                :columns="searchTableColumns"
+                :dataSource="searchData"
+                :pagination="{ pageSize: 5 }"
+              >
+                <span slot="range" slot-scope="text, record">
+                  <trend :flag="record.status === 0 ? 'up' : 'down'">
+                    {{ text }}%
+                  </trend>
+                </span>
+              </a-table>
             </div>
-          </a-card>
-
-          <a-card :loading="loading" title="动态" :bordered="false">
-            <a-list>
-              <a-list-item :key="index" v-for="(item, index) in activities">
-                <a-list-item-meta>
-                  <a-avatar slot="avatar" :src="item.user.avatar"/>
-                  <div slot="title">
-                    <span>{{ item.user.nickname }}</span>&nbsp;
-                    在&nbsp;<a href="#">{{ item.project.name }}</a>&nbsp;
-                    <span>{{ item.project.action }}</span>&nbsp;
-                    <a href="#">{{ item.project.event }}</a>
-                  </div>
-                  <div slot="description">{{ item.time }}</div>
-                </a-list-item-meta>
-              </a-list-item>
-            </a-list>
           </a-card>
         </a-col>
-        <a-col
-          style="padding: 0 12px"
-          :xl="8"
-          :lg="24"
-          :md="24"
-          :sm="24"
-          :xs="24">
-          <a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
-            <div class="item-group">
-              <a>操作一</a>
-              <a>操作二</a>
-              <a>操作三</a>
-              <a>操作四</a>
-              <a>操作五</a>
-              <a>操作六</a>
-              <a-button size="small" type="primary" ghost icon="plus">添加</a-button>
+        <a-col :xl="12" :lg="24" :md="24" :sm="24" :xs="24">
+          <a-card class="antd-pro-pages-dashboard-analysis-salesCard" :loading="loading" :bordered="false" title="销售额类别占比" :style="{ height: '100%' }">
+            <div slot="extra" style="height: inherit;">
+              <!-- style="bottom: 12px;display: inline-block;" -->
+              <span class="dashboard-analysis-iconGroup">
+                <a-dropdown :trigger="['click']" placement="bottomLeft">
+                  <a-icon type="ellipsis" class="ant-dropdown-link" />
+                  <a-menu slot="overlay">
+                    <a-menu-item>
+                      <a href="javascript:;">操作一</a>
+                    </a-menu-item>
+                    <a-menu-item>
+                      <a href="javascript:;">操作二</a>
+                    </a-menu-item>
+                  </a-menu>
+                </a-dropdown>
+              </span>
+              <div class="analysis-salesTypeRadio">
+                <a-radio-group defaultValue="a">
+                  <a-radio-button value="a">全部渠道</a-radio-button>
+                  <a-radio-button value="b">线上</a-radio-button>
+                  <a-radio-button value="c">门店</a-radio-button>
+                </a-radio-group>
+              </div>
             </div>
-          </a-card>
-          <a-card
-            title="XX 指数"
-            style="margin-bottom: 24px"
-            :loading="radarLoading"
-            :bordered="false"
-            :body-style="{ padding: 0 }">
-            <div style="min-height: 400px;">
-              <!-- :scale="scale" :axis1Opts="axis1Opts" :axis2Opts="axis2Opts"  -->
-              <radar :data="radarData"/>
-            </div>
-          </a-card>
-          <a-card :loading="loading" title="团队" :bordered="false">
-            <div class="members">
-              <a-row>
-                <a-col :span="12" v-for="(item, index) in teams" :key="index">
-                  <a>
-                    <a-avatar size="small" :src="item.avatar"/>
-                    <span class="member">{{ item.name }}</span>
-                  </a>
-                </a-col>
-              </a-row>
+            <h4>销售额</h4>
+            <div>
+              <div>
+                <v-chart :force-fit="true" :height="405" :data="pieData" :scale="pieScale">
+                  <v-tooltip :showTitle="false" dataKey="item*percent" />
+                  <v-axis />
+                  <v-legend dataKey="item"/>
+                  <v-pie position="percent" color="item" :vStyle="pieStyle" />
+                  <v-coord type="theta" :radius="0.75" :innerRadius="0.6" />
+                </v-chart>
+              </div>
             </div>
           </a-card>
         </a-col>
@@ -126,68 +220,158 @@
 <script>
 import { timeFix } from '@/utils/util'
 import { mapState } from 'vuex'
-import { PageHeaderWrapper } from '@ant-design-vue/pro-layout'
-import { Radar } from '@/components'
+import moment from 'moment'
+import {
+  ChartCard,
+  MiniArea,
+  MiniBar,
+  MiniProgress,
+  RankList,
+  Bar,
+  Trend,
+  NumberInfo,
+  MiniSmoothArea
+} from '@/components'
+import { baseMixin } from '@/store/app-mixin'
 
-import { getRoleList, getServiceList } from '@/api/manage'
+const barData = []
+const barData2 = []
+for (let i = 0; i < 12; i += 1) {
+  barData.push({
+    x: `${i + 1}月`,
+    y: Math.floor(Math.random() * 1000) + 200
+  })
+  barData2.push({
+    x: `${i + 1}月`,
+    y: Math.floor(Math.random() * 1000) + 200
+  })
+}
+
+const rankList = []
+for (let i = 0; i < 7; i++) {
+  rankList.push({
+    name: '白鹭岛 ' + (i + 1) + ' 号店',
+    total: 1234.56 - i * 100
+  })
+}
+
+const searchUserData = []
+for (let i = 0; i < 7; i++) {
+  searchUserData.push({
+    x: moment().add(i, 'days').format('YYYY-MM-DD'),
+    y: Math.ceil(Math.random() * 10)
+  })
+}
+const searchUserScale = [
+  {
+    dataKey: 'x',
+    alias: '时间'
+  },
+  {
+    dataKey: 'y',
+    alias: '用户数',
+    min: 0,
+    max: 10
+  }]
+
+const searchTableColumns = [
+  {
+    dataIndex: 'index',
+    title: '排名',
+    width: 90
+  },
+  {
+    dataIndex: 'keyword',
+    title: '搜索关键词'
+  },
+  {
+    dataIndex: 'count',
+    title: '用户数'
+  },
+  {
+    dataIndex: 'range',
+    title: '周涨幅',
+    align: 'right',
+    sorter: (a, b) => a.range - b.range,
+    scopedSlots: { customRender: 'range' }
+  }
+]
+const searchData = []
+for (let i = 0; i < 50; i += 1) {
+  searchData.push({
+    index: i + 1,
+    keyword: `搜索关键词-${i}`,
+    count: Math.floor(Math.random() * 1000),
+    range: Math.floor(Math.random() * 100),
+    status: Math.floor((Math.random() * 10) % 2)
+  })
+}
 
 const DataSet = require('@antv/data-set')
 
+const sourceData = [
+  { item: '家用电器', count: 32.2 },
+  { item: '食用酒水', count: 21 },
+  { item: '个护健康', count: 17 },
+  { item: '服饰箱包', count: 13 },
+  { item: '母婴产品', count: 9 },
+  { item: '其他', count: 7.8 }
+]
+
+const pieScale = [{
+  dataKey: 'percent',
+  min: 0,
+  formatter: '.0%'
+}]
+
+const dv = new DataSet.View().source(sourceData)
+dv.transform({
+  type: 'percent',
+  field: 'count',
+  dimension: 'item',
+  as: 'percent'
+})
+const pieData = dv.rows
+
 export default {
   name: 'Workplace',
+  mixins: [baseMixin],
   components: {
-    PageHeaderWrapper,
-    Radar
+    ChartCard,
+    MiniArea,
+    MiniBar,
+    MiniProgress,
+    RankList,
+    Bar,
+    Trend,
+    NumberInfo,
+    MiniSmoothArea
   },
   data () {
     return {
       timeFix: timeFix(),
       avatar: '',
       user: {},
-
       projects: [],
-      loading: true,
-      radarLoading: true,
       activities: [],
       teams: [],
-
-      // data
-      axis1Opts: {
-        dataKey: 'item',
-        line: null,
-        tickLine: null,
-        grid: {
-          lineStyle: {
-            lineDash: null
-          },
-          hideFirstLine: false
-        }
-      },
-      axis2Opts: {
-        dataKey: 'score',
-        line: null,
-        tickLine: null,
-        grid: {
-          type: 'polygon',
-          lineStyle: {
-            lineDash: null
-          }
-        }
-      },
-      scale: [{
-        dataKey: 'score',
-        min: 0,
-        max: 80
-      }],
-      axisData: [
-        { item: '引用', a: 70, b: 30, c: 40 },
-        { item: '口碑', a: 60, b: 70, c: 40 },
-        { item: '产量', a: 50, b: 60, c: 40 },
-        { item: '贡献', a: 40, b: 50, c: 40 },
-        { item: '热度', a: 60, b: 70, c: 40 },
-        { item: '引用', a: 70, b: 50, c: 40 }
-      ],
-      radarData: []
+      loading: true,
+      rankList,
+      // 搜索用户数
+      searchUserData,
+      searchUserScale,
+      searchTableColumns,
+      searchData,
+      barData,
+      barData2,
+      //
+      pieScale,
+      pieData,
+      sourceData,
+      pieStyle: {
+        stroke: '#fff',
+        lineWidth: 1
+      }
     }
   },
   computed: {
@@ -208,182 +392,55 @@ export default {
   created () {
     this.user = this.userInfo
     this.avatar = this.userInfo.avatar
-
-    getRoleList().then(res => {
-      // console.log('workplace -> call getRoleList()', res)
-    })
-
-    getServiceList().then(res => {
-      // console.log('workplace -> call getServiceList()', res)
-    })
-  },
-  mounted () {
-    this.getProjects()
-    this.getActivity()
-    this.getTeams()
-    this.initRadar()
-  },
-  methods: {
-    getProjects () {
-      this.$http.get('/list/search/projects')
-        .then(res => {
-          this.projects = res.result && res.result.data
-          this.loading = false
-        })
-    },
-    getActivity () {
-      this.$http.get('/workplace/activity')
-        .then(res => {
-          this.activities = res.result
-        })
-    },
-    getTeams () {
-      this.$http.get('/workplace/teams')
-        .then(res => {
-          this.teams = res.result
-        })
-    },
-    initRadar () {
-      this.radarLoading = true
-
-      this.$http.get('/workplace/radar')
-        .then(res => {
-          const dv = new DataSet.View().source(res.result)
-          dv.transform({
-            type: 'fold',
-            fields: ['个人', '团队', '部门'],
-            key: 'user',
-            value: 'score'
-          })
-
-          this.radarData = dv.rows
-          this.radarLoading = false
-        })
-    }
+    setTimeout(() => {
+      this.loading = !this.loading
+    }, 1000)
   }
 }
 </script>
 
 <style lang="less" scoped>
   @import "./Workplace.less";
+  .extra-wrapper {
+    line-height: 55px;
+    padding-right: 24px;
 
-  .project-list {
-
-    .card-title {
-      font-size: 0;
-
-      a {
-        color: rgba(0, 0, 0, 0.85);
-        margin-left: 12px;
-        line-height: 24px;
-        height: 24px;
-        display: inline-block;
-        vertical-align: top;
-        font-size: 14px;
-
-        &:hover {
-          color: #1890ff;
-        }
-      }
-    }
-
-    .card-description {
-      color: rgba(0, 0, 0, 0.45);
-      height: 44px;
-      line-height: 22px;
-      overflow: hidden;
-    }
-
-    .project-item {
-      display: flex;
-      margin-top: 8px;
-      overflow: hidden;
-      font-size: 12px;
-      height: 20px;
-      line-height: 20px;
-
-      a {
-        color: rgba(0, 0, 0, 0.45);
-        display: inline-block;
-        flex: 1 1 0;
-
-        &:hover {
-          color: #1890ff;
-        }
-      }
-
-      .datetime {
-        color: rgba(0, 0, 0, 0.25);
-        flex: 0 0 auto;
-        float: right;
-      }
-    }
-
-    .ant-card-meta-description {
-      color: rgba(0, 0, 0, 0.45);
-      height: 44px;
-      line-height: 22px;
-      overflow: hidden;
-    }
-  }
-
-  .item-group {
-    padding: 20px 0 8px 24px;
-    font-size: 0;
-
-    a {
-      color: rgba(0, 0, 0, 0.65);
+    .extra-item {
       display: inline-block;
-      font-size: 14px;
-      margin-bottom: 13px;
-      width: 25%;
-    }
-  }
+      margin-right: 24px;
 
-  .members {
-    a {
-      display: block;
-      margin: 12px 0;
-      line-height: 24px;
-      height: 24px;
-
-      .member {
-        font-size: 14px;
-        color: rgba(0, 0, 0, .65);
-        line-height: 24px;
-        max-width: 100px;
-        vertical-align: top;
-        margin-left: 12px;
-        transition: all 0.3s;
-        display: inline-block;
-      }
-
-      &:hover {
-        span {
-          color: #1890ff;
-        }
+      a {
+        margin-left: 24px;
       }
     }
   }
 
-  .mobile {
+  .antd-pro-pages-dashboard-analysis-twoColLayout {
+    position: relative;
+    display: flex;
+    display: block;
+    flex-flow: row wrap;
+  }
 
-    .project-list {
-
-      .project-card-grid {
-        width: 100%;
-      }
-    }
-
-    .more-info {
-      border: 0;
-      padding-top: 16px;
-      margin: 16px 0 16px;
-    }
-
-    .headerContent .title .welcome-text {
-      display: none;
+  .antd-pro-pages-dashboard-analysis-salesCard {
+    height: calc(100% - 24px);
+    /deep/ .ant-card-head {
+      position: relative;
     }
   }
 
+  .dashboard-analysis-iconGroup {
+    i {
+      margin-left: 16px;
+      color: rgba(0,0,0,.45);
+      cursor: pointer;
+      transition: color .32s;
+      color: black;
+    }
+  }
+  .analysis-salesTypeRadio {
+    position: absolute;
+    right: 54px;
+    bottom: 12px;
+  }
 </style>
diff --git a/src/views/list/StandardList.vue b/src/views/list/StandardList.vue
new file mode 100644
index 0000000..b7a484d
--- /dev/null
+++ b/src/views/list/StandardList.vue
@@ -0,0 +1,186 @@
+<template>
+  <div>
+    <a-card :bordered="false">
+      <a-row>
+        <a-col :sm="8" :xs="24">
+          <head-info title="我的待办" content="8个任务" :bordered="true"/>
+        </a-col>
+        <a-col :sm="8" :xs="24">
+          <head-info title="本周任务平均处理时间" content="32分钟" :bordered="true"/>
+        </a-col>
+        <a-col :sm="8" :xs="24">
+          <head-info title="本周完成任务数" content="24个"/>
+        </a-col>
+      </a-row>
+    </a-card>
+
+    <a-card
+      style="margin-top: 24px"
+      :bordered="false"
+      title="标准列表">
+
+      <div slot="extra">
+        <a-radio-group v-model="status">
+          <a-radio-button value="all">全部</a-radio-button>
+          <a-radio-button value="processing">进行中</a-radio-button>
+          <a-radio-button value="waiting">等待中</a-radio-button>
+        </a-radio-group>
+        <a-input-search style="margin-left: 16px; width: 272px;" />
+      </div>
+
+      <div class="operate">
+        <a-button type="dashed" style="width: 100%" icon="plus" @click="$refs.taskForm.add()">添加</a-button>
+      </div>
+
+      <a-list size="large" :pagination="{showSizeChanger: true, showQuickJumper: true, pageSize: 5, total: 50}">
+        <a-list-item :key="index" v-for="(item, index) in data">
+          <a-list-item-meta :description="item.description">
+            <a-avatar slot="avatar" size="large" shape="square" :src="item.avatar"/>
+            <a slot="title">{{ item.title }}</a>
+          </a-list-item-meta>
+          <div slot="actions">
+            <a @click="edit(item)">编辑</a>
+          </div>
+          <div slot="actions">
+            <a-dropdown>
+              <a-menu slot="overlay">
+                <a-menu-item><a>编辑</a></a-menu-item>
+                <a-menu-item><a>删除</a></a-menu-item>
+              </a-menu>
+              <a>更多<a-icon type="down"/></a>
+            </a-dropdown>
+          </div>
+          <div class="list-content">
+            <div class="list-content-item">
+              <span>Owner</span>
+              <p>{{ item.owner }}</p>
+            </div>
+            <div class="list-content-item">
+              <span>开始时间</span>
+              <p>{{ item.startAt }}</p>
+            </div>
+            <div class="list-content-item">
+              <a-progress :percent="item.progress.value" :status="!item.progress.status ? null : item.progress.status" style="width: 180px" />
+            </div>
+          </div>
+        </a-list-item>
+      </a-list>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import HeadInfo from '@/components/tools/HeadInfo'
+import TaskForm from './modules/TaskForm'
+
+const data = []
+data.push({
+  title: 'Alipay',
+  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/WdGqmHpayyMjiEhcKoVE.png',
+  description: '那是一种内在的东西， 他们到达不了，也无法触及的',
+  owner: '付晓晓',
+  startAt: '2018-07-26 22:44',
+  progress: {
+    value: 90
+  }
+})
+data.push({
+  title: 'Angular',
+  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/zOsKZmFRdUtvpqCImOVY.png',
+  description: '希望是一个好东西，也许是最好的，好东西是不会消亡的',
+  owner: '曲丽丽',
+  startAt: '2018-07-26 22:44',
+  progress: {
+    value: 54
+  }
+})
+data.push({
+  title: 'Ant Design',
+  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/dURIMkkrRFpPgTuzkwnB.png',
+  description: '生命就像一盒巧克力，结果往往出人意料',
+  owner: '林东东',
+  startAt: '2018-07-26 22:44',
+  progress: {
+    value: 66
+  }
+})
+data.push({
+  title: 'Ant Design Pro',
+  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/sfjbOqnsXXJgNCjCzDBL.png',
+  description: '城镇中有那么多的酒馆，她却偏偏走进了我的酒馆',
+  owner: '周星星',
+  startAt: '2018-07-26 22:44',
+  progress: {
+    value: 30
+  }
+})
+data.push({
+  title: 'Bootstrap',
+  avatar: 'https://gw.alipayobjects.com/zos/rmsportal/siCrBXXhmvTQGWPNLBow.png',
+  description: '那时候我只会想自己想要什么，从不想自己拥有什么',
+  owner: '吴加好',
+  startAt: '2018-07-26 22:44',
+  progress: {
+    status: 'exception',
+    value: 100
+  }
+})
+
+export default {
+  name: 'StandardList',
+  components: {
+    HeadInfo,
+    TaskForm
+  },
+  data () {
+    return {
+      data,
+      status: 'all'
+    }
+  },
+  methods: {
+    edit (record) {
+      console.log('record', record)
+      // mockdata
+      record.taskName = '测试'
+      // mockend
+      this.$dialog(TaskForm,
+        // component props
+        {
+          record
+        },
+        // modal props
+        {
+          title: '操作',
+          width: 700,
+          centered: true,
+          maskClosable: false
+        })
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+    .ant-avatar-lg {
+        width: 48px;
+        height: 48px;
+        line-height: 48px;
+    }
+
+    .list-content-item {
+        color: rgba(0, 0, 0, .45);
+        display: inline-block;
+        vertical-align: middle;
+        font-size: 14px;
+        margin-left: 40px;
+        span {
+            line-height: 20px;
+        }
+        p {
+            margin-top: 4px;
+            margin-bottom: 0;
+            line-height: 22px;
+        }
+    }
+</style>
diff --git a/src/views/list/table/Edit.vue b/src/views/list/table/Edit.vue
index 74b1695..dca09e8 100644
--- a/src/views/list/table/Edit.vue
+++ b/src/views/list/table/Edit.vue
@@ -1,7 +1,6 @@
 <template>
   <div>
     <a-form :form="form" @submit="handleSubmit">
-
       <a-form-item
         :labelCol="labelCol"
         :wrapperCol="wrapperCol"
diff --git a/src/views/list/table/List.vue b/src/views/list/table/List.vue
index 8e5da0b..e7bed7e 100644
--- a/src/views/list/table/List.vue
+++ b/src/views/list/table/List.vue
@@ -67,7 +67,6 @@
       <a-dropdown v-action:edit v-if="selectedRowKeys.length > 0">
         <a-menu slot="overlay">
           <a-menu-item key="1"><a-icon type="delete" />删除</a-menu-item>
-          <!-- lock | unlock -->
           <a-menu-item key="2"><a-icon type="lock" />锁定</a-menu-item>
         </a-menu>
         <a-button style="margin-left: 8px">
diff --git a/src/views/profile/basic/index.vue b/src/views/profile/basic/index.vue
index efaf623..b4cd8c1 100644
--- a/src/views/profile/basic/index.vue
+++ b/src/views/profile/basic/index.vue
@@ -9,7 +9,7 @@
       </a-descriptions>
       <a-divider style="margin-bottom: 32px"/>
       <a-descriptions title="用户信息">
-        <a-descriptions-item label="用户姓名">付小小</a-descriptions-item>
+        <a-descriptions-item label="用户姓名">测试用户</a-descriptions-item>
         <a-descriptions-item label="联系电话">18100000000</a-descriptions-item>
         <a-descriptions-item label="常用快递">菜鸟仓储</a-descriptions-item>
         <a-descriptions-item label="取货地址">浙江省杭州市西湖区万塘路18号</a-descriptions-item>
diff --git a/src/views/role/RoleList.vue b/src/views/role/RoleList.vue
index d3716ad..024aa84 100644
--- a/src/views/role/RoleList.vue
+++ b/src/views/role/RoleList.vue
@@ -54,7 +54,6 @@
                 </a-col>
               </a-row>
             </a-form-item>
-
           </a-form>
         </div>
       </a-col>
diff --git a/src/views/security/maps/icons.js b/src/views/security/maps/icons.js
new file mode 100644
index 0000000..6699a56
--- /dev/null
+++ b/src/views/security/maps/icons.js
@@ -0,0 +1,17 @@
+export const filledIcons = [{
+  type: 'home'
+}, {
+  type: 'account-book'
+}, {
+  type: 'alert'
+}, {
+  type: 'api'
+}, {
+  type: 'appstore'
+}, {
+  type: 'bell'
+}, {
+  type: 'cloud'
+}, {
+  type: 'edit'
+}]
diff --git a/src/views/security/maps/map.js b/src/views/security/maps/map.js
new file mode 100644
index 0000000..5c06b43
--- /dev/null
+++ b/src/views/security/maps/map.js
@@ -0,0 +1,6 @@
+export const typeMap = {
+  'CORPORATION': '公司',
+  'MALL': '门店',
+  'STORE': '店长',
+  'STAFF': '店员'
+}
diff --git a/src/views/security/modules/CreateForm.vue b/src/views/security/modules/CreateForm.vue
new file mode 100644
index 0000000..f5e76a5
--- /dev/null
+++ b/src/views/security/modules/CreateForm.vue
@@ -0,0 +1,83 @@
+<template>
+  <a-modal v-model="visible" :title="modalTitle" @ok="onSubmit" @cancel="onCancel" :width="1020">
+    <template slot="footer">
+      <a-button key="cancel" @click="onCancel">取消</a-button>
+      <a-button key="submit" type="primary" @click="onSubmit">保存</a-button>
+    </template>
+    <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
+      <a-form-model-item ref="name" label="名称" prop="name">
+        <a-input v-model="form.name"/>
+      </a-form-model-item>
+    </a-form-model>
+  </a-modal>
+</template>
+
+<script>
+import { userGet, userAdd, userUpdate } from '@/api/security/user'
+
+export default {
+  props: {
+    id: {
+      type: String,
+      default: undefined
+    }
+  },
+  data () {
+    return {
+      modalTitle: '新增',
+      visible: false,
+      labelCol: { span: 4 },
+      wrapperCol: { span: 16 },
+      form: {
+        name: ''
+      },
+      rules: {
+        name: [
+          { required: true, message: '请输入名称', trigger: 'blur' },
+          { min: 2, message: '长度不能小于2', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  methods: {
+    add () {
+      this.modalTitle = '新增'
+      this.visible = true
+    },
+    edit (obj) {
+      this.modalTitle = '修改'
+      this.visible = true
+      userGet({ id: obj.id }).then(data => {
+        const form = data.data
+        this.form = form
+      })
+    },
+    onSubmit (e) {
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          if (this.form.id) {
+            userUpdate(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            })
+          } else {
+            userAdd(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            })
+          }
+        } else {
+          return false
+        }
+      })
+    },
+    onCancel () {
+      this.$refs.ruleForm.resetFields()
+      this.visible = false
+    },
+    onReset () {
+      this.$refs.ruleForm.resetFields()
+    }
+  }
+}
+</script>
diff --git a/src/views/security/modules/UserDetail.vue b/src/views/security/modules/UserDetail.vue
new file mode 100644
index 0000000..35c351b
--- /dev/null
+++ b/src/views/security/modules/UserDetail.vue
@@ -0,0 +1,48 @@
+<template>
+  <a-drawer
+    title="品牌详情"
+    width="640"
+    placement="right"
+    :visible="visible"
+    @close="onClose">
+    <a-descriptions :column="{ sm: 2, xs: 1 }">
+      <a-descriptions-item label="名称">{{ model.name }}</a-descriptions-item>
+      <a-descriptions-item label="编码">{{ model.code }}</a-descriptions-item>
+      <a-descriptions-item label="创建时间">{{ model.createdAt | moment('YYYY-MM-DD') }}</a-descriptions-item>
+      <a-descriptions-item label="上次修改时间">{{ model.updatedAt }}</a-descriptions-item>
+      <a-descriptions-item label="状态">{{ model.status | statusFilter }}</a-descriptions-item>
+      <a-descriptions-item label="排序">{{ model.sortOrder }}</a-descriptions-item>
+    </a-descriptions>
+  </a-drawer>
+</template>
+
+<script>
+import { userGet } from '@/api/security/user'
+import { statusMap } from '@/views/status/statusMap'
+
+export default {
+  data () {
+    return {
+      visible: false,
+      model: {}
+    }
+  },
+  filters: {
+    statusFilter (status) {
+      return statusMap[status]
+    }
+  },
+  methods: {
+    show (id) {
+      this.visible = true
+      userGet({ id: id }).then(data => {
+        this.model = data.data
+      })
+    },
+    onClose () {
+      this.model = {}
+      this.visible = false
+    }
+  }
+}
+</script>
diff --git a/src/views/security/resource/FunctionResource.vue b/src/views/security/resource/FunctionResource.vue
new file mode 100644
index 0000000..ecbfc52
--- /dev/null
+++ b/src/views/security/resource/FunctionResource.vue
@@ -0,0 +1,138 @@
+<template>
+  <page-header-wrapper :title="false">
+    <a-row :gutter="24">
+      <a-col :span="9">
+        <a-card :bordered="false" title="功能">
+          <ul class="ant-tree ant-tree-show-line">
+            <li v-for="item in functionTreeData" :key="item.id" @click="handleSelect(item.id)" >
+              <span class="ant-tree-switcher ant-tree-switcher-noop">
+                <a-icon type="file" />
+              </span>
+              <span class="ant-tree-node-content-wrapper" :class="{ 'ant-tree-node-selected' : item.id == functionId }">
+                <span class="ant-tree-title">{{ item.name }}</span>
+              </span>
+            </li>
+          </ul>
+        </a-card>
+      </a-col>
+      <a-col :span="15">
+        <a-card :bordered="false" title="资源">
+          <a-tree
+            show-line
+            checkable
+            v-model="checkedKeys"
+            :tree-data="resourceTreeData"
+            :replace-fields="replaceFields"
+            :disabled="disabled"
+            @check="onCheck" >
+          </a-tree>
+        </a-card>
+      </a-col>
+    </a-row>
+  </page-header-wrapper>
+</template>
+
+<script>
+import { functionPage } from '@/api/security/function'
+import { resourceByFunctionId } from '@/api/security/resource'
+import { functionResourceAdd, functionResourceDelete } from '@/api/security/functionResource'
+
+export default {
+  data () {
+    return {
+      replaceFields: {
+        title: 'name',
+        key: 'id'
+      },
+      functionTreeData: [],
+      resourceTreeData: [],
+      checkedKeys: [],
+      functionId: '',
+      disabled: false
+    }
+  },
+  created () {
+    this.loadFunctions()
+  },
+  methods: {
+    loadFunctions () {
+      functionPage({
+        pageSize: 50,
+        status: 1
+      }).then(res => {
+        this.functionTreeData = res.data.entities
+      })
+    },
+    loadResource (functionId) {
+      resourceByFunctionId({
+        functionId
+      }).then(res => {
+        this.resourceTreeData = res.data
+        const result = this.initCheckedKeys(res.data, [])
+        this.checkedKeys = result
+      })
+    },
+    initCheckedKeys (data, result) {
+      for (let i = 0, length = data.length; i < length; i++) {
+        const item = data[i]
+        // 只获取checked为true的子节点,父节点自动会根据子节点勾选状态判定是全选还是半选
+        if (item.checked && item.children.length === 0) {
+          result.push(item.id)
+          continue
+        } else if (item.children.length > 0) {
+          this.initCheckedKeys(item.children, result)
+        }
+      }
+      return result
+    },
+    handleSelect (functionId) {
+      if (this.functionId === functionId || this.disabled) {
+        return false
+      }
+      this.functionId = functionId
+      this.loadResource(functionId)
+    },
+    onCheck (checkedKeys, info) {
+      if (this.disabled) {
+        return false
+      }
+      this.checkedKeys = checkedKeys
+      const id = info.node.dataRef.id
+      const checked = info.checked
+      if (checked) {
+        this.addResource(id)
+      } else {
+        this.deleteResource(id)
+      }
+    },
+    addResource (id) {
+      const { functionId } = this
+      functionResourceAdd({
+        functionId,
+        resourceId: id
+      }).then(res => {
+      }).finally(() => {
+        this.disabled = false
+      })
+    },
+    deleteResource (id) {
+      const { functionId } = this
+      functionResourceDelete({
+        functionId,
+        resourceId: id
+      }).then(res => {
+      }).finally(() => {
+        this.disabled = false
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+  .ant-tree{
+    li {
+      cursor: pointer;
+    }
+  }
+</style>
diff --git a/src/views/security/resource/ResourceTree.vue b/src/views/security/resource/ResourceTree.vue
new file mode 100644
index 0000000..8087737
--- /dev/null
+++ b/src/views/security/resource/ResourceTree.vue
@@ -0,0 +1,129 @@
+<template>
+  <page-header-wrapper :title="false">
+    <a-row :gutter="16">
+      <a-col :span="6">
+        <a-card :bordered="false">
+          <a-tree :default-expand-all="true" :tree-data="treeData" :replace-fields="replaceFields" @select="handleSelect" show-icon>
+            <template slot-scope="text" slot="icon">
+              <a-icon :type="text.icon"/>
+            </template>
+          </a-tree>
+        </a-card>
+      </a-col>
+      <a-col :span="18">
+        <a-card :bordered="false">
+          <a-row :gutter="8">
+            <a-col :span="14" :offset="4">
+              <a-button-group>
+                <a-button @click="handleRootCreate" type="primary"><a-icon type="plus" />新增根菜单</a-button>
+                <a-button @click="handleCreate" :disabled="!checkedNode"><a-icon type="plus" />新增下级菜单</a-button>
+                <a-button @click="handleDelete" :disabled="!checkedNode"><a-icon type="close" />删除当前菜单</a-button>
+                <a-button><a-icon type="redo" />刷新缓存</a-button>
+              </a-button-group>
+            </a-col>
+          </a-row>
+          <create-form ref="modal" @ok="handleOk"></create-form>
+        </a-card>
+      </a-col>
+    </a-row>
+  </page-header-wrapper>
+</template>
+
+<script>
+import CreateForm from './modules/CreateForm'
+import { resourceDelete, resourceAll } from '@/api/security/resource'
+import { Tree } from 'ant-design-vue'
+import { listToTree } from '@/utils/util'
+const rootParentId = '-1'
+
+export default {
+  name: 'ResourceTree',
+  components: {
+    [Tree.name]: Tree,
+    CreateForm
+  },
+  data () {
+    return {
+      replaceFields: {
+        title: 'name',
+        key: 'id',
+        icon: 'icon'
+      },
+      treeData: [],
+      checkedNode: undefined
+    }
+  },
+  created () {
+    this.onLoadTree()
+  },
+  methods: {
+    // 加载树节点
+    onLoadTree () {
+      this.checkedNode = undefined
+      resourceAll().then(res => {
+        this.treeData = listToTree(res.data, [], rootParentId)
+      })
+    },
+    // 选择
+    handleSelect (selectedKeys, info) {
+      const node = info.node
+      this.checkedNode = node
+      this.$refs.modal.edit(node.dataRef)
+    },
+    // 增根节点
+    handleRootCreate () {
+      this.checkedNode = undefined
+      this.$refs.modal.add(rootParentId)
+    },
+    // 增子节点
+    handleCreate () {
+      const { checkedNode } = this
+      if (!checkedNode) {
+        this.$message.warning('请选择节点')
+        return
+      }
+      this.$refs.modal.add(checkedNode.dataRef.id)
+    },
+    // 删
+    handleDelete () {
+      const { checkedNode } = this
+      if (!checkedNode) {
+        this.$message.warning('请选择节点')
+        return false
+      }
+      if (checkedNode.dataRef.children && checkedNode.dataRef.children.length > 0) {
+        this.$message.warning('该节点有子节点，请先删除子节点')
+        return false
+      }
+      // 删除节点判断是删除新增的子节点还是在编辑态的节点
+      const parentId = this.$refs.modal.getParentId()
+      const id = checkedNode.dataRef.id
+      if (parentId === id) {
+       this.$refs.modal.onReset(true)
+      } else {
+        const _this = this
+        this.$confirm({
+          title: '提示',
+          content: '确认删除该节点？',
+          onOk () {
+            resourceDelete({ id: id })
+              .then(res => {
+                _this.$message.success('删除成功！')
+                _this.onLoadTree()
+              })
+          }
+        })
+      }
+    },
+    handleOk () {
+      this.onLoadTree()
+    }
+  }
+}
+</script>
+
+<style lang="less">
+.resource-form{
+  margin-top: 20px;
+}
+</style>
diff --git a/src/views/security/resource/modules/CreateForm.vue b/src/views/security/resource/modules/CreateForm.vue
new file mode 100644
index 0000000..63d52fe
--- /dev/null
+++ b/src/views/security/resource/modules/CreateForm.vue
@@ -0,0 +1,151 @@
+<template>
+  <a-form-model
+    ref="ruleForm"
+    :model="form"
+    :rules="rules"
+    :label-col="labelCol"
+    :wrapper-col="wrapperCol"
+    class="resource-form">
+    <a-form-model-item ref="name" label="名称" prop="name">
+      <a-input v-model="form.name" />
+    </a-form-model-item>
+    <a-form-model-item ref="code" label="编码" prop="code">
+      <a-input v-model="form.code" />
+    </a-form-model-item>
+    <a-form-model-item ref="description" label="组件名称" prop="description">
+      <a-input v-model="form.description" />
+    </a-form-model-item>
+    <a-form-model-item ref="url" label="URL" prop="url">
+      <a-input v-model="form.url" />
+    </a-form-model-item>
+    <a-form-model-item ref="actions" label="权限" prop="actions">
+      <a-select v-model="form.actions" mode="multiple">
+        <a-select-option v-for="i in permissions" :key="i.key">{{ i.label }}</a-select-option>
+      </a-select>
+    </a-form-model-item>
+    <a-form-model-item ref="icon" label="图标" prop="icon">
+      <icon-selector-view ref="iconModel" @ok="handleIcon"></icon-selector-view>
+      <a-input v-model="form.icon" @click="$refs.iconModel.show()">
+        <a-icon v-if="form.icon" slot="prefix" :type="form.icon" />
+      </a-input>
+    </a-form-model-item>
+    <a-form-model-item ref="enabled" label="状态" prop="enabled">
+      <a-radio-group v-model="form.enabled">
+        <a-radio :value="true">启用</a-radio>
+        <a-radio :value="false">停用</a-radio>
+      </a-radio-group>
+    </a-form-model-item>
+    <a-form-model-item ref="sortOrder" label="排序" prop="sortOrder">
+      <a-input v-model="form.sortOrder" />
+    </a-form-model-item>
+    <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }">
+      <a-button type="primary" @click="onSubmit" :loading="loading">保存</a-button>
+      <a-button @click="onCancel">取消</a-button>
+    </a-form-model-item>
+  </a-form-model>
+</template>
+
+<script>
+import { resourceAdd, resourceUpdate } from '@/api/security/resource'
+import IconSelectorView from '@/components/IconSelector/IconSelectorView'
+import { PERMISSION_ENUM } from '@/utils/helper/permission'
+
+export default {
+  props: {
+    id: {
+      type: String,
+      default: undefined
+    }
+  },
+  components: {
+    IconSelectorView
+  },
+  data () {
+    return {
+      loading: false,
+      labelCol: { span: 4 },
+      wrapperCol: { span: 14 },
+      permissions: PERMISSION_ENUM,
+      form: {
+        parentId: '',
+        name: '',
+        code: '',
+        url: '',
+        actions: [],
+        icon: '',
+        enabled: true,
+        sortOrder: 0,
+        description: ''
+      },
+      rules: {
+        parentId: [{ required: true, message: '请输入父级' }],
+        name: [{ required: true, message: '请输入名称', trigger: 'blur' }, { min: 2, message: '长度不能小于2', trigger: 'blur' }],
+        code: [{ required: true, message: '请输入编码', trigger: 'blur' }, { min: 2, message: '长度不能小于2', trigger: 'blur' }],
+        url: [{ required: true, message: '请输入正确的URL', trigger: 'blur' }],
+        sortOrder: [{ required: true, message: '请输入排序', trigger: 'blur' }],
+        description: [{ required: true, message: '请输入组件名称', trigger: 'blur' }]
+      }
+    }
+  },
+  methods: {
+    add (id) {
+      if (!this.loading && id) {
+        this.$refs.ruleForm.resetFields()
+        this.form.parentId = id
+        this.form.id = undefined
+      }
+    },
+    edit (obj) {
+      this.form = Object.assign({}, obj)
+    },
+    onSubmit (e) {
+      if (this.loading) {
+        return false
+      }
+      this.loading = false
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          if (this.form.id) {
+            resourceUpdate(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            }, () => {
+              this.loading = false
+            })
+          } else {
+            resourceAdd(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            }, () => {
+              this.loading = false
+            })
+          }
+        } else {
+          this.loading = false
+          return false
+        }
+      })
+    },
+    onCancel () {
+      this.$refs.ruleForm.resetFields()
+      delete this.form.id
+      this.loading = false
+    },
+    onReset (all) {
+      if (all) {
+        this.form.parentId = undefined
+      }
+      this.$refs.ruleForm.resetFields()
+    },
+    handleIcon (item) {
+      this.form.icon = item
+    },
+		getParentId () {
+			return this.form.parentId
+		}
+  }
+}
+</script>
+
+<style>
+</style>
diff --git a/src/views/security/role/RoleList.vue b/src/views/security/role/RoleList.vue
new file mode 100644
index 0000000..f239caf
--- /dev/null
+++ b/src/views/security/role/RoleList.vue
@@ -0,0 +1,198 @@
+<template>
+  <page-header-wrapper :title="false">
+    <a-card :bordered="false">
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline">
+          <a-row :gutter="48">
+            <a-col :md="6" :sm="24">
+              <a-form-item label="名称">
+                <a-input v-model="queryParam.name" placeholder="请输入名称" @pressEnter="handleRefresh"/>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="机构">
+                <a-tree-select
+                  v-model="queryParam.orgId"
+                  style="width: 100%"
+                  :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+                  :tree-data="orgData"
+                  placeholder="请选择机构"
+                  tree-default-expand-all
+                  :replaceFields="{
+                    children:'children',
+                    title:'name',
+                    key:'id',
+                    value:'id'
+                  }"
+                >
+                </a-tree-select></a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="状态">
+                <a-select v-model="queryParam.status" placeholder="请选择" default-value="0" @pressEnter="handleRefresh">
+                  <a-select-option value="">全部</a-select-option>
+                  <a-select-option v-for="(item, index) in statusMap" :key="index" :value="index">{{ item }}</a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-button type="primary" @click="handleRefresh">查询</a-button>
+              <a-button @click="() => {queryParam = {}, handleRefresh()}">重置</a-button>
+            </a-col>
+            <a-col :md="6" :sm="24" align="right">
+              <a-button type="primary" @click="handleCreate">新增</a-button>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <s-table
+        ref="table"
+        size="default"
+        rowKey="id"
+        :columns="columns"
+        :data="loadData"
+      >
+        <template slot="time" slot-scope="text, record">{{ record.createdAt | moment }}</template>
+        <template slot="tbStatus" slot-scope="text, record">
+          <a-switch checked-children="启用" un-checked-children="停用" v-model="record.status" @change="updateStatus(record.id, record.status)"/>
+        </template>
+        <template slot="action" slot-scope="text, record">
+          <a href="javascript:;" @click="handleEdit(record)">修改</a>
+          <a-divider type="vertical" />
+          <a-popconfirm title="是否删除?" @confirm="() => handleDelete(record)">
+            <a href="javascript:;">删除</a>
+          </a-popconfirm>
+          <a-divider type="vertical" />
+          <a href="javascript:;" @click="handleDetail(record.id)">详情</a>
+        </template>
+      </s-table>
+      <create-form ref="modal" @ok="handleOk" />
+      <role-detail ref="detail"></role-detail>
+    </a-card>
+  </page-header-wrapper>
+</template>
+
+<script>
+import { rolePage, roleUpdateStatus, roleDelete } from '@/api/security/role'
+import { STable } from '@/components'
+import CreateForm from './modules/CreateForm'
+import RoleDetail from './modules/RoleDetail'
+import { statusMap } from '@/views/status/statusMap'
+import { orgTreeGet } from '@/api/bms/org'
+
+export default {
+  name: 'RoleList',
+  components: {
+    STable,
+    CreateForm,
+    RoleDetail
+  },
+  data () {
+    return {
+      statusMap: statusMap,
+      orgData: [],
+      queryParam: { name: '', status: '', orgId: '' },
+      selectedRowKeys: [], // 选中行的key 出选择框时需要配置
+      selectedRows: [], // 选中行的数据
+      columns: [
+        { title: '机构', width: 30, dataIndex: 'orgName', key: 'orgName' },
+        { title: '名称', width: 30, dataIndex: 'name', key: 'name' },
+        { title: '编码', width: 30, dataIndex: 'code', key: 'code' },
+        {
+          title: '创建时间',
+          width: 10,
+          key: 'createdAt',
+          align: 'center',
+          scopedSlots: { customRender: 'time' }
+        },
+        {
+          title: '状态',
+          width: 10,
+          key: 'tbStatus',
+          align: 'center',
+          scopedSlots: { customRender: 'tbStatus' }
+        },
+        {
+          title: '操作',
+          key: 'operation',
+          width: 10,
+          align: 'right',
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+      loadData: parameter => {
+        return rolePage(Object.assign(parameter, this.queryParam))
+          .then(res => {
+            const data = res.data
+            data.entities.forEach((item) => {
+              item.status = item.status === 1
+            })
+            return data
+          })
+      }
+    }
+  },
+  computed: {
+    rowSelection () {
+      return {
+        selectedRowKeys: this.selectedRowKeys,
+        onChange: this.onSelectChange
+      }
+    }
+  },
+  methods: {
+    // 修改状态
+    updateStatus (id, status) {
+      roleUpdateStatus({
+        id: id,
+        status: status ? 1 : 0
+      }).then(res => {
+        this.$notification.success({
+          message: '操作成功',
+          duration: 1,
+          description: status ? '角色已启用' : '角色已停用'
+        })
+        this.$refs.table.refresh()
+      })
+    },
+    // 增
+    handleCreate () {
+      this.$refs.modal.add()
+    },
+    // 改
+    handleEdit (record) {
+      this.$refs.modal.edit(record)
+    },
+    // 删
+    handleDelete (record) {
+      roleDelete({ id: record.id }).then(() => {
+        this.$refs.table.refresh()
+      })
+    },
+    // 编辑后回调
+    handleOk () {
+      this.$refs.table.refresh()
+    },
+    // 详情
+    handleDetail (id) {
+      this.$refs.detail.show(id)
+    },
+    handleRefresh () {
+      this.$refs.table.refresh(true)
+    },
+    // 选择行
+    onSelectChange (selectedRowKeys, selectedRows) {
+      this.selectedRowKeys = selectedRowKeys
+      this.selectedRows = selectedRows
+    },
+    loadOrg () {
+      orgTreeGet({ treeLevel: 'MALL' }).then(data => {
+        this.orgData = data.data
+      })
+    }
+  },
+  mounted () {
+    this.loadOrg()
+  }
+}
+</script>
diff --git a/src/views/security/role/RoleResource.vue b/src/views/security/role/RoleResource.vue
new file mode 100644
index 0000000..5056d46
--- /dev/null
+++ b/src/views/security/role/RoleResource.vue
@@ -0,0 +1,138 @@
+<template>
+  <page-header-wrapper :title="false">
+    <a-row :gutter="24">
+      <a-col :span="9">
+        <a-card :bordered="false" title="角色">
+          <ul class="ant-tree ant-tree-show-line">
+            <li v-for="item in roleTreeData" :key="item.id" @click="handleSelect(item.id)" >
+              <span class="ant-tree-switcher ant-tree-switcher-noop">
+                <a-icon type="file" />
+              </span>
+              <span class="ant-tree-node-content-wrapper" :class="{ 'ant-tree-node-selected' : item.id == roleId }">
+                <span class="ant-tree-title">{{ item.name }}</span>
+              </span>
+            </li>
+          </ul>
+        </a-card>
+      </a-col>
+      <a-col :span="15">
+        <a-card :bordered="false" title="资源">
+          <a-tree
+            show-line
+            checkable
+            v-model="checkedKeys"
+            :tree-data="resourceTreeData"
+            :replace-fields="replaceFields"
+            :disabled="disabled"
+            @check="onCheck" >
+          </a-tree>
+        </a-card>
+      </a-col>
+    </a-row>
+  </page-header-wrapper>
+</template>
+
+<script>
+import { rolePage } from '@/api/security/role'
+import { resourceByRoleId } from '@/api/security/resource'
+import { roleResourceAdd, roleResourceDelete } from '@/api/security/roleResource'
+
+export default {
+  data () {
+    return {
+      replaceFields: {
+        title: 'name',
+        key: 'id'
+      },
+      roleTreeData: [],
+      resourceTreeData: [],
+      checkedKeys: [],
+      roleId: '',
+      disabled: false
+    }
+  },
+  created () {
+    this.loadRoles()
+  },
+  methods: {
+    loadRoles () {
+      rolePage({
+        pageSize: 50,
+        status: 1
+      }).then(res => {
+        this.roleTreeData = res.data.entities
+      })
+    },
+    loadResource (roleId) {
+      resourceByRoleId({
+        roleId
+      }).then(res => {
+        this.resourceTreeData = res.data
+        const result = this.initCheckedKeys(res.data, [])
+        this.checkedKeys = result
+      })
+    },
+    initCheckedKeys (data, result) {
+      for (let i = 0, length = data.length; i < length; i++) {
+        const item = data[i]
+        // 只获取checked为true的子节点,父节点自动会根据子节点勾选状态判定是全选还是半选
+        if (item.checked && item.children.length === 0) {
+          result.push(item.id)
+          continue
+        } else if (item.children.length > 0) {
+          this.initCheckedKeys(item.children, result)
+        }
+      }
+      return result
+    },
+    handleSelect (roleId) {
+      if (this.roleId === roleId || this.disabled) {
+        return false
+      }
+      this.roleId = roleId
+      this.loadResource(roleId)
+    },
+    onCheck (checkedKeys, info) {
+      if (this.disabled) {
+        return false
+      }
+      this.checkedKeys = checkedKeys
+      const id = info.node.dataRef.id
+      const checked = info.checked
+      if (checked) {
+        this.addResource(id)
+      } else {
+        this.deleteResource(id)
+      }
+    },
+    addResource (id) {
+      const { roleId } = this
+      roleResourceAdd({
+        roleId,
+        resourceId: id
+      }).then(res => {
+      }).finally(() => {
+        this.disabled = false
+      })
+    },
+    deleteResource (id) {
+      const { roleId } = this
+      roleResourceDelete({
+        roleId,
+        resourceId: id
+      }).then(res => {
+      }).finally(() => {
+        this.disabled = false
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+  .ant-tree{
+    li {
+      cursor: pointer;
+    }
+  }
+</style>
diff --git a/src/views/security/role/modules/CreateForm.vue b/src/views/security/role/modules/CreateForm.vue
new file mode 100644
index 0000000..89aed8f
--- /dev/null
+++ b/src/views/security/role/modules/CreateForm.vue
@@ -0,0 +1,132 @@
+<template>
+  <a-drawer :visible="visible" :title="modalTitle" :width="720" @close="onCancel">
+    <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-item label="机构" ref="orgId" prop="orgId">
+            <a-tree-select
+              v-model="form.orgId"
+              style="width: 100%"
+              :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+              :tree-data="orgData"
+              placeholder="请选择机构"
+              tree-default-expand-all
+              @select="onSelectOrg"
+              :replaceFields="{
+                children:'children',
+                title:'name',
+                key:'id',
+                value:'id'
+              }"
+            >
+            </a-tree-select></a-form-item>
+        </a-col>
+      </a-row>
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-model-item ref="name" label="名称" prop="name"><a-input v-model="form.name" /></a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item ref="code" label="编码" prop="code"><a-input v-model="form.code" /></a-form-model-item>
+        </a-col>
+      </a-row>
+      <a-row :gutter="16">
+        <a-col>
+          <a-form-model-item ref="description" label="描述" prop="description" :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }"><a-input v-model="form.description" /></a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-form-model>
+    <div class="draw-button-container align-center">
+      <a-button @click="onCancel">取消</a-button>
+      <a-button type="primary" @click="onSubmit">保存</a-button>
+    </div>
+
+  </a-drawer>
+</template>
+
+<script>
+import { roleGet, roleAdd, roleUpdate } from '@/api/security/role'
+import { orgTreeGet } from '@/api/bms/org'
+
+export default {
+  props: {
+    id: {
+      type: String,
+      default: undefined
+    }
+  },
+  data () {
+    return {
+      modalTitle: '新增',
+      visible: false,
+      labelCol: { span: 6 },
+      wrapperCol: { span: 18 },
+      form: {
+        name: '',
+        code: '',
+        description: '',
+        orgId: undefined,
+        orgName: ''
+      },
+      rules: {
+        name: [{ required: true, message: '请输入名称' }],
+        orgId: [{ required: true, message: '请选择机构' }]
+      },
+      orgData: []
+    }
+  },
+  methods: {
+    add () {
+      this.form.id = undefined
+      this.modalTitle = '新增'
+      this.visible = true
+    },
+    edit (obj) {
+      this.modalTitle = '修改'
+      this.visible = true
+      roleGet({ id: obj.id }).then(data => {
+        const form = data.data
+        this.form = form
+      })
+    },
+    onSubmit (e) {
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          if (this.form.id) {
+            roleUpdate(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            })
+          } else {
+            roleAdd(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            })
+          }
+        } else {
+          return false
+        }
+      })
+    },
+    onCancel () {
+      this.$refs.ruleForm.resetFields()
+      delete this.form.id
+      this.visible = false
+    },
+    onReset () {
+      this.$refs.ruleForm.resetFields()
+    },
+    loadOrg () {
+      orgTreeGet({ treeLevel: 'MALL' }).then(data => {
+        this.orgData = data.data
+      })
+    },
+    onSelectOrg(value, node, extra) {
+      this.form.orgName = node.dataRef.name
+    }
+  },
+  mounted () {
+    this.loadOrg()
+  }
+}
+</script>
diff --git a/src/views/security/role/modules/RoleDetail.vue b/src/views/security/role/modules/RoleDetail.vue
new file mode 100644
index 0000000..4ea1c36
--- /dev/null
+++ b/src/views/security/role/modules/RoleDetail.vue
@@ -0,0 +1,46 @@
+<template>
+  <a-drawer
+    title="角色详情"
+    width="640"
+    placement="right"
+    :visible="visible"
+    @close="onClose">
+    <a-descriptions :column="{ sm: 2, xs: 1 }">
+      <a-descriptions-item label="名称">{{ model.name }}</a-descriptions-item>
+      <a-descriptions-item label="描述">{{ model.description }}</a-descriptions-item>
+      <a-descriptions-item label="创建时间">{{ model.createdAt | moment }}</a-descriptions-item>
+      <a-descriptions-item label="最近修改">{{ model.updatedAt | moment }}</a-descriptions-item>
+    </a-descriptions>
+  </a-drawer>
+</template>
+
+<script>
+import { roleGet } from '@/api/security/role'
+import { statusMap } from '@/views/status/statusMap'
+
+export default {
+  data () {
+    return {
+      visible: false,
+      model: {}
+    }
+  },
+  filters: {
+    statusFilter (status) {
+      return statusMap[status + '']
+    }
+  },
+  methods: {
+    show (id) {
+      this.visible = true
+      roleGet({ id: id }).then(data => {
+        this.model = data.data
+      })
+    },
+    onClose () {
+      this.model = {}
+      this.visible = false
+    }
+  }
+}
+</script>
diff --git a/src/views/security/user/UserList.vue b/src/views/security/user/UserList.vue
new file mode 100644
index 0000000..9c13366
--- /dev/null
+++ b/src/views/security/user/UserList.vue
@@ -0,0 +1,182 @@
+<template>
+  <page-header-wrapper :title="false">
+    <a-card :bordered="false">
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline">
+          <a-row :gutter="48">
+            <a-col :md="6" :sm="24">
+              <a-form-item label="名称">
+                <a-input v-model="queryParam.realName" placeholder="请输入名称" @pressEnter="handleRefresh"/>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="机构">
+                <a-tree-select
+                  v-model="queryParam.orgId"
+                  style="width: 100%"
+                  :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+                  :tree-data="orgData"
+                  placeholder="请选择机构"
+                  tree-default-expand-all
+                  :replaceFields="{
+                    children:'children',
+                    title:'name',
+                    key:'id',
+                    value:'id'
+                  }"
+                >
+                </a-tree-select></a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="状态">
+                <a-select v-model="queryParam.enabled" placeholder="请选择" default-value="0" @pressEnter="handleRefresh">
+                  <a-select-option value="">全部</a-select-option>
+                  <a-select-option v-for="(item, index) in statusMap" :key="index" :value="index">{{ item }}</a-select-option>
+                </a-select>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-button type="primary" @click="handleRefresh">查询</a-button>
+              <a-button @click="() => {queryParam = {}, handleRefresh()}">重置</a-button>
+              <a-button type="primary" class="ant-btn-right" @click="handleCreate">新增</a-button>
+            </a-col>
+          </a-row>
+        </a-form>
+      </div>
+      <s-table
+        ref="table"
+        rowKey="id"
+        :columns="columns"
+        :data="loadData"
+      >
+        <template slot="tbStatus" slot-scope="text, record">
+          <a-switch checked-children="启用" un-checked-children="停用" v-model="record.enabled" @change="updateStatus(record.id, record.enabled)"/>
+        </template>
+        <template slot="action" slot-scope="text, record">
+          <a href="javascript:;" @click="handleEdit(record)">修改</a>
+          <a-divider type="vertical" />
+          <a href="javascript:;" @click="handleDetail(record.id)">详情</a>
+          <a-divider type="vertical" />
+          <a href="javascript:;" @click="handlePassword(record.id)">修改密码</a>
+          <a-divider type="vertical" />
+          <a href="javascript:;" @click="handleRole(record.id)">分配角色</a>
+        </template>
+      </s-table>
+      <create-form ref="modal" @ok="handleOk" />
+      <user-detail ref="detail"></user-detail>
+      <user-role ref="role"></user-role>
+      <password-form ref="password"></password-form>
+    </a-card>
+  </page-header-wrapper>
+</template>
+
+<script>
+import { userPage, userUpdateEnabled } from '@/api/security/user'
+import { STable } from '@/components'
+import CreateForm from './modules/CreateForm'
+import UserDetail from './modules/UserDetail'
+import UserRole from './modules/UserRole'
+import OrgTree from './modules/OrgTree'
+import PasswordForm from '@/components/PasswordForm'
+import { statusMap } from '@/views/status/statusMap'
+import { orgTreeGet } from '@/api/bms/org'
+
+export default {
+  name: 'UserList',
+  components: {
+    STable,
+    CreateForm,
+    UserDetail,
+    UserRole,
+    PasswordForm,
+    OrgTree
+  },
+  data () {
+    return {
+      isShowOrg: false,
+      statusMap: statusMap,
+      orgData: [],
+      queryParam: { realName: '', enabled: '', orgId: '' },
+      columns: [
+        { title: '名称', width: 40, dataIndex: 'realName', key: 'realName' },
+        { title: '手机号', width: 40, dataIndex: 'mobile', key: 'mobile' },
+        { title: '邮箱', width: 40, dataIndex: 'email', key: 'email' },
+        {
+          title: '状态',
+          width: 10,
+          key: 'tbStatus',
+          align: 'center',
+          scopedSlots: { customRender: 'tbStatus' }
+        },
+        {
+          title: '操作',
+          key: 'operation',
+          width: 10,
+          align: 'right',
+          scopedSlots: { customRender: 'action' }
+        }
+      ],
+      loadData: parameter => {
+        return userPage(Object.assign(parameter, this.queryParam))
+          .then(res => {
+           const data = res.data
+           data.entities.forEach((item) => {
+             item.status = item.status === 1
+           })
+           return data
+          })
+      }
+    }
+  },
+  methods: {
+    // 修改状态
+    updateStatus (id, status) {
+      userUpdateEnabled({
+        id: id,
+        enabled: status ? 1 : 0
+      }).then(res => {
+        this.$notification.success({
+          message: '操作成功',
+          duration: 1,
+          description: status ? '用户已启用' : '用户已停用'
+        })
+        this.$refs.table.refresh()
+      })
+    },
+    // 分配角色
+    handleRole (userId) {
+      this.$refs.role.show(userId)
+    },
+    // 增
+    handleCreate () {
+      this.$refs.modal.add()
+    },
+    // 改
+    handleEdit (record) {
+      this.$refs.modal.edit(record)
+    },
+    // 编辑后回调
+    handleOk () {
+      this.$refs.table.refresh()
+    },
+    // 详情
+    handleDetail (id) {
+      this.$refs.detail.show(id)
+    },
+    handlePassword (id) {
+      this.$refs.password.show(id)
+    },
+    handleRefresh () {
+      this.$refs.table.refresh(true)
+    },
+    loadOrg () {
+      orgTreeGet({ treeLevel: 'MALL' }).then(data => {
+        this.orgData = data.data
+      })
+    }
+  },
+  mounted () {
+    this.loadOrg()
+  }
+}
+</script>
diff --git a/src/views/security/user/UserLogin.vue b/src/views/security/user/UserLogin.vue
new file mode 100644
index 0000000..62ae41e
--- /dev/null
+++ b/src/views/security/user/UserLogin.vue
@@ -0,0 +1,80 @@
+<template>
+  <div class="main">
+    <a-form-model ref="ruleForm" class="user-layout-login" :model="form" :rules="rules" @submit.prevent="handleSubmit">
+      <a-form-model-item>
+        <a-input size="large" v-model="form.username" placeholder="请输入用户名">
+          <a-icon slot="prefix" type="user" style="color:rgba(0,0,0,.25)" />
+        </a-input>
+      </a-form-model-item>
+      <a-form-model-item>
+        <a-input-password size="large" v-model="form.password" placeholder="请输入密码">
+          <a-icon slot="prefix" type="lock" style="color:rgba(0,0,0,.25)" />
+        </a-input-password>
+      </a-form-model-item>
+      <a-form-model-item>
+        <a-button block type="primary" size="large" html-type="submit" :loading="loading">登录</a-button>
+      </a-form-model-item>
+    </a-form-model>
+  </div>
+</template>
+
+<script>
+import { mapActions } from 'vuex'
+import { timeFix } from '@/utils/util'
+
+export default {
+  data () {
+    return {
+      form: {
+        username: '',
+        password: ''
+      },
+      rules: {
+        username: [{ required: true, message: '请输入账号' }],
+        password: [{ required: true, message: '请输入密码', trigger: 'blur' }]
+      },
+      loading: false
+    }
+  },
+  methods: {
+    ...mapActions(['Login', 'Logout']),
+    handleSubmit () {
+      if (this.loading) {
+        return false
+      }
+      this.loading = false
+      this.$refs.ruleForm.validate(valid => {
+        const { form } = this
+				console.log(form)
+        if (valid) {
+          this.Login(form).then(() => {
+            this.loginSuccess()
+          }, (res) => {
+            this.requestFailed(res)
+          })
+        } else {
+          this.loading = false
+          return false
+        }
+      })
+    },
+    loginSuccess (res) {
+      this.loading = false
+      this.$router.push({ path: '/' })
+      // 延迟 1 秒显示欢迎信息
+      setTimeout(() => {
+        this.$notification.success({
+          message: '欢迎',
+          description: `${timeFix()}，欢迎回来`
+        })
+      }, 1000)
+    },
+    requestFailed (err) {
+      this.loading = false
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+</style>
diff --git a/src/views/security/user/modules/CreateForm.vue b/src/views/security/user/modules/CreateForm.vue
new file mode 100644
index 0000000..df6ba08
--- /dev/null
+++ b/src/views/security/user/modules/CreateForm.vue
@@ -0,0 +1,173 @@
+<template>
+  <a-drawer :visible="visible" :title="modalTitle" :width="720" @close="onCancel">
+    <a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-model-item ref="username" label="用户名" prop="username"><a-input v-model="form.username" /></a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item ref="realName" label="姓名" prop="realName"><a-input v-model="form.realName" /></a-form-model-item>
+        </a-col>
+      </a-row>
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-model-item ref="mobile" label="手机号" prop="mobile"><a-input v-model="form.mobile" /></a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item ref="password" label="密码" prop="password"><a-input-password v-model="form.password" /></a-form-model-item>
+        </a-col>
+      </a-row>
+      <a-row>
+        <a-col>
+          <a-form-model-item ref="type" label="类型" prop="type" :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }">
+            <a-radio-group name="type" v-model="form.type" :disabled="orgDisable" >
+              <a-radio v-if="isCorporation" value="CORPORATION">
+                公司管理员
+              </a-radio>
+              <a-radio v-if="isCorporation || isMall" value="MALL">
+                门店管理员
+              </a-radio>
+              <a-radio value="STORE">
+                店长
+              </a-radio>
+              <a-radio value="STAFF">
+                店员
+              </a-radio>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-model-item ref="orgName" label="机构" prop="orgName">
+            <a-input v-model="form.orgName" readOnly @click="openOrgTree" :disabled="orgDisable"/>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+      <a-row :gutter="16">
+        <a-col :span="12">
+          <a-form-model-item ref="address" label="地址" prop="address"><a-input v-model="form.address" /></a-form-model-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-model-item ref="email" label="邮箱" prop="email"><a-input v-model="form.email" /></a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-form-model>
+    <div class="draw-button-container align-center">
+      <a-button @click="onCancel">取消</a-button>
+      <a-button type="primary" @click="onSubmit">保存</a-button>
+    </div>
+
+    <org-tree @selectOrg="selectOrg($event)" ref="orgModal"/>
+
+  </a-drawer>
+</template>
+
+<script>
+import { userGet, userAdd, userUpdate } from '@/api/security/user'
+import OrgTree from './OrgTree'
+import { userMixin } from '@/store/user-mixin'
+
+export default {
+  mixins: [userMixin],
+  props: {
+    id: {
+      type: String,
+      default: undefined
+    }
+  },
+  components: {
+    OrgTree
+  },
+  data () {
+    return {
+      isShowOrg: false,
+      modalTitle: '新增',
+      visible: false,
+      labelCol: { span: 6 },
+      wrapperCol: { span: 18 },
+      form: {
+        username: '',
+        realName: '',
+        mobile: '',
+        password: '',
+        type: undefined,
+        orgId: undefined,
+        orgName: '',
+        address: '',
+        email: ''
+      },
+      rules: {
+        username: [{ required: true, message: '请输入用户名', trigger: 'blur' }, { min: 5, message: '长度不能小于5', trigger: 'blur' }],
+        realName: [{ required: true, message: '请输入姓名', trigger: 'blur' }, { min: 2, message: '长度不能小于5', trigger: 'blur' }],
+        mobile: [{ required: true, message: '请输入正确的手机号', pattern: /^1[3456789]\d{9}$/, trigger: 'blur' }],
+        password: [{ required: true, message: '请输入密码', trigger: 'blur' }, { min: 6, message: '长度不能小于6', trigger: 'blur' }],
+        type: [{ required: true, message: '请选择类型', trigger: 'blur' }],
+        orgName: [{ required: true, message: '请选择机构', trigger: 'blur' }]
+      }
+    }
+  },
+  computed: {
+    orgDisable () {
+      return this.modalTitle === '修改'
+    }
+  },
+  created () {
+    if (this.isCorporation) {
+      this.form.type = 'CORPORATION'
+    } else if (this.isMall) {
+      this.form.type = 'MALL'
+    } else {
+      this.form.type = 'STORE'
+    }
+  },
+  methods: {
+    add () {
+      this.modalTitle = '新增'
+      this.visible = true
+    },
+    edit (obj) {
+      this.modalTitle = '修改'
+      this.visible = true
+      userGet({ id: obj.id }).then(data => {
+        const form = data.data
+        this.form = form
+      })
+    },
+    onSubmit (e) {
+      this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          if (this.form.id) {
+            userUpdate(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            })
+          } else {
+            userAdd(this.form).then(data => {
+              this.$emit('ok')
+              this.onCancel()
+            })
+          }
+        } else {
+          return false
+        }
+      })
+    },
+    onCancel () {
+      this.$refs.ruleForm.resetFields()
+      delete this.form.id
+      this.visible = false
+    },
+    onReset () {
+      this.$refs.ruleForm.resetFields()
+    },
+    openOrgTree () {
+      this.$refs.orgModal.loadOrg(this.form.type)
+    },
+    selectOrg (orgData) {
+      this.form.orgId = orgData.id
+      this.form.orgName = orgData.name
+    }
+  }
+}
+</script>
diff --git a/src/views/security/user/modules/OrgTree.vue b/src/views/security/user/modules/OrgTree.vue
new file mode 100644
index 0000000..7207282
--- /dev/null
+++ b/src/views/security/user/modules/OrgTree.vue
@@ -0,0 +1,121 @@
+<template>
+  <a-modal v-model="isShowOrg" title="选择机构" :footer="null" >
+    <div>
+      <a-input-search style="margin-bottom: 8px" placeholder="搜索名称" @change="onChange" />
+      <a-tree
+        :disable-branch-nodes="true"
+        :expanded-keys="expandedKeys"
+        :auto-expand-parent="autoExpandParent"
+        :tree-data="orgList"
+        @expand="onExpand"
+        @select="onSelect"
+        :replaceFields="{
+          children:'children',
+          title:'name',
+          key:'id'
+        }"
+      >
+        <template slot="name" slot-scope="{ name }">
+          <span v-if="name.indexOf(searchValue) > -1">
+            {{ name.substr(0, name.indexOf(searchValue)) }}
+            <span style="color: #f50">{{ searchValue }}</span>
+            {{ name.substr(name.indexOf(searchValue) + searchValue.length) }}
+          </span>
+          <span v-else>{{ name }}</span>
+        </template>
+      </a-tree>
+    </div>
+  </a-modal>
+</template>
+
+<script>
+import { orgByUserType } from '@/api/bms/org'
+
+// 所有节点放进dataList,便于搜索
+const dataList = []
+const generateList = data => {
+  for (let i = 0; i < data.length; i++) {
+    const node = data[i]
+    // 设置插槽,搜索结果样式变化
+    node.scopedSlots = { title: 'name' }
+    const id = node.id
+    const name = node.name
+    dataList.push({ id, name })
+    if (node.children) {
+      generateList(node.children)
+    }
+  }
+}
+
+// 获取传入id所在节点的父节点
+const getParentKey = (id, tree) => {
+  let parentKey
+  for (let i = 0; i < tree.length; i++) {
+    const node = tree[i]
+    if (node.children) {
+      if (node.children.some(item => item.id === id)) {
+        parentKey = node.id
+      } else if (getParentKey(id, node.children)) {
+        parentKey = getParentKey(id, node.children)
+      }
+    }
+  }
+  return parentKey
+}
+export default {
+  data () {
+    return {
+      expandedKeys: [],
+      searchValue: '',
+      autoExpandParent: true,
+      orgList: [],
+      isShowOrg: false
+    }
+  },
+  methods: {
+    onExpand (expandedKeys) {
+      this.expandedKeys = expandedKeys
+      this.autoExpandParent = false
+    },
+    onSelect (selectedKeys, info) {
+      var orgInfo = info.node.dataRef
+      const org = { id: orgInfo.id, name: orgInfo.name, type: orgInfo.type }
+      this.$emit('selectOrg', org)
+      this.isShowOrg = false
+    },
+    onChange (e) {
+      const value = e.target.value
+      // 获取搜索结果所在节点的父节点集合
+      const expandedKeys = dataList
+        .map(item => {
+          if (item.name.indexOf(value) > -1) {
+            return getParentKey(item.id, this.orgList)
+          }
+          return null
+        })
+        .filter((item, i, self) => item && self.indexOf(item) === i)
+      // 拷贝,根据搜索结果设置展开节点
+      Object.assign(this, {
+        expandedKeys,
+        searchValue: value,
+        autoExpandParent: true
+      })
+    },
+    loadOrg (userType) {
+      orgByUserType({ userType: userType }).then(data => {
+        const orgData = data.data
+        // 默认展开树节点
+        for (let i = 0; i < orgData.length; i++) {
+          this.expandedKeys.push(orgData[i].id)
+          for (let j = 0; j < orgData[i].children.length; j++) {
+            this.expandedKeys.push(orgData[i].children[j].id)
+          }
+        }
+        generateList(orgData)
+        this.orgList = orgData
+      })
+      this.isShowOrg = true
+    }
+  }
+}
+</script>
diff --git a/src/views/security/user/modules/UserDetail.vue b/src/views/security/user/modules/UserDetail.vue
new file mode 100644
index 0000000..1a7c87e
--- /dev/null
+++ b/src/views/security/user/modules/UserDetail.vue
@@ -0,0 +1,56 @@
+<template>
+  <a-drawer
+    title="用户详情"
+    width="640"
+    placement="right"
+    :visible="visible"
+    @close="onClose">
+    <a-descriptions :column="{ sm: 2, xs: 1 }">
+      <a-descriptions-item label="用户名">{{ model.username }}</a-descriptions-item>
+      <a-descriptions-item label="姓名">{{ model.realName }}</a-descriptions-item>
+      <a-descriptions-item label="创建时间">{{ model.createdAt | moment }}</a-descriptions-item>
+      <a-descriptions-item label="最近修改">{{ model.updatedAt | moment }}</a-descriptions-item>
+      <a-descriptions-item label="状态">{{ model.enabled | statusFilter }}</a-descriptions-item>
+      <a-descriptions-item label="手机号">{{ model.mobile }}</a-descriptions-item>
+      <a-descriptions-item label="机构">{{ model.orgName }}</a-descriptions-item>
+      <a-descriptions-item label="类型">{{ model.type | typeFilter }}</a-descriptions-item>
+      <a-descriptions-item label="地址">{{ model.address }}</a-descriptions-item>
+      <a-descriptions-item label="邮箱">{{ model.email }}</a-descriptions-item>
+    </a-descriptions>
+  </a-drawer>
+</template>
+
+<script>
+import { userGet } from '@/api/security/user'
+import { enabledMap } from '@/views/status/enabledMap'
+// import { typeMap } from '../../maps/map.js'
+
+export default {
+  data () {
+    return {
+      visible: false,
+      model: {}
+    }
+  },
+  filters: {
+    statusFilter (status) {
+      return enabledMap[status + '']
+    },
+    typeFilter (type) {
+      return ''
+    }
+  },
+  methods: {
+    show (id) {
+      this.visible = true
+      userGet({ id: id }).then(data => {
+        this.model = data.data
+      })
+    },
+    onClose () {
+      this.model = {}
+      this.visible = false
+    }
+  }
+}
+</script>
diff --git a/src/views/security/user/modules/UserRole.vue b/src/views/security/user/modules/UserRole.vue
new file mode 100644
index 0000000..697b5d6
--- /dev/null
+++ b/src/views/security/user/modules/UserRole.vue
@@ -0,0 +1,145 @@
+<template>
+  <a-drawer class="role-drawer" :visible="visible" title="分配角色" :width="720" @close="onCancel">
+    <a-transfer
+      class="role-transfer"
+      :data-source="dataSource"
+      :titles="['未选中', '已选择']"
+      :operations="['添加', '移除']"
+      :target-keys="targetKeys"
+      :show-search="true"
+      :filter-option="(inputValue, item) => item.title.indexOf(inputValue) !== -1"
+      :show-select-all="false"
+      :render="item => item.title"
+      @change="onChange"
+    >
+    </a-transfer>
+    <div class="draw-button-container align-center">
+      <a-button @click="onCancel">取消</a-button>
+      <a-button type="primary" @click="onSubmit">保存</a-button>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+import { rolePage, rolesByUserId } from '@/api/security/role'
+import { userRoleAdd, userRoleDelete } from '@/api/security/userRole'
+import { Transfer } from 'ant-design-vue'
+import { diffArray } from '@/utils/util'
+
+export default {
+  components: {
+    [Transfer.name]: Transfer
+  },
+  data () {
+    return {
+      visible: false,
+      dataSource: [],
+      targetKeys: [],
+      originalKeys: [],
+      userId: '',
+      isLoading: false
+    }
+  },
+  methods: {
+    show (userId) {
+      if (!userId) {
+        return false
+      }
+      this.userId = userId
+      this.visible = true
+      this.loadRoles()
+      this.loadUserRoles(userId)
+    },
+    loadRoles () {
+      rolePage({
+        pageSize: 30,
+        status: 1
+      }).then(res => {
+        const data = []
+        res.data.entities.forEach((item) => {
+          data.push({
+            key: item.id,
+            title: item.name
+          })
+        })
+        this.dataSource = data
+      })
+    },
+    loadUserRoles (userId) {
+      rolesByUserId({
+        userId,
+        checked: true
+      }).then(res => {
+        const data = []
+        res.data.forEach((item) => {
+          data.push(item.id)
+        })
+        this.targetKeys = data
+        this.originalKeys = data
+      })
+    },
+    onSubmit () {
+      if (this.isLoading) {
+        return false
+      }
+      this.isLoading = true
+      const { targetKeys, originalKeys, userId } = this
+      const addArray = diffArray(targetKeys, originalKeys)
+      const deleteArray = diffArray(originalKeys, targetKeys)
+      if (addArray.length > 0) {
+        userRoleAdd({ roleId: addArray.join(','), userId }).then(res => {
+        })
+      }
+      if (deleteArray.length > 0) {
+        userRoleDelete({ roleId: deleteArray.join(','), userId }).then(res => {
+        })
+      }
+      this.isLoading = false
+      this.onCancel()
+    },
+    onCancel () {
+      this.visible = false
+      this.dataSource = []
+      this.targetKeys = []
+      this.originalKeys = []
+    },
+    onChange (nextTargetKeys) {
+      if (this.isLoading) {
+        return false
+      }
+      this.targetKeys = nextTargetKeys
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+.role-drawer {
+  /deep/ .ant-drawer-wrapper-body {
+    position: relative;
+    .ant-drawer-body {
+      position: absolute;
+      top: 55px;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      padding: 0;
+    }
+  }
+}
+.role-transfer {
+  display: flex;
+  align-items: center;
+  height: 100%;
+  padding: 24px 24px 75px;
+  /deep/ .ant-transfer-list {
+    flex: 1;
+    height: 100%;
+  }
+  /deep/ .ant-transfer-list-body{
+    overflow-y: auto;
+  }
+  /deep/ .ant-transfer-operation .ant-btn {
+    margin-left: 0;
+  }
+}
+</style>
diff --git a/src/views/status/enabledMap.js b/src/views/status/enabledMap.js
new file mode 100644
index 0000000..0c46776
--- /dev/null
+++ b/src/views/status/enabledMap.js
@@ -0,0 +1,4 @@
+export const enabledMap = {
+  'false': '停用',
+  'true': '启用'
+}
diff --git a/src/views/status/statusMap.js b/src/views/status/statusMap.js
new file mode 100644
index 0000000..5ce705e
--- /dev/null
+++ b/src/views/status/statusMap.js
@@ -0,0 +1,4 @@
+export const statusMap = {
+  '0': '停用',
+  '1': '启用'
+}
diff --git a/vue.config.js b/vue.config.js
index 05431b3..a687f1e 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -5,7 +5,7 @@ const GitRevision = new GitRevisionPlugin()
 const buildDate = JSON.stringify(new Date().toLocaleString())
 const createThemeColorReplacerPlugin = require('./config/plugin.config')
 
-function resolve(dir) {
+function resolve (dir) {
   return path.join(__dirname, dir)
 }
 
@@ -93,21 +93,21 @@ const vueConfig = {
   },
 
   devServer: {
-    // development server port 8000
-    port: 8000,
-    // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
+    disableHostCheck: true, // ���vue��Ŀ�еġ�Invalid Host header������
+    port: 8000, // development server port Ĭ��8000������ÿ������Ŀ����Ķ˿ں��Ƕ��ٶ���
+    // �����Ҫ�������������Ƴ�mockjs /src/main.jsL11
     proxy: {
-      '/dawa': {
-        target: 'http://a.3a6.cn/dawa/',
+      '/dawa': { // ����API�ı�־�����API��������ַ�������ô�Ϳ�ʼƥ�����
+        target: 'http://a.3a6.cn', // ��ַ������������Ҳ������IP��ַ������API����/api/getList, �ᱻ����������http://www.baidu.com/api/getList ��
         ws: false,
-        changeOrigin: true
+        changeOrigin: true // ���target��������Ҫ��������һ������changeOrigin: true����������ʧ�ܡ�
       }
     }
   },
 
   // disable source map in production
   productionSourceMap: false,
-  lintOnSave: undefined,
+  lintOnSave: false,
   // babel-loader no-ignore node_modules/*
   transpileDependencies: []
 }