diff --git a/build/utils.js b/build/utils.js index 8220903..80e8943 100644 --- a/build/utils.js +++ b/build/utils.js @@ -59,7 +59,11 @@ exports.cssLoaders = function (options) { return { css: generateLoaders(), postcss: generateLoaders(), - less: generateLoaders('less'), + less: generateLoaders('less', { + modifyVars: { + 'hack': `true; @import "${path.join(__dirname, '../src/assets/css/resetVantUi.less')}";` + } + }), sass: generateLoaders('sass', { indentedSyntax: true }), scss: generateLoaders('sass').concat( { diff --git a/package-lock.json b/package-lock.json index dc150ce..1f52fe5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4,6 +4,21 @@ "lockfileVersion": 1, "requires": true, "dependencies": { + "@babel/runtime": { + "version": "7.22.5", + "resolved": "https://registry.npmmirror.com/@babel/runtime/-/runtime-7.22.5.tgz", + "integrity": "sha512-ecjvYlnAaZ/KVneE/OdKYBYfgXV3Ptu6zQWmgEF7vwKhQnvVS6bjMD2XYgj+SNvQ1GfK/pjgokfPkC/2CO8CuA==", + "requires": { + "regenerator-runtime": "^0.13.11" + }, + "dependencies": { + "regenerator-runtime": { + "version": "0.13.11", + "resolved": "https://registry.npmmirror.com/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", + "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==" + } + } + }, "@nodelib/fs.scandir": { "version": "2.1.5", "resolved": "https://registry.npmmirror.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", @@ -41,6 +56,21 @@ "integrity": "sha1-FZJUFOCtLNdlv+9YhC9+JqesyyQ=", "dev": true }, + "@vant/icons": { + "version": "1.8.0", + "resolved": "https://registry.npmmirror.com/@vant/icons/-/icons-1.8.0.tgz", + "integrity": "sha512-sKfEUo2/CkQFuERxvkuF6mGQZDKu3IQdj5rV9Fm0weJXtchDSSQ+zt8qPCNUEhh9Y8shy5PzxbvAfOOkCwlCXg==" + }, + "@vant/popperjs": { + "version": "1.3.0", + "resolved": "https://registry.npmmirror.com/@vant/popperjs/-/popperjs-1.3.0.tgz", + "integrity": "sha512-hB+czUG+aHtjhaEmCJDuXOep0YTZjdlRR+4MSmIFnkCQIxJaXLQdSsR90XWvAI2yvKUI7TCGqR8pQg2RtvkMHw==" + }, + "@vue/babel-helper-vue-jsx-merge-props": { + "version": "1.4.0", + "resolved": "https://registry.npmmirror.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.4.0.tgz", + "integrity": "sha512-JkqXfCkUDp4PIlFdDQ0TdXoIejMtTHP67/pvxlgeY+u5k3LEdKuWZ3LK6xkxo52uDoABIVyRwqVkfLQJhk7VBA==" + }, "abbrev": { "version": "1.1.1", "resolved": "https://registry.npmmirror.com/abbrev/-/abbrev-1.1.1.tgz", @@ -1815,8 +1845,9 @@ }, "clone": { "version": "2.1.2", - "resolved": "http://registry.npm.taobao.org/clone/download/clone-2.1.2.tgz", - "integrity": "sha1-G39Ln1kfHo+DZwQBYANFoCiHQ18=" + "resolved": "https://registry.npmmirror.com/clone/-/clone-2.1.2.tgz", + "integrity": "sha512-3Pe/CF1Nn94hyhIYpjtiLhdCoEoz0DqQ+988E9gmeEdQZlojxnOb74wctFyuwWQHzqyf9X7C7MG8juUpqBJT8w==", + "dev": true }, "clone-deep": { "version": "4.0.1", @@ -2018,6 +2049,15 @@ "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=", "dev": true }, + "copy-anything": { + "version": "2.0.6", + "resolved": "https://registry.npmmirror.com/copy-anything/-/copy-anything-2.0.6.tgz", + "integrity": "sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==", + "dev": true, + "requires": { + "is-what": "^3.14.1" + } + }, "copy-concurrently": { "version": "1.0.5", "resolved": "http://registry.npm.taobao.org/copy-concurrently/download/copy-concurrently-1.0.5.tgz", @@ -4821,6 +4861,13 @@ "integrity": "sha1-Cpf7h2mG6AgcYxFg+PnziRV/AEM=", "dev": true }, + "image-size": { + "version": "0.5.5", + "resolved": "https://registry.npmmirror.com/image-size/-/image-size-0.5.5.tgz", + "integrity": "sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==", + "dev": true, + "optional": true + }, "import-cwd": { "version": "2.1.0", "resolved": "https://registry.nlark.com/import-cwd/download/import-cwd-2.1.0.tgz", @@ -5179,6 +5226,12 @@ "resolved": "http://registry.npm.taobao.org/is-utf8/download/is-utf8-0.2.1.tgz", "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=" }, + "is-what": { + "version": "3.14.1", + "resolved": "https://registry.npmmirror.com/is-what/-/is-what-3.14.1.tgz", + "integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==", + "dev": true + }, "is-windows": { "version": "1.0.2", "resolved": "http://registry.npm.taobao.org/is-windows/download/is-windows-1.0.2.tgz", @@ -5340,10 +5393,49 @@ "invert-kv": "^1.0.0" } }, + "less": { + "version": "4.1.3", + "resolved": "https://registry.npmmirror.com/less/-/less-4.1.3.tgz", + "integrity": "sha512-w16Xk/Ta9Hhyei0Gpz9m7VS8F28nieJaL/VyShID7cYvP6IL5oHeL6p4TXSDJqZE/lNv0oJ2pGVjJsRkfwm5FA==", + "dev": true, + "requires": { + "copy-anything": "^2.0.1", + "errno": "^0.1.1", + "graceful-fs": "^4.1.2", + "image-size": "~0.5.0", + "make-dir": "^2.1.0", + "mime": "^1.4.1", + "needle": "^3.1.0", + "parse-node-version": "^1.0.1", + "source-map": "~0.6.0", + "tslib": "^2.3.0" + }, + "dependencies": { + "make-dir": { + "version": "2.1.0", + "resolved": "https://registry.npmmirror.com/make-dir/-/make-dir-2.1.0.tgz", + "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==", + "dev": true, + "optional": true, + "requires": { + "pify": "^4.0.1", + "semver": "^5.6.0" + } + }, + "pify": { + "version": "4.0.1", + "resolved": "https://registry.npmmirror.com/pify/-/pify-4.0.1.tgz", + "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==", + "dev": true, + "optional": true + } + } + }, "less-loader": { "version": "4.1.0", - "resolved": "https://registry.npmmirror.com/less-loader/download/less-loader-4.1.0.tgz", - "integrity": "sha1-LBNSxbCaT4QQFJAnT9UWdN5BNj4=", + "resolved": "https://registry.npmmirror.com/less-loader/-/less-loader-4.1.0.tgz", + "integrity": "sha512-KNTsgCE9tMOM70+ddxp9yyt9iHqgmSs0yTZc5XH5Wo+g80RWRIYNqE58QJKm/yMud5wZEvz50ugRDuzVIkyahg==", + "dev": true, "requires": { "clone": "^2.1.1", "loader-utils": "^1.1.0", @@ -6014,6 +6106,47 @@ } } }, + "needle": { + "version": "3.2.0", + "resolved": "https://registry.npmmirror.com/needle/-/needle-3.2.0.tgz", + "integrity": "sha512-oUvzXnyLiVyVGoianLijF9O/RecZUf7TkBfimjGrLM4eQhXyeJwM6GeAWccwfQ9aa4gMCZKqhAOuLaMIcQxajQ==", + "dev": true, + "optional": true, + "requires": { + "debug": "^3.2.6", + "iconv-lite": "^0.6.3", + "sax": "^1.2.4" + }, + "dependencies": { + "debug": { + "version": "3.2.7", + "resolved": "https://registry.npmmirror.com/debug/-/debug-3.2.7.tgz", + "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==", + "dev": true, + "optional": true, + "requires": { + "ms": "^2.1.1" + } + }, + "iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmmirror.com/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dev": true, + "optional": true, + "requires": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + } + }, + "ms": { + "version": "2.1.3", + "resolved": "https://registry.npmmirror.com/ms/-/ms-2.1.3.tgz", + "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==", + "dev": true, + "optional": true + } + } + }, "negotiator": { "version": "0.6.2", "resolved": "https://registry.npm.taobao.org/negotiator/download/negotiator-0.6.2.tgz", @@ -6603,6 +6736,12 @@ "json-parse-better-errors": "^1.0.1" } }, + "parse-node-version": { + "version": "1.0.1", + "resolved": "https://registry.npmmirror.com/parse-node-version/-/parse-node-version-1.0.1.tgz", + "integrity": "sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==", + "dev": true + }, "parseurl": { "version": "1.3.3", "resolved": "https://registry.npm.taobao.org/parseurl/download/parseurl-1.3.3.tgz", @@ -6697,7 +6836,8 @@ "pify": { "version": "3.0.0", "resolved": "https://registry.npm.taobao.org/pify/download/pify-3.0.0.tgz", - "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=" + "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=", + "dev": true }, "pinkie": { "version": "2.0.4", @@ -9293,6 +9433,12 @@ "integrity": "sha1-8shUBoALmw90yfdGW4HqrSQSUvg=", "dev": true }, + "tslib": { + "version": "2.5.3", + "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.5.3.tgz", + "integrity": "sha512-mSxlJJwl3BMEQCUNnxXBU9jP4JBktcEGhURcPR6VQVlnP0FdDEsIaz0C35dXNGLyRfrATNofF0F5p2KPxQgB+w==", + "dev": true + }, "tty-browserify": { "version": "0.0.0", "resolved": "http://registry.npm.taobao.org/tty-browserify/download/tty-browserify-0.0.0.tgz", @@ -9684,6 +9830,25 @@ "spdx-expression-parse": "^3.0.0" } }, + "vant": { + "version": "2.12.54", + "resolved": "https://registry.npmmirror.com/vant/-/vant-2.12.54.tgz", + "integrity": "sha512-t7DCiLxNosDrg0Jm5EY9p0A5cAMo5OadmizbYtPEc0ru+OJKEa3kcfxtKIK5on7ZPqoOkyYJt8e6BQ1VDMPsrg==", + "requires": { + "@babel/runtime": "7.x", + "@vant/icons": "^1.7.1", + "@vant/popperjs": "^1.1.0", + "@vue/babel-helper-vue-jsx-merge-props": "^1.0.0", + "vue-lazyload": "1.2.3" + }, + "dependencies": { + "vue-lazyload": { + "version": "1.2.3", + "resolved": "https://registry.npmmirror.com/vue-lazyload/-/vue-lazyload-1.2.3.tgz", + "integrity": "sha512-DC0ZwxanbRhx79tlA3zY5OYJkH8FYp3WBAnAJbrcuoS8eye1P73rcgAZhyxFSPUluJUTelMB+i/+VkNU/qVm7g==" + } + } + }, "vary": { "version": "1.1.2", "resolved": "http://registry.npm.taobao.org/vary/download/vary-1.1.2.tgz", diff --git a/package.json b/package.json index 212f1b4..9b7faa0 100644 --- a/package.json +++ b/package.json @@ -13,11 +13,11 @@ "axios": "^0.21.1", "css-loader": "^3.6.0", "js-base64": "^3.6.0", - "less-loader": "^4.1.0", "mint-ui": "^2.2.13", "moment": "^2.29.1", "node-sass": "^4.14.1", "sass-loader": "^7.3.1", + "vant": "^2.12.54", "vue": "^2.5.2", "vue-baidu-map": "^0.21.22", "vue-h5-popup": "^1.0.2", @@ -41,6 +41,8 @@ "file-loader": "^1.1.4", "friendly-errors-webpack-plugin": "^1.6.1", "html-webpack-plugin": "^2.30.1", + "less": "^4.1.3", + "less-loader": "^4.1.0", "node-notifier": "^5.1.2", "optimize-css-assets-webpack-plugin": "^3.2.0", "ora": "^1.2.0", diff --git a/src/api/getUserIfo.js b/src/api/getUserIfo.js new file mode 100644 index 0000000..7a3f637 --- /dev/null +++ b/src/api/getUserIfo.js @@ -0,0 +1,29 @@ +import request from '@/utils/request' + +export function getTokenByOpenId(params) { // 获取用户token和手机号 + return request({ + url: 'wxPublicUser/getTokenByOpenId', + method: 'post', + data: params + }) +} + + +export function saveFeedbackAndSuggest(params) { // 提交建议反馈 + return request({ + url: 'suggest/saveFeedbackAndSuggest', + method: 'post', + data: params + }) +} + + +export function getFeedbackType(params) { // 获取建议反馈类型 + return request({ + url: 'suggest/getFeedbackType', + method: 'post', + data: params + }) +} + + diff --git a/src/assets/css/reset.css b/src/assets/css/reset.css index 1ad44a8..5b8d9b7 100644 --- a/src/assets/css/reset.css +++ b/src/assets/css/reset.css @@ -61,3 +61,7 @@ body,html,#app .leftRightPadding{ padding: 0 10px; } + +.commonPagePadding{ + padding: 0 10px; +} diff --git a/src/assets/css/resetVantUi.less b/src/assets/css/resetVantUi.less new file mode 100644 index 0000000..1b0dc4e --- /dev/null +++ b/src/assets/css/resetVantUi.less @@ -0,0 +1,905 @@ + + + // Color Palette +@black: #000; +@white: #fff; +@gray-1: #f7f8fa; +@gray-2: #f2f3f5; +@gray-3: #ebedf0; +@gray-4: #dcdee0; +@gray-5: #c8c9cc; +@gray-6: #969799; +@gray-7: #646566; +@gray-8: #323233; +@red: #ee0a24; +@blue: #1989fa; + //1989fa +@orange: #ff976a; +@orange-dark: #ed6a0c; +@orange-light: #fffbe8; +@green: #07c160; + +// Gradient Colors +@gradient-red: linear-gradient(to right, #ff6034, #ee0a24); +@gradient-orange: linear-gradient(to right, #ffd01e, #ff8917); +@gradient-blue: linear-gradient(180deg, #2282C5 0%, #4B8EF1 58%, #63BEFD 100%); + +// Component Colors +@text-color: @gray-8; +@active-color: @gray-2; +@active-opacity: 0.7; +@disabled-opacity: 0.5; +@background-color: @gray-1; +@background-color-light: #fafafa; +@text-link-color: #576b95; + +// Padding +@padding-base: 4px; +@padding-xs: @padding-base * 2; +@padding-sm: @padding-base * 3; +@padding-md: @padding-base * 4; +@padding-lg: @padding-base * 6; +@padding-xl: @padding-base * 8; + +// Font +@font-size-xs: 10px; +@font-size-sm: 12px; +@font-size-md: 14px; +@font-size-lg: 16px; +@font-weight-bold: 500; +@line-height-xs: 14px; +@line-height-sm: 18px; +@line-height-md: 20px; +@line-height-lg: 22px; +@base-font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', +Helvetica, Segoe UI, Arial, Roboto, 'PingFang SC', 'miui', 'Hiragino Sans GB', +'Microsoft Yahei', sans-serif; +@price-integer-font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, +sans-serif; + +// Animation +@animation-duration-base: 0.3s; +@animation-duration-fast: 0.2s; +@animation-timing-function-enter: ease-out; +@animation-timing-function-leave: ease-in; + +// Border +@border-color: @gray-3; +@border-width-base: 1px; +@border-radius-sm: 2px; +@border-radius-md: 4px; +@border-radius-lg: 8px; +@border-radius-max: 999px; + +// ActionSheet +@action-sheet-max-height: 80%; +@action-sheet-header-height: 48px; +@action-sheet-header-font-size: @font-size-lg; +@action-sheet-description-color: @gray-6; +@action-sheet-description-font-size: @font-size-md; +@action-sheet-description-line-height: @line-height-md; +@action-sheet-item-background: @white; +@action-sheet-item-font-size: @font-size-lg; +@action-sheet-item-line-height: @line-height-lg; +@action-sheet-item-text-color: @text-color; +@action-sheet-item-disabled-text-color: @gray-5; +@action-sheet-subname-color: @gray-6; +@action-sheet-subname-font-size: @font-size-sm; +@action-sheet-subname-line-height: @line-height-sm; +@action-sheet-close-icon-size: 22px; +@action-sheet-close-icon-color: @gray-5; +@action-sheet-close-icon-active-color: @gray-6; +@action-sheet-close-icon-padding: 0 @padding-md; +@action-sheet-cancel-text-color: @gray-7; +@action-sheet-cancel-padding-top: @padding-xs; +@action-sheet-cancel-padding-color: @background-color; +@action-sheet-loading-icon-size: 22px; + +// AddressEdit +@address-edit-padding: @padding-sm; +@address-edit-buttons-padding: @padding-xl @padding-base; +@address-edit-button-margin-bottom: @padding-sm; +@address-edit-detail-finish-color: @blue; +@address-edit-detail-finish-font-size: @font-size-sm; + +// AddressList +@address-list-padding: @padding-sm @padding-sm 80px; +@address-list-disabled-text-color: @gray-6; +@address-list-disabled-text-padding: @padding-base * 5 0 @padding-md; +@address-list-disabled-text-font-size: @font-size-md; +@address-list-disabled-text-line-height: @line-height-md; +@address-list-add-button-z-index: 999; +@address-list-item-padding: @padding-sm; +@address-list-item-text-color: @text-color; +@address-list-item-disabled-text-color: @gray-5; +@address-list-item-font-size: 13px; +@address-list-item-line-height: @line-height-sm; +@address-list-item-radio-icon-color: @red; +@address-list-edit-icon-size: 20px; + +// Badge +@badge-size: 16px; +@badge-color: @white; +@badge-padding: 0 3px; +@badge-font-size: @font-size-sm; +@badge-font-weight: @font-weight-bold; +@badge-border-width: @border-width-base; +@badge-background-color: @red; +@badge-dot-color: @red; +@badge-dot-size: 8px; +@badge-font-family: -apple-system-font, Helvetica Neue, Arial, sans-serif; + +// Button +@button-mini-height: 24px; +@button-mini-font-size: @font-size-xs; +@button-small-height: 32px; +@button-small-font-size: @font-size-sm; +@button-normal-font-size: @font-size-md; +@button-large-height: 50px; +@button-default-height: 44px; +@button-default-line-height: 1.2; +@button-default-font-size: @font-size-lg; +@button-default-color: @text-color; +@button-default-background-color: @white; +@button-default-border-color: @border-color; +@button-primary-color: @white; +@button-primary-background-color: @green; +@button-primary-border-color: @green; +@button-info-color: @white; +@button-info-background-color: @gradient-blue; +@button-info-border-color: @gradient-blue; +@button-danger-color: @white; +@button-danger-background-color: @red; +@button-danger-border-color: @red; +@button-warning-color: @white; +@button-warning-background-color: @orange; +@button-warning-border-color: @orange; +@button-border-width: @border-width-base; +@button-border-radius: @border-radius-sm; +@button-round-border-radius: @border-radius-max; +@button-plain-background-color: @white; +@button-disabled-opacity: @disabled-opacity; + +// Calendar +@calendar-background-color: @white; +@calendar-popup-height: 80%; +@calendar-header-box-shadow: 0 2px 10px rgba(125, 126, 128, 0.16); +@calendar-header-title-height: 44px; +@calendar-header-title-font-size: @font-size-lg; +@calendar-header-subtitle-font-size: @font-size-md; +@calendar-weekdays-height: 30px; +@calendar-weekdays-font-size: @font-size-sm; +@calendar-month-title-font-size: @font-size-md; +@calendar-month-mark-color: fade(@gray-2, 80%); +@calendar-month-mark-font-size: 160px; +@calendar-day-height: 64px; +@calendar-day-font-size: @font-size-lg; +@calendar-range-edge-color: @white; +@calendar-range-edge-background-color: @red; +@calendar-range-middle-color: @red; +@calendar-range-middle-background-opacity: 0.1; +@calendar-selected-day-size: 54px; +@calendar-selected-day-color: @white; +@calendar-info-font-size: @font-size-xs; +@calendar-info-line-height: @line-height-xs; +@calendar-selected-day-background-color: @red; +@calendar-day-disabled-color: @gray-5; +@calendar-confirm-button-height: 36px; +@calendar-confirm-button-margin: 7px 0; + +// Card +@card-padding: @padding-xs @padding-md; +@card-font-size: @font-size-sm; +@card-text-color: @text-color; +@card-background-color: @background-color-light; +@card-thumb-size: 88px; +@card-thumb-border-radius: @border-radius-lg; +@card-title-line-height: 16px; +@card-desc-color: @gray-7; +@card-desc-line-height: @line-height-md; +@card-price-color: @gray-8; +@card-origin-price-color: @gray-6; +@card-num-color: @gray-6; +@card-origin-price-font-size: @font-size-xs; +@card-price-font-size: @font-size-sm; +@card-price-integer-font-size: @font-size-lg; +@card-price-font-family: @price-integer-font-family; + +// Cascader +@cascader-header-height: 48px; +@cascader-title-font-size: @font-size-lg; +@cascader-title-line-height: 20px; +@cascader-close-icon-size: 22px; +@cascader-close-icon-color: @gray-5; +@cascader-close-icon-active-color: @gray-6; +@cascader-selected-icon-size: 18px; +@cascader-tabs-height: 48px; +@cascader-active-color: @red; +@cascader-options-height: 384px; +@cascader-tab-color: @text-color; +@cascader-unselected-tab-color: @gray-6; + +// Cell +@cell-font-size: @font-size-md; +@cell-line-height: 24px; +@cell-vertical-padding: 10px; +@cell-horizontal-padding: @padding-md; +@cell-text-color: @text-color; +@cell-background-color: @white; +@cell-border-color: @border-color; +@cell-active-color: @active-color; +@cell-required-color: @red; +@cell-label-color: @gray-6; +@cell-label-font-size: @font-size-sm; +@cell-label-line-height: @line-height-sm; +@cell-label-margin-top: @padding-base; +@cell-value-color: @gray-6; +@cell-icon-size: 16px; +@cell-right-icon-color: @gray-6; +@cell-large-vertical-padding: @padding-sm; +@cell-large-title-font-size: @font-size-lg; +@cell-large-label-font-size: @font-size-md; + +// CellGroup +@cell-group-background-color: @white; +@cell-group-title-color: @gray-6; +@cell-group-title-padding: @padding-md @padding-md @padding-xs; +@cell-group-title-font-size: @font-size-md; +@cell-group-title-line-height: 16px; +@cell-group-inset-padding: 0 @padding-md; +@cell-group-inset-border-radius: @border-radius-lg; +@cell-group-inset-title-padding: @padding-md @padding-md @padding-xs @padding-xl; + +// Checkbox +@checkbox-size: 20px; +@checkbox-border-color: @gray-5; +@checkbox-transition-duration: @animation-duration-fast; +@checkbox-label-margin: @padding-xs; +@checkbox-label-color: @text-color; +@checkbox-checked-icon-color: @blue; +@checkbox-disabled-icon-color: @gray-5; +@checkbox-disabled-label-color: @gray-5; +@checkbox-disabled-background-color: @border-color; + +// Circle +@circle-size: 100px; +@circle-color: @blue; +@circle-layer-color: @white; +@circle-text-color: @text-color; +@circle-text-font-weight: @font-weight-bold; +@circle-text-font-size: @font-size-md; +@circle-text-line-height: @line-height-md; + +// Collapse +@collapse-item-transition-duration: @animation-duration-base; +@collapse-item-content-padding: @padding-sm @padding-md; +@collapse-item-content-font-size: @font-size-md; +@collapse-item-content-line-height: 1.5; +@collapse-item-content-text-color: @gray-6; +@collapse-item-content-background-color: @white; +@collapse-item-title-disabled-color: @gray-5; + +// ContactCard +@contact-card-padding: @padding-md; +@contact-card-add-icon-size: 40px; +@contact-card-add-icon-color: @blue; +@contact-card-value-line-height: @line-height-md; + +// ContactEdit +@contact-edit-padding: @padding-md; +@contact-edit-fields-radius: @border-radius-md; +@contact-edit-buttons-padding: @padding-xl 0; +@contact-edit-button-margin-bottom: @padding-sm; +@contact-edit-button-font-size: 16px; +@contact-edit-field-label-width: 4.1em; + +// ContactList +@contact-list-edit-icon-size: 16px; +@contact-list-add-button-z-index: 999; +@contact-list-item-padding: @padding-md; + +// CountDown +@count-down-text-color: @text-color; +@count-down-font-size: @font-size-md; +@count-down-line-height: @line-height-md; + +// Coupon +@coupon-margin: 0 @padding-sm @padding-sm; +@coupon-content-height: 84px; +@coupon-content-padding: 14px 0; +@coupon-background-color: @white; +@coupon-active-background-color: @active-color; +@coupon-border-radius: @border-radius-lg; +@coupon-box-shadow: 0 0 4px rgba(0, 0, 0, 0.1); +@coupon-head-width: 96px; +@coupon-amount-color: @red; +@coupon-amount-font-size: 30px; +@coupon-currency-font-size: 40%; +@coupon-name-font-size: @font-size-md; +@coupon-disabled-text-color: @gray-6; +@coupon-description-padding: @padding-xs @padding-md; +@coupon-description-border-color: @border-color; + +// CouponCell +@coupon-cell-selected-text-color: @text-color; + +// CouponList +@coupon-list-background-color: @background-color; +@coupon-list-field-padding: 5px 0 5px @padding-md; +@coupon-list-exchange-button-height: 32px; +@coupon-list-close-button-height: 40px; +@coupon-list-empty-image-size: 200px; +@coupon-list-empty-tip-color: @gray-6; +@coupon-list-empty-tip-font-size: @font-size-md; +@coupon-list-empty-tip-line-height: @line-height-md; + +// Dialog +@dialog-width: 320px; +@dialog-small-screen-width: 90%; +@dialog-font-size: @font-size-lg; +@dialog-transition: @animation-duration-base; +@dialog-border-radius: 16px; +@dialog-background-color: @white; +@dialog-header-font-weight: @font-weight-bold; +@dialog-header-line-height: 24px; +@dialog-header-padding-top: 26px; +@dialog-header-isolated-padding: @padding-lg 0; +@dialog-message-padding: @padding-lg; +@dialog-message-font-size: @font-size-md; +@dialog-message-line-height: @line-height-md; +@dialog-message-max-height: 60vh; +@dialog-has-title-message-text-color: @gray-7; +@dialog-has-title-message-padding-top: @padding-xs; +@dialog-button-height: 48px; +@dialog-round-button-height: 36px; +@dialog-confirm-button-text-color: @red; + +// Divider +@divider-margin: @padding-md 0; +@divider-text-color: @gray-6; +@divider-font-size: @font-size-md; +@divider-line-height: 24px; +@divider-border-color: @border-color; +@divider-content-padding: @padding-md; +@divider-content-left-width: 10%; +@divider-content-right-width: 10%; + +// DropdownMenu +@dropdown-menu-height: 48px; +@dropdown-menu-background-color: @white; +@dropdown-menu-box-shadow: 0 2px 12px fade(@gray-7, 12); +@dropdown-menu-title-font-size: 15px; +@dropdown-menu-title-text-color: @text-color; +@dropdown-menu-title-active-text-color: @red; +@dropdown-menu-title-disabled-text-color: @gray-6; +@dropdown-menu-title-padding: 0 @padding-xs; +@dropdown-menu-title-line-height: @line-height-lg; +@dropdown-menu-option-active-color: @red; +@dropdown-menu-content-max-height: 80%; +@dropdown-item-z-index: 10; + +// Empty +@empty-padding: @padding-xl 0; +@empty-image-size: 160px; +@empty-description-margin-top: @padding-md; +@empty-description-padding: 0 60px; +@empty-description-color: @gray-6; +@empty-description-font-size: @font-size-md; +@empty-description-line-height: @line-height-md; +@empty-bottom-margin-top: 24px; + +// Field +@field-label-width: 6.2em; +@field-label-color: @gray-7; +@field-label-margin-right: @padding-sm; +@field-input-text-color: @text-color; +@field-input-error-text-color: @red; +@field-input-disabled-text-color: @gray-5; +@field-placeholder-text-color: @gray-5; +@field-icon-size: 16px; +@field-clear-icon-size: 16px; +@field-clear-icon-color: @gray-5; +@field-right-icon-color: @gray-6; +@field-error-message-color: @red; +@field-error-message-font-size: 12px; +@field-text-area-min-height: 60px; +@field-word-limit-color: @gray-7; +@field-word-limit-font-size: @font-size-sm; +@field-word-limit-line-height: 16px; +@field-disabled-text-color: @gray-5; + +// GridItem +@grid-item-content-padding: @padding-md @padding-xs; +@grid-item-content-background-color: @white; +@grid-item-content-active-color: @active-color; +@grid-item-icon-size: 28px; +@grid-item-text-color: @gray-7; +@grid-item-text-font-size: @font-size-sm; + +// GoodsAction +@goods-action-background-color: @white; +@goods-action-height: 50px; +@goods-action-icon-width: 48px; +@goods-action-icon-height: 100%; +@goods-action-icon-color: @text-color; +@goods-action-icon-size: 18px; +@goods-action-icon-font-size: @font-size-xs; +@goods-action-icon-active-color: @active-color; +@goods-action-icon-text-color: @gray-7; +@goods-action-button-height: 40px; +@goods-action-button-warning-color: @gradient-orange; +@goods-action-button-danger-color: @gradient-red; + +// IndexAnchor +@index-anchor-z-index: 1; +@index-anchor-padding: 0 @padding-md; +@index-anchor-text-color: @text-color; +@index-anchor-font-weight: @font-weight-bold; +@index-anchor-font-size: @font-size-md; +@index-anchor-line-height: 32px; +@index-anchor-background-color: transparent; +@index-anchor-sticky-text-color: @red; +@index-anchor-sticky-background-color: @white; + +// IndexBar +@index-bar-sidebar-z-index: 2; +@index-bar-index-font-size: @font-size-xs; +@index-bar-index-line-height: @line-height-xs; +@index-bar-index-active-color: @red; + +// Info +@info-size: 16px; +@info-color: @white; +@info-padding: 0 3px; +@info-font-size: @font-size-sm; +@info-font-weight: @font-weight-bold; +@info-border-width: @border-width-base; +@info-background-color: @red; +@info-dot-color: @red; +@info-dot-size: 8px; +@info-font-family: -apple-system-font, Helvetica Neue, Arial, sans-serif; + +// Image +@image-placeholder-text-color: @gray-6; +@image-placeholder-font-size: @font-size-md; +@image-placeholder-background-color: @background-color; +@image-loading-icon-size: 32px; +@image-loading-icon-color: @gray-4; +@image-error-icon-size: 32px; +@image-error-icon-color: @gray-4; + +// ImagePreview +@image-preview-index-text-color: @white; +@image-preview-index-font-size: @font-size-md; +@image-preview-index-line-height: @line-height-md; +@image-preview-index-text-shadow: 0 1px 1px @gray-8; +@image-preview-overlay-background-color: rgba(0, 0, 0, 0.9); +@image-preview-close-icon-size: 22px; +@image-preview-close-icon-color: @gray-5; +@image-preview-close-icon-active-color: @gray-6; +@image-preview-close-icon-margin: @padding-md; +@image-preview-close-icon-z-index: 1; + +// List +@list-text-color: @gray-6; +@list-text-font-size: @font-size-md; +@list-text-line-height: 50px; + +// Loading +@loading-text-color: @gray-6; +@loading-text-font-size: @font-size-md; +@loading-spinner-color: @gray-5; +@loading-spinner-size: 30px; +@loading-spinner-animation-duration: 0.8s; + +// NavBar +@nav-bar-height: 46px; +@nav-bar-background-color: @white; +@nav-bar-arrow-size: 16px; +@nav-bar-icon-color: @blue; +@nav-bar-text-color: @blue; +@nav-bar-title-font-size: @font-size-lg; +@nav-bar-title-text-color: @text-color; +@nav-bar-z-index: 1; + +// NoticeBar +@notice-bar-height: 40px; +@notice-bar-padding: 0 @padding-md; +@notice-bar-wrapable-padding: @padding-xs @padding-md; +@notice-bar-text-color: @orange-dark; +@notice-bar-font-size: @font-size-md; +@notice-bar-line-height: 24px; +@notice-bar-background-color: @orange-light; +@notice-bar-icon-size: 16px; +@notice-bar-icon-min-width: 24px; + +// Notify +@notify-text-color: @white; +@notify-padding: @padding-xs @padding-md; +@notify-font-size: @font-size-md; +@notify-line-height: @line-height-md; +@notify-primary-background-color: @blue; +@notify-success-background-color: @green; +@notify-danger-background-color: @red; +@notify-warning-background-color: @orange; + +// NumberKeyboard +@number-keyboard-background-color: @gray-2; +@number-keyboard-key-height: 48px; +@number-keyboard-key-font-size: 28px; +@number-keyboard-key-active-color: @gray-3; +@number-keyboard-delete-font-size: @font-size-lg; +@number-keyboard-title-color: @gray-7; +@number-keyboard-title-height: 34px; +@number-keyboard-title-font-size: @font-size-lg; +@number-keyboard-close-padding: 0 @padding-md; +@number-keyboard-close-color: @text-link-color; +@number-keyboard-close-font-size: @font-size-md; +@number-keyboard-button-text-color: @white; +@number-keyboard-button-background-color: @blue; +@number-keyboard-cursor-color: @text-color; +@number-keyboard-cursor-width: 1px; +@number-keyboard-cursor-height: 40%; +@number-keyboard-cursor-animation-duration: 1s; +@number-keyboard-z-index: 100; + +// Overlay +@overlay-z-index: 1; +@overlay-background-color: rgba(0, 0, 0, 0.7); + +// Pagination +@pagination-height: 40px; +@pagination-font-size: @font-size-md; +@pagination-item-width: 36px; +@pagination-item-default-color: @blue; +@pagination-item-disabled-color: @gray-7; +@pagination-item-disabled-background-color: @background-color; +@pagination-background-color: @white; +@pagination-desc-color: @gray-7; +@pagination-disabled-opacity: @disabled-opacity; + +// Panel +@panel-background-color: @white; +@panel-header-value-color: @red; +@panel-footer-padding: @padding-xs @padding-md; + +// PasswordInput +@password-input-height: 50px; +@password-input-margin: 0 @padding-md; +@password-input-font-size: 20px; +@password-input-border-radius: 6px; +@password-input-background-color: @white; +@password-input-info-color: @gray-6; +@password-input-info-font-size: @font-size-md; +@password-input-error-info-color: @red; +@password-input-dot-size: 10px; +@password-input-dot-color: @black; + +// Picker +@picker-background-color: @white; +@picker-toolbar-height: 44px; +@picker-title-font-size: @font-size-lg; +@picker-title-line-height: @line-height-md; +@picker-action-padding: 0 @padding-md; +@picker-action-font-size: @font-size-md; +@picker-confirm-action-color: @text-link-color; +@picker-cancel-action-color: @gray-6; +@picker-option-font-size: @font-size-lg; +@picker-option-text-color: @black; +@picker-option-disabled-opacity: 0.3; +@picker-loading-icon-color: @blue; +@picker-loading-mask-color: rgba(255, 255, 255, 0.9); + +// Popover +@popover-arrow-size: 6px; +@popover-border-radius: @border-radius-lg; +@popover-action-width: 128px; +@popover-action-height: 44px; +@popover-action-font-size: @font-size-md; +@popover-action-line-height: @line-height-md; +@popover-action-icon-size: 20px; +@popover-light-text-color: @text-color; +@popover-light-background-color: @white; +@popover-light-action-disabled-text-color: @gray-5; +@popover-dark-text-color: @white; +@popover-dark-background-color: #4a4a4a; +@popover-dark-action-disabled-text-color: @gray-6; + +// Popup +@popup-background-color: @white; +@popup-transition: transform @animation-duration-base; +@popup-round-border-radius: 16px; +@popup-close-icon-size: 22px; +@popup-close-icon-color: @gray-5; +@popup-close-icon-active-color: @gray-6; +@popup-close-icon-margin: 16px; +@popup-close-icon-z-index: 1; + +// Progress +@progress-height: 4px; +@progress-color: @blue; +@progress-background-color: @gray-3; +@progress-pivot-padding: 0 5px; +@progress-pivot-text-color: @white; +@progress-pivot-font-size: @font-size-xs; +@progress-pivot-line-height: 1.6; +@progress-pivot-background-color: @blue; + +// PullRefresh +@pull-refresh-head-height: 50px; +@pull-refresh-head-font-size: @font-size-md; +@pull-refresh-head-text-color: @gray-6; + +// Radio +@radio-size: 20px; +@radio-border-color: @gray-5; +@radio-transition-duration: @animation-duration-fast; +@radio-label-margin: @padding-xs; +@radio-label-color: @text-color; +@radio-checked-icon-color: @blue; +@radio-disabled-icon-color: @gray-5; +@radio-disabled-label-color: @gray-5; +@radio-disabled-background-color: @border-color; + +// Rate +@rate-icon-size: 20px; +@rate-icon-gutter: @padding-base; +@rate-icon-void-color: @gray-5; +@rate-icon-full-color: @red; +@rate-icon-disabled-color: @gray-5; + +// ShareSheet +@share-sheet-header-padding: @padding-sm @padding-md @padding-base; +@share-sheet-title-color: @text-color; +@share-sheet-title-font-size: @font-size-md; +@share-sheet-title-line-height: @line-height-md; +@share-sheet-description-color: @gray-6; +@share-sheet-description-font-size: @font-size-sm; +@share-sheet-description-line-height: 16px; +@share-sheet-icon-size: 48px; +@share-sheet-option-name-color: @gray-7; +@share-sheet-option-name-font-size: @font-size-sm; +@share-sheet-option-description-color: @gray-5; +@share-sheet-option-description-font-size: @font-size-sm; +@share-sheet-cancel-button-font-size: @font-size-lg; +@share-sheet-cancel-button-height: 48px; +@share-sheet-cancel-button-background: @white; + +// Search +@search-padding: 10px @padding-sm; +@search-background-color: @white; +@search-content-background-color: @gray-1; +@search-input-height: 34px; +@search-label-padding: 0 5px; +@search-label-color: @text-color; +@search-label-font-size: @font-size-md; +@search-left-icon-color: @gray-6; +@search-action-padding: 0 @padding-xs; +@search-action-text-color: @text-color; +@search-action-font-size: @font-size-md; + +// Sidebar +@sidebar-width: 80px; +@sidebar-font-size: @font-size-md; +@sidebar-line-height: @line-height-md; +@sidebar-text-color: @text-color; +@sidebar-disabled-text-color: @gray-5; +@sidebar-padding: 20px @padding-sm; +@sidebar-active-color: @active-color; +@sidebar-background-color: @background-color; +@sidebar-selected-font-weight: @font-weight-bold; +@sidebar-selected-text-color: @text-color; +@sidebar-selected-border-width: 4px; +@sidebar-selected-border-height: 16px; +@sidebar-selected-border-color: @red; +@sidebar-selected-background-color: @white; + +// Skeleton +@skeleton-row-height: 16px; +@skeleton-row-background-color: @active-color; +@skeleton-row-margin-top: @padding-sm; +@skeleton-title-width: 40%; +@skeleton-avatar-size: 32px; +@skeleton-avatar-background-color: @active-color; +@skeleton-animation-duration: 1.2s; + +// Slider +@slider-active-background-color: @blue; +@slider-inactive-background-color: @gray-3; +@slider-disabled-opacity: @disabled-opacity; +@slider-bar-height: 2px; +@slider-button-width: 24px; +@slider-button-height: 24px; +@slider-button-border-radius: 50%; +@slider-button-background-color: @white; +@slider-button-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); + +// Step +@step-text-color: @gray-6; +@step-active-color: @green; +@step-process-text-color: @text-color; +@step-font-size: @font-size-md; +@step-line-color: @border-color; +@step-finish-line-color: @green; +@step-finish-text-color: @text-color; +@step-icon-size: 12px; +@step-circle-size: 5px; +@step-circle-color: @gray-6; +@step-horizontal-title-font-size: @font-size-sm; + +// Steps +@steps-background-color: @white; + +// Sticky +@sticky-z-index: 99; + +// Stepper +@stepper-active-color: #e8e8e8; +@stepper-background-color: @active-color; +@stepper-button-icon-color: @text-color; +@stepper-button-disabled-color: @background-color; +@stepper-button-disabled-icon-color: @gray-5; +@stepper-button-round-theme-color: @blue; +@stepper-input-width: 32px; +@stepper-input-height: 28px; +@stepper-input-font-size: @font-size-md; +@stepper-input-line-height: normal; +@stepper-input-text-color: @text-color; +@stepper-input-disabled-text-color: @gray-5; +@stepper-input-disabled-background-color: @active-color; +@stepper-border-radius: @border-radius-md; + +// SubmitBar +@submit-bar-height: 50px; +@submit-bar-z-index: 100; +@submit-bar-background-color: @white; +@submit-bar-button-width: 110px; +@submit-bar-price-color: @red; +@submit-bar-price-font-size: @font-size-md; +@submit-bar-currency-font-size: @font-size-md; +@submit-bar-text-color: @text-color; +@submit-bar-text-font-size: @font-size-md; +@submit-bar-tip-padding: @padding-xs @padding-sm; +@submit-bar-tip-font-size: @font-size-sm; +@submit-bar-tip-line-height: 1.5; +@submit-bar-tip-color: #f56723; +@submit-bar-tip-background-color: #fff7cc; +@submit-bar-tip-icon-size: 12px; +@submit-bar-button-height: 40px; +@submit-bar-padding: 0 @padding-md; +@submit-bar-price-integer-font-size: 20px; +@submit-bar-price-font-family: @price-integer-font-family; + +// Swipe +@swipe-indicator-size: 6px; +@swipe-indicator-margin: @padding-sm; +@swipe-indicator-active-opacity: 1; +@swipe-indicator-inactive-opacity: 0.3; +@swipe-indicator-active-background-color: @blue; +@swipe-indicator-inactive-background-color: @border-color; + +// Switch +@switch-size: 30px; +@switch-width: 2em; +@switch-height: 1em; +@switch-node-size: 1em; +@switch-node-background-color: @white; +@switch-node-box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), +0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05); +@switch-background-color: @white; +@switch-on-background-color: @blue; +@switch-transition-duration: @animation-duration-base; +@switch-disabled-opacity: @disabled-opacity; +@switch-border: @border-width-base solid rgba(0, 0, 0, 0.1); + +// SwitchCell +@switch-cell-padding-top: @cell-vertical-padding - 1px; +@switch-cell-padding-bottom: @cell-vertical-padding - 1px; +@switch-cell-large-padding-top: @cell-large-vertical-padding - 1px; +@switch-cell-large-padding-bottom: @cell-large-vertical-padding - 1px; + +// Tabbar +@tabbar-height: 50px; +@tabbar-z-index: 1; +@tabbar-background-color: @white; + +// TabbarItem +@tabbar-item-font-size: @font-size-sm; +@tabbar-item-text-color: @gray-7; +@tabbar-item-active-color: @blue; +@tabbar-item-active-background-color: @tabbar-background-color; +@tabbar-item-line-height: 1; +@tabbar-item-icon-size: 22px; +@tabbar-item-margin-bottom: 4px; + +// Tab +@tab-text-color: @gray-7; +@tab-active-text-color: @text-color; +@tab-disabled-text-color: @gray-5; +@tab-font-size: @font-size-md; +@tab-line-height: @line-height-md; + +// Tabs +@tabs-default-color: @red; +@tabs-line-height: 44px; +@tabs-card-height: 30px; +@tabs-nav-background-color: @white; +@tabs-bottom-bar-width: 40px; +@tabs-bottom-bar-height: 3px; +@tabs-bottom-bar-color: @tabs-default-color; + +// Tag +@tag-padding: 0 @padding-base; +@tag-text-color: @white; +@tag-font-size: @font-size-sm; +@tag-border-radius: 2px; +@tag-line-height: 16px; +@tag-medium-padding: 2px 6px; +@tag-large-padding: @padding-base @padding-xs; +@tag-large-border-radius: @border-radius-md; +@tag-large-font-size: @font-size-md; +@tag-round-border-radius: @border-radius-max; +@tag-danger-color: @red; +@tag-primary-color: @blue; +@tag-success-color: @green; +@tag-warning-color: @orange; +@tag-default-color: @gray-6; +@tag-plain-background-color: @white; + +// Toast +@toast-max-width: 70%; +@toast-font-size: @font-size-md; +@toast-text-color: @white; +@toast-loading-icon-color: @white; +@toast-line-height: @line-height-md; +@toast-border-radius: @border-radius-lg; +@toast-background-color: fade(@black, 70%); +@toast-icon-size: 36px; +@toast-text-min-width: 96px; +@toast-text-padding: @padding-xs @padding-sm; +@toast-default-padding: @padding-md; +@toast-default-width: 88px; +@toast-default-min-height: 88px; +@toast-position-top-distance: 20%; +@toast-position-bottom-distance: 20%; + +// TreeSelect +@tree-select-font-size: @font-size-md; +@tree-select-nav-background-color: @background-color; +@tree-select-content-background-color: @white; +@tree-select-nav-item-padding: 14px @padding-sm; +@tree-select-item-height: 48px; +@tree-select-item-active-color: @red; +@tree-select-item-disabled-color: @gray-5; +@tree-select-item-selected-size: 16px; + +// Uploader +@uploader-size: 80px; +@uploader-icon-size: 24px; +@uploader-icon-color: @gray-4; +@uploader-text-color: @gray-6; +@uploader-text-font-size: @font-size-sm; +@uploader-upload-background-color: @gray-1; +@uploader-upload-active-color: @active-color; +@uploader-delete-color: @white; +@uploader-delete-icon-size: 14px; +@uploader-delete-background-color: rgba(0, 0, 0, 0.7); +@uploader-file-background-color: @background-color; +@uploader-file-icon-size: 20px; +@uploader-file-icon-color: @gray-7; +@uploader-file-name-padding: 0 @padding-base; +@uploader-file-name-margin-top: @padding-xs; +@uploader-file-name-font-size: @font-size-sm; +@uploader-file-name-text-color: @gray-7; +@uploader-mask-background-color: fade(@gray-8, 88%); +@uploader-mask-icon-size: 22px; +@uploader-mask-message-font-size: @font-size-sm; +@uploader-mask-message-line-height: @line-height-xs; +@uploader-loading-icon-size: 22px; +@uploader-loading-icon-color: @white; +@uploader-disabled-opacity: @disabled-opacity; + +// Sku +@sku-item-background-color: @background-color; +@sku-icon-gray-color: @gray-4; +@sku-upload-mask-color: rgba(50, 50, 51, 0.8); diff --git a/src/assets/images/cards/novipcard.png b/src/assets/images/cards/novipcard.png new file mode 100644 index 0000000..22bb1d9 --- /dev/null +++ b/src/assets/images/cards/novipcard.png diff --git a/src/assets/images/cards/vipcardbg.png b/src/assets/images/cards/vipcardbg.png new file mode 100644 index 0000000..9269742 --- /dev/null +++ b/src/assets/images/cards/vipcardbg.png diff --git a/src/assets/images/cards/vipcardbg1.png b/src/assets/images/cards/vipcardbg1.png new file mode 100644 index 0000000..17763a9 --- /dev/null +++ b/src/assets/images/cards/vipcardbg1.png diff --git a/src/assets/images/myCars/addBtn.png b/src/assets/images/myCars/addBtn.png new file mode 100644 index 0000000..4788e25 --- /dev/null +++ b/src/assets/images/myCars/addBtn.png diff --git a/src/assets/images/myCars/addBtnBg.png b/src/assets/images/myCars/addBtnBg.png new file mode 100644 index 0000000..1e3585f --- /dev/null +++ b/src/assets/images/myCars/addBtnBg.png diff --git a/src/assets/images/myCars/carNumBg.png b/src/assets/images/myCars/carNumBg.png new file mode 100644 index 0000000..0a6330b --- /dev/null +++ b/src/assets/images/myCars/carNumBg.png diff --git a/src/assets/images/myCars/fornt.png b/src/assets/images/myCars/fornt.png new file mode 100644 index 0000000..fbd19be --- /dev/null +++ b/src/assets/images/myCars/fornt.png diff --git a/src/components/vant-number-plate/vnp-input-box.vue b/src/components/vant-number-plate/vnp-input-box.vue new file mode 100644 index 0000000..9967717 --- /dev/null +++ b/src/components/vant-number-plate/vnp-input-box.vue @@ -0,0 +1,118 @@ + + + + + diff --git a/src/components/vant-number-plate/vnp-input.vue b/src/components/vant-number-plate/vnp-input.vue new file mode 100644 index 0000000..b2cf057 --- /dev/null +++ b/src/components/vant-number-plate/vnp-input.vue @@ -0,0 +1,45 @@ + + + diff --git a/src/components/vant-number-plate/vnp-keyboard.vue b/src/components/vant-number-plate/vnp-keyboard.vue new file mode 100644 index 0000000..c44d919 --- /dev/null +++ b/src/components/vant-number-plate/vnp-keyboard.vue @@ -0,0 +1,198 @@ + + + + +> diff --git a/src/main.js b/src/main.js index 61e7273..df0e216 100644 --- a/src/main.js +++ b/src/main.js @@ -8,17 +8,27 @@ import './assets/css/reset.css' // 引入公共样式 import './assets/iconfont/iconfont.css' -import h5Popup from 'vue-h5-popup' // 引入弹窗 -Vue.use(h5Popup) - - -import BaiduMap from 'vue-baidu-map' - -Vue.use(BaiduMap, { - // ak 是在百度地图开发者平台申请的密钥 详见 http://lbsyun.baidu.com/apiconsole/key */ - ak: 'cuMSxNl5LOY6sf1M3nDGtG6tGXl5a0Bb' +// 路由守卫 +router.beforeEach((to,from ,next)=>{ + if(to.meta.title) { + document.title=to.meta.title; + }else { + document.title='宣化微信公众号'; + } + next() }) +// import h5Popup from 'vue-h5-popup' // 引入弹窗 +// Vue.use(h5Popup) +// +// +// import BaiduMap from 'vue-baidu-map' +// +// Vue.use(BaiduMap, { +// // ak 是在百度地图开发者平台申请的密钥 详见 http://lbsyun.baidu.com/apiconsole/key */ +// ak: 'cuMSxNl5LOY6sf1M3nDGtG6tGXl5a0Bb' +// }) +// import 'mint-ui/lib/style.css' import { MessageBox } from 'mint-ui' @@ -32,6 +42,15 @@ import { Field } from 'mint-ui'; Vue.component(Field.name, Field); + + + + + + + + + //全局设置的基本样式 import './assets/css/base.scss' @@ -45,13 +64,21 @@ Vue.prototype.$moment = moment import utils from './utils/utils' // 工具类 Vue.prototype.$utils = utils // -// import Mint from 'mint-ui'; -// import 'mint-ui/lib/style.css' -// Vue.use(Mint); +import Mint from 'mint-ui'; +import 'mint-ui/lib/style.css' +Vue.use(Mint); + + +// 在main.js中 + +import Vant from 'vant'; + +import 'vant/lib/index.css'; +import 'vant/lib/index.less'; + +Vue.use(Vant); -import 'swiper/dist/css/swiper.min.css' // 轮播 -import 'swiper/dist/js/swiper.min' import vueFilter from './utils/filters' // 公共filter for (let key in vueFilter){ diff --git a/src/router/index.js b/src/router/index.js index 37925db..4f59b12 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -67,50 +67,99 @@ export default new Router({ - // //---------------- 个人页面导航 - // { - // path: '/selfNav', - // name: 'selfNav', - // component: () => import("@/views/mySelf/selfNav.vue") - // }, - // - // // ------------------------建议反馈 - // { - // path: '/suggestionBack', - // name: 'suggestionBack', - // component: () => import("@/views/mySelf/feedback/suggestionBack.vue") - // }, - // - // // ------------------------停车记录 - // { - // path: '/parkNotes', - // name: 'parkNotes', - // component: () => import("@/views/mySelf/parkNotes/parkNotes.vue") - // }, - // - // - // // ------------------------停车记录 - // { - // path: '/binDing', - // name: 'binDing', - // component: () => import("@/views/binding/binDing.vue") - // }, - // - // - // // ------------------------购买会员卡提示 - // { - // path: '/cardPoint', - // name: 'cardPoint', - // component: () => import("@/views/cards/cardPoint.vue") - // }, - // - // - // // ------------------------购买会员卡 - // { - // path: '/buyCard', - // name: 'buyCard', - // component: () => import("@/views/cards/buyCard.vue") - // }, + //---------------- 个人页面导航 + { + path: '/selfNav', + name: 'selfNav', + component: () => import("@/views/mySelf/selfNav.vue"), + meta: {title: "个人中心"} + }, + + // ------------------------建议反馈 + { + path: '/suggestionBack', + name: 'suggestionBack', + component: () => import("@/views/mySelf/feedback/suggestionBack.vue"), + meta: {title: "建议反馈"} + }, + + // ------------------------停车记录 + { + path: '/parkNotes', + name: 'parkNotes', + component: () => import("@/views/mySelf/parkNotes/parkNotes.vue") + }, + + + // ------------------------登录 + { + path: '/binDing', + name: 'binDing', + component: () => import("@/views/binding/binDing.vue"), + meta: {title: "绑定手机号"} + }, + { + path: '/myCars', + name: 'myCars', + component: () => import("@/views//mySelf/myCars/myCars.vue"), + meta: {title: "我的车牌"} + }, + + { + path: '/addCarNum', + name: 'addCarNum', + component: () => import("@/views//mySelf/myCars/addCarNum.vue"), + meta: {title: "添加车牌"} + }, + { + path: '/rzCarNumber', + name: 'rzCarNumber', + component: () => import("@/views//mySelf/myCars/rzCarNumber.vue"), + meta: {title: "认证车牌"} + }, + + + { + path: '/cardList', + name: 'cardList', + component: () => import("@/views//cards/cardList.vue"), + meta: {title: "会员卡列表"} + }, + + + { + path: '/buyCardDetail', + name: 'buyCardDetail', + component: () => import("@/views//cards/buyCardDetail.vue"), + meta: {title: "购买会员卡"} + }, + + { + path: '/buyVipCard', + name: 'buyVipCard', + component: () => import("@/views//cards/buyVipCard.vue"), + meta: {title: "购买会员卡"} + }, + + + + + + // ------------------------购买会员卡提示 + { + path: '/cardPoint', + name: 'cardPoint', + component: () => import("@/views/cards/cardPoint.vue") + }, + + + // ------------------------购买会员卡 + { + path: '/buyCard', + name: 'buyCard', + component: () => import("@/views/cards/buyCard.vue"), + meta: {title: "购买会员卡"} + }, diff --git a/src/utils/utils.js b/src/utils/utils.js index 684fff1..92cec0d 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -1,163 +1,139 @@ -import md5 from './md5.min.js'; +import md5 from "./md5.min.js"; +var myCommonSalt = function(val) { // 获取盐值 + let len = parseInt(val); + let $chars = "ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678"; + let maxPos = $chars.length; + var pwd = ""; + for (var i = 0; i < len; i++) { + pwd += $chars.charAt(Math.floor(Math.random() * maxPos)); + } + console.log(pwd); + return pwd; +}; export default { - myCommonSalt: function (val) { // 获取盐值 - let len = parseInt(val); - let $chars = 'ABCDEFGHJKMNPQRSTWXYZabcdefhijkmnprstwxyz2345678'; - let maxPos = $chars.length; - var pwd = ''; - for (var i = 0; i < len; i++) { - pwd += $chars.charAt(Math.floor(Math.random() * maxPos)); + myCommonSalt, + formatDate: function(secs, type = 0) { //type是可选参数，因为json中时间的格式是year-month-date,不能识别XX年XX月XX日 + var t = new Date(secs); + var year = t.getFullYear(); + var month = t.getMonth() + 1; + if (month < 10) { + month = "0" + month; + } + var date = t.getDate(); + if (date < 10) { + date = "0" + date; + } + var hour = t.getHours(); + if (hour < 10) { + hour = "0" + hour; + } + var minute = t.getMinutes(); + if (minute < 10) { + minute = "0" + minute; + } + var second = t.getSeconds(); + if (second < 10) { + second = "0" + second; + } + if (type == 0) { + return year + "年" + month + "月" + date + "日"; + } else { + return year + "-" + month + "-" + date; } - console.log(pwd); - return pwd; }, - - formatDate: function(secs, type=0){ //type是可选参数，因为json中时间的格式是year-month-date,不能识别XX年XX月XX日 - var t = new Date(secs) - var year = t.getFullYear() - var month = t.getMonth() + 1 - if(month < 10){ month = '0' + month } - var date = t.getDate() - if(date < 10){ date = '0' + date } - var hour = t.getHours() - if(hour < 10){ hour = '0' + hour } - var minute = t.getMinutes() - if(minute < 10){ minute = '0' + minute } - var second = t.getSeconds() - if(second < 10){ second = '0' + second } - if(type==0){ - return year + '年' + month + '月' + date + '日' - }else{ - return year + '-'+month+'-'+date - }}, - - timestampToTime: function (timestamp) { + timestampToTime: function(timestamp) { var d = new Date(timestamp);//时间戳为10位需*1000，时间戳为13位的话不需乘1000 - var youWant=d.getFullYear() + '-' + this.completedString(d.getMonth() + 1) + '-' + this.completedString(d.getDate()) ; - return youWant + var youWant = d.getFullYear() + "-" + this.completedString(d.getMonth() + 1) + "-" + this.completedString(d.getDate()); + return youWant; }, - completedString:function(s) { - return s < 10 ? '0' + s : s + completedString: function(s) { + return s < 10 ? "0" + s : s; }, - - - - dateFormat: function (msd) { // 时间转换 - var time = msd - + dateFormat: function(msd) { // 时间转换 + var time = msd; if (null != time && "" != time) { - if (time > 60 && time < 60 * 60) { - time = parseInt(time / 60.0) + "分钟" + parseInt((parseFloat(time / 60.0) - - parseInt(time / 60.0)) * 60) + "秒"; - } - else if (time >= 60 * 60 && time < 60 * 60 * 24) { - time = parseInt(time / 3600.0) + "小时" + parseInt((parseFloat(time / 3600.0) - - parseInt(time / 3600.0)) * 60) + "分钟" + - parseInt((parseFloat((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60) - - parseInt((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60)) * 60) + "秒"; - } else if (time >= 60 * 60 * 24) { - time = parseInt(time / 3600.0 / 24) + "天" + parseInt((parseFloat(time / 3600.0 / 24) - - parseInt(time / 3600.0 / 24)) * 24) + "小时" + parseInt((parseFloat(time / 3600.0) - - parseInt(time / 3600.0)) * 60) + "分钟" + - parseInt((parseFloat((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60) - - parseInt((parseFloat(time / 3600.0) - parseInt(time / 3600.0)) * 60)) * 60) + "秒"; - } - else { - time = parseInt(time) + "秒"; - } - } - return time; }, - - signObject: function (jsonObj){ //签名字段 - let sort = [] - for(let k in jsonObj){ + // myVxAppId: 'wx1489e48e6a547023', + signObject: function(jsonObj) { //签名字段 + jsonObj.sign_type = "md5"; + jsonObj.app_id = "ud8yq5tv0inxupc05xfeau39jywlqoj2"; + jsonObj.deviceInfo = "BC0703A4-AFB0-4B51-9089-9B7487C0CC6E"; + jsonObj.salt = myCommonSalt(32); + jsonObj.token = "99ecd32eed1b4ebea71bc73b0aabbb99"; + let sort = []; + for (let k in jsonObj) { sort.push({ keyname: k, value: jsonObj[k] - }) + }); } - return this.myGetSign(sort) + return this.myGetSign(sort); }, - - clientBrowser: function () { // 判断客户端 + clientBrowser: function() { // 判断客户端 if (/MicroMessenger/.test(window.navigator.userAgent)) { console.log("微信客户端"); - return '微信' + return "微信"; } else if (/AlipayClient/.test(window.navigator.userAgent)) { console.log("支付宝客户端"); - return '支付宝' + return "支付宝"; } else if (/BankabciPhone/.test(window.navigator.userAgent)) { console.log("农行客户端"); - return '立即' - }else if (/BankabcAndroid/.test(window.navigator.userAgent)) { + return "立即"; + } else if (/BankabcAndroid/.test(window.navigator.userAgent)) { console.log("农行客户端"); - return '立即' - }else { + return "立即"; + } else { console.log("其他浏览器"); - return '支付宝' + return "支付宝"; } }, - // 1:支付宝 2：微信 3：银联 10:H5 4微信公众号 34 农行 - clientBrowsePayType: function () { // 判断客户端 + clientBrowsePayType: function() { // 判断客户端 if (/MicroMessenger/.test(window.navigator.userAgent)) { console.log("微信客户端"); - return '4' + return "4"; } else if (/AlipayClient/.test(window.navigator.userAgent)) { console.log("支付宝客户端"); - return '1' + return "1"; } else if (/BankabciPhone/.test(window.navigator.userAgent)) { console.log("农行客户端"); - return '34' - }else if (/BankabcAndroid/.test(window.navigator.userAgent)) { + return "34"; + } else if (/BankabcAndroid/.test(window.navigator.userAgent)) { console.log("农行客户端"); - return '34' - }else { + return "34"; + } else { console.log("其他浏览器"); - return '1' + return "1"; } }, - // 0eca8f5373ca4866aec2f8e9d9367104 老的id - // 14318527b13840c2a4af63fef52c2d6e 老的签名 - - // ud8yq5tv0inxupc05xfeau39jywlqoj2 新的id - // ny1u72b6k374sg379z0kqjgfxe2ycnpw 新的签名 - - myVarAppid:'ud8yq5tv0inxupc05xfeau39jywlqoj2',// 公共请求Appid - - myDeviceInfo: 'BC0703A4-AFB0-4B51-9089-9B7487C0CC6E', // 公共请求设备信息 - - myVxAppId: 'wx1489e48e6a547023', - // 测试环境 微信赤峰 appid wxff4cebaedbf4f886 - // 微信赤峰 appid wx2af2bab90d433c86 - // 黄石 appid wxa1a66cc7d263afe6 - - myOrgId: '10120', // 归属地 赤峰id 10003 黄石 10079 - - myGetSign: function (objb) { // 获取签名 - var compare = function (obj1, obj2) { + myVarAppid: "ud8yq5tv0inxupc05xfeau39jywlqoj2",// 公共请求Appid + myDeviceInfo: "BC0703A4-AFB0-4B51-9089-9B7487C0CC6E", // 公共请求设备信息 + myVxAppId: "wx1489e48e6a547023", + openId: "oWw3o5rY_bFsiT_nFd2CEQWGZfhs", + myOrgId: "10120", // 归属地 赤峰id 10003 黄石 10079 + myGetSign: function(objb) { // 获取签名 + var compare = function(obj1, obj2) { var val1 = obj1.keyname; var val2 = obj2.keyname; if (val1 < val2) { @@ -167,19 +143,18 @@ export default { } else { return 0; } - } + }; objb.sort(compare); - var strmd5 = 'ny1u72b6k374sg379z0kqjgfxe2ycnpw'; - for(var i=0;i'+strmd5); strmd5 = md5(strmd5); - strmd5=strmd5.toUpperCase(); + strmd5 = strmd5.toUpperCase(); return strmd5; - }, - -} + } +}; diff --git a/src/views/binding/binDing.vue b/src/views/binding/binDing.vue index a7fe640..363649f 100644 --- a/src/views/binding/binDing.vue +++ b/src/views/binding/binDing.vue @@ -8,7 +8,7 @@
- 绑定 + 绑定
diff --git a/src/views/cards/buyCardDetail.vue b/src/views/cards/buyCardDetail.vue new file mode 100644 index 0000000..2e90b86 --- /dev/null +++ b/src/views/cards/buyCardDetail.vue @@ -0,0 +1,82 @@ + + + + + diff --git a/src/views/cards/buyVipCard.vue b/src/views/cards/buyVipCard.vue new file mode 100644 index 0000000..d309b44 --- /dev/null +++ b/src/views/cards/buyVipCard.vue @@ -0,0 +1,119 @@ + + + + + diff --git a/src/views/cards/cardList.vue b/src/views/cards/cardList.vue new file mode 100644 index 0000000..e9cf55a --- /dev/null +++ b/src/views/cards/cardList.vue @@ -0,0 +1,78 @@ + + + + + diff --git a/src/views/mySelf/feedback/suggestionBack.vue b/src/views/mySelf/feedback/suggestionBack.vue index ab6b4c0..2690e7b 100644 --- a/src/views/mySelf/feedback/suggestionBack.vue +++ b/src/views/mySelf/feedback/suggestionBack.vue @@ -5,44 +5,80 @@
  • - {{i.text}} + {{i.name}}
    • -
    - + + + +
    - 提交 + 提交
    + + diff --git a/src/views/mySelf/myCars/myCars.vue b/src/views/mySelf/myCars/myCars.vue new file mode 100644 index 0000000..446206a --- /dev/null +++ b/src/views/mySelf/myCars/myCars.vue @@ -0,0 +1,139 @@ + + + + + diff --git a/src/views/mySelf/myCars/rzCarNumber.vue b/src/views/mySelf/myCars/rzCarNumber.vue new file mode 100644 index 0000000..923c5aa --- /dev/null +++ b/src/views/mySelf/myCars/rzCarNumber.vue @@ -0,0 +1,78 @@ + + + + + diff --git a/src/views/mySelf/selfNav.vue b/src/views/mySelf/selfNav.vue index 607589c..152b386 100644 --- a/src/views/mySelf/selfNav.vue +++ b/src/views/mySelf/selfNav.vue @@ -4,32 +4,112 @@
      -
    • 15911111111
      • -
    • 账户余额: ￥100.00
      • -
    • 我的卡券：20张
      • +
    • +
    • {{phoneNum}}
      • + +
    - + - + - + - + -
    - 退出账户 + + + + + +
    + + 退出账户 +
    +
    + 登录绑定
    diff --git a/vue.config.js b/vue.config.js new file mode 100644 index 0000000..8a915da --- /dev/null +++ b/vue.config.js @@ -0,0 +1,18 @@ +const path = require('path') +module.exports = { + css:{ + loaderOptions:{ + less:{ + modifyVars:{ + //通过本地less文件覆盖变量 + // true; @import "your-less-file-path.less"; + modifyVars: { + hack: `true; @import "${path.resolve(__dirname, './src/assets/css/resetVantUi.less')}";` + } + } + } + } + } +} + +}