Skip to content

O
offical_web
Commit 73e04781 by wusiyi
Options

Merge branch 'dev'

parents 06b84a0e c048704b
Showing with 7563 additions and 2513 deletions
element-variables.scss
...@@ -6,37 +6,75 @@ ...@@ -6,37 +6,75 @@
/* Transition /* Transition
-------------------------- */ -------------------------- */
$--all-transition: all .3s cubic-bezier(.645,.045,.355,1) !default; $--all-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
$--fade-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default; $--fade-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
$--fade-linear-transition: opacity 200ms linear !default; $--fade-linear-transition: opacity 200ms linear !default;
$--md-fade-transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default; $--md-fade-transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
$--border-transition-base: border-color .2s cubic-bezier(.645,.045,.355,1) !default; opacity 300ms cubic-bezier(0.23, 1, 0.32, 1) !default;
$--color-transition-base: color .2s cubic-bezier(.645,.045,.355,1) !default; $--border-transition-base: border-color 0.2s
cubic-bezier(0.645, 0.045, 0.355, 1) !default;
$--color-transition-base: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !default;
/* Color /* Color
-------------------------- */ -------------------------- */
/// color|1|Brand Color|0 /// color|1|Brand Color|0
$--color-primary: #409EFF !default; $--color-primary: #eca217 !default;
/// color|1|Background Color|4 /// color|1|Background Color|4
$--color-white: #FFFFFF !default; $--color-white: #ffffff !default;
/// color|1|Background Color|4 /// color|1|Background Color|4
$--color-black: #000000 !default; $--color-black: #000000 !default;
$--color-primary-light-1: mix($--color-white, $--color-primary, 10%) !default; /* 53a8ff */ $--color-primary-light-1: mix(
$--color-primary-light-2: mix($--color-white, $--color-primary, 20%) !default; /* 66b1ff */ $--color-white,
$--color-primary-light-3: mix($--color-white, $--color-primary, 30%) !default; /* 79bbff */ $--color-primary,
$--color-primary-light-4: mix($--color-white, $--color-primary, 40%) !default; /* 8cc5ff */ 10%
$--color-primary-light-5: mix($--color-white, $--color-primary, 50%) !default; /* a0cfff */ ) !default; /* 53a8ff */
$--color-primary-light-6: mix($--color-white, $--color-primary, 60%) !default; /* b3d8ff */ $--color-primary-light-2: mix(
$--color-primary-light-7: mix($--color-white, $--color-primary, 70%) !default; /* c6e2ff */ $--color-white,
$--color-primary-light-8: mix($--color-white, $--color-primary, 80%) !default; /* d9ecff */ $--color-primary,
$--color-primary-light-9: mix($--color-white, $--color-primary, 90%) !default; /* ecf5ff */ 20%
) !default; /* 66b1ff */
$--color-primary-light-3: mix(
$--color-white,
$--color-primary,
30%
) !default; /* 79bbff */
$--color-primary-light-4: mix(
$--color-white,
$--color-primary,
40%
) !default; /* 8cc5ff */
$--color-primary-light-5: mix(
$--color-white,
$--color-primary,
50%
) !default; /* a0cfff */
$--color-primary-light-6: mix(
$--color-white,
$--color-primary,
60%
) !default; /* b3d8ff */
$--color-primary-light-7: mix(
$--color-white,
$--color-primary,
70%
) !default; /* c6e2ff */
$--color-primary-light-8: mix(
$--color-white,
$--color-primary,
80%
) !default; /* d9ecff */
$--color-primary-light-9: mix(
$--color-white,
$--color-primary,
90%
) !default; /* ecf5ff */
/// color|1|Functional Color|1 /// color|1|Functional Color|1
$--color-success: #67C23A !default; $--color-success: #67c23a !default;
/// color|1|Functional Color|1 /// color|1|Functional Color|1
$--color-warning: #ff9900 !default; $--color-warning: #ff9900 !default;
/// color|1|Functional Color|1 /// color|1|Functional Color|1
$--color-danger: #F56C6C !default; $--color-danger: #f56c6c !default;
/// color|1|Functional Color|1 /// color|1|Functional Color|1
$--color-info: #909399 !default; $--color-info: #909399 !default;
...@@ -56,19 +94,19 @@ $--color-text-regular: #606266 !default; ...@@ -56,19 +94,19 @@ $--color-text-regular: #606266 !default;
/// color|1|Font Color|2 /// color|1|Font Color|2
$--color-text-secondary: #909399 !default; $--color-text-secondary: #909399 !default;
/// color|1|Font Color|2 /// color|1|Font Color|2
$--color-text-placeholder: #C0C4CC !default; $--color-text-placeholder: #c0c4cc !default;
/// color|1|Border Color|3 /// color|1|Border Color|3
$--border-color-base: #DCDFE6 !default; $--border-color-base: #dcdfe6 !default;
/// color|1|Border Color|3 /// color|1|Border Color|3
$--border-color-light: #E4E7ED !default; $--border-color-light: #e4e7ed !default;
/// color|1|Border Color|3 /// color|1|Border Color|3
$--border-color-lighter: #EBEEF5 !default; $--border-color-lighter: #ebeef5 !default;
/// color|1|Border Color|3 /// color|1|Border Color|3
$--border-color-extra-light: #F2F6FC !default; $--border-color-extra-light: #f2f6fc !default;
// Background // Background
/// color|1|Background Color|4 /// color|1|Background Color|4
$--background-color-base: #F5F7FA !default; $--background-color-base: #f5f7fa !default;
/* Link /* Link
-------------------------- */ -------------------------- */
...@@ -92,9 +130,9 @@ $--border-radius-zero: 0 !default; ...@@ -92,9 +130,9 @@ $--border-radius-zero: 0 !default;
// Box-shadow // Box-shadow
/// boxShadow|1|Shadow|1 /// boxShadow|1|Shadow|1
$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04) !default; $--box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04) !default;
// boxShadow|1|Shadow|1 // boxShadow|1|Shadow|1
$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .12) !default; $--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.12) !default;
/// boxShadow|1|Shadow|1 /// boxShadow|1|Shadow|1
$--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default; $--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default;
...@@ -211,8 +249,6 @@ $--checkbox-button-checked-font-color: $--color-white !default; ...@@ -211,8 +249,6 @@ $--checkbox-button-checked-font-color: $--color-white !default;
/// color||Color|0 /// color||Color|0
$--checkbox-button-checked-border-color: $--color-primary !default; $--checkbox-button-checked-border-color: $--color-primary !default;
/* Radio /* Radio
-------------------------- */ -------------------------- */
/// fontSize||Font|1 /// fontSize||Font|1
...@@ -481,8 +517,8 @@ $--cascader-menu-radius: $--border-radius-base !default; ...@@ -481,8 +517,8 @@ $--cascader-menu-radius: $--border-radius-base !default;
$--cascader-menu-border: solid 1px $--border-color-light !default; $--cascader-menu-border: solid 1px $--border-color-light !default;
$--cascader-menu-shadow: $--box-shadow-light !default; $--cascader-menu-shadow: $--box-shadow-light !default;
$--cascader-node-background-hover: $--background-color-base !default; $--cascader-node-background-hover: $--background-color-base !default;
$--cascader-node-color-disabled:$--color-text-placeholder !default; $--cascader-node-color-disabled: $--color-text-placeholder !default;
$--cascader-color-empty:$--color-text-placeholder !default; $--cascader-color-empty: $--color-text-placeholder !default;
$--cascader-tag-background: #f0f2f5; $--cascader-tag-background: #f0f2f5;
/* Group /* Group
...@@ -592,7 +628,6 @@ $--button-info-background-color: $--color-info !default; ...@@ -592,7 +628,6 @@ $--button-info-background-color: $--color-info !default;
$--button-hover-tint-percent: 20% !default; $--button-hover-tint-percent: 20% !default;
$--button-active-shade-percent: 10% !default; $--button-active-shade-percent: 10% !default;
/* cascader /* cascader
-------------------------- */ -------------------------- */
$--cascader-height: 200px !default; $--cascader-height: 200px !default;
...@@ -636,11 +671,11 @@ $--table-font-color: $--color-text-regular !default; ...@@ -636,11 +671,11 @@ $--table-font-color: $--color-text-regular !default;
/// color||Color|0 /// color||Color|0
$--table-header-font-color: $--color-text-secondary !default; $--table-header-font-color: $--color-text-secondary !default;
/// color||Color|0 /// color||Color|0
$--table-row-hover-background-color:#35e6dc; $--table-row-hover-background-color: #35e6dc;
$--table-current-row-background-color:#35e6dc !important; $--table-current-row-background-color: #35e6dc !important;
/// color||Color|0 /// color||Color|0
$--table-header-background-color: $--color-white !default; $--table-header-background-color: $--color-white !default;
$--table-fixed-box-shadow: 0 0 10px rgba(0, 0, 0, .12) !default; $--table-fixed-box-shadow: 0 0 10px rgba(0, 0, 0, 0.12) !default;
/* Pagination /* Pagination
-------------------------- */ -------------------------- */
...@@ -828,8 +863,11 @@ $--loading-fullscreen-spinner-size: 50px !default; ...@@ -828,8 +863,11 @@ $--loading-fullscreen-spinner-size: 50px !default;
/* Scrollbar /* Scrollbar
--------------------------*/ --------------------------*/
$--scrollbar-background-color: rgba($--color-text-secondary, .3) !default; $--scrollbar-background-color: rgba($--color-text-secondary, 0.3) !default;
$--scrollbar-hover-background-color: rgba($--color-text-secondary, .5) !default; $--scrollbar-hover-background-color: rgba(
$--color-text-secondary,
0.5
) !default;
/* Carousel /* Carousel
--------------------------*/ --------------------------*/
...@@ -938,7 +976,7 @@ $--link-info-font-color: $--color-info !default; ...@@ -938,7 +976,7 @@ $--link-info-font-color: $--color-info !default;
/// border||Other|4 /// border||Other|4
$--calendar-border: $--table-border !default; $--calendar-border: $--table-border !default;
/// color||Other|4 /// color||Other|4
$--calendar-selected-background-color: #F2F8FE !default; $--calendar-selected-background-color: #f2f8fe !default;
$--calendar-cell-width: 85px !default; $--calendar-cell-width: 85px !default;
/* Form /* Form
...@@ -951,7 +989,7 @@ $--form-label-font-size: $--font-size-base !default; ...@@ -951,7 +989,7 @@ $--form-label-font-size: $--font-size-base !default;
/// color||Color|0 /// color||Color|0
$--avatar-font-color: #fff !default; $--avatar-font-color: #fff !default;
/// color||Color|0 /// color||Color|0
$--avatar-background-color: #C0C4CC !default; $--avatar-background-color: #c0c4cc !default;
/// fontSize||Font Size|1 /// fontSize||Font Size|1
$--avatar-text-font-size: 14px !default; $--avatar-text-font-size: 14px !default;
/// fontSize||Font Size|1 /// fontSize||Font Size|1
...@@ -973,23 +1011,49 @@ $--lg: 1200px !default; ...@@ -973,23 +1011,49 @@ $--lg: 1200px !default;
$--xl: 1920px !default; $--xl: 1920px !default;
$--breakpoints: ( $--breakpoints: (
'xs' : (max-width: $--sm - 1), 'xs': (
'sm' : (min-width: $--sm), max-width: $--sm - 1,
'md' : (min-width: $--md), ),
'lg' : (min-width: $--lg), 'sm': (
'xl' : (min-width: $--xl) min-width: $--sm,
),
'md': (
min-width: $--md,
),
'lg': (
min-width: $--lg,
),
'xl': (
min-width: $--xl,
),
); );
$--breakpoints-spec: ( $--breakpoints-spec: (
'xs-only' : (max-width: $--sm - 1), 'xs-only': (
'sm-and-up' : (min-width: $--sm), max-width: $--sm - 1,
'sm-only': "(min-width: #{$--sm}) and (max-width: #{$--md - 1})", ),
'sm-and-down': (max-width: $--md - 1), 'sm-and-up': (
'md-and-up' : (min-width: $--md), min-width: $--sm,
'md-only': "(min-width: #{$--md}) and (max-width: #{$--lg - 1})", ),
'md-and-down': (max-width: $--lg - 1), 'sm-only': '(min-width: #{$--sm}) and (max-width: #{$--md - 1})',
'lg-and-up' : (min-width: $--lg), 'sm-and-down': (
'lg-only': "(min-width: #{$--lg}) and (max-width: #{$--xl - 1})", max-width: $--md - 1,
'lg-and-down': (max-width: $--xl - 1), ),
'xl-only' : (min-width: $--xl), 'md-and-up': (
min-width: $--md,
),
'md-only': '(min-width: #{$--md}) and (max-width: #{$--lg - 1})',
'md-and-down': (
max-width: $--lg - 1,
),
'lg-and-up': (
min-width: $--lg,
),
'lg-only': '(min-width: #{$--lg}) and (max-width: #{$--xl - 1})',
'lg-and-down': (
max-width: $--xl - 1,
),
'xl-only': (
min-width: $--xl,
),
); );
package-lock.json
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json
...@@ -32,6 +32,7 @@ ...@@ -32,6 +32,7 @@
"vue-infinite-viewer": "~0.9.1", "vue-infinite-viewer": "~0.9.1",
"vue-json-viewer": "^2.2.22", "vue-json-viewer": "^2.2.22",
"vue-router": "^3.5.3", "vue-router": "^3.5.3",
"vue-seamless-scroll": "^1.1.23",
"vue-selecto": "~1.10.1", "vue-selecto": "~1.10.1",
"vuedraggable": "~2.23.2", "vuedraggable": "~2.23.2",
"vuex": "^3.4.0", "vuex": "^3.4.0",
...@@ -41,6 +42,7 @@ ...@@ -41,6 +42,7 @@
"xlsx": "~0.16.1" "xlsx": "~0.16.1"
}, },
"devDependencies": { "devDependencies": {
"@iconify/vue2": "^2.1.0",
"@vue/cli-plugin-babel": "~4.5.15", "@vue/cli-plugin-babel": "~4.5.15",
"@vue/cli-plugin-eslint": "~4.5.15", "@vue/cli-plugin-eslint": "~4.5.15",
"@vue/cli-plugin-router": "~4.5.15", "@vue/cli-plugin-router": "~4.5.15",
...@@ -58,7 +60,7 @@ ...@@ -58,7 +60,7 @@
"less": "^3.0.4", "less": "^3.0.4",
"less-loader": "^5.0.0", "less-loader": "^5.0.0",
"mockjs": "^1.1.0", "mockjs": "^1.1.0",
"prettier": "^2.2.1", "prettier": "^2.8.8",
"sass": "^1.58.3", "sass": "^1.58.3",
"sass-loader": "^10", "sass-loader": "^10",
"stylus": "~0.54.7", "stylus": "~0.54.7",
......
src/assets/css/common.css
...@@ -74,7 +74,6 @@ input { ...@@ -74,7 +74,6 @@ input {
border: 0; border: 0;
outline: none; outline: none;
vertical-align: baseline; vertical-align: baseline;
} }
html, html,
...@@ -143,7 +142,7 @@ body { ...@@ -143,7 +142,7 @@ body {
padding: 3px 0; padding: 3px 0;
} }
.el-tabs--border-card>.el-tabs__content { .el-tabs--border-card > .el-tabs__content {
padding: 10px; padding: 10px;
} }
...@@ -161,7 +160,7 @@ body { ...@@ -161,7 +160,7 @@ body {
background-color: #35e6dc !important; background-color: #35e6dc !important;
} }
.height>td { .height > td {
background-color: #ff4747 !important; background-color: #ff4747 !important;
color: #fff; color: #fff;
} }
...@@ -227,15 +226,15 @@ body { ...@@ -227,15 +226,15 @@ body {
line-height: 24px; line-height: 24px;
} }
.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before { .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before {
content: '*'; content: '*';
color: #f55555; color: #f55555;
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
} }
.el-button+.el-button, .el-button + .el-button,
.el-button+.el-dropdown { .el-button + .el-dropdown {
margin-left: 5px; margin-left: 5px;
} }
...@@ -333,7 +332,7 @@ body { ...@@ -333,7 +332,7 @@ body {
font-size: 14px; font-size: 14px;
} }
.index-tableOperate>div { .index-tableOperate > div {
cursor: pointer; cursor: pointer;
border-radius: 4px; border-radius: 4px;
height: 40px; height: 40px;
...@@ -604,8 +603,6 @@ ul li { ...@@ -604,8 +603,6 @@ ul li {
border: none; border: none;
} }
.show-column { .show-column {
position: absolute; position: absolute;
z-index: 5; z-index: 5;
...@@ -836,13 +833,12 @@ ul li { ...@@ -836,13 +833,12 @@ ul li {
display: inline-block; display: inline-block;
width: 24px; width: 24px;
height: 24px; height: 24px;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAWUUlEQVR4Xu2de5Ac1XXGv9OzSBYq2xRIdkGCTQgPBQgxSIbdnp1eyUAoUDAJqRAnNlWYx8xKeJUoSUHZkEJUQYxxFdisI02PeJUdYhOXsYFCig3xamd2elc2Qg4PG2zjECWYsiUIwpaEpJ0+qUGQAEaib885d7p37v6753733N93v+memZ5ugvtzBByB/RIgx8YRcAT2T8AFxO0OR+AABFxA3PZwBFxA3B5wBNIRcEeQdNzcqB4h4ALSI0a7ZaYj4AKSjpsb1SMEXEB6xGi3zHQEXEDScXOjeoSAlYCUH1r43sK75hzG3JqHFh88E9i2yNtR4Hjrjj07t37l7Md2ZHFNF3375LlzZx08v0Xe/ALHc7PYo3FPBdpJVNjWemXXC7WzNm03Hm84QC0glzf6z/S4cDaYLwLh/YZ95aqcwY8R0T978B5eU5rY1M3mlzUGF8aIz2TmvyTQyd3sRX1uxi9A9JWYWt9eW5p6WGM+8YAMjxc/zoQRgE/XaDjzmsT30jSPVpdMbbDZ6/BY/2LuoxEwXWBz3uzMRRuJMVodat4t2ZNYQJZNFEvcij/NROdINphXLQJu2+PR39wx2PyV5houmSi+e1bMNzNwmeY8edEm5vVU8D67ZrDZkOhZJCDDdf9yBv4RwEESTc0gjR9zH59f8yef0lhTORpYQNN0H4DjNPRzrLmXgCuqQbS20zV0HJByw7+WGKs6bWQmj/daNLBmSXNKco3Lxor9cYEnJTVnmhYzrqsNRR3tzY4CUm4M/Bkx/ctMA6uznsKJYdD4oYR2pV46AWg9KaE10zWY+MJaafLradeZOiAuHIbICU+BC3/aaUheDQe1vgHGAsMOera8k5CkCsjKaGDOrmlvisEz+2NE+S11VxhEn+xEtlL37wRwcScavTaWQI/N6Yv7b/End5muPVVAhuv+lQx8znQyVw945J21pjSR6jP7ZY3BM2OOH3IczQkQcFU1iG4yHWkckPa34jRr9pMg/JbpZK4eAPMD4dDkR9OwqIwP3A+i89KM7fkxjOd4z+4TTb99Nw5IZbx4Logf7Hng6QHs5O2759fO27TTRKL8wMKD6b2ztwKYEZfqmKxdrJZpaTjUXGeiZxyQcsO/nhhXm0zyWu1LIDwL5pdSjM3cEIJ3KIOPBTDHuLmY/jBc3DQ6VapsKJ4Fj79jPBewi0A/YcQvphibvSFEh4BxFIBDTJtjwg21UnSNyTjjgFTqA2MALTaZROLzaJP5bNUOj/UfxQXvWtM3zWl4pPy+6S5qxddVl0w9a4uJrXnK4/4qIrTZG/zxhjCYXGIwAOYBGfcfB+GkxJMwauFQVElcn8PCcn3gEQItTNo6A1+rBdFfJK1v15Xr/lcJ+FjSMQzeVAsmFyWtz2NdZdwPQSgn7p3xRDgU/X7ieiBFQOr+zwEcnnQSQmGwGjSaSevzWFeuD/w1gW4x6H1zGESnGtSjUvcfBXBK0jEMXlkLJr+QtD6PdcP1UpHRmjDo/fkwiI4wqE8VkD0m11zt9eg92hfsmSxYo7ZcLx1OaLVfOJL9EXaGpcjo9xmVhr8DnPwNOqNwRC1oPJ+soXxWtS/UPCjmlw263xsG0SyD+lQBYZMJwiAyPo0z0c9KbaXuq3LR1s8KR9M+tLkYb17thkwBZaVem4u2flY4mvahzcUFxNSR/dRrG6WtL4TBuow2FxcQIUu1jdLWF8JgXUabiwuIkKXaRmnrC2GwLqPNxQVEyFJto7T1hTBYl9Hm4gIiZKm2Udr6Qhisy2hzcQERslTbKG19IQzWZbS5uIAIWaptlLa+EAbrMtpcXECELNU2SltfCIN1GW0uLiBClmobpa0vhMG6jDYXFxAhS7WN0tYXwmBdRpuLC4iQpdpGaesLYbAuo83FBUTIUm2jtPWFMFiX0ebiAiJkqbZR2vpCGKzLaHNxARGyVNsobX0hDNZltLm4gAhZqm2Utr4QBusy2lxcQIQs1TZKW18Ig3UZbS4uIEKWahulrS+EwbqMNhcXECFLtY3S1hfCYF1Gm4sLiJCl2kZp6wthsC6jzcUFRMhSbaO09YUwWJfR5uICImSptlHa+kIYrMtoc3EBEbJU2yhtfSEM1mW0ubiACFmqbZS2vhAG6zLaXFxAhCzVNkpbXwiDdRltLi4gQpZqG6WtL4TBuow2FxcQIUu1jdLWF8JgXUabiwuIkKXaRmnrC2GwLqPNxQVEyFJto7T1hTBYl9Hm4gIiZKm2Udr6Qhisy2hzcQERslTbKG19IQzWZbS5uIAIWaptlLa+EAbrMtpcXECELNU2SltfCIN1GW0uLiBClmobpa0vhMG6jDYXFxAhS7WN0tYXwmBdRpuLC4iQpdpGaesLYbAuo83FBUTIUm2jtPWFMFiX0ebiAiJkqbZR2vpCGKzLaHNxARGyVNsobX0hDNZltLm4gAhZqm2Utr4QBusy2lxcQIQs1TZKW18Ig3UZbS4uIEKWahulrS+EwbqMNhcXECFLtY3S1hfCYF1Gm4sLiJCl2kZp6wthsC6jzcUFRMhSbaO09YUwWJfR5uICImSptlHa+kIYrMtoc3EBEbJU2yhtfSEM1mW0ubiACFmqbZS2vhAG6zLaXFxAhCzVNkpbXwiDdRltLmkC8j8ADklKgvfimNoZ0TNJ6/NYNzzWv5gL3phB78+GQfQ7BvXQ3ggmvWSpVptLmoD8GMCxSSERaKQaNL+UtD6PdeVx/3YiXJK4d8a6cChamrgecAHZD6zsBaRRnABzMbG5hC3xNM5fuyT6QeIxOSq8vO5/zAO+atYyfz4MJq80GaO9EUx6yVKtNpcUR5Di5wH+O0NILzHz5+DhGW+atxqOzWQ599HhDDqOGKtMG2Tgj2pB9KDJOO2NYNJLlmq1uaQIiH8+gG9lCVLeeqEC3l8tRr806Vt7I5j0kqVabS7GAfnURPGIvTE/lyVIueqFMRkORb5pz9obwbSfrNRrczEOSBtMpe7fCmAkK5Dy1AcBn6wG0V2mPWtvBNN+slKvzSVVQJZHA8e0pmkjgEOzAioPfTD44VoweVaaXrU3QpqesjBGm0uqgLTBlBv+tWneoGYBatd6IO+jYWnigTTza2+END1lYYw2l9QBee1U618BnJ0FUFnvgYGbakF0Vdo+tTdC2r66PU6bS0cBeS0k2wG8p9ugMj7/ujAw+2LwrevR3ggZ57ff9rS5dByQdufDjeJDzHxmXiFr9k1EN1ZLzU93Oof2Rui0v26N1+YiEpBXjyQN/0YwUp9CdAuw6ryES8JSdKfEHNobQaLHbmhocxELyKshGS9eAIpHAFrcDVgZmvNupni0Vppqf9In8qe9EUSa7IKINhfRgLzOp1wvXkbEF4KR6iPNLnDufErCTmbczzF9ee3i5vrOBd+soL0RpPu1pafNRSUgr8NZPh4cGVPr/Bjx0QDNI+AwgA+2BU91HqadIPwS4K0EejTevvv+2nmbdmrNqb0RtPrW1tXmohoQbTi9pK+9EfLKUpuLC0hOdob2RsgJht9oU5uLC0hOdob2RsgJBheQvBql3bcLyNsT1ubijiDaO1tIX3sjCLVpXUabiwuIdUvTTai9EdJ11f1R2lxcQLrvcaIOtDdCoiYyWKTNxQUkg6a/XUvaGyEnGNyb9Lwapd23C4h7k669x3KtX6kXtwI8L+kiCn187Gp/8qdJ6/NYVx5bOI8Ks5PfJYewMyxFc03W6k6xTGh1sbZSL04ABvcjA1aEQTTaxZbVpx6u9xcZ3kTiiQhbwlL0wcT1AFxATGh1sdb47o3Ai2EQHdbFltWnrtQHxgyvHN8cBtGpJo25gJjQ6mJtueGvIMYXjVogPAmiKzn2NteCxvNGYzNaPFIvzd9N8fGE+GIwXWrUJtM3w6HmBSZjVAOyvOl/aDpGgBh/QETHAzje5DzaZCG2axnYSuAnwfTD2MMUeYhqRb2bdLdZtlrYbHudM2k+ApZXg2iNyZrEA7J8vP/3YvJG2rfXBHCkSTO5r2U8QR6+dtCvWqOj5258WXo9lbq/peeYCkKMY5y2dnH0fRNJsYCMrDtn9u652/+ePIyAe/smDgz8CMBozfDV6p2MG677qxlY9k517v9vR4A2hkGz35SNSECWNQaPjuP4HhAWmTYwk+sJ9PVq0LxQao3to3PL86Z6/QUoDU9i+kR1qHm36diOA1JuFAeJuWE6cc/UM/47HIrETjXL4/71RLi6Z/gJLJSY11eHJs9NI9VRQNyNrBMjfzwMopMTVx+gsH0qu2fu9gl3tE5Mc6/n0RlrBpupXsRTB2RlNDBn5zR9B8Bg4lZ7u/DmMIj+VgLBq6e0HM/ox9pJcGprEFCuBtHatHqpAzJc99cycFnaiXtxHAPLpd64u1Pbd95BzLiuNhQZP+DojcqpApLioZXvvJoeqGh/ujX7161+qY+AXzvFvccdxX9j87xCjKXVoei7nW6rVAGpNAa+ASajbyQ7bXSmjCfCNdVSdIPUetqnurum6VZ3NN9HtP2G3Oujz6wuyjwT0zggw03/JG7hcSmDe02nfRSpBdEJ0ut+9ajeRyO9+8JFG4kxmuaj3AN5YR6Q8YEKE1WlDe4lPc+jBWsGm09rrLn9AoZpLsZE7ScRLyBgPkDzATa6zFujNxFNQvvmfNvAeAHAFgIiIG5Wg6mmiP5bRIwDUq77XybgIsNmXgSwqtDH62fKbxQq9dIJzK0LiXCtIQsQ8aXV0uQdpuNcvX0CaQLyPQI+nLhVwpNhKTopcX0OC01/7QfG6nAouiKHS+25lo0DUqn7/wHgqMSkPFoaDjbXJa7PYWF53F9ldiThDWEwuSSHS+25llMEpPhrk/NZRuGImfJbhP3tjmWNwYUxx48k3T3tS+VrQfS+pPWurnsEUgTEZ5N2wyAynsNEPyu1pqdZvcIlK/6k7cN487qN8PaoHZe0WzDb41xAhPxxARECmTEZFxAhQ1xAhEBmTMYFRMgQFxAhkBmTcQERMsQFRAhkxmRcQIQMcQERApkxGRcQIUNcQIRAZkzGBUTIEBcQIZAZk3EBETIkywFpX1hJrb0z45v7Wd62ePbup2uLNu0Vsu6AMi4gQpSzEpDy2MACKtAiEC0GuB+ME4WWmDWZn4Hp34n4oVaMR0xvCJd0MS4gSUm9Q123A+J+MJWRH0x1eyMI7WdxmW5xuWSi+O5ZMd/sfnK7z9L2T26p4H027W1+3rox3BFEKCrdCEg5GlhA03QfgOOEljFTZPYScEUnt/t5HYQLiNCWsB2QykRxEWI2uhGz0FJzI9OV2/7Y3gh5ccMml+Gm/z5u4Rd5YdPNPolxRie3/3FHECH3bAVk1djivucLe74FYKlQ6zNd5pVCAQNpbwPkAiK0PWwFxN282twwqzevtrURzDF0d4QNLu7xB+k9tvb4AxsbIT2G7o20wcU9QKcTfy09QMfGRugEQ7fG2uAy3PCfY8YR3Vpj3uclxIOmN5hz70GEXNcOyHB94DQGbUzVLuM5EP8k1djMDaL2LaeS33bqDf0TcFU1iG4yWZILiAmtA9TqB6S4ksE3G7XbDgZoRTjUvNdoXMaLy43+04npRsNnpLdXdV8YRH9ssjwXEBNaXQxIpe7fCeDixO0KP/ot8bwWCyuNgduMnpVO+EFYik4xadEFxIRWFwNSrvtGt3xl8MpaMPkFoeVlUma4XioyWhOJmyM8F5ai305cv+8JVWZ/2qcSZt1kp1qbS6Xu7mj5VrfbF2oeFLPJ8+j3hkE0y2TXuICY0OriEUQ7gEIYrMtoc3EBEbJU2yhtfSEM1mW0ubiACFmqbZS2vhAG6zLaXFxAhCzVNkpbXwiDdRltLi4gQpZqG6WtL4TBuow2FxcQIUu1jdLWF8JgXUabiwuIkKXaRmnrC2GwLqPNxQVEyFJto7T1hTBYl9Hm4gIiZKm2Udr6Qhisy2hzcQERslTbKG19IQzWZbS5uIAIWaptlLa+EAbrMtpcXECELNU2SltfCIN1GW0uLiBClmobpa0vhMG6jDYXFxAhS7WN0tYXwmBdRpuLC4iQpdpGaesLYbAuo83FBUTIUm2jtPWFMFiX0ebiAiJkqbZR2vpCGKzLaHNxARGyVNsobX0hDNZltLm4gAhZqm2Utr4QBusy2lxcQIQs1TZKW18Ig3UZbS4uIEKWahulrS+EwbqMNhcXECFLtY3S1hfCYF1Gm4sLiJCl2kZp6wthsC6jzcUFRMhSbaO09YUwWJfR5mIekIa/A4yDk5Lg1u75tSWbtiWtz2Pd8mjgmNY0GdwcmraFQXO+yVor9eJWgOclHVPo42NX+5M/TVqfx7ry2MJ5VJi9NXHvhJ1hKZqbuD7VnRUb/n+C8YGkk6S55XxS7azUVer+CIBbk/dDzTBoDiavByr14gTARYMxK8IgGjWoz13pcL2/yPBMbj26JSxFHzRZqPkRpO4/CsDgBsC8IQwml5g0lbfaSt1/AcChSftmxh21oejSpPXtuvK4fzsRLjEY82IYRIcZ1OeutFIfGDO8w/vmMIhONVmoeUDGi/eC+E9MJgHx7QzvrtnsPT0aNJIfEo0msVtcrpcOJy8+Bcw3gXGiyexM+KtaKTI44gDlhr+CGF80mQeEJ0F0Jcfe5lrQeN5obEaLR+ql+bspPp4QX2x0Z/f2epi+GQ41LzBZmnFAhuv+MgZWm0ziat9MoFDAKaZPXV3e9D/UamGzY5meAAHLq0G0xkTBOCCXb/A/7Hn4nskkrvZNBP4rDKLE7+HeOLJS97cAONLxTEcgjnHa2sXR901GGwekLV6pF6cAPt1kIle7jwABa6pBtDwND/cQzzTUXh9j6SGe7emGx4sfZ+J/6qTdnhxLeLkQx/2rh6Z+lGb97jHQaai99sLE9InqUPNuU4VUR5B9IRlYx0TnmE7Yy/XMuKE2FF3TCYPyuH89Ea7uRKPXxhLz+urQ5Llp1p06IMsmiqU45n8DcFCaiXtuDOORWTveOzh67vrdnax9ZN05s/fM3T4BwqJOdHpo7F7PozPWDDYbadacOiCvHkXq/uUM1NJM3GtjPPJ+d01p4mcS617WGDw65vgZCa2ZrkFAuRpEa9Ous6OAtCctN/xribEqbQO9MI6JSrVSM/k3vgmglBvFQWJO9aqYQH5GlDDjutpQ1NHe7Dgg+96P+B9hwoMA3jUjyMotYuIgj/78S4PNn8tJ/r/SpyaKR+yN+R4ARpetaPSSMc1XiLG0OhR9t9O+RALSbqL9RVY8zf/g3rjvs4SA2+b08Ypb/MldnZp0oPEro4E5u6bpVgYu05wnL9rtN+ReH33G9IvY/a1PLCCvT7DvI2CM9Oz3JMT30jSPVpdMbbC5qYbH+hdzH42AyehSCps96s5FG4kxmuaj3AP1JR6Q/wtKvb8IeEUGfAAfAKF94dw8k0vldYF2qk47AN7KQPvasqc85ib6qFktRk90qtzJ+OGmfxKmuRgTta/8XUDAfIDmA2x0mXcnPaiOJewEsA2M9gWiWwiIgLhZDaaaGvOqBUSjWafpCNgm4AJim7ibL1cEXEByZZdr1jYBFxDbxN18uSLgApIru1yztgm4gNgm7ubLFQEXkFzZ5Zq1TcAFxDZxN1+uCLiA5Mou16xtAi4gtom7+XJFwAUkV3a5Zm0TcAGxTdzNlysC/wtcJnBuKa8IdAAAAABJRU5ErkJggg==); background: #fff;
/* background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADEAAAAwCAYAAAC4wJK5AAADsklEQVRoQ+1Y4VnbMBB9lwUKExQmKExQMUHpBCVO/wMTFCYA/jdJmaB0gooJGiaomaDpArl+Z8uOpMi2jGNI+eJfEJ9Penenu6dHeAUPvQIM2ILYlCxuM7GuTKgpHxDjTeGPCY96SGms/xfLhJryHhY4BeEYwF5gwzMQvgG41UOa1wFaAaHGfAHC++wjRooBLttEJSZ6Zo0vMbYAUixwrj/TXZW9A0JN+BrAqWec6oT2fQdqyooYHHLMhIdQ9NSUd8D4DkA53zH+gjCzfsuDaD+EMz2km9B6Logxz0HL2iw/IBzpIenifzVh+Xt1oeUK4ufQz6CasETzg7WRexAubN/yLgO7yMpMquJtac8Y6hFJiXn4rH/VhIORxSqIsJ0bORd4XqbLEmJc6hFd1JWUyZwAXwaMsO8H56mZkGh8qtwA4wEDqKKkzGZ+A9gxZ60RQJn1PCsahHfmN60TOnLjZWdizGcgXHmbu9cJuTVcF77AO2X7ZTzqEYW6UaXXrJMxJAj542VjtTtNWWEBBYJ8ONMjksPe6VFjlnaZR7KirpsWcM4T49ze17PMCeesEXab+n4IkBrzCQhT886pjmcHoRN60prS0sH4+SIgvHoOzpymUpL3Lwoi24DVuv/LTGQgxpyWQ8ubOTFZMIGw2cSNTuhs2axivXSw8+jMrU7opI27lTmzwEebSzURwDkGOO9KAAN93pnmTYCcIATmzLMRQDVhe8oLtxIgNukLYvFaK+BlIZ991qN6JICG1MnQKwidABHyF2Sm5r5xZe4bxS5/6ISEGDqPn4neCKBpkweGB5W3uOy+wNAYICXGjAlic+BtXia9w8dsFH4mll3EtapnpH5oahY0Eb6zCF3TkZD3t8jvE8Ebng+iFwJYSSP8+0IYjtNOQybVBDC3nq+DANaFWkQCcwGSEyrUQmi3sNyC6s90Qod1Pp7EY2Ly38XGzIU/pY/ARajyTHRZeN3felfZ2pLayExknewrH2OQiQry1BLHjQWRAbHnVg3n2mwQ7pSv5FybDUI6F+OXKam5Tmi3scVmXUHEM87ELRG6RAHsTAC7HHqHxkfqTkEF0AhhzrSsUwC7bNoXkz3JM4I7xRJAW73osuPwt456GKDxK0JDHAH06G+lUrguQL7iaAct0KViCaDoqiX3b6lqt4Um+uyxTfYMNRE5Uy5ppbJYOPZB2NpOYdNZAWyLoq19EwFMQyp020X6tt/oORELfgsiNlJ9220z0XeEY/1vMxEbqb7tXkUm/gFlj+ZA0z+8UQAAAABJRU5ErkJggg==); */
background-size: 100% 100%; background-size: 100% 100%;
} }
.summary-but.issummary { .summary-but.issummary {
background-image: url(data:image/png;base64,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); background-image: url(data:image/png;base64,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);
} }
.el-table-column1 { .el-table-column1 {
...@@ -856,13 +852,13 @@ ul li { ...@@ -856,13 +852,13 @@ ul li {
color: #666 !important; color: #666 !important;
} }
.el-table th>.cell { .el-table th > .cell {
padding-left: 3px; padding-left: 3px;
padding-right: 3px; padding-right: 3px;
/* line-height: 20px; */ /* line-height: 20px; */
} }
.plTableBox .el-table th>.cell { .plTableBox .el-table th > .cell {
padding-left: 3px !important; padding-left: 3px !important;
padding-right: 3px !important; padding-right: 3px !important;
/* line-height: 20px; */ /* line-height: 20px; */
...@@ -881,8 +877,8 @@ ul li { ...@@ -881,8 +877,8 @@ ul li {
vertical-align: top; vertical-align: top;
} }
.func-btn-wrap>div, .func-btn-wrap > div,
.func-btn-wrap>button { .func-btn-wrap > button {
margin-left: 5px; margin-left: 5px;
display: inline; display: inline;
} }
...@@ -917,7 +913,7 @@ ul li { ...@@ -917,7 +913,7 @@ ul li {
margin-bottom: 5px !important; margin-bottom: 5px !important;
} }
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { .el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
background-color: #aad2ff; background-color: #aad2ff;
} }
...@@ -931,7 +927,8 @@ ul li { ...@@ -931,7 +927,8 @@ ul li {
width: 16px; width: 16px;
} }
.account_operation span:nth-of-type(2) {} .account_operation span:nth-of-type(2) {
}
.account_operation span:nth-of-type(3) { .account_operation span:nth-of-type(3) {
width: 16px; width: 16px;
...@@ -998,7 +995,7 @@ ul li { ...@@ -998,7 +995,7 @@ ul li {
.el-message { .el-message {
z-index: 7000 !important; z-index: 7000 !important;
margin-top: 400px !important; /* margin-top: 400px !important; */
} }
.el-select.green .el-input__inner { .el-select.green .el-input__inner {
...@@ -1078,5 +1075,489 @@ ul li { ...@@ -1078,5 +1075,489 @@ ul li {
.bg-colorBg { .bg-colorBg {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgba(248, 249, 255, var(--tw-bg-opacity)); background-color: var(--background-color);
} }
\ No newline at end of file
.primary-color {
color: var(--primary-color);
}
.secondary-color {
color: var(--secondary-color);
}
/* Element UI 主题色覆盖 - 颜色变量已在 src/styles/index.scss 中基于 $primary-color 生成 */
.el-button--text {
border-color: transparent;
color: var(--el-color-primary);
background: transparent;
padding-left: 0;
padding-right: 0;
}
.el-button--text:hover,
.el-button--text:focus {
color: var(--el-color-primary-light-1);
border-color: transparent;
background-color: transparent;
}
.el-button--text:active {
color: var(--el-color-primary-light-1);
border-color: transparent;
background-color: transparent;
}
/* 按钮主题色 */
.el-button--primary {
background-color: var(--el-color-primary) !important;
border-color: var(--el-color-primary) !important;
}
.el-button--primary:hover,
.el-button--primary:focus {
background-color: var(--el-color-primary-light-1) !important;
border-color: var(--el-color-primary-light-1) !important;
}
.el-button--primary:active {
background-color: var(--el-color-primary-dark-1) !important;
border-color: var(--el-color-primary-dark-1) !important;
}
/* 输入框主题色 */
.el-input__inner:focus,
.el-input.is-active .el-input__inner,
.el-input.is-focus .el-input__inner {
border-color: var(--el-color-primary) !important;
}
.el-textarea__inner:focus {
border-color: var(--el-color-primary) !important;
}
/* 选择器主题色 */
.el-select .el-input.is-focus .el-input__inner {
border-color: var(--el-color-primary) !important;
}
.el-select-dropdown__item.selected {
background-color: var(--el-color-primary-light-9) !important;
color: var(--el-color-primary) !important;
}
.el-select-dropdown__item:hover {
background-color: var(--el-color-primary-light-8) !important;
}
/* 复选框和单选框主题色 */
.el-checkbox__input.is-checked .el-checkbox__inner {
background-color: var(--el-color-primary) !important;
border-color: var(--el-color-primary) !important;
}
.el-radio__input.is-checked .el-radio__inner {
background-color: var(--el-color-primary) !important;
border-color: var(--el-color-primary) !important;
}
/* 单选按钮组主题色 */
.el-radio-button__inner {
color: var(--el-color-primary-dark-2) !important;
}
.el-radio-button__inner:hover {
color: var(--el-color-primary) !important;
}
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
background-color: var(--el-color-primary) !important;
border-color: var(--el-color-primary) !important;
color: #ffffff !important;
box-shadow: -1px 0 0 0 var(--el-color-primary) !important;
}
.el-radio-button:first-child
.el-radio-button__orig-radio:checked
+ .el-radio-button__inner {
border-left-color: var(--el-color-primary) !important;
}
.el-radio-button:last-child
.el-radio-button__orig-radio:checked
+ .el-radio-button__inner {
border-right-color: var(--el-color-primary) !important;
}
/* 开关主题色 */
.el-switch.is-checked .el-switch__core {
background-color: var(--el-color-primary) !important;
border-color: var(--el-color-primary) !important;
}
/* 标签页主题色 */
.el-tabs__active-bar {
background-color: var(--el-color-primary) !important;
}
.el-tabs__item.is-active {
color: var(--el-color-primary) !important;
}
.el-tabs__item:hover {
color: var(--el-color-primary-light-1) !important;
}
/* 分页器主题色 */
.el-pagination button:hover {
color: var(--el-color-primary) !important;
}
.el-pager li.active {
color: var(--el-color-primary) !important;
}
.el-pager li:hover {
color: var(--el-color-primary) !important;
}
/* 表格主题色 */
.el-table__header th {
background-color: var(--el-color-primary-light-9) !important;
}
.el-table--striped .el-table__body tr.el-table__row--striped td {
background-color: var(--el-color-primary-light-9) !important;
}
/* 对话框主题色 */
.el-dialog__headerbtn .el-dialog__close:hover {
color: var(--el-color-primary) !important;
}
/* 消息提示主题色 */
.el-message--success {
background-color: var(--el-color-primary-light-9) !important;
border-color: var(--el-color-primary-light-7) !important;
}
.el-message--success .el-message__content {
color: var(--el-color-primary-dark-2) !important;
}
/* 通知主题色 */
.el-notification--success {
border-left-color: var(--el-color-primary) !important;
}
/* 标签主题色 */
.el-tag--primary {
background-color: var(--el-color-primary-light-9) !important;
border-color: var(--el-color-primary-light-7) !important;
color: var(--el-color-primary-dark-2) !important;
}
/* 徽章主题色 */
.el-badge__content {
background-color: var(--el-color-primary) !important;
}
/* 卡片主题色 */
.el-card__header {
border-bottom-color: var(--el-color-primary-light-8) !important;
}
/* 滑块主题色 */
.el-slider__runway .el-slider__bar {
background-color: var(--el-color-primary) !important;
}
.el-slider__button {
border-color: var(--el-color-primary) !important;
}
/* 步骤条主题色 */
.el-steps .el-step__head.is-process {
color: var(--el-color-primary) !important;
border-color: var(--el-color-primary) !important;
}
.el-steps .el-step__head.is-finish {
color: var(--el-color-primary) !important;
border-color: var(--el-color-primary) !important;
}
/* 菜单主题色 */
.el-menu-item.is-active {
color: var(--el-color-primary) !important;
}
.el-submenu__title:hover {
background-color: var(--el-color-primary-light-9) !important;
}
/* 评分主题色 */
.el-rate__icon {
color: var(--el-color-primary-light-6) !important;
}
.el-rate__icon.is-active {
color: var(--el-color-primary) !important;
}
/* 日期选择器主题色 */
.el-date-picker__header button:hover {
color: var(--el-color-primary) !important;
}
.el-picker-panel__icon-btn:hover {
color: var(--el-color-primary) !important;
}
.el-date-table td.current:not(.disabled) {
background-color: var(--el-color-primary) !important;
}
.el-date-table td.today span {
color: var(--el-color-primary) !important;
}
/* 加载主题色 */
.el-loading-spinner .el-loading-text {
color: var(--el-color-primary) !important;
}
/* 滚动条主题色 */
.el-scrollbar__thumb {
background-color: var(--el-color-primary-light-6) !important;
}
.el-scrollbar__thumb:hover {
background-color: var(--el-color-primary-light-4) !important;
}
/* 轮播图主题色 */
.el-carousel__indicator.is-active .el-carousel__button {
background-color: var(--el-color-primary) !important;
}
/* 折叠面板主题色 */
.el-collapse-item__header.is-active {
color: var(--el-color-primary) !important;
}
/* 穿梭框主题色 */
.el-transfer-panel__header .el-checkbox .el-checkbox__label {
color: var(--el-color-primary) !important;
}
/* 时间线主题色 */
.el-timeline-item__node--primary {
background-color: var(--el-color-primary) !important;
border-color: var(--el-color-primary) !important;
}
/* 回到顶部主题色 */
.el-back-top {
background-color: var(--el-color-primary) !important;
}
/* 链接主题色 */
.el-link--primary {
color: var(--el-color-primary) !important;
}
.el-link--primary:hover {
color: var(--el-color-primary-light-1) !important;
}
/* 日历主题色 */
.el-calendar__button-group .el-button-group .el-button--first,
.el-calendar__button-group .el-button-group .el-button--last {
color: var(--el-color-primary) !important;
}
.el-calendar-table .el-calendar-day:hover {
background-color: var(--el-color-primary-light-9) !important;
}
/* 头像主题色 */
.el-avatar {
background-color: var(--el-color-primary-light-6) !important;
}
/* 警告框主题色 */
.el-alert--success {
background-color: var(--el-color-primary-light-9) !important;
border-color: var(--el-color-primary-light-7) !important;
}
.el-alert--success .el-alert__content {
color: var(--el-color-primary-dark-2) !important;
}
/* 消息框主题色 */
.el-message-box__headerbtn .el-message-box__close:hover {
color: var(--el-color-primary) !important;
}
/* 级联选择器主题色 */
.el-cascader-node.is-active {
color: var(--el-color-primary) !important;
}
.el-cascader-node:hover {
background-color: var(--el-color-primary-light-9) !important;
}
/* 分组主题色 */
.el-option-group__title {
color: var(--el-color-primary-dark-2) !important;
}
/* 标签页主题色 */
.el-tab-pane {
color: var(--el-color-primary-dark-2) !important;
}
/* 弹出框主题色 */
.el-popover__reference:hover {
color: var(--el-color-primary) !important;
}
/* 工具提示主题色 */
.el-tooltip__popper {
border: none !important;
}
.el-tooltip__popper.is-dark {
background: #303133 !important;
color: #ffffff !important;
}
/* 标签主题色 */
.el-tag {
background-color: var(--el-color-primary-light-9) !important;
border-color: var(--el-color-primary-light-7) !important;
color: var(--el-color-primary-dark-2) !important;
}
/* 徽章主题色 */
.el-badge {
color: var(--el-color-primary-dark-2) !important;
}
/* 卡片主题色 */
.el-card {
border-color: var(--el-color-primary-light-8) !important;
}
/* 滑块主题色 */
.el-slider__runway {
background-color: var(--el-color-primary-light-8) !important;
}
/* 步骤条主题色 */
.el-steps {
color: var(--el-color-primary-dark-2) !important;
}
/* 菜单主题色 */
.el-menu {
background-color: var(--el-color-primary-light-9) !important;
}
/* 评分主题色 */
.el-rate {
color: var(--el-color-primary-dark-2) !important;
}
/* 日期选择器主题色 */
.el-date-picker {
border-color: var(--el-color-primary-light-7) !important;
}
/* 加载主题色 */
.el-loading-mask {
background-color: rgba(255, 255, 255, 0.8) !important;
}
/* 滚动条主题色 */
.el-scrollbar__bar {
background-color: var(--el-color-primary-light-8) !important;
}
/* 轮播图主题色 */
.el-carousel {
background-color: var(--el-color-primary-light-9) !important;
}
/* 折叠面板主题色 */
.el-collapse {
border-color: var(--el-color-primary-light-8) !important;
}
/* 穿梭框主题色 */
.el-transfer {
border-color: var(--el-color-primary-light-8) !important;
}
/* 时间线主题色 */
.el-timeline {
color: var(--el-color-primary-dark-2) !important;
}
/* 回到顶部主题色 */
.el-back-top:hover {
background-color: var(--el-color-primary-dark-1) !important;
}
/* 链接主题色 */
.el-link {
color: var(--el-color-primary-dark-2) !important;
}
/* 日历主题色 */
.el-calendar {
border-color: var(--el-color-primary-light-8) !important;
}
/* 头像主题色 */
.el-avatar--text {
color: var(--el-color-primary-dark-2) !important;
}
/* 警告框主题色 */
.el-alert {
border-color: var(--el-color-primary-light-7) !important;
}
/* 消息框主题色 */
.el-message-box {
border-color: var(--el-color-primary-light-8) !important;
}
/* 级联选择器主题色 */
.el-cascader {
border-color: var(--el-color-primary-light-8) !important;
}
/* 分组主题色 */
.el-option-group {
color: var(--el-color-primary-dark-2) !important;
}
/* 标签页主题色 */
.el-tabs {
border-color: var(--el-color-primary-light-8) !important;
}
/* 弹出框主题色 */
.el-popover {
border-color: var(--el-color-primary-light-7) !important;
}
/* 工具提示主题色 */
.el-tooltip {
color: var(--el-color-primary-dark-2) !important;
}
src/assets/css/index.css
.link { .link {
color: #2a6ffe; color: var(--primary-color);
text-decoration: none; text-decoration: none;
} }
.link:hover { .link:hover {
color: #525558; color: var(--light-color);
} }
\ No newline at end of file
src/assets/images/help/beginner.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 1024 1024">
<path fill="#faaa15" d="M928 161H699.2c-49.1 0-97.1 14.1-138.4 40.7L512 233l-48.8-31.3A255.2 255.2 0 0 0 324.8 161H96c-17.7 0-32 14.3-32 32v568c0 17.7 14.3 32 32 32h228.8c49.1 0 97.1 14.1 138.4 40.7l44.4 28.6c1.3.8 2.8 1.3 4.3 1.3s3-.4 4.3-1.3l44.4-28.6C602 807.1 650.1 793 699.2 793H928c17.7 0 32-14.3 32-32V193c0-17.7-14.3-32-32-32M404 553.5c0 4.1-3.2 7.5-7.1 7.5H211.1c-3.9 0-7.1-3.4-7.1-7.5v-45c0-4.1 3.2-7.5 7.1-7.5h185.7c3.9 0 7.1 3.4 7.1 7.5v45zm0-140c0 4.1-3.2 7.5-7.1 7.5H211.1c-3.9 0-7.1-3.4-7.1-7.5v-45c0-4.1 3.2-7.5 7.1-7.5h185.7c3.9 0 7.1 3.4 7.1 7.5v45zm416 140c0 4.1-3.2 7.5-7.1 7.5H627.1c-3.9 0-7.1-3.4-7.1-7.5v-45c0-4.1 3.2-7.5 7.1-7.5h185.7c3.9 0 7.1 3.4 7.1 7.5v45zm0-140c0 4.1-3.2 7.5-7.1 7.5H627.1c-3.9 0-7.1-3.4-7.1-7.5v-45c0-4.1 3.2-7.5 7.1-7.5h185.7c3.9 0 7.1 3.4 7.1 7.5v45z" />
</svg>
\ No newline at end of file
src/assets/images/home/custom.svg
<svg <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24">
t="1734072552728" <g fill="none" stroke="#faaa15" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8">
class="icon" <rect width="4" height="6" x="10" y="16" rx="2" />
viewBox="0 0 1024 1024" <rect width="16" height="6" x="3" y="2" rx="2" />
version="1.1" <path d="M19 5h1q2 0 2 2q0 6-7 6q-3 0-3 3" />
xmlns:xlink="http://www.w3.org/1999/xlink" </g>
xmlns="http://www.w3.org/2000/svg"
p-id="13839"
width="48"
height="48">
<path
d="M861.376 16.448c37.12 0 66.56 30.08 66.56 67.2v869.76c0 36.48-29.44 66.56-66.56 66.56h-284.16c-37.12 0-67.2-30.08-67.2-66.56v-295.68h167.04v-83.84h-167.04v-111.36h167.04v-83.84h-167.04v-111.36h167.04v-83.84h-167.04v-99.84c0-37.12 30.08-67.2 67.2-67.2z m-72.32 822.4c0-38.4-31.36-69.76-69.76-69.76-38.4 0-69.76 31.36-69.76 69.76 0 38.4 31.36 69.76 69.76 69.76 38.4 0 69.76-31.36 69.76-69.76z"
fill="#1870FD"
p-id="13840"></path>
<path
d="M91.84 824.896h279.04v-501.76h-279.04v501.76z"
fill="#AEC9FF"
p-id="13841"></path>
<path
d="M91.84 953.344c0 36.48 30.08 66.56 67.2 66.56h144.64c37.12 0 67.2-30.08 67.2-66.56v-44.8h-279.04v44.8zM370.88 239.168L231.36 16.448l-139.52 222.72h279.04z"
fill="#1870FD"
p-id="13842"></path>
</svg> </svg>
\ No newline at end of file
src/assets/images/home/earth.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 512 512">
<path fill="#faaa15" d="m267 474l-.8-.13a.85.85 0 0 0 .8.13m181.9-286.22a5.51 5.51 0 0 0-10.67-.63A5.52 5.52 0 0 1 433 191h-15.47a5.5 5.5 0 0 1-2.84-.79l-22.38-13.42a5.5 5.5 0 0 0-2.84-.79h-35.8a5.5 5.5 0 0 0-3.06.93l-44.15 29.43A5.52 5.52 0 0 0 304 211v41.74a5.51 5.51 0 0 0 2.92 4.87l57.89 30.9a5.55 5.55 0 0 1 2.92 4.8l.27 23.49a5.53 5.53 0 0 0 2.85 4.75l23.26 12.87a5.54 5.54 0 0 1 2.85 4.83v48.6a5.52 5.52 0 0 0 9.17 4.14c9.38-8.26 22.83-20.32 24.62-23.08q4.44-6.87 8.33-14.07a207.4 207.4 0 0 0 13.6-31c12.68-36.71 2.66-102.7-3.78-136.06M286.4 302.8l-61.33-46a4 4 0 0 0-2.4-.8h-29.1a3.78 3.78 0 0 1-2.68-1.11l-13.72-13.72a4 4 0 0 0-2.83-1.17h-53.19a3.79 3.79 0 0 1-2.68-6.47l8.42-8.42a3.78 3.78 0 0 1 2.68-1.11h32.37a8 8 0 0 0 7.7-5.83l6.89-24.5a4 4 0 0 1 2-2.47L206 177.06a3.79 3.79 0 0 0 2.05-3.37v-12.5a3.8 3.8 0 0 1 .68-2.17l14.6-21.02a3.75 3.75 0 0 1 1.78-1.38l20.43-7.67a3.79 3.79 0 0 0 2.46-3.55V114a3.8 3.8 0 0 0-1.69-3.16l-20.48-13.62A3.83 3.83 0 0 0 222 97l-27.88 13.94a3.78 3.78 0 0 1-4-.41l-13.22-10.45a3.8 3.8 0 0 1 .1-6l10.74-7.91a3.78 3.78 0 0 0-.09-6.16l-16.73-11.67a3.78 3.78 0 0 0-4-.22c-6.05 3.31-23.8 13.11-30.1 17.52a209.5 209.5 0 0 0-68.16 80c-1.82 3.76-4.07 7.59-4.29 11.72s-3.46 13.35-4.81 17.08a3.78 3.78 0 0 0 .24 3.1l35.69 65.58a3.74 3.74 0 0 0 1.38 1.44l37.55 22.54a3.78 3.78 0 0 1 1.81 2.73l7.52 54.54a3.82 3.82 0 0 0 1.61 2.61l29.3 20.14a4 4 0 0 1 1.65 2.48l15.54 73.8a3.6 3.6 0 0 0 .49 1.22c1.46 2.36 7.28 11 14.3 12.28c-.65.18-1.23.59-1.88.78a48 48 0 0 1 5 1.16c2 .54 4 1 6 1.43c3.13.62 3.44 1.1 4.94-1.68c2-3.72 4.29-5 6-5.46a3.85 3.85 0 0 0 2.89-2.9l10.07-46.68a4 4 0 0 1 1.6-2.42l45-31.9a4 4 0 0 0 1.69-3.27V306a4 4 0 0 0-1.55-3.2" />
<path fill="#faaa15" d="M262 48s-3.65.21-4.39.23q-8.13.24-16.22 1.12A207.5 207.5 0 0 0 184.21 64c2.43 1.68-1.75 3.22-1.75 3.22L189 80h35l24 12l21-12Zm92.23 72.06l16.11-14a4 4 0 0 0-.94-6.65l-18.81-8.73a4 4 0 0 0-5.3 1.9l-7.75 16.21a4 4 0 0 0 1.49 5.11l10.46 6.54a4 4 0 0 0 4.74-.38m75.41 20.61l-5.83-9c-.09-.14-.17-.28-.25-.43c-1.05-2.15-9.74-19.7-17-26.51c-5.45-5.15-7-3.67-7.43-2.53a3.77 3.77 0 0 1-1.19 1.6l-28.84 23.31a4 4 0 0 1-2.51.89h-14.93a4 4 0 0 0-2.83 1.17l-12 12a4 4 0 0 0 0 5.66l12 12a4 4 0 0 0 2.83 1.17h75.17a4 4 0 0 0 4-4.17l-.55-13.15a4 4 0 0 0-.64-2.01" />
<path fill="#faaa15" d="M256 72a184 184 0 1 1-130.1 53.9A182.77 182.77 0 0 1 256 72m0-40C132.3 32 32 132.3 32 256s100.3 224 224 224s224-100.3 224-224S379.7 32 256 32" />
</svg>
\ No newline at end of file
src/assets/images/home/fincial.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 2048 2048">
<path fill="#faaa15" d="m0 1898l384-384v534H0zm512-512l384-384v1046H512zm1280-490h128v1152h-384v-918zm-448 426l64-64v790h-384V1002zm704-1066v512h-128V475l-576 575l-384-384L0 1627v-182l960-959l384 384l485-486h-293V256z" />
</svg>
\ No newline at end of file
src/assets/images/home/logistics.svg
<svg <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 32 32">
t="1734072585485" <path fill="#faaa15" d="M4 16h12v2H4zm-2-5h10v2H2z" />
class="icon" <path fill="#faaa15" d="m29.919 16.606l-3-7A1 1 0 0 0 26 9h-3V7a1 1 0 0 0-1-1H6v2h15v12.556A4 4 0 0 0 19.142 23h-6.284a4 4 0 1 0 0 2h6.284a3.98 3.98 0 0 0 7.716 0H29a1 1 0 0 0 1-1v-7a1 1 0 0 0-.081-.394M9 26a2 2 0 1 1 2-2a2 2 0 0 1-2 2m14-15h2.34l2.144 5H23Zm0 15a2 2 0 1 1 2-2a2 2 0 0 1-2 2m5-3h-1.142A3.995 3.995 0 0 0 23 20v-2h5Z" />
viewBox="0 0 1228 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="18777"
width="48"
height="48">
<path
d="M597.333333 213.333333h-85.333333v128.768h-85.333333V213.333333H341.333333v128.768H256V213.333333H170.666667v128.768L85.333333 341.333333v85.333334h597.333334V341.333333l-85.333334 0.768z"
fill="#8BB3F1"
p-id="18778"></path>
<path
d="M938.666667 768h-27.648A149.546667 149.546667 0 0 0 768 661.333333a149.546667 149.546667 0 0 0-143.018667 106.666667H399.018667A149.546667 149.546667 0 0 0 256 661.333333 149.546667 149.546667 0 0 0 112.938667 768H85.333333V213.333333h597.333334v320a42.666667 42.666667 0 0 0 23.552 38.186667l85.333333 42.666667 38.229333-76.373334L768 506.965333v-58.410666l170.666667 70.613333V768z m-170.666667 106.666667c-35.285333 0-64-28.714667-64-64s28.714667-64 64-64 64 28.714667 64 64-28.714667 64-64 64z m-512 0c-35.285333 0-64-28.714667-64-64s28.714667-64 64-64 64 28.714667 64 64-28.714667 64-64 64z m741.674667-423.424L768 356.224V170.666667a42.666667 42.666667 0 0 0-42.666667-42.666667H42.666667a42.666667 42.666667 0 0 0-42.666667 42.666667v640a42.666667 42.666667 0 0 0 42.666667 42.666666h70.272A149.546667 149.546667 0 0 0 256 960 149.546667 149.546667 0 0 0 399.018667 853.333333h225.962666A149.546667 149.546667 0 0 0 768 960a149.546667 149.546667 0 0 0 143.018667-106.666667H981.333333a42.666667 42.666667 0 0 0 42.666667-42.666666v-320a42.624 42.624 0 0 0-26.325333-39.424z"
fill="#1768E4"
p-id="18779"></path>
</svg> </svg>
\ No newline at end of file
src/assets/images/home/platform.svg
<svg <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24">
t="1734072692984" <g fill="none" stroke="#faaa15" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.8">
class="icon" <path d="M8 13V4.5a1.5 1.5 0 0 1 3 0V12m0-.5v-2a1.5 1.5 0 0 1 3 0V12m0-1.5a1.5 1.5 0 0 1 3 0V12" />
viewBox="0 0 1024 1024" <path d="M17 11.5a1.5 1.5 0 0 1 3 0V16a6 6 0 0 1-6 6h-2h.208a6 6 0 0 1-5.012-2.7L7 19q-.468-.718-3.286-5.728a1.5 1.5 0 0 1 .536-2.022a1.87 1.87 0 0 1 2.28.28L8 13M5 3L4 2m0 5H3m11-4l1-1m0 4h1" />
version="1.1" </g>
xmlns="http://www.w3.org/2000/svg"
p-id="33676"
width="48"
height="48">
<path
d="M944 224H80V112a32 32 0 0 1 32-32h800a32 32 0 0 1 32 32v112z"
fill="#EEEEEE"
p-id="33677"></path>
<path
d="M944 232H80a8 8 0 0 1-8-8V112c0-22.048 17.936-40 40-40h800c22.064 0 40 17.952 40 40v112a8 8 0 0 1-8 8z m-856-16h848V112c0-13.232-10.768-24-24-24H112c-13.232 0-24 10.768-24 24v104z"
fill="#0277BD"
p-id="33678"></path>
<path
d="M152 152m-24 0a24 24 0 1 0 48 0 24 24 0 1 0-48 0Z"
fill="#EC407A"
p-id="33679"></path>
<path
d="M152 184c-17.648 0-32-14.352-32-32s14.352-32 32-32 32 14.352 32 32-14.352 32-32 32z m0-48a16.016 16.016 0 0 0 0 32 16.016 16.016 0 0 0 0-32z"
fill="#0277BD"
p-id="33680"></path>
<path
d="M248 152m-24 0a24 24 0 1 0 48 0 24 24 0 1 0-48 0Z"
fill="#FFA726"
p-id="33681"></path>
<path
d="M248 184c-17.648 0-32-14.352-32-32s14.352-32 32-32 32 14.352 32 32-14.352 32-32 32z m0-48a16.016 16.016 0 0 0 0 32 16.016 16.016 0 0 0 0-32z"
fill="#0277BD"
p-id="33682"></path>
<path
d="M912 784H112a32 32 0 0 1-32-32V224h864v528a32 32 0 0 1-32 32z"
fill="#81D4FA"
p-id="33683"></path>
<path
d="M912 792H112A40.048 40.048 0 0 1 72 752V224a8 8 0 0 1 8-8h864a8 8 0 0 1 8 8v528c0 22.048-17.936 40-40 40z m-824-560V752c0 13.232 10.768 24 24 24h800c13.232 0 24-10.768 24-24V232h-848z"
fill="#0277BD"
p-id="33684"></path>
<path
d="M736 560H288a32 32 0 1 1 0-64h448a32 32 0 1 1 0 64z"
fill="#EEEEEE"
p-id="33685"></path>
<path
d="M736 568H288c-22.064 0-40-17.952-40-40s17.936-40 40-40h448c22.064 0 40 17.952 40 40s-17.936 40-40 40z m-448-64c-13.232 0-24 10.768-24 24s10.768 24 24 24h448c13.232 0 24-10.768 24-24s-10.768-24-24-24H288z"
fill="#0277BD"
p-id="33686"></path>
<path
d="M608 432H416a32 32 0 0 1-32-32v-32a32 32 0 0 1 32-32h192a32 32 0 0 1 32 32v32a32 32 0 0 1-32 32z"
fill="#EC407A"
p-id="33687"></path>
<path
d="M608 440H416a40.048 40.048 0 0 1-40-40v-32c0-22.048 17.936-40 40-40h192c22.064 0 40 17.952 40 40v32c0 22.048-17.936 40-40 40z m-192-96c-13.232 0-24 10.768-24 24v32c0 13.232 10.768 24 24 24h192c13.232 0 24-10.768 24-24v-32c0-13.232-10.768-24-24-24H416z"
fill="#0277BD"
p-id="33688"></path>
<path
d="M608 632H416a8 8 0 0 1 0-16h192a8 8 0 0 1 0 16z"
fill="#0277BD"
p-id="33689"></path>
<path
d="M912 120H112a8 8 0 0 1 0-16h800a8 8 0 0 1 0 16z"
fill="#FFFFFF"
p-id="33690"></path>
<path
d="M912 760H112a8 8 0 0 1 0-16h800a8 8 0 0 1 0 16z"
fill="#29B6F6"
p-id="33691"></path>
<path
d="M912 264H112a8 8 0 0 1 0-16h800a8 8 0 0 1 0 16z"
fill="#E1F5FE"
p-id="33692"></path>
<path
d="M656 720v192l64-64 96 96 64-64-96-96 64-64z"
fill="#FFA726"
p-id="33693"></path>
<path
d="M816 952a8.032 8.032 0 0 1-5.664-2.336L720 859.312l-58.336 58.336a7.92 7.92 0 0 1-8.72 1.728A7.968 7.968 0 0 1 648 912V720a8 8 0 0 1 8-8h192a8 8 0 0 1 5.664 13.664L795.312 784l90.336 90.336a8 8 0 0 1 0 11.312l-64 64A7.92 7.92 0 0 1 816 952z m-96-112c2.048 0 4.096 0.784 5.664 2.336L816 932.688 868.688 880l-90.336-90.336a8 8 0 0 1 0-11.312l50.336-50.336H664v164.688l50.336-50.336A7.936 7.936 0 0 1 720 840z"
fill="#0277BD"
p-id="33694"></path>
<path
d="M344 152m-24 0a24 24 0 1 0 48 0 24 24 0 1 0-48 0Z"
fill="#80CBC4"
p-id="33695"></path>
<path
d="M344 184c-17.648 0-32-14.352-32-32s14.352-32 32-32 32 14.352 32 32-14.352 32-32 32z m0-48a16.016 16.016 0 0 0 0 32 16.016 16.016 0 0 0 0-32z"
fill="#0277BD"
p-id="33696"></path>
</svg> </svg>
\ No newline at end of file
src/assets/images/home/production.svg
<svg <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 36 36">
t="1734072462423" <path fill="#faaa15" d="M4 18.24V7.91c0-.65 2.09-1.84 5.5-1.84S15 7.27 15 7.91V9.7a19 19 0 0 1 2-.2V7.91c0-2.52-3.77-3.84-7.5-3.84S2 5.4 2 7.91v10.33C2 20.4 4.77 21.67 7.9 22v-2C5.46 19.68 4 18.78 4 18.24" class="clr-i-outline--badged clr-i-outline-path-1--badged" />
class="icon" <path fill="#faaa15" d="M18 10.85c-4.93 0-8.65 1.88-8.65 4.38v12.31c0 2.5 3.72 4.38 8.65 4.38s8.65-1.88 8.65-4.38V15.23c0-2.5-3.72-4.38-8.65-4.38m6.65 7.67c-.85 1-3.42 2-6.65 2a14.5 14.5 0 0 1-4-.52v1.46a16.3 16.3 0 0 0 4 .47a12.76 12.76 0 0 0 6.65-1.56v3.12c-.85 1-3.42 2-6.65 2a14.5 14.5 0 0 1-4-.53v1.46a16.3 16.3 0 0 0 4 .47a12.76 12.76 0 0 0 6.65-1.56v2.29C24.65 28.57 22 30 18 30s-6.65-1.43-6.65-2.38V15.23c0-.95 2.65-2.38 6.65-2.38s6.65 1.43 6.65 2.38Z" class="clr-i-outline--badged clr-i-outline-path-2--badged" />
viewBox="0 0 1024 1024" <path fill="#faaa15" d="M21 7.91c0-.33.55-.8 1.54-1.18V6a7.5 7.5 0 0 1 .14-1.41C20.55 5.19 19 6.3 19 7.91V9.5a19 19 0 0 1 2 .2Z" class="clr-i-outline--badged clr-i-outline-path-3--badged" />
version="1.1" <path fill="#faaa15" d="M32 13.22v5c0 .54-1.46 1.44-3.9 1.73v2c3.13-.32 5.9-1.6 5.9-3.75v-5.9a7.5 7.5 0 0 1-2 .92" class="clr-i-outline--badged clr-i-outline-path-4--badged" />
xmlns="http://www.w3.org/2000/svg" <circle cx="30" cy="6" r="5" fill="#faaa15" class="clr-i-outline--badged clr-i-outline-path-5--badged clr-i-badge" />
p-id="6373" <path fill="none" d="M0 0h36v36H0z" />
width="48"
xmlns:xlink="http://www.w3.org/1999/xlink"
height="48">
<path
d="M204.8 655.36h614.4c79.872 0 143.36 63.488 143.36 143.36s-63.488 143.36-143.36 143.36H204.8c-79.872 0-143.36-63.488-143.36-143.36s63.488-143.36 143.36-143.36z"
fill="#D9ECFF"
p-id="6374"></path>
<path
d="M839.68 655.36c79.872 0 143.36 63.488 143.36 143.36s-63.488 143.36-143.36 143.36H184.32c-79.872 0-143.36-63.488-143.36-143.36s63.488-143.36 143.36-143.36h655.36z m0 61.44H184.32c-45.056 0-81.92 36.864-81.92 81.92s36.864 81.92 81.92 81.92h655.36c45.056 0 81.92-36.864 81.92-81.92s-36.864-81.92-81.92-81.92z"
fill="#6BB0FE"
p-id="6375"></path>
<path
d="M274.432 114.688c8.192-8.192 18.432-12.288 28.672-12.288h415.744c10.24 0 20.48 4.096 28.672 12.288l57.344 73.728c10.24 10.24 14.336 24.576 14.336 36.864v40.96H204.8v-40.96c0-14.336 4.096-26.624 12.288-36.864l57.344-73.728z"
fill="#6BB0FE"
p-id="6376"></path>
<path
d="M266.24 184.32h491.52c34.816 0 61.44 26.624 61.44 61.44v348.16c0 34.816-26.624 61.44-61.44 61.44H266.24c-34.816 0-61.44-26.624-61.44-61.44V245.76c0-34.816 26.624-61.44 61.44-61.44z"
fill="#0064F9"
p-id="6377"></path>
<path
d="M409.6 184.32h204.8v245.76l-102.4-40.96-102.4 40.96z"
fill="#1DDFFF"
p-id="6378"></path>
<path
d="M409.6 184.32h204.8v245.76l-102.4-40.96-102.4 40.96z"
fill="#1DDFFF"
p-id="6379"></path>
<path
d="M327.68 798.72m-40.96 0a40.96 40.96 0 1 0 81.92 0 40.96 40.96 0 1 0-81.92 0Z"
fill="#6BB0FE"
p-id="6380"></path>
<path
d="M512 798.72m-40.96 0a40.96 40.96 0 1 0 81.92 0 40.96 40.96 0 1 0-81.92 0Z"
fill="#6BB0FE"
p-id="6381"></path>
<path
d="M696.32 798.72m-40.96 0a40.96 40.96 0 1 0 81.92 0 40.96 40.96 0 1 0-81.92 0Z"
fill="#6BB0FE"
p-id="6382"></path>
</svg> </svg>
\ No newline at end of file
src/assets/images/home/tictok.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 6.0.0-beta2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) --><path d="M448,209.91a210.06,210.06,0,0,1-122.77-39.25V349.38A162.55,162.55,0,1,1,185,188.31V278.2a74.62,74.62,0,1,0,52.23,71.18V0l88,0a121.18,121.18,0,0,0,1.86,22.17h0A122.18,122.18,0,0,0,381,102.39a121.43,121.43,0,0,0,67,20.14Z"/></svg>
\ No newline at end of file
src/assets/images/home/wechat.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="mdi-wechat" width="24" height="24" viewBox="0 0 24 24"><path d="M9.5,4C5.36,4 2,6.69 2,10C2,11.89 3.08,13.56 4.78,14.66L4,17L6.5,15.5C7.39,15.81 8.37,16 9.41,16C9.15,15.37 9,14.7 9,14C9,10.69 12.13,8 16,8C16.19,8 16.38,8 16.56,8.03C15.54,5.69 12.78,4 9.5,4M6.5,6.5A1,1 0 0,1 7.5,7.5A1,1 0 0,1 6.5,8.5A1,1 0 0,1 5.5,7.5A1,1 0 0,1 6.5,6.5M11.5,6.5A1,1 0 0,1 12.5,7.5A1,1 0 0,1 11.5,8.5A1,1 0 0,1 10.5,7.5A1,1 0 0,1 11.5,6.5M16,9C12.69,9 10,11.24 10,14C10,16.76 12.69,19 16,19C16.67,19 17.31,18.92 17.91,18.75L20,20L19.38,18.13C20.95,17.22 22,15.71 22,14C22,11.24 19.31,9 16,9M14,11.5A1,1 0 0,1 15,12.5A1,1 0 0,1 14,13.5A1,1 0 0,1 13,12.5A1,1 0 0,1 14,11.5M18,11.5A1,1 0 0,1 19,12.5A1,1 0 0,1 18,13.5A1,1 0 0,1 17,12.5A1,1 0 0,1 18,11.5Z" /></svg>
\ No newline at end of file
src/assets/images/home/wx2.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<g>
<path fill="none" d="M0 0h24v24H0z"/>
<path d="M5.457 18.185C3.358 16.677 2 14.4 2 11.908 2 7.323 6.475 3.6 12 3.6s10 3.723 10 8.308c0 4.584-4.475 8.307-10 8.307a11.36 11.36 0 0 1-3.272-.461c-.092-.03-.216-.03-.308-.03-.185 0-.37.06-.525.153l-2.191 1.261a.44.44 0 0 1-.185.062.342.342 0 0 1-.34-.338c0-.093.03-.154.062-.247.03-.03.308-1.046.463-1.661 0-.062.03-.154.03-.216 0-.246-.092-.43-.277-.553zm3.21-7.674c.717 0 1.285-.568 1.285-1.285 0-.718-.568-1.286-1.285-1.286-.718 0-1.285.568-1.285 1.286 0 .717.567 1.285 1.285 1.285zm6.666 0c.718 0 1.285-.568 1.285-1.285 0-.718-.567-1.286-1.285-1.286-.717 0-1.285.568-1.285 1.286 0 .717.568 1.285 1.285 1.285z"/>
</g>
</svg>
src/assets/images/home/xhs.png
src/assets/images/home/xhs.png

7.66 KB | W: | H:

src/assets/images/home/xhs.png

47.2 KB | W: | H:

src/assets/images/home/xhs.png
src/assets/images/home/xhs.png
src/assets/images/home/xhs.png
src/assets/images/home/xhs.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/images/logout.svg
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1678692281445" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4160" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M867.5 470.8L758 365c-18.2-17-19.2-45.5-2.3-63.7 17-18.2 45.5-19.2 63.7-2.3 0.4 0.4 0.9 0.8 1.3 1.2l187.6 181.5c17.9 17.3 18.3 45.9 1 63.8L821.6 739.2c-18.1 17.1-46.6 16.3-63.7-1.7-16.1-17-16.5-43.5-0.9-61l112.1-115.6H422.3c-24.9 0-45.1-20.2-45.1-45.1 0-24.9 20.2-45.1 45.1-45.1l445.2 0.1zM92.1 917.3h555.4c24.9 1.1 44.1 22.1 43 47-1 23.3-19.7 42-43 43H47.1c-24.9 0-45-20.1-45.1-45V61.7c0-24.9 20.2-45.1 45.1-45.1h600.4c24.9 0 45.1 20.2 45.1 45.1 0 24.9-20.2 45.1-45.1 45.1H92l0.1 810.5z" p-id="4161"></path></svg> <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 14 14">
\ No newline at end of file <g fill="none">
<path fill="#fff3d7" d="M9.5 12.5a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1v-11a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1z" />
<path stroke="#e8af24" stroke-linecap="round" stroke-linejoin="round" d="M9.5 10.5v2a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1v-11a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v2M6.5 7h7m-2-2l2 2l-2 2" stroke-width="1.6" />
</g>
</svg>
\ No newline at end of file
src/assets/images/product/hd.svg
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735112162652" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11483" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M800.1 896.2H223.9c-53 0-96-43-96-96V271.9c0-53 43-96 96-96h48v96h-48v528.2h576.3V271.9h-48v-96h48c53 0 96 43 96 96v528.2c0 53.1-43 96.1-96.1 96.1zM608 127.8h96v192.1h-96V127.8z m-144 48h96v96h-96v-96z m-144.1-48h96v192.1h-96V127.8z" fill="#0070E0" p-id="11484"></path><path d="M656.1 750.6V366.4h96v384.2h-96zM464 510.5h96v240.1h-96V510.5z m-192.1 96h96v144.1h-96V606.5z" fill="#99C6F3" p-id="11485"></path></svg> <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24">
\ No newline at end of file <path fill="#faaa15" d="M22 10H2v9a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3zM7 8a1 1 0 0 1-1-1V3a1 1 0 0 1 2 0v4a1 1 0 0 1-1 1m10 0a1 1 0 0 1-1-1V3a1 1 0 0 1 2 0v4a1 1 0 0 1-1 1" opacity="0.5" />
<path fill="#faaa15" d="M19 4h-1v3a1 1 0 0 1-2 0V4H8v3a1 1 0 0 1-2 0V4H5a3 3 0 0 0-3 3v3h20V7a3 3 0 0 0-3-3" />
</svg>
\ No newline at end of file
src/assets/images/product/help.svg
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735111977409" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4386" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M572.235294 654.336V707.764706h-120.470588V542.117647h59.738353a105.411765 105.411765 0 1 0-105.411765-105.411765h-120.470588c0-124.747294 101.135059-225.882353 225.882353-225.882353 124.747294 0 225.882353 101.135059 225.882353 225.882353 0 103.710118-69.888 191.096471-165.150118 217.630118zM512 1024C229.225412 1024 0 794.774588 0 512S229.225412 0 512 0s512 229.225412 512 512-229.225412 512-512 512z m0-120.470588c216.244706 0 391.529412-175.284706 391.529412-391.529412S728.244706 120.470588 512 120.470588 120.470588 295.755294 120.470588 512s175.284706 391.529412 391.529412 391.529412z m-60.235294-165.647059h120.470588v90.352941h-120.470588v-90.352941z" fill="#3481F5" p-id="4387"></path></svg> <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 48 48">
\ No newline at end of file <defs>
<mask id="SVG5A3x2kwa">
<g fill="none">
<path fill="#555555" stroke="#fff" stroke-linejoin="round" stroke-width="4" d="M24 44a19.94 19.94 0 0 0 14.142-5.858A19.94 19.94 0 0 0 44 24a19.94 19.94 0 0 0-5.858-14.142A19.94 19.94 0 0 0 24 4A19.94 19.94 0 0 0 9.858 9.858A19.94 19.94 0 0 0 4 24a19.94 19.94 0 0 0 5.858 14.142A19.94 19.94 0 0 0 24 44Z" />
<path stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="4" d="M24 28.625v-4a6 6 0 1 0-6-6" />
<path fill="#fff" fill-rule="evenodd" d="M24 37.625a2.5 2.5 0 1 0 0-5a2.5 2.5 0 0 0 0 5" clip-rule="evenodd" />
</g>
</mask>
</defs>
<path fill="#faaa15" d="M0 0h48v48H0z" mask="url(#SVG5A3x2kwa)" />
</svg>
\ No newline at end of file
src/assets/images/product/join.svg
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735113645538" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="24628" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M365.10055 74.4c30.3 0 58.9 10.5 81.9 29.8l8.3 7.6 61.2 61.2 58.5-58.7c23.9-24 56.4-37.5 90.3-37.4 30.3 0 58.9 10.5 81.9 29.8l8.3 7.7 231.1 231c24.1 24 37.4 56 37.4 90.3 0 30.2-10.5 58.9-29.8 81.9l-7.7 8.3-386.2 386.3c-23.9 24-56.3 37.5-90.2 37.4-30.3 0-59-10.4-82-29.7l-8.3-7.7L37.40055 529.7C13.40055 505.8-0.09945 473.4 0.00055 439.5c0-30.3 10.5-58.9 29.8-81.9l7.7-8.3 237.4-237.5c23.9-24 56.4-37.5 90.2-37.4z m-25 93.2l-5.1 4.3L97.60055 409.4c-14.8 14.8-16.7 38.1-4.4 55l4.4 5.1L479.80055 852c8.1 7.8 18.9 12.1 30.1 12l6.6-0.5c6.6-0.9 12.9-3.4 18.3-7.2l5.1-4.4 32.7-32.6-66.4-66.3c-6.4-6.4-10.6-14.6-12-23.6l-0.4-6.5c-0.1-21 15.3-38.9 36-42l6.5-0.5 6.5 0.5c6.6 1 12.8 3.5 18.3 7.4l5.3 4.5 66.4 66.4 33.4-33.4-66.4-66.4c-16.6-16.7-16.5-43.7 0.2-60.2 6.4-6.3 14.6-10.5 23.5-11.9l6.4-0.5c8.8 0 17.4 2.7 24.9 8l5.3 4.5 66.3 66.3 81.2-81.4L608.20055 385l-26.3 26.3c-29.4 29.5-69.3 46-110.9 45.9-41.6 0.1-81.4-16.4-110.8-45.9-22.6-22.7-22.6-59.5 0-82.2l96.1-96.1-61.1-61.1c-15-14.3-38-16.1-55.1-4.3z m364.5-2c-21.9-21-56.4-21-78.3 0l-88.8 88.7 1-1-118 117.8 17.6 7.4c31.6 13.3 68.3 6.4 92.8-18.1l56.4-56.4c9.9-10.1 25.7-11.7 37.5-3.8l4.7 3.8 238.3 238.5 67.8-67.8c10.3-10.3 16.2-24.2 16.3-38.8 0-14.9-5.8-28.8-16.2-39.3l-231.1-231z" fill="#3A9CFF" opacity=".3" p-id="24629"></path><path d="M665.30055 76.9c30.3 0 58.9 10.5 81.9 29.8l8.3 7.7 231.1 231c24.1 24 37.4 56 37.4 90.3 0 30.2-10.5 58.9-29.8 81.9l-7.7 8.3-118.7 118.5-310.6-310.5 30.1-30c4.1-4.2 9.4-7 15.2-8.1l5.8-0.6c5.9 0 11.6 1.7 16.5 5l4.7 3.8 238.3 238.5 67.8-67.8c10.3-10.3 16.2-24.2 16.3-38.8 0-14.9-5.8-28.8-16.2-39.3l-231.1-231c-21.9-21-56.4-21-78.3 0l-88.8 88.7 1-1-31 30.9-20.2-20.2 20.2 20.2-87 86.9 17.6 7.4c31.6 13.3 68.3 6.4 92.8-18.1l26.3-26.4 51 51.1-26.3 26.3c-29.4 29.5-69.3 46-110.9 45.9-41.6 0.1-81.4-16.4-110.8-45.9-20.5-20.6-22.8-53.1-5.3-76.3l5.2-6 96.1-96.1 60.1-60.1 0.2 0.2 58.5-58.7c23.9-24 56.4-37.5 90.3-37.5z" fill="#3A9CFF" p-id="24630"></path></svg> <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24">
\ No newline at end of file <path fill="#faaa15" d="M12.22 19.85c-.18.18-.5.21-.71 0a.504.504 0 0 1 0-.71l3.39-3.39l-1.41-1.41l-3.39 3.39c-.19.2-.51.19-.71 0a.504.504 0 0 1 0-.71l3.39-3.39l-1.41-1.41l-3.39 3.39c-.18.18-.5.21-.71 0a.513.513 0 0 1 0-.71l3.39-3.39l-1.42-1.41l-3.39 3.39c-.18.18-.5.21-.71 0a.513.513 0 0 1 0-.71L9.52 8.4l1.87 1.86c.95.95 2.59.94 3.54 0c.98-.98.98-2.56 0-3.54l-1.86-1.86l.28-.28c.78-.78 2.05-.78 2.83 0l4.24 4.24c.78.78.78 2.05 0 2.83z" opacity="0.3" />
<path fill="#faaa15" d="M12.22 19.85c-.18.18-.5.21-.71 0a.504.504 0 0 1 0-.71l3.39-3.39l-1.41-1.41l-3.39 3.39c-.19.2-.51.19-.71 0a.504.504 0 0 1 0-.71l3.39-3.39l-1.41-1.41l-3.39 3.39c-.18.18-.5.21-.71 0a.513.513 0 0 1 0-.71l3.39-3.39l-1.42-1.41l-3.39 3.39c-.18.18-.5.21-.71 0a.513.513 0 0 1 0-.71L9.52 8.4l1.87 1.86c.95.95 2.59.94 3.54 0c.98-.98.98-2.56 0-3.54l-1.86-1.86l.28-.28c.78-.78 2.05-.78 2.83 0l4.24 4.24c.78.78.78 2.05 0 2.83zm9.61-6.78a4.01 4.01 0 0 0 0-5.66l-4.24-4.24a4.01 4.01 0 0 0-5.66 0l-.28.28l-.28-.28a4.01 4.01 0 0 0-5.66 0L2.17 6.71a3.99 3.99 0 0 0-.4 5.19l1.45-1.45a2 2 0 0 1 .37-2.33l3.54-3.54c.78-.78 2.05-.78 2.83 0l3.56 3.56c.18.18.21.5 0 .71s-.53.18-.71 0L9.52 5.57l-5.8 5.79c-.98.97-.98 2.56 0 3.54c.39.39.89.63 1.42.7a2.46 2.46 0 0 0 2.12 2.12a2.46 2.46 0 0 0 2.12 2.12c.07.54.31 1.03.7 1.42c.47.47 1.1.73 1.77.73s1.3-.26 1.77-.73z" />
</svg>
\ No newline at end of file
src/assets/images/product/safety.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24">
<g fill="none">
<path fill="#fff" d="m12 23.29l8.33-3.92l2.45-15.19L12 .75L1.22 4.18l2.45 15.19z" />
<path fill="#f7ead4" d="m20.33 19.35l2.45-15.19L12 .73v22.54z" />
<path stroke="#faaa15" stroke-linecap="round" stroke-linejoin="round" d="m11.854 15.92l4.9-4.9l-2.45-2.94l-2.45 1.96l-2.45-1.96l-2.45 2.94z" stroke-width="1.3" />
<path stroke="#faaa15" stroke-linecap="round" stroke-linejoin="round" d="m12 23.27l8.33-3.92l2.45-15.19L12 .73L1.22 4.16l2.45 15.19z" stroke-width="1.3" />
<path stroke="#faaa15" stroke-linecap="round" stroke-linejoin="round" d="m12 20.82l6.37-2.94l1.96-12.25L12 2.69L3.67 5.63l1.96 12.25z" stroke-width="1.3" />
</g>
</svg>
\ No newline at end of file
src/assets/images/product/service.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256">
<g fill="#faaa15">
<path d="M16 152h32v56H16a8 8 0 0 1-8-8v-40a8 8 0 0 1 8-8M192.54 40A39.12 39.12 0 0 0 156 64a39.12 39.12 0 0 0-36.54-24C97.67 40 80 58.31 80 80c0 14.56 7 27.71 16.73 40H140a20 20 0 0 1 0 40h4l37.78-8.68C203.82 135.07 232 109.23 232 80c0-21.69-17.67-40-39.46-40" opacity="0.2" />
<path d="M230.33 141.06a24.34 24.34 0 0 0-18.61-4.77C230.5 117.33 240 98.48 240 80c0-26.47-21.29-48-47.46-48A47.58 47.58 0 0 0 156 48.75A47.58 47.58 0 0 0 119.46 32C93.29 32 72 53.53 72 80c0 11 3.24 21.69 10.06 33a31.87 31.87 0 0 0-14.75 8.4L44.69 144H16a16 16 0 0 0-16 16v40a16 16 0 0 0 16 16h104a8 8 0 0 0 1.94-.24l64-16a7 7 0 0 0 1.19-.4L226 182.82l.44-.2a24.6 24.6 0 0 0 3.93-41.56ZM119.46 48a31.15 31.15 0 0 1 29.14 19a8 8 0 0 0 14.8 0a31.15 31.15 0 0 1 29.14-19C209.59 48 224 62.65 224 80c0 19.51-15.79 41.58-45.66 63.9l-11.09 2.55A28 28 0 0 0 140 112h-39.32C92.05 100.36 88 90.12 88 80c0-17.35 14.41-32 31.46-32M16 160h24v40H16Zm203.43 8.21l-38 16.18L119 200H56v-44.69l22.63-22.62A15.86 15.86 0 0 1 89.94 128H140a12 12 0 0 1 0 24h-28a8 8 0 0 0 0 16h32a8.3 8.3 0 0 0 1.79-.2l67-15.41l.31-.08a8.6 8.6 0 0 1 6.3 15.9Z" />
</g>
</svg>
\ No newline at end of file
src/assets/images/product/universe.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256">
<g fill="#faaa15">
<path d="M216 128a88 88 0 1 1-88-88a88 88 0 0 1 88 88" opacity="0.4" />
<path d="M245.11 60.68c-7.65-13.19-27.84-16.16-58.5-8.66A95.93 95.93 0 0 0 32 128a98 98 0 0 0 .78 12.31C5.09 169 5.49 186 10.9 195.32C16 204.16 26.64 208 40.64 208a124 124 0 0 0 28.79-4A95.93 95.93 0 0 0 224 128a97 97 0 0 0-.77-12.25c12.5-13 20.82-25.35 23.65-35.92c1.95-7.32 1.36-13.76-1.77-19.15M128 48a80.11 80.11 0 0 1 78 62.2c-17.06 16.06-40.15 32.53-62.07 45.13c-27.55 15.81-51.45 25.67-70.51 31.07A79.94 79.94 0 0 1 128 48M24.74 187.29c-1.46-2.51-.65-7.24 2.22-13a79 79 0 0 1 10.29-15.05a96 96 0 0 0 18 31.32c-17.25 2.9-28.01 1.05-30.51-3.27M128 208a79.45 79.45 0 0 1-38.56-9.94a370 370 0 0 0 62.43-28.86c21.58-12.39 40.68-25.82 56.07-39.08A80.07 80.07 0 0 1 128 208M231.42 75.69c-1.7 6.31-6.19 13.53-12.63 21.13a95.7 95.7 0 0 0-18-31.35c14.21-2.35 27.37-2.17 30.5 3.24c.9 1.57.95 3.92.13 6.98" />
</g>
</svg>
\ No newline at end of file
src/assets/images/product/us.svg
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735113584264" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="22404" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M731.8528 775.0144c-25.0368-106.3424-97.3824-190.6688-191.7952-233.0624 58.4704-44.8 95.0784-116.6848 90.7776-196.8128-6.2464-115.7632-99.2768-210.4832-214.9376-218.5216C280.576 117.1968 167.4752 224.5632 167.4752 357.888c0 74.9568 35.7888 141.6704 91.136 184.064-94.4128 42.3936-166.7584 126.72-191.7952 233.0624-7.168 30.4128-15.6672 71.6288 5.632 95.1296 18.6368 20.5824 62.464 21.76 90.2144 21.76h487.9872c4.9152 0 43.4688-1.1264 48.2304-2.304 48.4352-11.9296 43.8784-68.1472 32.9728-114.5856z m-196.2496 42.9568H267.008c-25.856 0-46.7968-20.9408-46.7968-46.7968 0-25.856 20.9408-46.7968 46.7968-46.7968h268.5952c25.856 0 46.7968 20.9408 46.7968 46.7968 0 25.856-20.992 46.7968-46.7968 46.7968z" fill="#2595E8" p-id="22405"></path><path d="M540.0064 541.952c55.3472-42.3936 91.136-109.1072 91.136-184.064 0-127.8464-103.9872-231.8336-231.8336-231.8336-127.8464 0-231.8336 103.9872-231.8336 231.8336 0 74.9568 35.7888 141.6704 91.136 184.064-94.4128 42.3936-166.7584 126.72-191.7952 233.0624-6.656 28.3136-16.896 65.6384 1.8944 87.9616 7.0144 8.3456 19.8656 16.6912 36.9664 20.6848 42.496 9.3184 87.3472 6.0416 132.6592 6.0416 104.0896 0 202.0864-25.9584 287.8976-71.7312H267.008c-25.856 0-46.7968-20.9408-46.7968-46.7968 0-25.856 20.9408-46.7968 46.7968-46.7968h268.5952c25.856 0 46.7968 20.9408 46.7968 46.7968 0 5.0688-0.8192 9.8816-2.304 14.4384 42.8544-28.8256 81.92-62.9248 116.1728-101.376a339.44576 339.44576 0 0 0-156.2624-142.2848z" fill="#3A9CED" p-id="22406"></path><path d="M829.1328 515.1744c38.3488-36.6592 62.3104-88.2688 62.3104-145.3568 0-110.9504-90.2656-201.2672-201.2672-201.2672-24.9856 0-45.2608 20.2752-45.2608 45.2608s20.2752 45.2608 45.2608 45.2608c61.0304 0 110.6944 49.664 110.6944 110.6944 0 57.1392-43.4688 104.2432-99.072 110.08-3.84-0.1536-7.7312-0.3072-11.6224-0.3072-24.9856 0-45.2608 20.2752-45.2608 45.2608v0.9216c0 24.9856 20.2752 45.2608 45.2608 45.2608 4.3008 0 8.6016-0.2048 12.8512-0.4608 103.8336 6.656 186.3168 93.2352 186.3168 198.7072 0 24.9856 20.2752 45.2608 45.2608 45.2608s45.2608-20.2752 45.2608-45.2608c0.0512-109.312-60.9792-204.7488-150.7328-254.0544z" fill="#2595E8" p-id="22407"></path><path d="M850.9952 248.9856c-36.7616-48.7936-95.1808-80.4352-160.8192-80.4352-24.9856 0-45.2608 20.2752-45.2608 45.2608s20.2752 45.2608 45.2608 45.2608c61.0304 0 110.6944 49.664 110.6944 110.6944 0 57.1392-43.4688 104.2432-99.072 110.08-3.84-0.1536-7.7312-0.3072-11.6224-0.3072-24.9856 0-45.2608 20.2752-45.2608 45.2608v0.9216c0 24.9856 20.2752 45.2608 45.2608 45.2608 4.3008 0 8.6016-0.2048 12.8512-0.4608 22.8352 1.4848 44.6464 6.8096 64.768 15.36 53.248-90.88 83.8144-196.6592 83.8144-309.6064 0-9.1136-0.2048-18.2272-0.6144-27.2896z" fill="#3A9CED" p-id="22408"></path><path d="M644.864 213.8112c0 11.1104 4.0448 21.2992 10.7008 29.184 7.3216-23.1936 13.2608-46.9504 17.7664-71.2192-16.64 6.7072-28.4672 22.9888-28.4672 42.0352zM110.592 670.5152c229.5296-14.7968 424.6528-155.8528 516.6592-354.4576-19.7632-107.9296-114.432-190.0032-227.9936-190.0032-127.8464 0-231.8336 103.9872-231.8336 231.8336 0 74.9568 35.7888 141.6704 91.136 184.064-60.7232 27.2384-112.1792 71.936-147.968 128.5632z" fill="#59ADF8" p-id="22409"></path><path d="M455.936 133.0688c-18.1248-4.5568-37.12-7.0144-56.6272-7.0144-127.8464 0-231.8336 103.9872-231.8336 231.8336 0 14.1824 1.28 28.0576 3.7376 41.5744 121.344-55.6032 221.4912-149.5552 284.7232-266.3936z" fill="#6BC2FC" p-id="22410"></path></svg> <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 24 24">
\ No newline at end of file <path fill="#faaa15" d="M16.67 13.13C18.04 14.06 19 15.32 19 17v3h4v-3c0-2.18-3.57-3.47-6.33-3.87M15 12c2.21 0 4-1.79 4-4s-1.79-4-4-4c-.47 0-.91.1-1.33.24a5.98 5.98 0 0 1 0 7.52c.42.14.86.24 1.33.24m-6 0c2.21 0 4-1.79 4-4s-1.79-4-4-4s-4 1.79-4 4s1.79 4 4 4m0-6c1.1 0 2 .9 2 2s-.9 2-2 2s-2-.9-2-2s.9-2 2-2m0 7c-2.67 0-8 1.34-8 4v3h16v-3c0-2.66-5.33-4-8-4m6 5H3v-.99C3.2 16.29 6.3 15 9 15s5.8 1.29 6 2z" />
</svg>
\ No newline at end of file
src/assets/images/product/zx.svg
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1735112261447" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="19531" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M763.9 99.7H260.1c-58.8 0-106.5 47.7-106.5 106.5v662.7c0 40.1 41.7 66.5 77.9 49.4l234.6-110.8c28.8-13.6 62.1-13.6 90.9-0.1l235.5 110.9c36.2 17.1 77.9-9.4 77.9-49.4V206.2c0-58.8-47.7-106.5-106.5-106.5z m-92.5 479.4H352.6c-21 0-38.1-17-38.1-38s17-38.1 38-38.1h318.7c21.1 0 38.1 17.1 38.1 38.1s-16.9 38-37.9 38z m0-173.8H352.6c-21 0-38.1-17-38.1-38.1 0-21 17-38.1 38.1-38.1h318.7c21 0 38.1 17 38.1 38.1s-17 38.1-38 38.1z" fill="#2595E8" p-id="19532"></path><path d="M870.4 471.3v-265c0-58.8-47.7-106.5-106.5-106.5H260.1c-58.8 0-106.5 47.7-106.5 106.5v632.9c44.5 9.7 90 14.6 135.6 14.6 31.9 0 63.2-2.4 93.8-6.9l83.2-39.3c23.6-11.1 50.1-13 74.8-5.9C688.4 737.5 806.7 619 870.4 471.3z m-199 107.8H352.6c-21 0-38.1-17-38.1-38s17-38.1 38-38.1h318.7c21.1 0 38.1 17.1 38.1 38.1s-16.9 38-37.9 38z m0-173.8H352.6c-21 0-38.1-17-38.1-38.1 0-21 17-38.1 38.1-38.1h318.7c21 0 38.1 17 38.1 38.1s-17 38.1-38 38.1z" fill="#3A9CED" p-id="19533"></path><path d="M362.9 579.1h-10.3c-21 0-38.1-17-38.1-38s17-38.1 38-38.1h142.6c38.1-28.6 72.9-61.4 103.6-97.6H352.6c-21 0-38.1-17-38.1-38.1 0-21 17-38.1 38.1-38.1h301.6c43.5-70.1 72.7-148 86.1-229.4H260.1c-58.8 0-106.5 47.7-106.5 106.5V628c73.9-4.4 144.4-21.4 209.3-48.9z" fill="#59ADF8" p-id="19534"></path><path d="M498.5 99.7H260.1c-58.8 0-106.5 47.7-106.5 106.5v167.7C298.8 326.5 420.8 228 498.5 99.7z" fill="#6BC2FC" p-id="19535"></path></svg> <svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 48 48">
\ No newline at end of file <defs>
<mask id="SVG2m4WoNWP">
<g fill="none" stroke="#fff" stroke-linejoin="round" stroke-width="4">
<path fill="#555555" d="M8 44V6a2 2 0 0 1 2-2h28a2 2 0 0 1 2 2v38l-16-8.273z" />
<path stroke-linecap="round" d="M16 18h16" />
</g>
</mask>
</defs>
<path fill="#faaa15" d="M0 0h48v48H0z" mask="url(#SVG2m4WoNWP)" />
</svg>
\ No newline at end of file
src/assets/platforms/logo10.svg 0 → 100644
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg enable-background="new 0 0 512 512" id="Layer_1" version="1.1" viewBox="0 0 512 512" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><path d="M259.9,275c-2.8,5.6-5.2,11.5-9.2,16.5c-10.9,13.4-25.1,20.5-42.3,21.5c-19,1.1-34.9-2.7-51-18.1 c-0.2,3.9-0.5,7.5-0.7,11.1c-0.1,2.3-1,3.2-3.4,3.1c-6.2-0.1-12.3-0.2-18.5,0c-2.9,0.1-3.1-1.1-3.1-3.5c0.3-13.3,0.5-26.6,0.7-40 c0-1.8-0.2-3.6-0.4-5.5c0-6.3,0-12.5,0-18.8c0.1-3.2,0.4-6.3,0.4-9.5c0-25.8,0.1-51.6-0.1-77.4c0-3.4,0.8-4.7,4.4-4.5 c4.8,0.3,9.7,0.4,14.5,0c4.9-0.4,6.5,0.8,6.4,6.1c-0.4,16.6-0.1,33.3-0.1,50c0,1.8,0,3.6,0,5.6c2.3,0.2,3-1.6,4.1-2.6 c22.9-22.5,77.9-21.2,95.8,18.4c5.3,11.7,6.2,24,4.8,36.6C261.5,267.7,260.7,271.4,259.9,275z M236.4,253.4 c-0.1-1.9-0.2-4.4-0.4-6.9c-1.3-16.6-13-29.8-29.8-33.9c-16.3-3.9-33.7,2.9-42.1,16.8c-5.8,9.6-7.2,20.2-6,31.2 c2.9,26,26.4,41.4,51.4,33.7C226.4,289.1,236.4,274.2,236.4,253.4z" fill="#0465D2"/><path d="M259.9,275c0.8-3.6,1.6-7.3,2.3-10.9c7.6-15.2,21.7-19.6,36.9-22.1c16.7-2.8,33.5-1.9,50.3-1.9 c4.3,0,5.4-1.3,5.1-5.4c-0.9-11.4-6.3-18.6-17.4-21.6c-9.6-2.6-19.4-2.9-29,0.5c-6.1,2.1-10.9,5.8-12.7,12.3 c-0.6,2.1-1.7,2.5-3.5,2.5c-6.7,0-13.3-0.1-20,0c-2.9,0.1-3.4-1.1-2.9-3.6c1.7-8.6,6.3-15.3,13.5-20.2c7.7-5.3,16.5-7.9,25.6-9 c15-1.8,29.8-1.8,44.4,2.9c6.4,2.1,11.6,6.2,17.3,9.5c3.6,5,6.5,10.3,8.7,16c2.4,15.4,0.9,30.9,1.2,46.4 c0.3,11.8,0.1,23.6,0.5,35.5c0.1,2.9-0.9,3.3-3.3,3.2c-5.5-0.1-11-0.1-16.5,0c-2.5,0.1-3.6-0.7-3.6-3.3c0-3.5-0.5-7-0.7-10.4 c-1.9-0.5-2.3,1-3.2,1.9c-10,10.3-22.5,15.2-36.7,15.7c-9,0.3-17.9,0.7-26.8-1.8C270.2,305.7,261.2,295.1,259.9,275z M317.8,297.1 c21.1-0.1,35.3-12.7,36.9-35.3c0.3-3.7-0.4-5.3-4.7-5.1c-10,0.5-20,0.1-29.9,0.4c-7.1,0.2-14.3,1.1-21.1,3.5 c-6.5,2.4-11.3,6.4-12.1,13.8c-0.9,8.1,2.4,14.2,9.2,18.5C301.8,296.3,308.2,297.2,317.8,297.1z" fill="#F4AF05"/><path d="M132.1,241.5c0,6.3,0,12.5,0,18.8c-31.8,0-63.6,0.1-95.5-0.1c-4.5,0-5.2,1.4-4.7,5.4 c1.8,14.9,14.7,28.3,29.6,30.4c8.3,1.2,16.6,1,24.6-2c7-2.7,12.5-7,15.7-13.8c1.1-2.3,2.4-3.1,4.9-3c6.2,0.2,12.3,0.3,18.5,0 c3.6-0.2,3.7,1.2,2.8,4c-3.7,12.4-12.1,20.7-23.6,25.6c-21.1,8.9-42.9,9.1-64.4,1.7c-17.7-6.1-28.5-19-32.5-37.4 c-3.1-14.2-2.4-28.2,2.6-41.8c6.4-17.3,19.5-27.5,37-31.9c14.2-3.6,28.6-3.9,43-0.6c21.9,5,35.5,18.5,40.6,40.4 C131.3,238.6,131.7,240,132.1,241.5z M69.1,243.7c9.1,0,18.3,0,27.4,0c10.7,0,11.3-0.8,7.7-11c-4.8-13.8-15.4-19.9-29.1-21.2 c-19.6-1.9-37.6,5.8-42.6,27.8c-0.9,3.8,0.1,4.6,3.7,4.5C47.2,243.6,58.2,243.7,69.1,243.7z" fill="#E4343A"/><path d="M378.6,224.1c-2.2-5.7-5.1-11.1-8.7-16c0-3.3-3-5.4-3.5-9.2c9.3,0,18.4,0,27.4,0c2.4,0,2.5,2.4,3.3,3.9 c12.9,25.7,25.8,51.4,38.7,77.1c0.7,1.3,1.4,2.6,2.5,4.8c4.4-8.8,8.5-17,12.6-25.2c9.5-19,19-38.1,28.4-57.2 c1.3-2.6,2.6-3.7,5.6-3.6c7.3,0.2,14.6,0.1,21.7,0.1c0.7,1.7-0.1,2.7-0.6,3.7c-24.7,48.5-49.4,96.9-73.9,145.4 c-1.4,2.8-3,3.9-6.1,3.8c-7.6-0.2-15.3-0.1-23.2-0.1c-0.3-2.2,1-3.6,1.8-5.1c6-11.5,12.1-23,18.1-34.4c1-1.8,1.5-3.3,0.3-5.5 c-14.2-26.5-28.2-53.1-42.4-79.7C380.1,225.8,379.3,225,378.6,224.1z" fill="#87B819"/></g></svg>
\ No newline at end of file
src/assets/platforms/logo16.svg 0 → 100644
<svg t="1606814005501" class="white-icon" viewBox="0 0 3744 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3226" width="200" height="200"><path d="M797.2121348 334.01729261a107.5584835 107.5584835 0 0 0-59.4229953-93.16282318 172.05267709 172.05267709 0 0 1 3.68070905 29.40477161l36.07094396 475.13857898v2.65828967a160.64248006 160.64248006 0 0 1-38.77012991 104.53212281 106.98592883 106.98592883 0 0 0 89.52301152-105.51364588zM701.30922827 271.93600763a123.91718888 123.91718888 0 0 0-123.87629148-120.89082817l-377.02724747 0.65434834a124.16256881 124.16256881 0 0 0-123.46732417 121.54517654L42.54418891 745.11154269v4.33505627a123.95808516 123.95808516 0 0 0 123.87629149 123.54911787l447.81954238-0.98152198a123.99898145 123.99898145 0 0 0 123.54911672-123.91718886z m-159.49737073 83.47029125A152.05416007 152.05416007 0 0 1 389.83949004 507.91032366h-0.69524464a152.99478575 152.99478575 0 0 1-152.91299317-152.29954112v-25.92854733a25.39688895 25.39688895 0 0 1 50.7528816 0v26.0512373a100.3197565 100.3197565 0 0 0 29.8955326 71.81471428 101.87383424 101.87383424 0 0 0 71.77381799 29.69104895h0.65434724a100.15617025 100.15617025 0 0 0 71.81471428-30.05911996 101.91473052 101.91473052 0 0 0 29.73194634-71.7738169v-26.05123728a25.39688895 25.39688895 0 1 1 50.7528805 0zM2842.45919492 312.2602153a144.12018842 144.12018842 0 0 0-102.65087256-42.53263264H2549.67927701a6.21630764 6.21630764 0 0 0-6.21630763 6.21630765v468.92227134a6.25720504 6.25720504 0 0 0 6.21630763 6.25720503h91.60874654a6.25720504 6.25720504 0 0 0 6.21630764-6.25720503v-184.89425968h92.46757853a145.1426078 145.1426078 0 0 0 102.65087256-247.71168667z m-102.65087256 145.83785243h-92.46757853v-86.53754823h92.46757853a43.26877355 43.26877355 0 0 1 0 86.53754823zM1917.6607196 269.60489269h-91.48605657a6.25720504 6.25720504 0 0 0-6.25720506 6.25720394v182.15417741h-156.1438364V275.86209663a6.25720504 6.25720504 0 0 0-6.25720505-6.25720394h-91.52695285a6.29810132 6.29810132 0 0 0-6.25720391 6.25720394v469.00406502a6.25720504 6.25720504 0 0 0 6.25720391 6.25720503h91.52695285a6.21630764 6.21630764 0 0 0 6.25720505-6.25720503v-182.76762838h156.1438364v182.76762838a6.21630764 6.21630764 0 0 0 6.25720506 6.25720503h91.48605657a6.21630764 6.21630764 0 0 0 6.25720391-6.25720503V275.86209663a6.25720504 6.25720504 0 0 0-6.25720391-6.25720394zM1483.50069551 269.56399529h-232.49809174c-63.88074152 0-121.62697022 43.26877355-134.38675912 105.84082062A133.07806352 133.07806352 0 0 0 1201.88559359 528.35870426l162.85090503 59.79106629a30.01822367 30.01822367 0 0 1 17.38112364 40.16062031 30.7134683 30.7134683 0 0 1-28.62773331 17.95367829h-231.47567125a6.29810132 6.29810132 0 0 0-5.80734034 4.08967633l-39.71075559 92.54937222a6.25720504 6.25720504 0 0 0 5.80734035 8.62921627h267.42392523c69.27911457 0 130.86963742-50.09853327 139.04899012-118.88688684a134.95931378 134.95931378 0 0 0-88.3370059-143.13866646l-162.85090504-59.79106519a28.17786859 28.17786859 0 0 1-16.35870539-37.78860793 28.62773329 28.62773329 0 0 1 26.78737933-16.76767269h235.44265764a6.25720504 6.25720504 0 0 0 6.25720503-6.25720505V275.86209663a6.29810132 6.29810132 0 0 0-6.21630763-6.29810134zM3294.16392889 269.68668637h-100.68782752a6.21630764 6.21630764 0 0 0-5.72554666 3.76250162l-80.32123947 185.09874443-79.91227328-184.03542878a6.29810132 6.29810132 0 0 0-5.76644295-3.76250161h-103.10073725a6.25720504 6.25720504 0 0 0-5.72554666 8.75190734l136.10442423 313.67816321-7.97486904 18.85340658a57.25546659 57.25546659 0 0 1-52.26606197 34.27148626h-36.80708486a6.25720504 6.25720504 0 0 0-5.80734034 3.8851927l-39.87434296 92.38578485a6.25720504 6.25720504 0 0 0 5.80734035 8.62921739h76.68142781a161.78758938 161.78758938 0 0 0 148.53703952-97.45698428l162.60552509-375.1459961a6.25720504 6.25720504 0 0 0-5.76644404-8.91549361zM3709.4705464 269.68668637h-100.68782864a6.25720504 6.25720504 0 0 0-5.76644294 3.76250162l-80.32124058 185.09874443-79.91227217-184.03542878a6.21630764 6.21630764 0 0 0-5.72554666-3.76250161h-103.10073726a6.25720504 6.25720504 0 0 0-5.76644294 8.75190734l136.10442312 313.67816321-8.17935158 18.85340658a57.01008554 57.01008554 0 0 1-52.22516568 34.27148626h-36.80708487a6.25720504 6.25720504 0 0 0-5.80734033 3.8851927l-39.87434296 92.38578485a6.25720504 6.25720504 0 0 0 5.80734034 8.62921739h76.68142782a161.74669311 161.74669311 0 0 0 148.53703951-97.45698428L3715.4005767 278.43859262a6.25720504 6.25720504 0 0 0-5.9300303-8.75190625zM2232.81116575 270.30013732a240.06399237 240.06399237 0 1 0 240.06399236 240.06399237 240.39116598 240.39116598 0 0 0-240.06399236-240.06399237z m0 379.0311888a139.04899012 139.04899012 0 1 1 139.04899012-139.04899012 139.04899012 139.04899012 0 0 1-139.04899012 139.04899012z" fill="#FFFFFF" p-id="3227"></path></svg>
\ No newline at end of file
src/assets/platforms/logo17.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" id="Art" viewBox="0 0 500 125">
<defs>
<style>.cls-1{fill:#121118;}</style>
</defs>
<title>BC_Wordmark_Black</title>
<path class="cls-1" d="M142.05,60.77a18.3,18.3,0,0,1,15.24,7.36V9.89a1.4,1.4,0,0,0-2.22-1.12L83,61.42h1.92c7.48,0,11.32,4.76,11.32,10a9,9,0,0,1-5,8.41.6.6,0,0,0,0,1.1A9.72,9.72,0,0,1,97,90c0,5.94-3.89,10.65-11.43,10.65H65a.78.78,0,0,1-.78-.77V75.12L10.49,114.29a1.22,1.22,0,0,0,.73,2.21H156.06a1.23,1.23,0,0,0,1.23-1.22V95.46a21.74,21.74,0,0,1-15.24,5.9c-11.55,0-21-7.94-21-20.3S130.5,60.77,142.05,60.77ZM113.33,99.94a.71.71,0,0,1-.71.71h-7a.71.71,0,0,1-.71-.71V62.13a.71.71,0,0,1,.71-.71h7a.71.71,0,0,1,.71.71ZM72.55,76.23V69.17a.39.39,0,0,1,.39-.4H83c2.83,0,4.6,1.7,4.6,4.12S85.87,77,83,77H73.32A.76.76,0,0,1,72.55,76.23Zm0,16.29V85.13a.76.76,0,0,1,.77-.77H83.39c3.25,0,5,2,5,4.47,0,2.82-1.88,4.47-5,4.47H73.32A.77.77,0,0,1,72.55,92.52ZM152,72.94l5.28-2.87v8.87H140.82a.83.83,0,0,0-.83.83v5.64a.83.83,0,0,0,.83.83h8.92a.62.62,0,0,1,.62.62v3.78a.63.63,0,0,1-.22.5,13.26,13.26,0,0,1-8.09,2.8c-7.19,0-12.38-5.47-12.38-12.88s5.19-12.88,12.38-12.88a11.25,11.25,0,0,1,8.89,4.52A.86.86,0,0,0,152,72.94ZM163.41,81c0-12.12,8.7-20.29,19.91-20.29a16.81,16.81,0,0,1,14.81,8.16.66.66,0,0,1-.25.94l-4.48,2.43a.64.64,0,0,1-.84-.23,11.14,11.14,0,0,0-9.24-5.19c-7.51,0-13.08,5.89-13.08,14.18s5.57,14.18,13.08,14.18a11.28,11.28,0,0,0,9.25-5.2.64.64,0,0,1,.83-.24l4.51,2.34a.65.65,0,0,1,.26,1c-2.93,4.45-7.57,8.27-14.85,8.27C172.11,101.33,163.41,93.09,163.41,81ZM202,81c0-9.76,5.58-17.35,14-19.61,14.29-3.81,27.4,9.55,24.29,24.46a18.8,18.8,0,0,1-18.92,15.45C210,101.33,202,92.74,202,81Zm32,0c0-8.12-5-14.18-12.58-14.18S208.83,72.91,208.83,81s4.9,14.18,12.58,14.18S234,89.09,234,81Zm47.62,19.13V70.33l-11.94,30.08a.33.33,0,0,1-.31.21h-2.5a.32.32,0,0,1-.3-.21l-12-30.08v29.83a.47.47,0,0,1-.46.46h-6a.47.47,0,0,1-.47-.46V61.85a.47.47,0,0,1,.47-.47h8.63a1,1,0,0,1,.87.59L268.11,88.9,278.55,62a.94.94,0,0,1,.87-.59h8.63a.47.47,0,0,1,.46.47v38.31a.47.47,0,0,1-.46.46h-6A.47.47,0,0,1,281.61,100.16Zm67.93-.25V62.09a.71.71,0,0,1,.71-.71h25.52a.71.71,0,0,1,.71.71v4.64a.71.71,0,0,1-.71.71H357.15a.71.71,0,0,0-.71.71v8.7a.71.71,0,0,0,.71.71h18.21a.71.71,0,0,1,.71.71v4.64a.71.71,0,0,1-.71.71H357.15a.71.71,0,0,0-.71.71v9.52a.71.71,0,0,0,.71.71h18.62a.71.71,0,0,1,.71.71v4.64a.71.71,0,0,1-.71.71H350.25A.71.71,0,0,1,349.54,99.91Zm59,.36-8.25-14a.71.71,0,0,0-.61-.35h-5.79a.71.71,0,0,0-.71.7V99.92a.7.7,0,0,1-.7.7H387a.71.71,0,0,1-.71-.7V62.09a.71.71,0,0,1,.71-.71h16.57c7.78,0,12.91,5,12.91,12.3,0,6.46-4,10.22-8.38,11.32a.71.71,0,0,0-.46,1.06l8.46,13.49a.7.7,0,0,1-.6,1.07h-6.34A.71.71,0,0,1,408.54,100.27Zm.86-26.65c0-3.77-2.83-6.18-6.72-6.18h-8.79a.71.71,0,0,0-.71.71V79.21a.7.7,0,0,0,.71.7h8.79C406.57,79.91,409.4,77.44,409.4,73.62Zm53.66,26.31V62.08a.69.69,0,0,1,.69-.7h25.56a.69.69,0,0,1,.69.7v4.67a.69.69,0,0,1-.69.69H470.65a.7.7,0,0,0-.7.69v8.74a.7.7,0,0,0,.7.69h18.24a.69.69,0,0,1,.7.69v4.68a.69.69,0,0,1-.7.69H470.65a.7.7,0,0,0-.7.69v9.56a.7.7,0,0,0,.7.69h18.66a.69.69,0,0,1,.69.69v4.68a.69.69,0,0,1-.69.69H463.75A.69.69,0,0,1,463.06,99.93ZM421.52,80.87c0-12.12,8.7-20.3,19.91-20.3a16.81,16.81,0,0,1,14.81,8.17.65.65,0,0,1-.25.93l-4.48,2.44a.64.64,0,0,1-.84-.24,11.15,11.15,0,0,0-9.24-5.18c-7.51,0-13.08,5.88-13.08,14.18S433.92,95,441.43,95a11.24,11.24,0,0,0,9.24-5.19.66.66,0,0,1,.84-.24L456,91.94a.67.67,0,0,1,.26,1c-2.93,4.44-7.57,8.26-14.85,8.26C430.22,101.16,421.52,92.93,421.52,80.87Zm-89,19.29V70.33L320.6,100.41a.33.33,0,0,1-.31.21h-2.5a.32.32,0,0,1-.3-.21l-12-30.08v29.83a.46.46,0,0,1-.46.46h-6a.47.47,0,0,1-.47-.46V61.85a.47.47,0,0,1,.47-.47h8.63a1,1,0,0,1,.87.59L319,88.9,329.48,62a1,1,0,0,1,.87-.59H339a.46.46,0,0,1,.46.47v38.31a.46.46,0,0,1-.46.46h-6A.47.47,0,0,1,332.54,100.16Z"></path>
</svg>
src/assets/platforms/logo18.svg 0 → 100644
<svg viewBox="0 0 629.52 150" xmlns="http://www.w3.org/2000/svg" role="img" height="100%" width="100%" class="_6o3atz140 _6o3atz1d7 _6o3atz17d _6o3atzdf" style="--_6o3atz1d6:middle;--_6o3atzd4:100%"><title>Wayfair</title><path fill="#7b189f" stroke-width="0px" d="M624.09,42.29c0-0.77-0.42-1.54-1.47-1.54h-1.89v4.96h0.7V43.9h0.63l1.26,1.81h0.84l-1.33-1.89 C623.74,43.76,624.09,42.99,624.09,42.29L624.09,42.29z M621.44,43.2v-1.81h1.26c0.56,0,0.77,0.49,0.77,0.91 c0,0.42-0.21,0.91-0.84,0.91L621.44,43.2L621.44,43.2z"></path><path fill="#7b189f" stroke-width="0px" d="M622.27,38.94c-2.38,0-4.26,1.89-4.26,4.26c0,2.38,1.89,4.26,4.26,4.26s4.26-1.89,4.26-4.26 C626.54,40.82,624.58,38.94,622.27,38.94z M622.27,46.83c-2.03,0-3.63-1.61-3.63-3.63c-0.07-2.03,1.61-3.63,3.63-3.63 s3.63,1.61,3.63,3.63C625.91,45.23,624.3,46.83,622.27,46.83z"></path><ellipse fill="#7b189f" stroke-width="0px" cx="541.78" cy="15.8" rx="11.49" ry="11.2"></ellipse><rect x="-42.72" y="-20.74" fill="none" stroke-width="0px" width="945.79" height="191.47"></rect><path fill="#7b189f" stroke-width="0px" d="M53.15,111.51L19.41,77.76L7.77,89.4c-1.17,1.17-1.31,2.04-0.87,3.49l5.53,21.53 c0.58,2.33,1.74,3.49,4.07,4.07l21.53,5.53c1.45,0.44,2.33,0.29,3.49-0.87L53.15,111.51L53.15,111.51z M58.68,111.51l11.64,11.64 c1.17,1.17,2.04,1.31,3.49,0.87l21.53-5.53c2.33-0.58,3.49-1.74,4.07-4.07l5.53-21.53c0.44-1.45,0.29-2.33-0.87-3.49L92.43,77.76 L58.68,111.51L58.68,111.51z M58.68,38.49l33.75,33.75l11.64-11.64c1.17-1.17,1.31-2.04,0.87-3.49l-5.53-21.53 c-0.58-2.33-1.74-3.49-4.07-4.07l-21.53-5.53c-1.45-0.44-2.33-0.29-3.49,0.87L58.68,38.49L58.68,38.49z M53.15,38.49L41.52,26.85 c-1.17-1.17-2.04-1.31-3.49-0.87L16.5,31.51c-2.33,0.58-3.49,1.74-4.07,4.07L6.9,57.1c-0.44,1.45-0.29,2.33,0.87,3.49l11.64,11.64 L53.15,38.49L53.15,38.49z"></path><path fill="#7b189f" stroke-width="0px" d="M437.35,53.47h-17.9v52.64c0,2.74-2.22,4.96-4.96,4.96h-13.95v-57.6h-16.28l-21.6,61.24 c-8.73,24.58-17.31,30.98-32.58,30.98c-2.91,0-7.56-0.58-12.22-1.45l4.12-13.53h6.65c7.34,0,11.21-2.28,13.75-8.68 c2.53-6.41,2.59-7.4,2.62-7.46L319.1,38.93h16.41c2.18,0,4.1,1.42,4.74,3.5l14.63,47.55L370.3,43c1.02-2.91,2.33-4.07,5.24-4.07 h25.01v-2.04c0-21.38,9.89-32.58,28.66-32.58c2.91,0,9.49,0.52,13.42,1.4l-4.15,13.58h-5.49c-7.47,0-13.53,6.06-13.53,13.53v6.11 h22.31L437.35,53.47L437.35,53.47z"></path><path fill="#7b189f" stroke-width="0px" d="M200.36,89.4l-14.54-47.27c-0.73-2.47-1.74-3.2-4.22-3.2h-13.82c-2.47,0-3.49,0.73-4.22,3.2L148.87,89.4 l-13.09-50.47h-20.8l20.95,68.95c0.73,2.47,1.74,3.2,4.22,3.2h14.4c2.47,0,3.49-0.73,4.22-3.2l15.27-48.58l15.42,48.58 c0.73,2.47,1.74,3.2,4.22,3.2h12.95c2.47,0,3.49-0.73,4.22-3.2l20.95-68.95H213.6L200.36,89.4L200.36,89.4z"></path><rect x="532.32" y="38.93" fill="#7b189f" stroke-width="0px" width="18.91" height="72.15"></rect><path fill="#7b189f" stroke-width="0px" d="M291.9,43l-0.44,8.3c-4.51-10.77-13.67-13.82-24.44-13.82c-19.78,0-32.15,17.89-32.15,37.53 s12.36,37.53,32.15,37.53c10.77,0,19.93-3.06,24.44-13.82l0.44,8.3c0,2.76,1.31,4.07,3.64,4.07h15.13V38.93h-15.13 C293.21,38.93,291.9,40.23,291.9,43L291.9,43z M272.39,97.44c-11.93,0-18.75-9.94-18.75-22.44s6.81-22.44,18.75-22.44 S291.14,62.5,291.14,75S284.32,97.44,272.39,97.44L272.39,97.44z"></path><path fill="#7b189f" stroke-width="0px" d="M497.64,43l-0.44,8.3c-4.51-10.77-13.67-13.82-24.44-13.82c-19.78,0-32.15,17.89-32.15,37.53 s12.36,37.53,32.15,37.53c10.77,0,19.93-3.06,24.44-13.82l0.44,8.3c0,2.76,1.31,4.07,3.64,4.07h15.13V38.93h-15.13 C498.96,38.93,497.64,40.23,497.64,43L497.64,43z M478.14,97.44c-11.93,0-18.75-9.94-18.75-22.44s6.81-22.44,18.75-22.44 S496.89,62.5,496.89,75S490.07,97.44,478.14,97.44z"></path><path fill="#7b189f" stroke-width="0px" d="M608.98,38.2c-11.2,0-19.2,3.44-22.69,16.82L586,43c0-2.76-1.31-4.07-3.64-4.07h-15.13v72.15h18.91V75 c0-12.65,7.27-20.8,19.78-20.8h3.41l4.59-15.09C612.16,38.36,610.29,38.2,608.98,38.2L608.98,38.2z"></path></svg>
\ No newline at end of file
src/assets/platforms/logo2.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="120" height="60"><g fill="#e43225"><path d="M35.742 35.825V20.083h9.296v1.972h-7.374v4.84h6.628v1.972h-6.628v4.938h7.888v1.972h-9.8zm19.586 0L52.13 31.65l-3.182 4.176h-2.254l4.375-5.584-4.607-5.783h2.535l3.148 4.325 3.198-4.325h2.486l-4.375 5.783 4.126 5.584zm5.352-1.7V41.9h-1.922V30.3c0-2.966 2.254-6.115 5.783-6.115 3.563 0 6.247 2.254 6.247 5.965 0 3.612-2.718 6.115-5.816 6.115-1.508 0-3.53-.663-4.292-2.12zm8.086-3.994c0-2.535-1.64-4.043-4.557-3.894-1.4.05-3.563 1.077-3.38 4.7.05 1.177 1.276 3.38 3.944 3.38 2.303.017 3.994-1.3 3.994-4.176zm3.664 5.684V24.457h1.922v1.226c.945-1.077 2.403-1.458 3.944-1.458v2.07c-.232-.05-2.535-.33-3.944 2.684v6.9H72.43zm6.395-5.675c0-3.28 2.353-5.965 5.584-5.965 4.043 0 5.535 2.684 5.535 6.115v.945H80.93c.15 2.154 2.07 3.28 3.844 3.248 1.3-.05 2.204-.43 3.148-1.36l1.276 1.3c-1.177 1.127-2.684 1.872-4.507 1.872-3.43-.05-5.866-2.585-5.866-6.164zm5.435-4.043c-1.84 0-3.248 1.6-3.33 3.33h6.993c0-1.674-1.2-3.33-3.662-3.33z"/><use xlink:href="#A"/><use xlink:href="#A" x="9.91"/></g><path d="M22.684 35.825l-1.4-3.762H13.67l-1.4 3.762h-2.02l6.115-15.742h2.204l6.065 15.742zM17.38 22.353l-2.867 7.805h5.965zm8.502 13.472V20.083h1.972v15.742zm4.938 0V24.7h1.972v11.135zm3.844-14.748v-.2c-1.508-.05-2.718-1.276-2.767-2.767H31.6c-.05 1.508-1.276 2.718-2.767 2.767v.2c1.508.05 2.718 1.276 2.767 2.767h.298a2.87 2.87 0 0 1 2.767-2.767z" fill="#f7971d"/><defs><path id="A" d="M90.938 34.234l1.4-1.276c-.05 0 .713.746.795.795a2.5 2.5 0 0 0 1.077.563c1.226.33 3.43.232 3.612-1.458.1-.945-.613-1.458-1.4-1.8-1.027-.38-2.154-.514-3.198-.994-1.177-.514-1.922-1.4-1.922-2.718 0-3.43 4.888-3.994 7.092-2.403l1.127 1.077-1.4 1.127c-.713-.845-1.36-1.276-2.867-1.276-.746 0-1.8.33-1.972 1.127-.282 1.127.994 1.558 1.84 1.8 1.127.282 2.353.464 3.33 1.077 1.36.845 1.7 2.684 1.177 4.093-.563 1.558-2.254 2.154-3.762 2.204-1.8.1-3.33-.464-4.607-1.74-.083.033-.315-.2-.315-.2z"/></defs></svg>
\ No newline at end of file
src/assets/platforms/logo3.svg 0 → 100644
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="818px" height="130px" viewBox="0 0 818 130" enable-background="new 0 0 818 130" xml:space="preserve"> <image id="image0" width="818" height="130" x="0" y="0"
xlink:href="data:image/png;base64,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" />
</svg>
src/assets/platforms/logo5.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="60" fill-rule="evenodd"><path d="M72.038 40.703c-5.8 4.283-14.234 6.57-21.486 6.57-10.168 0-19.323-3.76-26.248-10.016-.544-.492-.057-1.162.596-.78 7.474 4.35 16.715 6.965 26.26 6.965 6.438 0 13.52-1.332 20.032-4.096.984-.418 1.806.644.844 1.358m2.418-2.764c-.74-.95-4.9-.448-6.782-.226-.57.07-.657-.427-.144-.784 3.32-2.338 8.77-1.663 9.407-.88s-.165 6.25-3.286 8.858c-.48.4-.936.187-.723-.344.7-1.75 2.272-5.672 1.528-6.625" fill="#f90"/><path d="M67.803 20.427v-2.272a.56.56 0 0 1 .575-.575H78.55c.326 0 .588.235.588.575V20.1c-.004.326-.28.753-.766 1.428l-5.27 7.526c1.96-.048 4.026.244 5.802 1.245.4.226.5.557.54.884v2.425c0 .33-.366.718-.75.518-3.13-1.64-7.287-1.82-10.747.017-.353.192-.723-.192-.723-.522v-2.303c0-.37.004-1 .374-1.563l6.107-8.758H68.4c-.326 0-.588-.23-.588-.57M30.694 34.605H27.6c-.296-.022-.53-.244-.553-.527V18.194c0-.318.266-.57.596-.57h2.886c.3.013.54.244.562.53v2.076h.057c.753-2.007 2.168-2.943 4.074-2.943 1.937 0 3.147.936 4.018 2.943.75-2.007 2.45-2.943 4.275-2.943 1.297 0 2.716.535 3.582 1.737.98 1.336.78 3.278.78 4.98L47.87 34.03c0 .318-.266.575-.596.575h-3.1c-.3-.022-.557-.27-.557-.575V25.6c0-.67.06-2.342-.087-2.977-.23-1.066-.923-1.367-1.82-1.367-.75 0-1.532.5-1.85 1.302s-.287 2.142-.287 3.043v8.42c0 .318-.266.575-.596.575h-3.1c-.313-.022-.557-.27-.557-.575l-.004-8.42c0-1.772.292-4.38-1.907-4.38-2.224 0-2.137 2.542-2.137 4.38v8.42c0 .318-.266.575-.596.575M87.896 17.3c4.592 0 7.078 3.944 7.078 8.958 0 4.845-2.747 8.688-7.078 8.688-4.5 0-6.965-3.944-6.965-8.858 0-4.945 2.486-8.8 6.965-8.8m.026 3.243c-2.28 0-2.425 3.108-2.425 5.045s-.03 6.085 2.398 6.085c2.398 0 2.512-3.343 2.512-5.38 0-1.34-.057-2.943-.46-4.214-.348-1.106-1.04-1.537-2.024-1.537m13.007 14.075h-3.082c-.3-.022-.557-.27-.557-.575l-.004-15.888c.026-.292.283-.518.596-.518h2.87c.27.013.492.196.553.444v2.43h.057c.866-2.172 2.08-3.208 4.218-3.208 1.4 0 2.742.5 3.613 1.872.8 1.27.8 3.408.8 4.945v10c-.035.28-.292.5-.596.5H106.3c-.283-.022-.518-.23-.548-.5V25.48c0-1.737.2-4.28-1.937-4.28-.753 0-1.445.505-1.8 1.27-.435.97-.492 1.937-.492 3.008v8.554c-.004.318-.274.575-.605.575m-41.225-7.6c0 1.206.03 2.2-.58 3.282-.492.87-1.275 1.406-2.142 1.406-1.188 0-1.885-.905-1.885-2.242 0-2.638 2.364-3.117 4.605-3.117v.67m3.12 7.544c-.205.183-.5.196-.73.074-1.027-.853-1.214-1.25-1.776-2.063-1.698 1.732-2.903 2.25-5.102 2.25-2.607 0-4.632-1.606-4.632-4.823 0-2.512 1.358-4.222 3.3-5.058 1.68-.74 4.026-.87 5.82-1.075v-.4c0-.736.057-1.606-.38-2.242-.374-.57-1.097-.805-1.737-.805-1.18 0-2.23.605-2.486 1.86-.052.28-.257.553-.54.566l-3-.322c-.252-.057-.535-.26-.46-.65.688-3.64 3.98-4.736 6.92-4.736 1.506 0 3.474.4 4.662 1.54 1.506 1.406 1.362 3.282 1.362 5.324v4.823c0 1.45.6 2.085 1.167 2.87.196.28.24.614-.013.823L62.82 34.57l-.004-.01M19.12 27.017c0 1.206.03 2.2-.58 3.282-.492.87-1.27 1.406-2.142 1.406-1.188 0-1.88-.905-1.88-2.242 0-2.638 2.364-3.117 4.6-3.117v.67m3.12 7.544c-.205.183-.5.196-.73.074-1.027-.853-1.2-1.25-1.776-2.063-1.698 1.732-2.9 2.25-5.102 2.25C12.028 34.822 10 33.216 10 30c0-2.512 1.362-4.222 3.3-5.058 1.68-.74 4.026-.87 5.82-1.075v-.4c0-.736.057-1.606-.374-2.242-.38-.57-1.1-.805-1.737-.805-1.18 0-2.233.605-2.5 1.86-.052.28-.257.553-.535.566l-3.004-.322c-.252-.057-.53-.26-.46-.65.692-3.64 3.98-4.736 6.92-4.736 1.506 0 3.474.4 4.662 1.54 1.506 1.406 1.362 3.282 1.362 5.324v4.823c0 1.45.6 2.085 1.167 2.87.2.28.244.614-.01.823l-2.36 2.052-.01-.01" fill="#221f1f"/></svg>
\ No newline at end of file
src/assets/platforms/logo8.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="60"><path d="M58.505 27.333c0 1.64-.675 2.96-2.034 3.964S53.215 32.8 50.78 32.8h-1.35l-1.037 4.478H44.83l3.176-13.756h4.944c.9 0 1.68.064 2.348.185s1.246.338 1.73.635a3.08 3.08 0 0 1 1.101 1.174c.25.498.378 1.1.378 1.817zm-3.787.346c0-.54-.193-.933-.587-1.2s-.965-.386-1.73-.386h-1.43l-.95 4.116h1.28c1.077 0 1.92-.217 2.516-.66.603-.442.9-1.07.9-1.88zm10.34 8.506l-.756.5c-.297.193-.57.346-.82.458a6.17 6.17 0 0 1-.973.322c-.306.072-.724.113-1.254.113-.86 0-1.568-.24-2.114-.724s-.82-1.118-.82-1.9c0-.82.193-1.5.58-2.082s.965-1.03 1.73-1.367c.716-.322 1.568-.555 2.55-.7l3.208-.314.04-.177c.024-.08.032-.177.032-.28a.93.93 0 0 0-.6-.917c-.4-.177-1.013-.265-1.817-.265-.547 0-1.15.088-1.817.273l-1.487.458h-.306l.5-2.46c.386-.096 1-.2 1.8-.33s1.624-.185 2.428-.185c1.624 0 2.822.2 3.578.635.764.426 1.142 1.085 1.142 1.978a4.1 4.1 0 0 1-.032.482 3.62 3.62 0 0 1-.088.515l-1.624 7.06h-3.304zm.884-3.795l-1.672.177a6.27 6.27 0 0 0-1.327.297c-.378.137-.667.33-.86.57-.2.25-.297.57-.297.98 0 .354.13.6.394.756s.643.217 1.15.217c.33 0 .675-.072 1.053-.225a5.11 5.11 0 0 0 1.053-.58zm9.038 8.7h-3.66l2.645-4.012-1.704-10.162h3.4l.9 6.794 3.947-6.794h3.513z" fill="#123984"/><path d="M97.32 27.333c0 1.64-.675 2.96-2.034 3.964S92.03 32.8 89.595 32.8h-1.35l-1.037 4.478h-3.562l3.168-13.748h4.944c.9 0 1.68.064 2.348.185s1.246.338 1.73.635a3.08 3.08 0 0 1 1.101 1.174c.257.5.386 1.093.386 1.8zm-3.795.346c0-.54-.193-.933-.587-1.2s-.965-.386-1.73-.386h-1.43l-.95 4.116h1.278c1.077 0 1.92-.217 2.516-.66.603-.442.9-1.07.9-1.88zm10.348 8.506l-.756.5c-.297.193-.57.346-.82.458a6.17 6.17 0 0 1-.973.322c-.306.072-.724.113-1.254.113-.86 0-1.568-.24-2.114-.724s-.82-1.118-.82-1.9c0-.82.193-1.5.58-2.082s.965-1.03 1.73-1.367c.716-.322 1.568-.555 2.55-.7l3.208-.314.04-.177c.024-.08.032-.177.032-.28a.93.93 0 0 0-.6-.917c-.4-.177-1.013-.265-1.817-.265-.547 0-1.15.088-1.817.273l-1.487.458h-.306l.5-2.46c.386-.096 1-.2 1.8-.33s1.624-.185 2.428-.185c1.624 0 2.822.2 3.578.635.764.426 1.142 1.085 1.142 1.978a4.1 4.1 0 0 1-.032.482 3.62 3.62 0 0 1-.088.515l-1.624 7.06h-3.312zm.884-3.795l-1.672.177a6.27 6.27 0 0 0-1.327.297c-.378.137-.667.33-.86.57-.2.25-.297.57-.297.98 0 .354.13.6.394.756s.643.217 1.15.217c.33 0 .675-.072 1.053-.225a5.11 5.11 0 0 0 1.053-.58zm11.875-9.48l-3.32 14.375h-3.345l3.32-14.375z" fill="#009de2"/><g transform="matrix(.071673 0 0 .071673 -13.776444 3.122618)"><path d="M754.6 298.1c0 54.6-22.7 98.7-68 132.2s-108.6 50.2-190 50.2h-45L417.1 630H298.2L408 171.2h161c30 0 56.1 2.1 78.5 6.2 22.3 4.1 41.6 11.2 57.8 21.3 16 10.1 28.3 23.2 36.7 39.3 8.4 16 12.6 36.1 12.6 60.1z" fill="#009cde"/><path d="M421.1 634.9H292l112.2-468.7H569c30.1 0 56.8 2.1 79.3 6.2 22.8 4.2 42.8 11.6 59.5 21.9 16.7 10.5 29.7 24.4 38.5 41.2s13.2 37.8 13.2 62.5c0 56-23.5 101.9-70 136.2-46 34-110.9 51.2-193 51.2h-41.1zm-116.6-9.8h108.7l34.5-149.5h48.9c79.9 0 142.9-16.6 187.1-49.3 21.9-16.2 38.6-35.2 49.5-56.4s16.4-45.4 16.4-71.8c0-23.1-4.1-42.6-12.1-58-8-15.3-19.7-27.8-34.9-37.4-15.6-9.7-34.5-16.6-56.1-20.6-21.9-4-48-6.1-77.6-6.1h-157z" fill="#fff"/><path d="M701.8 247c0 54.6-22.7 98.7-68 132.2s-108.6 50.2-190 50.2h-45l-34.5 149.5H245.4L351.3 120h164.9c30 0 56.1 2.1 78.5 6.2 22.3 4.1 41.6 11.2 57.8 21.3 16 10.1 28.3 23.2 36.7 39.3 8.4 16 12.6 36.1 12.6 60.2z" fill="#0f3572"/><path d="M368.2 583.8h-129l108.1-468.7h168.9c30.1 0 56.8 2.1 79.3 6.2 22.8 4.2 42.8 11.6 59.5 21.9 16.7 10.5 29.7 24.4 38.5 41.2s13.2 37.8 13.2 62.5c0 56-23.5 101.9-70 136.2-46 34-110.9 51.2-193 51.2h-41.1zm-116.6-9.9h108.8l34.5-149.5h48.9c79.9 0 142.9-16.6 187.1-49.3 21.9-16.2 38.6-35.2 49.5-56.4s16.4-45.4 16.4-71.8c0-23.1-4.1-42.6-12.1-58-8-15.3-19.7-27.8-34.9-37.4-15.6-9.7-34.5-16.6-56.1-20.6-21.9-4-48-6.1-77.6-6.1h-161zm328-310.6c-.9 14-3.7 24.3-12.3 36.2-8.5 11.9-18.5 19.6-31.9 26-8.1 3.8-16.5 6.3-25.3 7.5s-19.3 1.9-31.6 1.9h-59.1l33.1-118.6h53.7c13.7 0 24.7.2 33 2.1 8.3 1.8 15.1 4.3 20.2 7.4 7.1 4.2 12.8 9.3 16.1 15.8 4.1 7.6 4.6 12.5 4.1 21.7z" fill="#fff"/></g></svg>
\ No newline at end of file
src/assets/platforms/logo9.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" viewBox="-231.5 619.2 120 60" width="120" height="60"><g transform="matrix(.984273 0 0 .984273 -2.3119 10.466283)"><path d="M-128.67 643.868c.758 0 1.415-.404 1.466-.9l.758-8.54c0-.86-1-1.516-2.224-1.516-1.263 0-2.224.708-2.224 1.516l.758 8.54c.05.505.708.9 1.466.9m-4.65 2.68c.404-.657.354-1.415-.05-1.718l-7.025-4.902c-.708-.404-1.82.1-2.426 1.162s-.505 2.274.202 2.678l7.783 3.64c.505.152 1.162-.202 1.516-.86m9.25-.001c.404.657 1.06 1 1.516.8l7.783-3.64c.708-.404.86-1.617.202-2.678-.606-1.06-1.718-1.567-2.426-1.162l-7.025 4.902c-.404.354-.455 1.112-.05 1.77m-4.6 7.983c.758 0 1.415.404 1.466.9l.758 8.54c0 .86-1 1.516-2.224 1.516-1.263 0-2.224-.708-2.224-1.516l.758-8.54c.05-.505.708-.9 1.466-.9m4.6-2.67c.404-.657 1.06-1 1.516-.8l7.783 3.588c.708.404.86 1.617.202 2.678-.606 1.06-1.718 1.567-2.426 1.162l-7.025-4.902c-.404-.303-.455-1.06-.05-1.718m-9.25.002c.404.657.354 1.415-.05 1.718l-7.025 4.902c-.708.404-1.82-.1-2.426-1.162s-.505-2.274.202-2.678l7.783-3.588c.505-.202 1.162.152 1.516.8" fill="#fdbb30"/><g fill="#1a75cf"><path d="M-165.77 652.776c0 .212 0 .466-.085.635-.254.804-1.1 1.524-2.158 1.524-.9 0-1.608-.508-1.608-1.566 0-1.65 1.82-2.074 3.85-2.074zm3.216-2.836c0-2.7-1.143-5.08-5.036-5.08-2 0-3.597.55-4.444 1.058l.635 2.158c.804-.508 2.03-.93 3.26-.93 2 0 2.285 1.1 2.285 1.82v.17c-4.317 0-7.025 1.48-7.025 4.528 0 1.862 1.397 3.597 3.8 3.597 1.48 0 2.7-.592 3.47-1.524h.085s.508 2.074 3.216 1.27c-.127-.846-.17-1.778-.17-2.878l-.085-4.2m-67.08-8.75l3.26 13.374c.508 2.2 1.48 3.005 4.2 2.455l1.735-7.152 1.016-4.825h.042c.212 1.82.508 3.1.846 4.867l1.1 4.952c.38 1.693 1.397 2.793 4.063 2.2l4.2-15.828h-3.386l-1.44 6.856-1.016 5.375h-.042l-.93-5.248-1.48-6.983H-221l-1.608 6.814-1.143 5.502h-.042a171.66 171.66 0 0 0-1.016-5.756l-1.27-6.56-3.555-.042m26.876 11.596c0 .212 0 .466-.085.635-.254.804-1.1 1.524-2.158 1.524-.9 0-1.608-.508-1.608-1.566 0-1.65 1.82-2.074 3.85-2.074zm3.216-2.836c0-2.7-1.143-5.08-5.036-5.08-2 0-3.597.55-4.444 1.058l.635 2.158c.804-.508 2.03-.93 3.26-.93 2 0 2.285 1.1 2.285 1.82v.17c-4.317 0-7.025 1.48-7.025 4.528 0 1.862 1.397 3.597 3.8 3.597 1.48 0 2.7-.592 3.47-1.524h.085s.508 2.074 3.216 1.27c-.127-.846-.17-1.778-.17-2.878v-4.2m5.246 3.736V641.18h-3.216v15.828h3.216v-3.343"/><path d="M-152.1 641.18v11.68c0 1.608.296 2.75.93 3.428.55.592 1.48.973 2.624.973.93 0 1.904-.17 2.328-.34l-.042-2.497c-.34.085-.72.127-1.227.127-1.1 0-1.48-.72-1.48-2.158v-4.486h2.793v-3.047h-2.793v-3.724h-3.132m-8.338 3.98v11.892h3.3v-6.094c0-.34 0-.635.085-.9.254-1.27 1.227-2.074 2.624-2.074.38 0 .677.042.973.085v-3.132c-.254-.042-.423-.085-.72-.085-1.227 0-2.666.804-3.26 2.497h-.085v-2.243h-2.92m-31.484.054v11.892h3.216v-6.983c0-.34.042-.677.17-.973.254-.72.93-1.524 1.947-1.524 1.312 0 1.904 1.1 1.904 2.7v6.77h3.216v-7.068c0-.296.042-.677.127-.973.254-.804.973-1.44 1.947-1.44 1.312 0 1.947 1.1 1.947 2.962v6.518h3.216v-7.025c0-3.682-1.862-5.163-3.978-5.163a4.43 4.43 0 0 0-2.328.635c-.55.34-1.058.846-1.524 1.48h-.042c-.508-1.27-1.693-2.116-3.26-2.116-2.03 0-2.92 1.016-3.47 1.904h-.042v-1.608h-3.047"/></g></g></svg>
\ No newline at end of file
src/components/footBanner.vue 0 → 100644
<template>
<div class="footer-bg flex items-center" v-if="bannerContent">
<div
class="footer-banner w-full flex flex-col items-center place-content-between py-8 lg:py-16 gap-6">
<p
class="footer-title font-medium text-lg lg:text-4xl text-center text-gray-700 tracking-wide">
{{ bannerContent.title }}
</p>
<p class="text-xs lg:text-xl text-center text-gray-500">
{{ bannerContent.description }}
</p>
<button
class="footer-register-btn lg:w-48 w-20 h-8 lg:h-14 rounded-lg text-sm lg:text-lg text-gray-700 cursor-pointer transition ease-in-out duration-300 hover:bg-primary-color hover:text-white"
@click="goToLogin">
立即使用
</button>
</div>
<Register :visible="registerDialog" @close="registerDialog = false" />
</div>
</template>
<script>
import Register from '../views/homePage/register.vue'
export default {
name: 'FootBanner',
components: {
Register,
},
inject: {
scrollParent: 'scrollParent',
},
data() {
return {
registerDialog: false,
}
},
computed: {
bannerContent() {
const path =
(this.$route && this.$route.path) ||
(typeof window !== 'undefined' ? window.location.pathname : '/home')
const contentMap = {
'/home': {
url: '/home',
title: '人效全面提升、业绩翻倍增长，从此刻开始！',
description: '九猫ERP将帮助您提升每一个人员效率，快速实现业务增长',
},
'/product/production': {
url: '/product/production',
title: '亚马逊ERP一体化管理，开启高效决策新体验',
description:
'九猫ERP助力精准核算业务利润与高效决策，业财一体化不再是难事',
},
'/price': {
url: '/price',
title: '选择九猫，开始高效管理跨境电商业务',
description: '已有超过60万卖家在使用九猫ERP，提升业务管理效益',
},
'/about': {
url: '/about',
title: '选择九猫，全面提升跨境业务效益！',
description: '已有60万+跨境卖家选择九猫ERP，实现业务高效增长',
},
}
return contentMap[path] || null
},
},
methods: {
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
},
}
</script>
<style scoped lang="scss">
.footer-banner {
background-image: linear-gradient(
to right,
var(--el-color-primary-light-4),
var(--el-color-primary-light-8),
#ffffff00 20%,
#ffffff00 80%,
var(--el-color-primary-light-8),
var(--el-color-primary-light-4)
);
background-size: 100% 40%;
background-position: center;
background-repeat: no-repeat;
}
@media (max-width: 1100px) {
.footer-banner {
background-size: 100% 30%;
}
}
.footer-register-btn {
border: 1px solid var(--primary-color);
&:hover {
background: var(--primary-color);
}
}
.footer-title {
color: var(--secondary-color);
}
</style>
src/components/footer.vue
<template> <template>
<footer class="banner_footer"> <div>
<div <FootBanner />
class="footer-container flex justify-between text-white w-full-70 w-full-90 mx-auto py-12 px-6 lg:py-20 lg:px-0"> <footer class="banner_footer">
<div class="footer-content-left"> <div
<div class="mr-48 hidden lg:block"> class="footer-container flex justify-between text-white w-full-70 w-full-90 mx-auto py-12 px-6 lg:py-20 lg:px-0">
<div class="jomalls text-3xl font-bold tracking-wider font-mono"> <div class="footer-content-left">
<span>JOMALLS九猫</span> <div class="mr-48 hidden lg:block">
</div> <div class="jomalls text-3xl font-bold tracking-wider font-mono">
<div class="flex mt-12 gap-2"> <span>JOMALLS九猫</span>
<div class="flex flex-col items-center mr-35px">
<div class="rounded-sm bg-white overflow-hidden">
<div class="w-32 h-32 border">
<img class="w-full h-full" src="../assets/images/home/wx.png"/>
</div>
</div>
<p class="mt-3 font-light text-xs text-white text-opacity-65">
扫码获取专业服务
</p>
</div> </div>
<div class="flex flex-col items-center"> <div class="flex mt-12 gap-2">
<div class="rounded-sm bg-white overflow-hidden"> <div class="flex flex-col items-center mr-35px">
<div class="w-32 h-32 border"> <p class="mb-3 font-light text-xs text-white text-opacity-65">
<img class="w-full h-full" src="../assets/images/home/qywx.png"/> 九猫ERP官方技术支持
</p>
<div class="rounded-sm bg-white overflow-hidden">
<div class="w-32 h-32 border">
<img
class="w-full h-full"
src="../assets/images/home/wx.png" />
</div>
</div> </div>
</div> </div>
<p class="mt-3 font-light text-xs text-white text-opacity-65"> <div class="flex ml-10 flex-col items-center">
扫码了解九猫最新动态 <p class="mb-3 font-light text-xs text-white text-opacity-65">
</p> 九猫ERP官方公众号
</div> </p>
<div class="flex flex-col items-center"> <div class="rounded-sm bg-white overflow-hidden">
<div class="rounded-sm bg-white overflow-hidden"> <div class="w-32 h-32 border">
<div class="w-32 h-32 border"> <img
<img class="w-full h-full" src="../assets/images/home/xhs.png"/> class="w-full h-full"
src="../assets/images/home/gzh.jpg" />
</div>
</div> </div>
</div> </div>
<p class="mt-3 font-light text-xs text-white text-opacity-65">
小红书
</p>
</div> </div>
</div> </div>
<div class="mt-8 flex items-center"> <div
<div class="mr-6"> class="flex flex-col gap-5 lg:gap-0 lg:flex-row justify-center items-center mt-0 lg:mt-20 mr-0 lg:mr-48">
<p class="font-light text-sm text-white text-opacity-65"> <el-tooltip
售前咨询电话 class="item"
</p> effect="light"
<p class="text-2xl font-medium">19898576659</p> :placement="$isMobile ? 'right' : 'top'">
<div slot="content" class="flex flex-col items-center">
<img
:class="$isMobile ? 'w-60 h-60' : 'w-32 h-32'"
src="../assets/images/home/dy.png"
alt="" />
<div class="text-base lg:text-sm">九猫抖音</div>
</div>
<div class="icons-circle">
<img
class="icons"
src="../assets/images/home/tictok.svg"
alt="" />
</div>
</el-tooltip>
<el-tooltip
class="item"
effect="light"
:placement="$isMobile ? 'right' : 'top'">
<div slot="content" class="flex flex-col items-center">
<img
:class="$isMobile ? 'w-60 h-60' : 'w-32 h-32'"
src="../assets/images/home/xhs.png"
alt="" />
<div class="text-base lg:text-sm">九猫小红书</div>
</div>
<div class="icons-circle">
<img
class="icons"
style="width: 40px"
src="../assets/images/home/redbook.png"
alt="" />
</div>
</el-tooltip>
<el-tooltip
class="item"
effect="light"
:placement="$isMobile ? 'right' : 'top'">
<div slot="content" class="flex flex-col items-center">
<img
:class="$isMobile ? 'w-60 h-60' : 'w-32 h-32'"
src="../assets/images/home/fwh.jpg"
alt="" />
<div class="text-base lg:text-sm">九猫微信服务号</div>
</div>
<div class="icons-circle">
<img class="icons" src="../assets/images/home/fwh.png" alt="" />
</div>
</el-tooltip>
<div class="block lg:hidden">
<el-tooltip
class="item"
effect="light"
:placement="$isMobile ? 'right' : 'top'">
<div slot="content" class="flex flex-col items-center">
<img
:class="$isMobile ? 'w-60 h-60' : 'w-32 h-32'"
src="../assets/images/home/wx.png"
alt="" />
<div class="text-base lg:text-sm">九猫官方技术支持</div>
</div>
<div class="icons-circle">
<img
class="icons"
src="../assets/images/home/qywx_icon.png"
alt="" />
</div>
</el-tooltip>
</div> </div>
<div class="ml-6">
<p class="font-light text-sm text-white text-opacity-65"> <div class="block lg:hidden">
售后咨询电话 <el-tooltip
</p> class="item"
<p class="text-2xl font-medium">xxxxx</p> effect="light"
:placement="$isMobile ? 'right' : 'top'">
<div slot="content" class="flex flex-col items-center">
<img
:class="$isMobile ? 'w-60 h-60' : 'w-32 h-32'"
src="../assets/images/home/fwh.jpg"
alt="" />
<div class="text-base lg:text-sm">九猫ERP官方公众号</div>
</div>
<div class="icons-circle">
<img
class="icons"
src="../assets/images/home/wechat.svg"
alt="" />
</div>
</el-tooltip>
</div> </div>
</div> </div>
<div class="mt-5">
<p class="font-light text-sm text-white text-opacity-65">邮箱</p>
<a class="text-2xl font-medium" href="mailto:mia@jomalls.com">
mia@jomalls.com
</a>
</div>
</div> </div>
</div> <div class="footer-content-right flex flex-1 flex-col">
<div class="footer-content-right flex flex-1 flex-col"> <div
<div class="flex flex-col lg:flex-row lg:justify-between lg:mb-20 mb-7.5">
class="flex flex-col lg:flex-row lg:justify-between lg:mb-20 mb-7.5">
<div class="border-b border-gray-700 border-solid lg:border-b-0">
<div <div
class="flex justify-between items-center font-medium text-base leading-10 lg:text-lg lg:leading-normal"> v-for="(section, index) in footerSections"
产品 :key="index"
<span class="border-b border-gray-700 border-solid lg:border-b-0">
class="flex justify-center items-center w-5 h-5" <div
@click="isShowProduct = !isShowProduct" class="flex justify-between items-center font-medium text-base leading-10 lg:text-lg lg:leading-normal">
v-show="$isMobile"> {{ section.title }}
<i <i
:class=" class="w-5 h-5 el-icon-arrow-down transition-all duration-300 transform"
isShowProduct ? 'el-icon-arrow-up' : 'el-icon-arrow-down' :class="[
" sectionStates[section.key] ? 'rotate-180' : 'rotate-0',
class="transition-all"></i> ]"
</span> @click="toggleSection(section.key)"
v-show="$isMobile" />
</div>
<!-- 桌面端 -->
<ul
v-if="!$isMobile"
class="footer-routers rounded-md mt-0 mb-1 space-y-5 p-4 lg:bg-transparent lg:space-y-3 lg:py-0 lg:px-0 lg:mb-0 lg:mt-7">
<li v-for="(link, linkIndex) in section.links" :key="linkIndex">
<a
:href="link.href"
:rel="link.rel"
:target="link.target ? link.target : null"
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white">
{{ link.text }}
</a>
</li>
</ul>
<!-- 移动端 -->
<transition name="slide-fade">
<ul
v-if="$isMobile && sectionStates[section.key]"
class="footer-routers rounded-md mt-0 mb-1 space-y-5 p-4 lg:bg-transparent lg:space-y-3 lg:py-0 lg:px-0 lg:mb-0 lg:mt-7">
<li
v-for="(link, linkIndex) in section.links"
:key="linkIndex">
<a
:href="link.href"
:rel="link.rel"
:target="link.target ? link.target : null"
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white">
{{ link.text }}
</a>
</li>
</ul>
</transition>
</div> </div>
<ul <div class="border-b border-gray-700 border-solid lg:border-b-0">
class="footer-routers bg-textPrimary rounded mt-0 mb-2 space-y-5 py-5 px-4 lg:bg-transparent lg:space-y-3 lg:py-0 lg:px-0 lg:mb-0 lg:mt-7" <div
v-show="isShowProduct || !$isMobile"> class="flex justify-between items-center font-medium text-base leading-10 lg:text-lg lg:leading-normal">
<li> 联系我们
<a <span
href="/product/production" class="flex justify-center items-center w-5 h-5"
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white" v-show="$isMobile"></span>
blank="true"> </div>
生产管理 <ul
</a> class="bg-textPrimary rounded mt-0 mb-2 space-y-5 py-[18px] px-0 lg:bg-transparent lg:space-y-3 lg:py-0 lg:px-0 lg:mb-0 lg:mt-7">
</li> <li>
<li> <p
<a class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 cursor-pointer"
href="/product/custom-chain" @click="copy('18103641690')">
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white" <span class="mr-2">售前咨询电话:18103641690</span>
blank="true"> <i class="el-icon-document-copy"></i>
一件定制 </p>
</a> </li>
</li> <li>
<li> <p
<a class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 cursor-pointer"
href="/product/logistics" @click="copy('mia@jomalls.com')">
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white" <span class="mr-2">邮箱: mia@jomalls.com</span>
blank="true"> <i class="el-icon-document-copy"></i>
海外仓物流 </p>
</a> </li>
</li> <li>
<li> <p
<a class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 cursor-pointer"
href="/product/platform" @click="copy('广州市南沙区丰泽东路106号')">
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white" <span class="mr-2">地址: 广州市南沙区丰泽东路106号</span>
blank="true"> <i class="el-icon-document-copy"></i>
自建站平台 </p>
</a> </li>
</li> </ul>
</ul>
</div>
<div class="border-b border-gray-700 border-solid lg:border-b-0">
<div
class="flex justify-between items-center font-medium text-base leading-10 lg:text-lg lg:leading-normal">
资源
<span
class="flex justify-center items-center w-5 h-5"
@click="isShowResource = !isShowResource"
v-show="$isMobile">
<i
:class="
isShowResource ? 'el-icon-arrow-up' : 'el-icon-arrow-down'
"
class="transition-all"></i>
</span>
</div> </div>
<ul
v-show="isShowResource || !$isMobile"
class="bg-textPrimary rounded mt-0 mb-2 space-y-5 py-[18px] px-4 lg:bg-transparent lg:space-y-3 lg:py-0 lg:px-0 lg:mb-0 lg:mt-7">
<li>
<a
href=""
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white"
blank="true">
活动信息
</a>
</li>
<li>
<a
href=""
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white"
blank="true">
入住平台流程
</a>
</li>
<li>
<a
href=""
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white"
blank="true">
咨讯
</a>
</li>
</ul>
</div> </div>
<div
<div class="border-b border-gray-700 border-solid lg:border-b-0"> class="overflow-hidden col-span-full border-t border-gray-700 border-solid">
<div
class="flex justify-between items-center font-medium text-base leading-10 lg:text-lg lg:leading-normal">
案例
<span
class="flex justify-center items-center w-5 h-5"
@click="isShowCase = !isShowCase"
v-show="$isMobile">
<i
:class="
isShowCase ? 'el-icon-arrow-up' : 'el-icon-arrow-down'
"
class="transition-all"></i>
</span>
</div>
<ul <ul
v-show="isShowCase || !$isMobile" class="flex flex-wrap justify-end -mr-3 lg:pt-8 hidden lg:flex"></ul>
class="bg-textPrimary text-gray-400 rounded mt-0 mb-2 space-y-5 py-[18px] px-4 lg:bg-transparent lg:space-y-3 lg:py-0 lg:px-0 lg:mb-0 lg:mt-7"> <div class="hidden lg:block text-right">
<li> <a
<a href="/after-sales-agreement"
href="/case" target="_blank"
class="font-normal inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white" class="text-xs text-gray-400 text-white text-opacity-45 font-light">
blank="true"> 售后协议
案例中心 </a>
</a>
</li>
</ul>
</div>
<div class="border-b border-gray-700 border-solid lg:border-b-0">
<div
class="flex justify-between items-center font-medium text-base leading-10 lg:text-lg lg:leading-normal">
关于
<span
class="flex justify-center items-center w-5 h-5"
@click="isShowAbout = !isShowAbout"
v-show="$isMobile">
<i
:class="
isShowAbout ? 'el-icon-arrow-up' : 'el-icon-arrow-down'
"></i>
</span>
</div> </div>
<ul <div
v-show="isShowAbout || !$isMobile" class="text-xs text-center lg:text-right lg:mt-4 text-white text-opacity-45 font-light mt-4">
class="bg-textPrimary rounded mt-0 mb-2 space-y-5 py-[18px] px-4 lg:bg-transparent lg:space-y-3 lg:py-0 lg:px-0 lg:mb-0 lg:mt-7"> <span class="flex justify-center items-center md:justify-end">
<li> <img
<a src="https://static.distributetop.com/office-site-new/office-site-upload/img/gongan.0c57706.png"
href="/join" class="w-5 h-5 mr-1" />
target="_blank"
rel="noopener nofollow noreferrer"
static="true"
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white">
加入我们
</a>
</li>
<li>
<a <a
href="/about" href="https://beian.miit.gov.cn"
target="_blank" target="_blank"
rel="noopener nofollow noreferrer" rel="noopener nofollow noreferrer"
static="true" static="true"
class="font-normal text-gray-400 inline-block w-full h-full text-sm text-white/65 hover:underline hover:text-white"> class="text-xs text-gray-400 text-white text-opacity-45 font-light">
关于九猫 粤ICP备2022141405号-1
</a> </a>
</li> </span>
</ul> </div>
</div>
</div>
<div
class="overflow-hidden col-span-full border-t-0 lg:border-t lg:border-solid lg:divide-gray-700">
<ul
class="flex flex-wrap justify-end -mr-3 lg:pt-8 hidden lg:flex"></ul>
<div class="hidden lg:block text-right">
<a
href="/after-sales-agreement"
target="_blank"
class="text-xs text-gray-400 text-white text-opacity-45 font-light">
售后协议
</a>
</div>
<div
class="text-xs text-center lg:text-right lg:mt-4 text-white text-opacity-45 font-light mt-4">
<span class="flex justify-center items-center md:justify-end">
<img
src="https://static.distributetop.com/office-site-new/office-site-upload/img/gongan.0c57706.png"
class="w-5 h-5 mr-1" />
<a
href="https://beian.miit.gov.cn"
target="_blank"
rel="noopener nofollow noreferrer"
static="true"
class="text-xs text-gray-400 text-white text-opacity-45 font-light">
粤ICP备2022141405号-1
</a>
</span>
</div>
<div
class="text-xs text-gray-400 text-center mt-4 lg:text-right text-white text-opacity-45 font-light">
地址：广州市南沙区丰泽东路106号
</div> </div>
</div> </div>
</div> </div>
</div> </footer>
</footer> </div>
</template> </template>
<script> <script>
import FootBanner from './footBanner.vue'
export default { export default {
name: 'PageFooter', name: 'PageFooter',
components: {
FootBanner,
},
data() { data() {
return { return {
isShowProduct: false, footerSections: [
isShowResource: false, {
isShowCase: false, key: 'product',
isShowAbout: false, title: '产品',
links: [
{
href: '/product/production?tab=product',
text: '九猫ERP',
rel: 'noopener nofollow noreferrer',
},
{
href: '/product/production?tab=custom-chain',
text: 'POD和满印供应链',
rel: 'noopener nofollow noreferrer',
},
{
href: '/product/production?tab=supply-chain',
text: '九猫美国供应链 [LA POD]',
rel: 'noopener nofollow noreferrer',
},
{
href: '/product/production?tab=logistics',
text: '九猫物流',
rel: 'noopener nofollow noreferrer',
},
{
href: 'https://jomalls.com/custom/',
text: '一件定制',
rel: 'noopener nofollow noreferrer',
target: '_blank',
},
],
},
{
key: 'service',
title: '客户服务',
links: [
{
href: '/about',
text: '关于九猫',
rel: 'noopener nofollow noreferrer',
},
// {
// href: '/price',
// text: '订购价格',
// rel: 'noopener nofollow noreferrer',
// },
{
href: '/help/index',
text: '帮助中心',
rel: 'help noopener nofollow noreferrer',
},
],
},
],
sectionStates: {
product: false,
service: false,
},
} }
}, },
methods: {
toggleSection(key) {
this.sectionStates[key] = !this.sectionStates[key]
},
async copy(text) {
try {
// 优先使用 Clipboard API（现代浏览器）
await navigator.clipboard.writeText(text)
} catch (err) {
// 降级方案：使用 document.execCommand
const textarea = document.createElement('textarea')
textarea.value = text
document.body.appendChild(textarea)
textarea.focus()
textarea.select()
document.execCommand('copy')
document.body.removeChild(textarea)
} finally {
this.$message.success('复制成功')
}
},
},
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
...@@ -285,12 +355,81 @@ export default { ...@@ -285,12 +355,81 @@ export default {
background: #20222e; background: #20222e;
padding-bottom: 48px; padding-bottom: 48px;
} }
.footer-routers { .footer-routers {
transition: all 0.5s ease; transition: all 0.5s ease;
} }
// 展开/收起动画
.slide-fade-enter-active {
transition: all 0.3s ease-out;
overflow: hidden;
}
.slide-fade-leave-active {
transition: all 0.3s ease-in;
overflow: hidden;
}
.slide-fade-enter {
max-height: 0;
opacity: 0;
transform: translateY(-10px);
}
.slide-fade-enter-to {
max-height: 500px;
opacity: 1;
transform: translateY(0);
}
.slide-fade-leave {
max-height: 500px;
opacity: 1;
transform: translateY(0);
}
.slide-fade-leave-to {
max-height: 0;
opacity: 0;
transform: translateY(-10px);
}
::v-deep .el-tooltip__popper.is-light {
border: none !important;
}
.icons-circle {
width: 40px;
height: 40px;
border-radius: 50%;
margin-right: 30px;
background-color: #ffffff36;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.2s ease;
cursor: pointer;
&:hover {
transform: scale(1.1);
}
}
.icons {
filter: brightness(0) saturate(100%) invert(14%) sepia(11%) saturate(1236%)
hue-rotate(195deg) brightness(93%) contrast(89%);
width: 22px;
height: 22px;
}
@media screen and (max-width: 1100px) { @media screen and (max-width: 1100px) {
.banner_footer { .banner_footer {
padding-bottom: 0; padding-bottom: 0;
} }
.footer-routers {
transition: all 0.5s ease;
background-color: #2c2d36;
}
} }
</style> </style>
src/components/head.vue
<template> <template>
<div class="header" :class="{ 'no-shadow': !shadow }" ref="header"> <div
<headerNavMobile v-if="$isMobile" :userInfo="userInfo"></headerNavMobile> class="header bg-white sticky shadow-sm"
<div class="container" v-else> :class="{ shadow: !$route.path.includes('help') }"
<div class="logo"> ref="header">
<span class="logo_text"> <headHelper v-if="$route.path.includes('help')" />
<img style="height: 40px" src="../assets/logo.png" /> <headerNavMobile v-else-if="$isMobile" :userInfo="userInfo" />
</span> <div
</div> class="container w-full lg:w-3/4 flex items-center h-full justify-between m-auto"
<nav class="navbar"> v-else>
<ul class="navbar_item_wrap"> <img
class="logo flex items-center justify-center cursor-pointer h-10"
@click="goHome"
style="height: 40px"
src="../assets/logo.png"
alt="九猫ERP"
title="九猫ERP" />
<nav class="navbar flex-1">
<ul
class="navbar_item_wrap flex items-center justify-center gap-14 w-full leading-8">
<li <li
class="navbar_item" class="navbar_item relative"
:class="{ active: active === item.path }" :class="{ active: active === item.path }"
v-for="item in navbar" v-for="item in navbar"
@click="changePath" @click="changePath"
:key="item.path"> :key="item.path">
<a class="navbar_item_a" :href="item.path">{{ item.name }}</a> <a
<i v-if="item.children" class="el-icon-arrow-down"></i> class="navbar_item_a flex items-center justify-center font-semibold"
:href="item.path">
<span>{{ item.name }}</span>
<i
v-if="item.children"
class="el-icon-arrow-down ml-1 text-lg"></i>
</a>
<template v-if="item.children"> <template v-if="item.children">
<div <div
class="navbar-panel" class="navbar-panel flex gap-5 rounded-md bg-white shadow-lg"
v-if="item.path === '/product/production'"> v-if="item.path === '/product/production'">
<div class="navbar-panel-left"> <div class="px-5 pb-5 border-solid border-r border-gray-100">
<div class="left-title"> <div
class="font-medium text-gray-400 w-full text-md border-solid border-b border-gray-200">
<span>九猫产品</span> <span>九猫产品</span>
</div> </div>
<div class="left-content"> <div class="left-content mt-3">
<div <div
class="left-content-item" class="left-content-item p-3 w-80 rounded-sm"
:class="{ lfActive: $route.path === child.path }"
v-for="child in item.children" v-for="child in item.children"
:key="child.path"> :key="child.path">
<a :href="child.path" class="item-router"> <a
<img :src="child.icon" /> :href="child.path"
<div class="content-name"> class="item-router flex items-center gap-5">
<div class="name">{{ child.name }}</div> <Icon
<div class="sub-title">{{ child.subTitle }}</div> :icon="child.icon"
width="30"
height="30"
class="icon-item"
color="var(--primary-color)" />
<div class="content-name flex-1">
<div class="text-md mb-2">
{{ child.name }}
</div>
<div class="text-sm text-gray-500">
{{ child.subTitle }}
</div>
</div> </div>
</a> </a>
</div> </div>
</div> </div>
</div> </div>
<div class="navbar-panel-right"> <div class="navbar-panel-right border-gray-500 px-5 pb-5">
<div class="right-title"> <div
class="right-title font-medium text-gray-400 w-full text-md border-solid border-b border-gray-200">
<span>2分钟了解九猫ERP</span> <span>2分钟了解九猫ERP</span>
</div> </div>
<div class="banner-image" @click="playVideo"> <div
<img src="../assets/images/home/07.png" /> class="banner-image relative w-52 mt-5 cursor: pointer"
<div class="play-icon"> @click="playVideo">
<img src="../assets/images/home/play.png" /> <img
</div> class="w-full rounded-md"
</div> src="../assets/video-pic.png" />
<a class="right-bottom-content" href="/financial"> <img
<img width="30" src="../assets/images/home/fincial.png" /> class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2"
<span>如何通过财务管控向内部要效益?</span> src="../assets/images/home/play.png" />
</a>
</div>
</div>
<div
class="navbar-panel navbar-panel-support"
v-if="item.path === '/support'">
<div class="navbar-panel-left">
<div class="left-title">
<span>资源</span>
</div>
<div class="left-content">
<div
class="left-content-item"
:class="{ lfActive: $route.path === child.path }"
v-for="(child, index) in item.children"
:key="index">
<a :href="child.path" class="item-router">
<img :src="child.icon" />
<div class="content-name">
<div class="name">{{ child.name }}</div>
<div class="sub-title">{{ child.subTitle }}</div>
</div>
</a>
</div>
</div>
</div>
<div class="navbar-panel-right">
<div class="right-title">
<span>支持</span>
</div>
<div class="right-content">
<div
class="right-content-item"
:class="{ lfActive: $route.path === '/help' }">
<a class="item-router" href="">
<img src="../assets/images/product/help.svg" />
<div class="content-name">
<div class="name">帮助中心</div>
<div class="sub-title">
快速上手产品,获取使用问题的答案
</div>
</div>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
<div <div
class="navbar-panel navbar-panel-about" class="navbar-panel flex gap-5 rounded-md bg-white shadow-lg"
v-if="item.path === '/about'"> v-else>
<div class="navbar-panel-left"> <div class="left-content mt-3 px-5 pb-5">
<div class="left-content"> <div
<div class="left-content-item p-3 w-80 rounded-sm"
class="left-content-item" :class="{ lfActive: $route.path === child.path }"
:class="{ lfActive: $route.path === child.path }" v-for="(child, index) in item.children"
v-for="(child, index) in item.children" :key="index">
:key="index"> <a
<a :href="child.path" class="item-router"> :href="child.path"
<img :src="child.icon" /> class="item-router flex items-center gap-5">
<div class="content-name"> <Icon
<div class="name">{{ child.name }}</div> :icon="child.icon"
<div class="sub-title">{{ child.subTitle }}</div> width="30"
height="30"
class="icon-item"
color="var(--primary-color)" />
<div class="content-name flex-1">
<div class="text-md mb-2">{{ child.name }}</div>
<div class="text-sm text-gray-500">
{{ child.subTitle }}
</div> </div>
</a> </div>
</div> </a>
</div> </div>
</div> </div>
</div> </div>
...@@ -126,21 +117,28 @@ ...@@ -126,21 +117,28 @@
</li> </li>
</ul> </ul>
</nav> </nav>
<div class="right_btn"> <div class="flex items-center">
<!-- <el-button type="primary" size="mini" @click="login">登录</el-button> <div class="user-operate mr-2" v-if="!userInfo">
<el-button size="mini" @click="register">注册</el-button> --> <el-button @click="login">登录</el-button>
<div class="user-operate" v-if="!userInfo"> <el-button @click="register">注册</el-button>
<el-button class="login-btn" @click="login">登录</el-button>
<el-button class="reg-btn" @click="register">注册</el-button>
</div> </div>
<div class="user-info" v-else> <div class="flex items-center" v-else>
<div class="user-msg"> <div class="text-gray-600 mr-10 cursor-default">
<span class="user-name">{{ userInfo.companyName }}</span> <span class="mr-2">{{ userInfo.companyName }}</span>
<span>欢迎您</span> <span>欢迎您</span>
</div> </div>
<div class="logout" title="退出登录" @click="logout"> <el-popconfirm title="确定退出登录吗？" @confirm="logout">
<img src="../assets/images/logout.png" /> <div
</div> class="logout mr-5 cursor-pointer"
title="退出登录"
slot="reference">
<Icon
icon="mdi:logout"
width="20"
height="20"
color="var(--primary-color)" />
</div>
</el-popconfirm>
</div> </div>
<el-button type="primary" @click="freeTrial">免费试用</el-button> <el-button type="primary" @click="freeTrial">免费试用</el-button>
</div> </div>
...@@ -150,7 +148,7 @@ ...@@ -150,7 +148,7 @@
<video <video
ref="nav-player" ref="nav-player"
controls controls
src="../assets/video/head-video.mp4" src="../assets/video/abount-jomalls2-video.mp4"
class="video"></video> class="video"></video>
<i class="el-icon-circle-close" @click="closeVideo"></i> <i class="el-icon-circle-close" @click="closeVideo"></i>
</div> </div>
...@@ -160,26 +158,18 @@ ...@@ -160,26 +158,18 @@
<script> <script>
import { mapMutations } from 'vuex' import { mapMutations } from 'vuex'
import { Icon } from '@iconify/vue2'
import headerNavMobile from './headerNavMobile.vue' import headerNavMobile from './headerNavMobile.vue'
import productionSvg from '../assets/images/home/production.svg' import headHelper from './headHelper.vue'
import customSvg from '../assets/images/home/custom.svg'
import logisticsSvg from '../assets/images/home/logistics.svg'
import platformSvg from '../assets/images/home/platform.svg'
import hdSvg from '../assets/images/product/hd.svg'
import zxSvg from '../assets/images/product/zx.svg'
import platform from '../assets/images/product/platform.svg'
import usSvg from '../assets/images/product/us.svg'
import joinSvg from '../assets/images/product/join.svg'
export default { export default {
props: {
shadow: { type: Boolean },
},
inject: { inject: {
scrollParent: 'scrollParent', scrollParent: 'scrollParent',
}, },
components: { components: {
headerNavMobile, headerNavMobile,
headHelper,
Icon,
}, },
data() { data() {
return { return {
...@@ -191,81 +181,39 @@ export default { ...@@ -191,81 +181,39 @@ export default {
expanding: false, expanding: false,
children: [ children: [
{ {
name: '独⽴站和平台ERP', name: '九猫ERP',
subTitle: '精细化运营和供应链⼀体化解决⽅案', subTitle: '精细化运营和供应链一体化解决方案',
path: '/product/production', path: '/product/production?tab=product',
icon: productionSvg, icon: 'ant-design:product-filled',
}, },
{ {
name: 'POD和满印供应链', name: 'POD和满印供应链',
subTitle: '⼏⼗万件底胚库存，多种⼯艺，五千多款模型，品类⻬全', subTitle: '⼏⼗万件底胚库存，多种⼯艺，五千多款模型，品类⻬全',
path: '/product/custom-chain', path: '/product/production?tab=custom-chain',
icon: customSvg, icon: 'tabler:paint',
}, },
{ {
name: '海外POD供应链', name: '九猫美国供应链 [LA POD]',
subTitle: '美国本⼟海外⽣产线，平台客户⾸选', subTitle: '美国本⼟海外⽣产线，平台客户⾸选',
path: '/product/logistics', path: '/product/production?tab=supply-chain',
icon: logisticsSvg, icon: 'fa7-solid:earth',
}, },
{ {
name: '九猫物流', name: '九猫物流',
subTitle: '集成国内主流物流，价格优惠时效快', subTitle: '集成国内主流物流，价格优惠时效快',
path: '/product/platform', path: '/product/production?tab=logistics',
icon: platformSvg, icon: 'mdi:truck-fast-outline',
}, },
], ],
}, },
// { name: '核心功能', path: '/function' }, // { name: '价格', path: '/price' },
{ name: '价格', path: '/price' },
// { name: '需求痛点', path: '/demand_pain_point' },
{ name: '一件定制', path: 'https://jomalls.com/custom/' }, { name: '一件定制', path: 'https://jomalls.com/custom/' },
{ name: '案例', path: '/case' },
{
name: '资源与支持',
path: '/support',
expanding: false,
children: [
{
name: '活动信息',
subTitle: '活动信息',
path: '',
icon: hdSvg,
},
{
name: '入住流程平台',
subTitle: '入住流程平台',
path: '',
icon: platformSvg,
},
{
name: '资讯',
subTitle: '资讯',
path: '',
icon: zxSvg,
},
],
},
{ {
name: '关于', name: '关于我们',
path: '/about', path: '/about',
expanding: false, expanding: false,
children: [
{
name: '关于我们',
subTitle: '九猫ERP以精细化管理方案，帮助卖家实现业务增长',
path: '/about',
icon: usSvg,
},
{
name: '加入我们',
subTitle: '加入九猫，一切皆有可能',
path: '/join',
icon: joinSvg,
},
],
}, },
// { name: '帮助', path: '/help' }, { name: '帮助', path: '/help' },
], ],
userInfo: JSON.parse(localStorage.getItem('userInfo')), userInfo: JSON.parse(localStorage.getItem('userInfo')),
playIcon: false, playIcon: false,
...@@ -293,15 +241,15 @@ export default { ...@@ -293,15 +241,15 @@ export default {
...mapMutations(['setUserInfo', 'setShopKey']), ...mapMutations(['setUserInfo', 'setShopKey']),
onScroll() { onScroll() {
if (this.$isMobile) return if (this.$isMobile) return
if (this.$route.path !== '/product/production') return // if (this.$route.path !== '/product/production') return
const top = this.scrollParent().scrollTop // const top = this.scrollParent().scrollTop
if (top - 400 >= this.$refs.header.offsetHeight) { // if (top - 400 >= this.$refs.header.offsetHeight) {
this.$refs.header.style.top = '-60px' // this.$refs.header.style.top = '-60px'
} else if (top - 60 >= this.$refs.header.offsetHeight) { // } else if (top - 60 >= this.$refs.header.offsetHeight) {
this.$refs.header.style.top = '-30px' // this.$refs.header.style.top = '-30px'
} else { // } else {
this.$refs.header.style.top = '0' // this.$refs.header.style.top = '0'
} // }
}, },
changePath() { changePath() {
this.scrollParent().scrollTo({ this.scrollParent().scrollTo({
...@@ -309,15 +257,41 @@ export default { ...@@ -309,15 +257,41 @@ export default {
top: 0, top: 0,
}) })
}, },
login() { async login() {
console.log(this.$route.query)
if (this.$route.query && this.$route.query.shopKey) { if (this.$route.query && this.$route.query.shopKey) {
this.setShopKey(this.$route.query.shopKey) this.setShopKey(this.$route.query.shopKey)
} }
this.$router.push('/login') // 跳转到首页
await this.$router.push('/home').catch(() => {})
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
}, },
register() { async register() {
this.$router.push('/register') // 跳转到首页并请求打开注册弹窗（若已在首页，则变更查询参数强制触发监听）
if (this.$route && this.$route.path === '/home') {
const query = Object.assign({}, this.$route.query, {
openRegister: '1',
_r: Date.now().toString(),
})
await this.$router.replace({ path: '/home', query }).catch(() => {})
} else {
await this.$router
.push({
path: '/home',
query: { openRegister: '1', _r: Date.now().toString() },
})
.catch(() => {})
}
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
}, },
freeTrial() { freeTrial() {
window.open('https://demo.jomalls.com') window.open('https://demo.jomalls.com')
...@@ -325,7 +299,9 @@ export default { ...@@ -325,7 +299,9 @@ export default {
logout() { logout() {
localStorage.removeItem('userInfo') localStorage.removeItem('userInfo')
this.setUserInfo(undefined) this.setUserInfo(undefined)
this.$router.push('/login') this.$router.push('/home')
// 刷新页面
window.location.reload()
}, },
playVideo() { playVideo() {
this.playIcon = true this.playIcon = true
...@@ -335,154 +311,60 @@ export default { ...@@ -335,154 +311,60 @@ export default {
this.playIcon = false this.playIcon = false
this.$refs['nav-player'].pause() this.$refs['nav-player'].pause()
}, },
async goHome() {
this.$router.push('/home')
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
}, },
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
/* .header { ::v-deep .el-button--primary {
position: fixed; background-color: var(--secondary-color) !important;
z-index: 999; border-color: var(--secondary-color) !important;
top: 0; &:hover {
right: 0; background-color: var(--secondary-color-light1) !important;
left: 0; border-color: var(--secondary-color-light1) !important;
} */
.user-name {
margin-right: 10px;
}
.user-msg {
color: #fff;
}
.logout {
margin-right: 30px;
}
.container {
width: 70vw;
margin: 0 auto;
display: flex;
align-items: center;
height: 100%;
}
.logo {
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
height: 100%;
img {
height: 40px;
}
}
@media screen and (max-width: 1500px) {
.navbar_item_wrap {
gap: 40px !important;
}
.container {
width: 80vw !important;
} }
} }
@media screen and (max-width: 1100px) { ::v-deep .el-button {
.header { &:hover {
position: sticky; background-color: var(--light-background-color) !important;
border-color: var(--light-color) !important;
color: var(--primary-color) !important;
} }
} &:focus {
background-color: var(--light-background-color) !important;
.header.no-shadow { border-color: var(--light-color) !important;
box-shadow: none !important; color: var(--primary-color) !important;
}
.navbar {
flex: 1;
}
.navbar_item {
position: relative;
i {
position: absolute;
top: 50%;
right: -20px;
transform: translateY(-50%);
font-size: 16px;
} }
} }
.navbar_item_wrap { .navbar_item_wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 60px;
width: 100%;
padding: 0;
height: 60px; height: 60px;
line-height: 60px; line-height: 60px;
} }
.navbar_item:hover .navbar_item_a {
color: #2253fd;
}
.navbar_item .navbar_item_a {
display: block;
text-decoration: none;
color: #000;
font-size: 16px;
white-space: nowrap;
}
.right_btn,
.user-info {
display: flex;
align-items: center;
margin-left: auto;
}
.user-msg { .navbar_item:hover .navbar_item_a {
margin-right: 50px; color: var(--secondary-color-light1);
}
.logout img {
width: 20px;
vertical-align: middle;
cursor: pointer;
}
.user-info {
color: #fff;
}
.login-btn {
position: relative;
margin-right: 10px;
cursor: pointer;
}
.reg-btn {
cursor: pointer;
}
.login-btn::after {
content: '';
width: 1px;
height: 15px;
position: absolute;
display: inline-block;
margin-left: 10px;
top: 4px;
background-color: #fff;
}
.user-operate {
margin-right: 10px;
} }
.active .navbar_item_a { .active .navbar_item_a {
color: #2253fd; color: var(--secondary-color-light1);
font-weight: bold;
} }
.active::after { .active::after {
content: ''; content: '';
width: 20px; width: 30px;
height: 2px; height: 2px;
background-color: #2253fd; background-color: var(--secondary-color-light1);
border-radius: 4px; border-radius: 4px;
display: block; display: block;
position: absolute; position: absolute;
...@@ -493,14 +375,7 @@ export default { ...@@ -493,14 +375,7 @@ export default {
.navbar-panel { .navbar-panel {
position: absolute; position: absolute;
visibility: hidden; visibility: hidden;
left: 100%;
background-color: #fff;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
border-radius: 4px;
z-index: 10000; z-index: 10000;
display: flex;
gap: 20px;
} }
.navbar_item:hover .navbar-panel { .navbar_item:hover .navbar-panel {
left: 50%; left: 50%;
...@@ -508,113 +383,22 @@ export default { ...@@ -508,113 +383,22 @@ export default {
transform: translateX(-50%); transform: translateX(-50%);
transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;
} }
.left-title {
font-weight: 500;
font-size: 16px;
padding-bottom: 20px;
width: 100%;
color: #91a0c3;
border-bottom: 1px solid #91a0c3;
line-height: initial;
}
.left-content, .left-content,
.right-content { .right-content {
margin-top: 20px;
line-height: initial; line-height: initial;
} }
.navbar-panel-left {
border-right: 1px solid #eee;
padding: 20px;
}
.left-content-item {
padding: 10px;
width: 350px;
.left-content-item {
&:not(:last-child) { &:not(:last-child) {
margin-bottom: 20px; margin-bottom: 20px;
} }
&:hover { &:hover {
background-color: #f8f9ff; background-color: var(--background-color);
}
&.lfActive {
background-color: #eef1ff;
}
img {
width: 30px;
vertical-align: middle;
}
.item-router {
display: flex;
align-items: flex-start;
gap: 20px;
white-space: nowrap;
text-decoration: none;
color: #000;
overflow: hidden;
}
.content-name {
flex: 1;
overflow: hidden;
.name {
font-size: 16px;
margin-bottom: 8px;
}
.sub-title {
font-size: 14px;
color: #777;
white-space: normal;
}
} }
} }
.navbar-panel-right {
padding: 20px;
display: flex;
flex-direction: column;
gap: 20px;
line-height: initial;
.banner-image {
width: 260px;
position: relative;
cursor: pointer;
img {
width: 100%;
border-radius: 10px;
}
.play-icon {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
.right-title {
font-weight: 500;
font-size: 16px;
padding-bottom: 20px;
width: 100%;
color: #91a0c3;
border-bottom: 1px solid #91a0c3;
line-height: initial;
white-space: nowrap;
}
.right-bottom-content {
white-space: nowrap;
font-size: 14px;
display: flex;
align-items: center;
gap: 5px;
cursor: pointer;
padding: 10px;
&:hover {
background-color: #eef1ff;
}
}
}
.navbar-panel.navbar-panel-support { .navbar-panel.navbar-panel-support {
.navbar-panel-right {
gap: 0;
}
img { img {
width: 30px; width: 30px;
vertical-align: middle; vertical-align: middle;
...@@ -627,32 +411,16 @@ export default { ...@@ -627,32 +411,16 @@ export default {
text-decoration: none; text-decoration: none;
color: #000; color: #000;
} }
.content-name {
.name {
font-size: 16px;
margin-bottom: 8px;
}
.sub-title {
font-size: 14px;
color: #777;
}
}
.right-content-item { .right-content-item {
padding: 10px; padding: 10px;
width: 280px; width: 280px;
&:hover { &:hover {
background-color: #f8f9ff; background-color: #f8f9ff;
} }
&.lfActive {
background-color: #eef1ff;
}
}
}
.navbar-panel.navbar-panel-about {
.left-content {
margin-top: 0;
} }
} }
.video-cont { .video-cont {
position: fixed; position: fixed;
top: 0; top: 0;
......
src/components/headHelper.vue 0 → 100644
<template>
<div>
<div class="top pt-3 pl-5 flex justify-between">
<div class="flex items-center gap-2 cursor-pointer" @click="goHelp">
<img class="h-8" :src="Logo" alt="logo" />
<h2
class="text-lg font-bold mt-2 border-l border-solid border-gray-300 pl-2">
九猫ERP帮助中心
</h2>
</div>
<div class="flex items-center justify-center pb-2">
<div
v-for="nav in navs"
:key="nav.path"
class="flex flex-col items-center justify-center mr-8">
<a class="nav-link relative" :index="nav.path" :href="nav.path">
{{ nav.name }}
</a>
</div>
<div
class="mr-2 flex items-center justify-center gap-2"
v-if="!userInfo">
<div
class="text-gray-500 font-semibold cursor-pointer pr-2 border-r-2 border-solid border-gray-200 hover:text-secondary-color"
@click="login">
登录
</div>
<div
class="text-gray-500 font-semibold cursor-pointer pr-2 hover:text-secondary-color"
@click="register">
注册
</div>
</div>
<div class="flex items-center" v-else>
<div class="text-gray-600 mr-10 cursor-default">
<span class="mr-2">{{ userInfo.companyName }}</span>
<span>欢迎您</span>
</div>
<el-popconfirm title="确定退出登录吗？" @confirm="logout">
<div
class="logout mr-5 cursor-pointer"
title="退出登录"
slot="reference">
<Icon
icon="mdi:logout"
width="20"
height="20"
color="var(--primary-color)" />
</div>
</el-popconfirm>
</div>
<!-- <el-button plain class="mr-10 mb-2" size="medium">免费试用</el-button> -->
</div>
</div>
</div>
</template>
<script>
import { Icon } from '@iconify/vue2'
import { mapMutations } from 'vuex'
import Logo from '../assets/logo.png'
export default {
name: 'headHelper',
inject: {
scrollParent: 'scrollParent',
},
components: {
Icon,
},
data() {
return {
Logo,
navs: [
{
name: '首页',
path: '/',
},
],
userInfo: JSON.parse(localStorage.getItem('userInfo')),
}
},
methods: {
...mapMutations(['setUserInfo', 'setShopKey']),
goHelp() {
if (this.$route.path === '/help/index') return
this.$router.push('/help')
},
async login() {
if (this.$route.query && this.$route.query.shopKey) {
this.setShopKey(this.$route.query.shopKey)
}
// 跳转到首页
await this.$router.push('/home').catch(() => {})
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
async register() {
// 跳转到首页并请求打开注册弹窗（若已在首页，则变更查询参数强制触发监听）
if (this.$route && this.$route.path === '/home') {
const query = Object.assign({}, this.$route.query, {
openRegister: '1',
_r: Date.now().toString(),
})
await this.$router.replace({ path: '/home', query }).catch(() => {})
} else {
await this.$router
.push({
path: '/home',
query: { openRegister: '1', _r: Date.now().toString() },
})
.catch(() => {})
}
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
logout() {
localStorage.removeItem('userInfo')
this.setUserInfo(undefined)
this.$router.push('/help/index')
// 刷新页面
window.location.reload()
},
},
}
</script>
<style scoped lang="scss">
.nav-link {
font-size: 16px;
font-weight: 530;
display: inline-block;
transition: all 0.2s ease;
&:hover {
color: var(--primary-color);
}
&::after {
content: '';
position: absolute;
bottom: -7px;
left: 50%;
transform: translateX(-50%) scaleX(0);
transform-origin: center;
width: 120%;
height: 2px;
background-image: linear-gradient(
to right,
#ffffff00 5%,
var(--primary-color),
#ffffff00 95%
);
transition: transform 0.2s ease;
}
&:hover::after {
transform: translateX(-50%) scaleX(1);
}
}
::v-deep .el-button--default {
color: #fff;
background-color: var(--secondary-color);
border: none;
font-size: 16px;
font-weight: 500;
transition: all 0.2s ease;
border-radius: 8px;
&:hover {
color: var(--secondary-color);
}
}
</style>
src/components/headerNavMobile.vue
<template> <template>
<div class="header-nav-mobile"> <div class="header-nav-mobile">
<div class="header-nav-mobile_trigger"> <div class="header-nav-mobile_trigger">
<a class="nav-icon icon-menu" href="javascript:;" @click="toggleShow"></a> <Icon
@click.native="toggleShow"
icon="typcn:th-menu"
color="var(--primary-color)"
width="20"
height="20" />
<!-- <a class="nav-icon icon-menu" href="javascript:;" @click="toggleShow"></a> -->
</div> </div>
<div class="header-nav-mobile_logo"> <div @click="goHome" class="header-nav-mobile_logo">
<img src="../assets/logo.png" style="height: 40px" /> <img src="../assets/logo.png" style="height: 40px" />
</div> </div>
<div class="header-nav-mobile_login" v-if="!userInfo"> <div class="header-nav-mobile_login" v-if="!userInfo">
...@@ -15,11 +21,14 @@ ...@@ -15,11 +21,14 @@
<span class="user-name">{{ userInfo.companyName }}</span> <span class="user-name">{{ userInfo.companyName }}</span>
<span style="margin: 0 10px">欢迎您</span> <span style="margin: 0 10px">欢迎您</span>
<span style="margin: 0 5px">|</span> <span style="margin: 0 5px">|</span>
<span style="margin-left: 10px; cursor: pointer" @click="logout"> <el-popconfirm title="确定退出登录吗？" @confirm="logout">
<img <div
style="width: 16px; height: 16px; vertical-align: middle" style="width: 16px; height: 16px; vertical-align: middle"
src="../assets/images/logout.png" /> title="退出登录"
</span> slot="reference">
<img src="../assets/images/logout.svg" />
</div>
</el-popconfirm>
</div> </div>
<transition name="header-nav-mobile"> <transition name="header-nav-mobile">
<div v-show="showing" class="header-nav-mobile-overlay"> <div v-show="showing" class="header-nav-mobile-overlay">
...@@ -98,8 +107,21 @@ ...@@ -98,8 +107,21 @@
</template> </template>
<script> <script>
import { mapMutations } from 'vuex' import { mapMutations } from 'vuex'
import { Icon } from '@iconify/vue2'
import productionSvg from '../assets/images/home/production.svg'
import customSvg from '../assets/images/home/custom.svg'
import supplyChainSvg from '../assets/images/home/earth.svg'
import logisticsSvg from '../assets/images/home/logistics.svg'
import usSvg from '../assets/images/product/us.svg'
export default { export default {
name: 'headerNavMobile', name: 'headerNavMobile',
inject: {
scrollParent: 'scrollParent',
},
components: {
Icon,
},
data() { data() {
return { return {
showing: false, showing: false,
...@@ -111,86 +133,48 @@ export default { ...@@ -111,86 +133,48 @@ export default {
expanding: false, expanding: false,
children: [ children: [
{ {
name: '生产管理', name: '九猫ERP',
path: '/product/production', subTitle: '精细化运营和供应链一体化解决方案',
path: '/product/production?tab=product',
icon: productionSvg,
}, },
{ {
name: '一件定制', name: 'POD和满印供应链',
path: '/product/custom-chain', subTitle: '⼏⼗万件底胚库存，多种⼯艺，五千多款模型，品类⻬全',
path: '/product/production?tab=custom-chain',
icon: customSvg,
}, },
{ {
name: '海外仓物流', name: '九猫美国供应链 [LA POD]',
path: '/product/logistics', subTitle: '美国本⼟海外⽣产线，平台客户⾸选',
path: '/product/production?tab=supply-chain',
icon: supplyChainSvg,
}, },
{ {
name: '自建站平台', name: '九猫物流',
path: '/product/platform', subTitle: '集成国内主流物流，价格优惠时效快',
path: '/product/production?tab=logistics',
icon: logisticsSvg,
}, },
], ],
}, },
{ name: '价格', path: '/price' }, // { name: '价格', path: '/price' },
{ name: '一件定制', path: 'https://jomalls.com/custom/' }, { name: '一件定制', path: 'https://jomalls.com/custom/' },
{ name: '案例', path: '/case' }, // { name: '案例', path: '/case' },
{
name: '资源与支持',
path: '/support',
expanding: false,
children: [
{
name: '资源',
expanding: false,
children: [
{
name: '活动信息',
path: '',
},
{
name: '入住流程平台',
path: '',
},
{
name: '资讯',
path: '',
},
],
},
{
name: '支持',
expanding: false,
children: [
{
name: '帮助中心',
path: '',
},
],
},
{
name: '了解SaaS ERP',
expanding: false,
children: [
{
name: '如何通过财务管控向内部要效益',
path: '/financial',
},
],
},
],
},
{ {
name: '关于', name: '客户服务',
path: '/about', path: '/about',
expanding: false, expanding: false,
children: [ children: [
{ {
name: '关于我们', name: '关于我们',
subTitle: '九猫ERP以精细化管理方案，帮助卖家实现业务增长',
path: '/about', path: '/about',
}, icon: usSvg,
{
name: '加入我们',
path: '/join',
}, },
], ],
}, },
{ name: '帮助', path: '/help' },
], ],
} }
}, },
...@@ -213,16 +197,56 @@ export default { ...@@ -213,16 +197,56 @@ export default {
const path = this.$route.path const path = this.$route.path
if (nav.path === path) return true if (nav.path === path) return true
}, },
login() { async login() {
this.$router.push('/login') // 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
async register() {
// 跳转到首页并请求打开注册弹窗（若已在首页，则变更查询参数强制触发监听）
if (this.$route && this.$route.path === '/home') {
const query = Object.assign({}, this.$route.query, {
openRegister: '1',
_r: Date.now().toString(),
})
await this.$router.replace({ path: '/home', query }).catch(() => {})
} else {
await this.$router
.push({
path: '/home',
query: { openRegister: '1', _r: Date.now().toString() },
})
.catch(() => {})
}
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
}, },
register() { async goHome() {
this.$router.push('/register') this.$router.push('/home')
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
}, },
logout() { logout() {
localStorage.removeItem('userInfo') localStorage.removeItem('userInfo')
this.setUserInfo(undefined) this.setUserInfo(undefined)
this.$router.push('/login') this.$router.push('/home')
// 刷新页面
window.location.reload()
}, },
}, },
} }
...@@ -253,8 +277,9 @@ export default { ...@@ -253,8 +277,9 @@ export default {
.header-nav-mobile_login { .header-nav-mobile_login {
flex: 1; flex: 1;
display: flex; display: flex;
font-size: 12px; font-size: 14px;
margin-right: 10px; margin-right: 10px;
margin-top: 8px;
justify-content: flex-end; justify-content: flex-end;
} }
...@@ -270,19 +295,6 @@ export default { ...@@ -270,19 +295,6 @@ export default {
flex: 1; flex: 1;
} }
.nav-icon {
width: 25px;
height: 25px;
display: block;
}
.icon-menu {
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
background-image: url(../assets/mobile.png);
}
.header-nav-mobile-enter-active, .header-nav-mobile-enter-active,
.header-nav-mobile-leave-active { .header-nav-mobile-leave-active {
transition: 0.3s; transition: 0.3s;
...@@ -345,7 +357,7 @@ export default { ...@@ -345,7 +357,7 @@ export default {
.header-nav-mobile-child { .header-nav-mobile-child {
font-size: 14px; font-size: 14px;
// color: #999; // color: #999;
background-color: #f8f9ff; background-color: #fffdf8;
padding: 0 20px; padding: 0 20px;
margin-top: 10px; margin-top: 10px;
} }
......
src/components/product-intro.vue
...@@ -207,47 +207,25 @@ ...@@ -207,47 +207,25 @@
class="reason-list flex justify-between flex-col mt-6 gap-5 lg:gap-0 lg:mt-10 lg:flex-row"> class="reason-list flex justify-between flex-col mt-6 gap-5 lg:gap-0 lg:mt-10 lg:flex-row">
<div class="section-reason-item"> <div class="section-reason-item">
<div class="season-top flex flex-col items-center"> <div class="season-top flex flex-col items-center">
<svg <Icon
t="1733125042270" class="w-14 h-14 lg:w-24 lg:h-24"
class="icon" icon="icon-park-twotone:planet"
viewBox="0 0 1271 1024" color="var(--primary-color)" />
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="6689"
width="80"
height="80">
<path
d="M994.998303 511.840045a359.604613 359.604613 0 0 1-679.099481 164.449956 50.482955 50.482955 0 0 1 52.004359-73.165708 375.648511 375.648511 0 0 0 53.249145 3.734356 369.286276 369.286276 0 0 0 369.424585-369.286276 28.63006 28.63006 0 0 1 44.535648-24.204157A359.604613 359.604613 0 0 1 994.998303 511.840045z"
fill="#E9F1FF"
p-id="6690"></path>
<path
d="M635.39369 188.749131h2.351261a318.111773 318.111773 0 0 1 318.111773 313.82418 25.310632 25.310632 0 0 0 25.310632 24.895704 25.310632 25.310632 0 0 0 25.034014-25.587251A368.1798 368.1798 0 0 0 637.744951 138.404485h-2.62788a25.310632 25.310632 0 0 0 0 50.621265zM355.731948 159.150905a25.172323 25.172323 0 0 0 15.214041-5.11745l10.234901-7.468711a25.310632 25.310632 0 0 0-29.321607-41.49284l-11.479686 8.436877a25.310632 25.310632 0 0 0 15.352351 45.365505z"
fill="#2C5CCB"
p-id="6691"></path>
<path
d="M1103.571234 682.098999l2.904499-1.383095 2.62788-1.244785 1.798023-0.968167 4.010974-1.936332a354.625472 354.625472 0 0 0 92.114105-64.037283 152.831961 152.831961 0 0 0 49.653099-99.721126v-6.638854A149.235914 149.235914 0 0 0 1209.239667 401.192472a345.773667 345.773667 0 0 0-82.98568-59.61138l-1.383095-0.829857c-9.266734-4.979141-18.948397-9.681663-29.044988-13.830947-1.521404-3.872665-3.042808-7.607021-4.702522-11.479686A493.073249 493.073249 0 0 0 424.195134 62.472588a25.310632 25.310632 0 1 0 21.991205 45.642124 442.590293 442.590293 0 0 1 633.457357 398.331264 25.310632 25.310632 0 0 0 25.172323 25.448942 25.448942 25.448942 0 0 0 25.310633-25.310633v-0.829856a489.615512 489.615512 0 0 0-12.862781-112.168978 268.182056 268.182056 0 0 1 55.323787 42.184387 100.689292 100.689292 0 0 1 33.74751 69.154734V517.095805a5.947307 5.947307 0 0 0 0 1.521404c0 0.968166 0 1.936333-0.691547 2.904499a13.830947 13.830947 0 0 1 0 1.936332v1.383095a38.173413 38.173413 0 0 1-1.106476 3.734356 95.571841 95.571841 0 0 1-7.74533 16.735445c-0.691547 1.383095-1.659714 2.766189-2.489571 4.149284a11.479686 11.479686 0 0 1-1.106475 1.659714 24.065847 24.065847 0 0 1-1.521405 2.48957l-2.074642 2.62788a3.457737 3.457737 0 0 1 0 0.968166c-0.968166 1.383095-2.074642 2.62788-3.181117 4.010975a167.631074 167.631074 0 0 1-11.756305 13.830946 245.914232 245.914232 0 0 1-32.779344 27.661894l-6.085616 4.149284h-0.829857l-5.25576 3.319427-1.798023 1.106476-4.840831 3.042808-2.074642 1.244785-5.11745 2.904499-1.798023 1.106476-5.808998 3.181117h-1.244785l-6.915473 3.596046c-10.37321 5.25576-21.299658 10.511519-33.055963 15.62897l-15.49066 6.500545C938.153112 695.100088 791.683387 719.304245 636.223546 719.304245s-302.621113-24.204157-412.30052-68.048258C122.265568 610.869623 64.452211 557.897097 64.452211 505.892738a100.689292 100.689292 0 0 1 33.74751-69.154733 274.95922 274.95922 0 0 1 60.441237-45.088886 497.91408 497.91408 0 0 0-13.830946 114.10531 25.310632 25.310632 0 0 0 25.310632 25.310632 25.172323 25.172323 0 0 0 25.310632-25.172323 440.79227 440.79227 0 0 1 117.839666-299.578305A25.310632 25.310632 0 1 0 276.618933 171.598757a493.349867 493.349867 0 0 0-96.816626 152.140413A385.745102 385.745102 0 0 0 61.962641 401.192472 149.235914 149.235914 0 0 0 13.830947 505.892738c0 69.154733 56.845191 131.670612 160.853909 179.802307a30.013154 30.013154 0 0 0 0.968167 3.319427 492.79663 492.79663 0 0 0 924.460475-1.106476 25.86387 25.86387 0 0 0 1.106475-4.425903h2.351261zM893.202535 878.221822a442.590293 442.590293 0 0 1-652.682373-166.662907c110.647573 37.758484 248.95704 58.366595 395.011837 58.366595 148.406058 0 288.928476-21.299658 400.267597-60.164618a441.483817 441.483817 0 0 1-142.597061 168.46093z"
fill="#2C5CCB"
p-id="6692"></path>
<path
d="M637.744951 1023.585072a506.350957 506.350957 0 0 1-474.263161-328.208365C57.951667 645.44699 0 578.366899 0 505.892738a162.513623 162.513623 0 0 1 52.142669-114.520238 394.735218 394.735218 0 0 1 117.286428-77.86823 502.201673 502.201673 0 0 1 96.816626-151.310557 38.311722 38.311722 0 0 1 27.661894-12.447852 39.00327 39.00327 0 0 1 30.151463 65.696997 427.376252 427.376252 0 0 0-114.10531 290.44988 39.141579 39.141579 0 0 1-39.141579 39.00327 39.141579 39.141579 0 0 1-39.141579-39.141579 515.617692 515.617692 0 0 1 6.638855-85.336941 235.126093 235.126093 0 0 0-30.566393 25.72556 87.688202 87.688202 0 0 0-29.736535 59.74969c0 45.365505 56.015334 94.880294 150.065771 132.500469C336.506932 681.68407 481.040325 705.473298 636.223546 705.473298s299.163376-23.789228 407.18307-67.080091l13.830947-5.808998 2.62788-1.244785c10.788138-4.702522 21.161348-9.543353 30.704701-13.830946l34.162439-19.916564 6.638854-4.425903h0.829857A219.358814 219.358814 0 0 0 1161.79952 567.163832a128.489494 128.489494 0 0 0 10.2349-11.341377l1.106476-1.244785 2.48957-3.181117 3.734356-5.39407 12.586161 5.947307-11.617995-7.468711a31.257939 31.257939 0 0 0 2.212952-3.596046A88.518059 88.518059 0 0 0 1189.461413 525.670992l3.042808-12.586162a32.087796 32.087796 0 0 0 0-4.010974 33.74751 33.74751 0 0 0 0-3.596046 88.24144 88.24144 0 0 0-29.736535-59.74969 232.221594 232.221594 0 0 0-25.725561-22.129515 512.436574 512.436574 0 0 1 6.638854 82.98568 39.141579 39.141579 0 1 1-78.283158 0A428.759347 428.759347 0 0 0 452.133646 120.562564a39.141579 39.141579 0 1 1-34.024128-70.537828 506.627576 506.627576 0 0 1 686.153264 259.33025l2.766189 6.638854c8.298568 3.872665 16.182208 7.88364 23.650919 11.894614l2.351261 1.244786a355.731948 355.731948 0 0 1 86.028488 62.23926 162.513623 162.513623 0 0 1 52.142669 114.520238v7.330402A165.97136 165.97136 0 0 1 1217.123306 622.487618a374.265417 374.265417 0 0 1-95.710151 66.526854l-4.564212 2.351261-2.62788-3.596046v2.074642l1.106476 2.351261-2.351261 1.244785A506.489267 506.489267 0 0 1 637.744951 1023.585072zM295.014092 177.269445a11.894614 11.894614 0 0 0-8.021949 3.734356A477.16766 477.16766 0 0 0 193.633253 328.99493l-2.074642 5.25576-5.11745 2.212951a372.052465 372.052465 0 0 0-114.520238 74.272184A135.819896 135.819896 0 0 0 27.661893 505.892738c0 62.23926 54.217311 121.574021 152.831961 166.939526l6.223926 2.904499 1.521404 6.638854a5.25576 5.25576 0 0 0 0 1.383095 478.827373 478.827373 0 0 0 899.011533-0.968166 10.234901 10.234901 0 0 0 0-1.936333l1.244785-7.192092 20.193182-9.681663a343.699025 343.699025 0 0 0 89.071297-61.547712A139.554252 139.554252 0 0 0 1243.402105 511.840045v-5.808997a136.096515 136.096515 0 0 0-44.259029-95.156914 325.857103 325.857103 0 0 0-78.836396-57.260119l-1.383095-0.829857c-8.851806-4.702522-18.395159-9.405044-27.661893-13.830946l-4.979141-2.351261-2.904499-4.564213-4.564212-11.894614A479.242302 479.242302 0 0 0 430.142441 74.92044a11.479686 11.479686 0 0 0 9.958282 20.74642 456.42124 456.42124 0 0 1 653.37392 410.779116 11.756305 11.756305 0 0 0 11.341376 12.309542 11.617995 11.617995 0 0 0 11.617996-11.479685 482.008491 482.008491 0 0 0-12.447852-110.647574l-7.330402-31.534558 27.661893 16.597136a287.683691 287.683691 0 0 1 58.504905 44.397339 114.520238 114.520238 0 0 1 37.620174 79.113015v4.979141a44.535648 44.535648 0 0 1 0 5.11745V521.936636l-0.829856 3.457737-1.106476 4.149284-1.244785 4.149284a116.73319 116.73319 0 0 1-8.990116 19.778254l-3.042808 4.840831-2.904499 4.425903-2.212951 3.181118-3.596046 4.702521-1.106476 1.383095c-3.734356 4.564212-7.88364 9.128425-12.309543 13.830947a254.2128 254.2128 0 0 1-34.715676 28.768369h-0.829856l-5.532379 3.872665-36.928628 21.576277c-10.788138 5.670688-21.852896 10.788138-33.194272 15.767279l-1.521404 0.691547c-5.11745 2.212951-10.37321 4.425903-15.767279 6.500545-110.647573 44.673958-259.606869 69.154733-417.55628 69.154733s-306.07885-24.480776-417.41797-69.154733C110.647573 620.827905 50.621265 564.674261 50.621265 505.892738a114.243619 114.243619 0 0 1 37.620175-79.113015A291.832975 291.832975 0 0 1 152.140413 379.339576l27.661894-15.905589-7.468712 31.11963a490.445369 490.445369 0 0 0-13.139399 110.647574 11.479686 11.479686 0 0 0 22.959372 0 454.484907 454.484907 0 0 1 121.574021-308.983349 11.617995 11.617995 0 0 0 3.042808-8.298568 11.894614 11.894614 0 0 0-11.479686-11.064757z m816.85571 507.734052h1.244785l-4.010974-5.808997zM637.744951 973.378735a452.271956 452.271956 0 0 1-262.787987-83.677227 456.42124 456.42124 0 0 1-146.884654-172.056977l-14.660803-30.013154 31.534558 10.788139c108.711241 37.205247 247.435636 57.675048 391.277481 57.675047 145.501559 0 286.023977-21.023039 395.565075-59.334761l31.534558-11.064757-13.830946 30.013154A456.42124 456.42124 0 0 1 901.224485 889.424889a451.995337 451.995337 0 0 1-263.479534 83.953846zM268.873603 735.071524a428.759347 428.759347 0 0 0 368.871348 210.645318A424.333444 424.333444 0 0 0 885.180586 866.880446 429.727513 429.727513 0 0 0 1007.446155 733.135192 1311.035434 1311.035434 0 0 1 636.223546 783.756456a1317.674288 1317.674288 0 0 1-367.349943-48.684932z"
fill="#2C5CCB"
p-id="6693"></path>
</svg>
<p class="reason-card-title">全生态产品</p> <p class="reason-card-title">全生态产品</p>
<p class="text-textPrimary font-normal mt-2 text-sm lg:text-lg"> <p class="text-textPrimary font-normal mt-2 text-sm lg:text-lg">
贴合跨境卖家核心使用场景 贴合跨境卖家核心使用场景
</p> </p>
<div class="mt-6 flex flex-col items-center"> <div class="lg:mt-6 mt-4 flex flex-col items-center">
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
为跨境定制业务量身定制开发解决方案 为跨境定制业务量身定制开发解决方案
</p> </p>
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
集成ERP系统、本土供应链、海外云仓 集成ERP系统、本土供应链、海外云仓
</p> </p>
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
减少跨境难度、提升多平台运营协作效率 减少跨境难度、提升多平台运营协作效率
</p> </p>
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
较少50%人员成本，全面赋能业务增长 较少50%人员成本，全面赋能业务增长
</p> </p>
</div> </div>
...@@ -260,40 +238,22 @@ ...@@ -260,40 +238,22 @@
<div class="section-reason-item"> <div class="section-reason-item">
<div class="season-top flex flex-col items-center"> <div class="season-top flex flex-col items-center">
<svg <Icon
t="1733125115126" icon="icon-park-twotone:shield-add"
class="icon" class="w-14 h-14 lg:w-24 lg:h-24"
viewBox="0 0 1024 1024" color="var(--primary-color)" />
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="8655"
width="80"
height="80">
<path
d="M529.18 950.26a32 32 0 0 1-34.36 0l-141-89.75a424.64 424.64 0 0 1-196.68-358.22V185.14a28 28 0 0 1 28-28c1.94 0 196.79-1.17 310.39-83.78a28 28 0 0 1 31.85-0.76c127.1 83.58 309.65 84.54 311.48 84.54a28 28 0 0 1 28 28v317.15a424.64 424.64 0 0 1-196.65 358.22z m-316-738.09v290.12a368.64 368.64 0 0 0 170.71 311L512 894.81l128.15-81.55a368.64 368.64 0 0 0 170.71-311V212.08a834.14 834.14 0 0 1-89.34-10.49c-81.88-14.08-152-38.33-208.85-72.15C460 163.3 391 187.55 307.24 201.61a871.13 871.13 0 0 1-94.1 10.56z"
fill="#1F61C1"
p-id="8656"></path>
<path
d="M508.13 528.47a32 32 0 0 1-45.26 0L377.2 442.8a28 28 0 0 1 0.56-40.15c11.08-10.49 28.66-9.82 39.45 1l68.29 68.25 197.7-197.7a28 28 0 0 1 39.6 39.6z"
fill="#1F61C1"
p-id="8657"></path>
<path
d="M632 662h-36.54a28 28 0 0 1 0-56H632a28 28 0 0 1 0 56zM501 662H392a28 28 0 0 1 0-56h109a28 28 0 0 1 0 56z"
fill="#FFB640"
p-id="8658"></path>
</svg>
<p class="reason-card-title">全方位保障</p> <p class="reason-card-title">全方位保障</p>
<p class="text-textPrimary font-normal mt-2 text-sm lg:text-lg"> <p class="text-textPrimary font-normal mt-2 text-xs lg:text-lg">
深度开发能力与数据安全护航 深度开发能力与数据安全护航
</p> </p>
<div class="mt-6 flex flex-col items-center"> <div class="mt-6 flex flex-col items-center">
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
五级权限管理体系 五级权限管理体系
</p> </p>
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
支持私有化部署 支持私有化部署
</p> </p>
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
全链路数据加密与灾备恢复机制 全链路数据加密与灾备恢复机制
</p> </p>
</div> </div>
...@@ -303,42 +263,25 @@ ...@@ -303,42 +263,25 @@
<p class="reason-tip-description">快速响应</p> <p class="reason-tip-description">快速响应</p>
</div> </div>
</div> </div>
<div class="section-reason-item"> <div class="section-reason-item">
<div class="season-top flex flex-col items-center"> <div class="season-top flex flex-col items-center">
<svg <Icon
t="1733125190985" icon="mingcute:hand-heart-line"
class="icon" class="w-14 h-14 lg:w-24 lg:h-24"
viewBox="0 0 1024 1024" color="var(--primary-color)" />
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="16052"
width="80"
height="80">
<path
d="M269.9028 631.604487m84.852814-84.852813l229.25816-229.258161q84.852814-84.852814 169.705628 0l94.936156 94.936156q84.852814 84.852814 0 169.705628l-229.258161 229.258161q-84.852814 84.852814-169.705627 0l-94.936156-94.936157q-84.852814-84.852814 0-169.705627Z"
fill="#E9F1FF"
p-id="16053"></path>
<path
d="M511.51 879.59a191.46 191.46 0 0 1-135.79-56.15L134.18 581.9a234.37 234.37 0 0 1 0-331.46l30.58-30.58a234.4 234.4 0 0 1 331.46 0l15.29 15.29 15.29-15.29a234.4 234.4 0 0 1 331.46 0l30.58 30.58a234.4 234.4 0 0 1 0 331.46L647.3 823.44a191.46 191.46 0 0 1-135.79 56.15z m-181-664.3A169.85 169.85 0 0 0 210 265.12l-30.57 30.57c-66.43 66.44-66.43 174.53 0 241L421 778.18c49.92 49.92 131.16 49.93 181.08 0l241.5-241.53c66.43-66.43 66.43-174.52 0-241L813 265.12c-66.44-66.43-174.53-66.43-241 0L470.86 366.31l-0.15 0.15-18.6 18.6a32 32 0 0 1-45.26-45.25l59.4-59.4L451 265.12a169.85 169.85 0 0 0-120.51-49.83z"
fill="#2C5CCB"
p-id="16054"></path>
<path
d="M510.88 643.7a198.31 198.31 0 0 1-141.15-58.46 30 30 0 0 1 42.42-42.43c54.44 54.44 143 54.44 197.45 0a30 30 0 1 1 42.4 42.43 198.33 198.33 0 0 1-141.12 58.46z"
fill="#2C5CCB"
p-id="16055"></path>
</svg>
<p class="reason-card-title">全周期服务</p> <p class="reason-card-title">全周期服务</p>
<p class="text-textPrimary font-normal mt-2 text-sm lg:text-lg"> <p class="text-textPrimary font-normal mt-2 text-xs lg:text-lg">
全程专业服务，满足卖家需求 全程专业服务，满足卖家需求
</p> </p>
<div class="mt-6 flex flex-col items-center"> <div class="mt-6 flex flex-col items-center">
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
软件顾问、实施、售后全流程服务 软件顾问、实施、售后全流程服务
</p> </p>
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
一体化专业服务，深度赋能客户 一体化专业服务，深度赋能客户
</p> </p>
<p class="text-textPrimary mb-2.5 font-light text-sm"> <p class="text-textPrimary mb-2.5 font-light text-xs lg:text-sm">
为软件使用负责，持续交付新功能 为软件使用负责，持续交付新功能
</p> </p>
</div> </div>
...@@ -353,12 +296,16 @@ ...@@ -353,12 +296,16 @@
</div> </div>
</template> </template>
<script> <script>
import { Icon } from '@iconify/vue2'
import purchaseImg from '../assets/images/home/01.png' import purchaseImg from '../assets/images/home/01.png'
import financesImg from '../assets/images/home/02.png' import financesImg from '../assets/images/home/02.png'
import statementsImg from '../assets/images/home/03.png' import statementsImg from '../assets/images/home/03.png'
import adImg from '../assets/images/home/04.png' import adImg from '../assets/images/home/04.png'
export default { export default {
name: 'productIntro', name: 'productIntro',
components: {
Icon,
},
data() { data() {
return { return {
activeTab: 0, activeTab: 0,
...@@ -542,13 +489,11 @@ export default { ...@@ -542,13 +489,11 @@ export default {
items: [ items: [
{ {
title: '客户雷达系统', title: '客户雷达系统',
subTitle: subTitle: '自动分析客户喜好/消费力，把客户分为不同等级重点维护',
'自动分析客户喜好/消费力，把客户分为不同等级重点维护',
}, },
{ {
title: '邮件轰炸机', title: '邮件轰炸机',
subTitle: subTitle: '与之邮件工具箱，设定好时间自动群发',
'与之邮件工具箱，设定好时间自动群发',
}, },
{ {
title: '广告万能遥控器', title: '广告万能遥控器',
...@@ -557,13 +502,12 @@ export default { ...@@ -557,13 +502,12 @@ export default {
}, },
{ {
title: '网红带货流水线', title: '网红带货流水线',
subTitle: subTitle: '按粉丝量/领域筛选红人，批量给网红布置推广任务',
'按粉丝量/领域筛选红人，批量给网红布置推广任务',
}, },
{ {
title:'智能保险箱', title: '智能保险箱',
subTitle:'所有平台账户统一管理，专业团队帮你过审开户' subTitle: '所有平台账户统一管理，专业团队帮你过审开户',
} },
], ],
}, },
], ],
...@@ -671,7 +615,7 @@ export default { ...@@ -671,7 +615,7 @@ export default {
flex-direction: row-reverse; flex-direction: row-reverse;
} }
.home-module-item:nth-child(odd) { .home-module-item:nth-child(odd) {
background-color: #f8f9ff; background-color: var(--background-color);
} }
.home-module-item:not(:last-child) { .home-module-item:not(:last-child) {
...@@ -696,7 +640,7 @@ export default { ...@@ -696,7 +640,7 @@ export default {
.desc-item { .desc-item {
position: relative; position: relative;
&::before { &::before {
background-color: #2554fe; background-color: var(--primary-color);
border-radius: 50%; border-radius: 50%;
position: absolute; position: absolute;
left: -23px; left: -23px;
...@@ -704,7 +648,7 @@ export default { ...@@ -704,7 +648,7 @@ export default {
content: ''; content: '';
width: 6px; width: 6px;
height: 6px; height: 6px;
box-shadow: 0 0 0 5px rgba(37, 84, 254, 0.1); box-shadow: 0 0 0 5px var(--shadow-color);
} }
&:not(:last-child) { &:not(:last-child) {
margin-bottom: 18px; margin-bottom: 18px;
...@@ -797,8 +741,7 @@ export default { ...@@ -797,8 +741,7 @@ export default {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
box-shadow: 0 0 16px 0 rgba(180, 189, 221, 1), box-shadow: 0 0px 10px 0px var(--shadow-color);
0 6px 14px 0 hsla(0, 0%, 100%, 0.3), 0 16px 20px 0 rgba(180, 189, 221, 0.25);
transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out;
.reason-card-type { .reason-card-type {
overflow: hidden; overflow: hidden;
...@@ -808,9 +751,10 @@ export default { ...@@ -808,9 +751,10 @@ export default {
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
width: 100%; width: 100%;
border-radius: 0 0 16px 16px; border-radius: 0 0 16px 16px;
background-image: url(../assets/images/home/05.png); background-color: var(--primary-color);
background-size: 100% 100%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='%23f6cd80' fill-opacity='0.32'%3E%3Cpath fill-rule='evenodd' d='M0 0h40v40H0V0zm40 40h40v40H40V40zm0-40h2l-2 2V0zm0 4l4-4h2l-6 6V4zm0 4l8-8h2L40 10V8zm0 4L52 0h2L40 14v-2zm0 4L56 0h2L40 18v-2zm0 4L60 0h2L40 22v-2zm0 4L64 0h2L40 26v-2zm0 4L68 0h2L40 30v-2zm0 4L72 0h2L40 34v-2zm0 4L76 0h2L40 38v-2zm0 4L80 0v2L42 40h-2zm4 0L80 4v2L46 40h-2zm4 0L80 8v2L50 40h-2zm4 0l28-28v2L54 40h-2zm4 0l24-24v2L58 40h-2zm4 0l20-20v2L62 40h-2zm4 0l16-16v2L66 40h-2zm4 0l12-12v2L70 40h-2zm4 0l8-8v2l-6 6h-2zm4 0l4-4v2l-2 2h-2z'/%3E%3C/g%3E%3C/svg%3E");
background-repeat: no-repeat; background-size: 50px 50px;
background-repeat: repeat;
.reason-tip { .reason-tip {
font-family: Helvetica Neue; font-family: Helvetica Neue;
font-size: 32px; font-size: 32px;
...@@ -822,10 +766,9 @@ export default { ...@@ -822,10 +766,9 @@ export default {
} }
.section-reason-item:hover { .section-reason-item:hover {
transform: translateY(-8px); transform: translateY(-8px);
box-shadow: 10px 10px 38px 0 hsla(0, 0%, 100%, 0.3), box-shadow: 10px 10px 38px 0 var(--el-color-primary-light-9);
0 0 14px 0 rgba(202, 210, 238, 0.2),
28px 36px 50px 0 rgba(180, 189, 221, 0.46);
} }
.season-top { .season-top {
padding: 24px 40px 36px; padding: 24px 40px 36px;
} }
...@@ -839,8 +782,26 @@ export default { ...@@ -839,8 +782,26 @@ export default {
.text-textPrimary { .text-textPrimary {
color: rgba(58, 64, 87, 1); color: rgba(58, 64, 87, 1);
} }
.reason-list {
@media (max-width: 1100px) {
.season-top {
padding: 16px 20px 18px;
}
.reason-card-title {
font-size: 20px;
margin-top: 8px;
}
.section-reason-item {
.reason-card-type {
padding-top: 12px;
padding-bottom: 16px;
.reason-tip {
font-size: 24px;
}
}
}
} }
.lx-title { .lx-title {
font-size: 2.25rem; font-size: 2.25rem;
color: #1a2035; color: #1a2035;
......
src/main.js
...@@ -20,12 +20,18 @@ import './assets/css/index.css' ...@@ -20,12 +20,18 @@ import './assets/css/index.css'
import './styles/index.scss' import './styles/index.scss'
const isMobile = () => window.innerWidth <= 1100 const isMobile = () => window.innerWidth <= 1100
Vue.util.defineReactive(Vue.prototype, '$isMobile', isMobile()) // 响应式更新 $isMobile 状态
// document.querySelector('html').style.fontSize = window.innerWidth / 100 + 'px' const mobileData = Vue.observable({ value: isMobile() })
// window.addEventListener('resize', () => { Object.defineProperty(Vue.prototype, '$isMobile', {
// Vue.prototype.$isMobile = isMobile() get() {
// document.querySelector('html').style.fontSize = window.innerWidth / 100 + 'px' return mobileData.value
// }) },
enumerable: true,
configurable: true
})
window.addEventListener('resize', () => {
mobileData.value = isMobile()
})
new Vue({ new Vue({
store, store,
......
src/plugins/element.js
...@@ -58,6 +58,12 @@ import { ...@@ -58,6 +58,12 @@ import {
Tag, Tag,
Scrollbar, Scrollbar,
RadioButton, RadioButton,
Divider,
BreadcrumbItem,
Breadcrumb,
Popconfirm,
Timeline,
TimelineItem,
} from 'element-ui' } from 'element-ui'
Vue.prototype.$ELEMENT = { size: 'mini' } Vue.prototype.$ELEMENT = { size: 'mini' }
...@@ -94,17 +100,24 @@ Vue.use(Tag) ...@@ -94,17 +100,24 @@ Vue.use(Tag)
Vue.use(Scrollbar) Vue.use(Scrollbar)
Vue.use(RadioButton) Vue.use(RadioButton)
Vue.use(Cascader) Vue.use(Cascader)
Vue.use(Divider)
Vue.use(Tabs)
Vue.use(Breadcrumb)
Vue.use(BreadcrumbItem)
Vue.use(Popconfirm)
Vue.use(Timeline)
Vue.use(TimelineItem)
Vue.prototype.$alert = MessageBox.alert Vue.prototype.$alert = MessageBox.alert
Vue.prototype.$message = (message) => Vue.prototype.$message = (message) =>
typeof message === 'string' typeof message === 'string'
? Message({ ? Message({
duration: 1000, duration: 1000,
message, message,
}) })
: Message({ : Message({
duration: 1000, duration: 1000,
...message, ...message,
}) })
// Vue.prototype.$message.warning = (msg)=> { // Vue.prototype.$message.warning = (msg)=> {
......
src/router/index.js
...@@ -6,8 +6,9 @@ import FunctionPage from '../views/function/functionPage.vue' ...@@ -6,8 +6,9 @@ import FunctionPage from '../views/function/functionPage.vue'
import PricePage from '../views/price/pricePage.vue' import PricePage from '../views/price/pricePage.vue'
import demandPage from '../views/demand/demandPage.vue' import demandPage from '../views/demand/demandPage.vue'
import aboutPage from '../views/aboutus/aboutPage' import aboutPage from '../views/aboutus/aboutPage'
import helpPage from '../views/helpPage' import helpPage from '../views/help/helpPage'
import productionManagement from '../views/product/productionManagement.vue'
import production from '../views/product/production.vue'
import ProductionCustom from '../views/product/productionCustom.vue' import ProductionCustom from '../views/product/productionCustom.vue'
import ProductionLogistics from '../views/product/productionLogistics.vue' import ProductionLogistics from '../views/product/productionLogistics.vue'
import ProductionPlatform from '../views/product/productPlatform.vue' import ProductionPlatform from '../views/product/productPlatform.vue'
...@@ -43,15 +44,11 @@ const routes = [ ...@@ -43,15 +44,11 @@ const routes = [
name: 'demandPage', name: 'demandPage',
component: demandPage, component: demandPage,
}, },
{
path: '/help',
name: 'help',
component: helpPage,
},
{ {
path: '/product/production', path: '/product/production',
name: 'production', name: 'production',
component: productionManagement, component: production,
}, },
{ {
path: '/product/custom-chain', path: '/product/custom-chain',
...@@ -83,6 +80,38 @@ const routes = [ ...@@ -83,6 +80,38 @@ const routes = [
name: 'about', name: 'about',
component: aboutPage, component: aboutPage,
}, },
{
path: '/help',
name: 'help',
component: helpPage,
redirect: 'help/index',
children: [
{
path: 'index',
name: 'HelpIndex',
component: (resolve) =>
require(['../views/help/pages/index.vue'], resolve),
},
{
path: 'beginner',
name: 'HelpBeginner',
component: (resolve) =>
require(['../views/help/pages/Beginner/beginner.vue'], resolve),
},
{
path: 'artical1',
name: 'Artical1',
component: (resolve) =>
require(['../views/help/pages/Beginner/artical1.vue'], resolve),
},
{
path: 'artical2',
name: 'Artical2',
component: (resolve) =>
require(['../views/help/pages/Beginner/artical2.vue'], resolve),
},
],
},
], ],
}, },
{ {
......
src/store/index.js
import Vue from 'vue' import Vue from 'vue'
import Vuex from 'vuex' import Vuex from 'vuex'
import pathModule from './path'
Vue.use(Vuex) Vue.use(Vuex)
export default new Vuex.Store({ export default new Vuex.Store({
modules: { modules: {
path: pathModule,
}, },
state: { state: {
userInfo: JSON.parse(JSON.stringify(localStorage.getItem('userInfo'))) || undefined, userInfo:
shopifyObj:{} JSON.parse(JSON.stringify(localStorage.getItem('userInfo'))) || undefined,
shopifyObj: {},
}, },
mutations: { mutations: {
setUserInfo(state, profile) { setUserInfo(state, profile) {
state.userInfo = profile state.userInfo = profile
}, },
setShopKey(state,data){ setShopKey(state, data) {
state.shopifyObj = data state.shopifyObj = data
} },
},
actions: {
}, },
actions: {},
}) })
src/store/path.js 0 → 100644
// 默认的帮助中心路径
const DEFAULT_HELP_CENTER = { name: '帮助中心', path: 'index' }
// 确保数组第一个元素是帮助中心
const ensureHelpCenterFirst = (pathNames) => {
if (!pathNames || pathNames.length === 0) {
return [DEFAULT_HELP_CENTER]
}
// 如果第一个元素已经是帮助中心，直接返回
if (pathNames[0].name === '帮助中心') {
return pathNames
}
const filtered = pathNames.filter((item) => item.name !== '帮助中心')
// 将帮助中心添加到第一位
return [DEFAULT_HELP_CENTER, ...filtered]
}
// 从 localStorage 初始化 currentPathNames
const initCurrentPathNames = () => {
try {
const stored = localStorage.getItem('currentPathNames')
const parsed = stored ? JSON.parse(stored) : []
return ensureHelpCenterFirst(parsed)
} catch (e) {
return [DEFAULT_HELP_CENTER]
}
}
export default {
namespaced: true,
state: {
currentPathNames: initCurrentPathNames(),
},
mutations: {
setCurrentPathNames(state, pathNames) {
// 确保第一个元素是帮助中心
state.currentPathNames = ensureHelpCenterFirst(pathNames || [])
localStorage.setItem(
'currentPathNames',
JSON.stringify(state.currentPathNames)
)
},
clearCurrentPathNames(state) {
// 清除时保留帮助中心
state.currentPathNames = [DEFAULT_HELP_CENTER]
localStorage.setItem(
'currentPathNames',
JSON.stringify(state.currentPathNames)
)
},
},
getters: {
currentPathNames: (state) => state.currentPathNames,
},
actions: {
setCurrentPathNames({ commit }, pathNames) {
commit('setCurrentPathNames', pathNames)
},
clearCurrentPathNames({ commit }) {
commit('clearCurrentPathNames')
},
// 添加文章路径
addArticlePath({ state, commit }, { title, index }) {
// 构建文章路径
const articlePath = `/help/artical${index + 1}`
// 获取当前路径列表
const currentPathNames = state.currentPathNames || []
// 构建新的路径列表，移除可能已存在的相同文章路径，然后添加新路径
const filteredPaths = currentPathNames.filter(
(item) => !item.path.startsWith('/help/artical')
)
// 添加文章路径
const newPathNames = [
...filteredPaths,
{ name: title, path: articlePath },
]
// 更新 vuex
commit('setCurrentPathNames', newPathNames)
},
},
}
src/styles/index.scss
$primary-color: #fd6701;
$secondary-color: #00205a;
:root { :root {
--primary-color: #2253fd; --primary-color: #{$primary-color};
--border-color: #dfe7f9; --border-color: #{rgba(mix(rgb(219, 219, 219), $primary-color, 80%), 0.3)};
--shadow-color: #{rgba($primary-color, 0.3)};
--light-color: #{lighten($primary-color, 20%)};
--darker-text-color: #{darken($primary-color, 5%)};
--hover-color: #{lighten($primary-color, 10%)};
--background-color: #{rgba(mix(rgb(247, 247, 247), $primary-color, 90%), 0.3)};
--light-background-color: #{lighten($primary-color, 45%)};
--secondary-color: #{$secondary-color};
--secondary-text-color: #{darken($secondary-color, 5%)};
--secondary-color-light1: #{mix(white, $secondary-color, 10%)};
--secondary-color-light2: #{mix(white, $secondary-color, 20%)};
--secondary-color-light3: #{mix(white, $secondary-color, 30%)};
--secondary-color-light4: #{mix(white, $secondary-color, 40%)};
--secondary-color-light5: #{mix(white, $secondary-color, 50%)};
--secondary-color-light6: #{mix(white, $secondary-color, 60%)};
--secondary-color-light7: #{mix(white, $secondary-color, 70%)};
--secondary-color-light8: #{mix(white, $secondary-color, 80%)};
--secondary-color-light9: #{mix(white, $secondary-color, 90%)};
--secondary-color-dark1: #{mix(black, $secondary-color, 10%)};
--secondary-color-dark2: #{mix(black, $secondary-color, 20%)};
--secondary-color-dark3: #{mix(black, $secondary-color, 30%)};
--secondary-color-dark4: #{mix(black, $secondary-color, 40%)};
--secondary-color-dark5: #{mix(black, $secondary-color, 50%)};
--secondary-color-dark6: #{mix(black, $secondary-color, 60%)};
--secondary-color-dark7: #{mix(black, $secondary-color, 70%)};
--secondary-color-dark8: #{mix(black, $secondary-color, 80%)};
--secondary-color-dark9: #{mix(black, $secondary-color, 90%)};
/* Element UI 主题色 - 基于 $primary-color 生成 */
--el-color-primary: #{$primary-color};
--el-color-primary-light-1: #{mix(white, $primary-color, 10%)};
--el-color-primary-light-2: #{mix(white, $primary-color, 20%)};
--el-color-primary-light-3: #{mix(white, $primary-color, 30%)};
--el-color-primary-light-4: #{mix(white, $primary-color, 40%)};
--el-color-primary-light-5: #{mix(white, $primary-color, 50%)};
--el-color-primary-light-6: #{mix(white, $primary-color, 60%)};
--el-color-primary-light-7: #{mix(white, $primary-color, 70%)};
--el-color-primary-light-8: #{mix(white, $primary-color, 80%)};
--el-color-primary-light-9: #{mix(white, $primary-color, 90%)};
--el-color-primary-dark-1: #{mix(black, $primary-color, 10%)};
--el-color-primary-dark-2: #{mix(black, $primary-color, 20%)};
--el-color-primary-dark-3: #{mix(black, $primary-color, 30%)};
--el-color-primary-dark-4: #{mix(black, $primary-color, 40%)};
--el-color-primary-dark-5: #{mix(black, $primary-color, 50%)};
--el-color-primary-dark-6: #{mix(black, $primary-color, 60%)};
--el-color-primary-dark-7: #{mix(black, $primary-color, 70%)};
--el-color-primary-dark-8: #{mix(black, $primary-color, 80%)};
--el-color-primary-dark-9: #{mix(black, $primary-color, 90%)};
} }
@tailwind base; @tailwind base;
......
src/theme/button.css
...@@ -373,9 +373,9 @@ ...@@ -373,9 +373,9 @@
line-height: 1; line-height: 1;
white-space: nowrap; white-space: nowrap;
cursor: pointer; cursor: pointer;
background: #FFFFFF; background: #ffffff;
border: 1px solid #DCDFE6; border: 1px solid #dcdfe6;
border-color: #DCDFE6; border-color: #dcdfe6;
color: #606266; color: #606266;
-webkit-appearance: none; -webkit-appearance: none;
text-align: center; text-align: center;
...@@ -383,380 +383,537 @@ ...@@ -383,380 +383,537 @@
box-sizing: border-box; box-sizing: border-box;
outline: none; outline: none;
margin: 0; margin: 0;
-webkit-transition: .1s; -webkit-transition: 0.1s;
transition: .1s; transition: 0.1s;
font-weight: 500; font-weight: 500;
-moz-user-select: none; -moz-user-select: none;
-webkit-user-select: none; -webkit-user-select: none;
-ms-user-select: none; -ms-user-select: none;
padding: 12px 20px; padding: 12px 20px;
font-size: 14px; font-size: 14px;
border-radius: 4px; } border-radius: 4px;
.el-button + .el-button { }
margin-left: 10px; } .el-button + .el-button {
.el-button.is-round { margin-left: 10px;
padding: 12px 20px; } }
.el-button:hover, .el-button:focus { .el-button.is-round {
color: #409EFF; padding: 12px 20px;
border-color: #c6e2ff; }
background-color: #ecf5ff; } .el-button:hover,
.el-button:active { .el-button:focus {
color: #3a8ee6; color: #409eff;
border-color: #3a8ee6; border-color: #c6e2ff;
outline: none; } background-color: #ecf5ff;
.el-button::-moz-focus-inner { }
border: 0; } .el-button:active {
.el-button [class*="el-icon-"] + span { color: #3a8ee6;
margin-left: 5px; } border-color: #3a8ee6;
.el-button.is-plain:hover, .el-button.is-plain:focus { outline: none;
background: #FFFFFF; }
border-color: #409EFF; .el-button::-moz-focus-inner {
color: #409EFF; } border: 0;
.el-button.is-plain:active { }
background: #FFFFFF; .el-button [class*='el-icon-'] + span {
border-color: #3a8ee6; margin-left: 5px;
color: #3a8ee6; }
outline: none; } .el-button.is-plain:hover,
.el-button.is-active { .el-button.is-plain:focus {
color: #3a8ee6; background: #ffffff;
border-color: #3a8ee6; } border-color: #409eff;
.el-button.is-disabled, .el-button.is-disabled:hover, .el-button.is-disabled:focus { color: #409eff;
color: #C0C4CC; }
cursor: not-allowed; .el-button.is-plain:active {
background-image: none; background: #ffffff;
background-color: #FFFFFF; border-color: #3a8ee6;
border-color: #EBEEF5; } color: #3a8ee6;
.el-button.is-disabled.el-button--text { outline: none;
background-color: transparent; } }
.el-button.is-disabled.is-plain, .el-button.is-disabled.is-plain:hover, .el-button.is-disabled.is-plain:focus { .el-button.is-active {
background-color: #FFFFFF; color: #3a8ee6;
border-color: #EBEEF5; border-color: #3a8ee6;
color: #C0C4CC; } }
.el-button.is-loading { .el-button.is-disabled,
position: relative; .el-button.is-disabled:hover,
pointer-events: none; } .el-button.is-disabled:focus {
.el-button.is-loading:before { color: #c0c4cc;
pointer-events: none; cursor: not-allowed;
content: ''; background-image: none;
position: absolute; background-color: #ffffff;
left: -1px; border-color: #ebeef5;
top: -1px; }
right: -1px; .el-button.is-disabled.el-button--text {
bottom: -1px; background-color: transparent;
border-radius: inherit; }
background-color: rgba(255, 255, 255, 0.35); } .el-button.is-disabled.is-plain,
.el-button.is-round { .el-button.is-disabled.is-plain:hover,
border-radius: 20px; .el-button.is-disabled.is-plain:focus {
padding: 12px 23px; } background-color: #ffffff;
.el-button.is-circle { border-color: #ebeef5;
border-radius: 50%; color: #c0c4cc;
padding: 12px; } }
.el-button--primary { .el-button.is-loading {
color: #FFFFFF; position: relative;
background-color: #409EFF; pointer-events: none;
border-color: #409EFF; } }
.el-button--primary:hover, .el-button--primary:focus { .el-button.is-loading:before {
background: #66b1ff; pointer-events: none;
border-color: #66b1ff; content: '';
color: #FFFFFF; } position: absolute;
.el-button--primary:active { left: -1px;
background: #3a8ee6; top: -1px;
border-color: #3a8ee6; right: -1px;
color: #FFFFFF; bottom: -1px;
outline: none; } border-radius: inherit;
.el-button--primary.is-active { background-color: rgba(255, 255, 255, 0.35);
background: #3a8ee6; }
border-color: #3a8ee6; .el-button.is-round {
color: #FFFFFF; } border-radius: 20px;
.el-button--primary.is-disabled, .el-button--primary.is-disabled:hover, .el-button--primary.is-disabled:focus, .el-button--primary.is-disabled:active { padding: 12px 23px;
color: #FFFFFF; }
background-color: #a0cfff; .el-button.is-circle {
border-color: #a0cfff; } border-radius: 50%;
.el-button--primary.is-plain { padding: 12px;
color: #409EFF; }
background: #ecf5ff; .el-button--primary {
border-color: #b3d8ff; } color: #ffffff;
.el-button--primary.is-plain:hover, .el-button--primary.is-plain:focus { background-color: #409eff;
background: #409EFF; border-color: #409eff;
border-color: #409EFF; }
color: #FFFFFF; } .el-button--primary:hover,
.el-button--primary.is-plain:active { .el-button--primary:focus {
background: #3a8ee6; background: #66b1ff;
border-color: #3a8ee6; border-color: #66b1ff;
color: #FFFFFF; color: #ffffff;
outline: none; } }
.el-button--primary.is-plain.is-disabled, .el-button--primary.is-plain.is-disabled:hover, .el-button--primary.is-plain.is-disabled:focus, .el-button--primary.is-plain.is-disabled:active { .el-button--primary:active {
color: #8cc5ff; background: #3a8ee6;
background-color: #ecf5ff; border-color: #3a8ee6;
border-color: #d9ecff; } color: #ffffff;
.el-button--success { outline: none;
color: #FFFFFF; }
background-color: #67C23A; .el-button--primary.is-active {
border-color: #67C23A; } background: #3a8ee6;
.el-button--success:hover, .el-button--success:focus { border-color: #3a8ee6;
background: #85ce61; color: #ffffff;
border-color: #85ce61; }
color: #FFFFFF; } .el-button--primary.is-disabled,
.el-button--success:active { .el-button--primary.is-disabled:hover,
background: #5daf34; .el-button--primary.is-disabled:focus,
border-color: #5daf34; .el-button--primary.is-disabled:active {
color: #FFFFFF; color: #ffffff;
outline: none; } background-color: #a0cfff;
.el-button--success.is-active { border-color: #a0cfff;
background: #5daf34; }
border-color: #5daf34; .el-button--primary.is-plain {
color: #FFFFFF; } color: #409eff;
.el-button--success.is-disabled, .el-button--success.is-disabled:hover, .el-button--success.is-disabled:focus, .el-button--success.is-disabled:active { background: #ecf5ff;
color: #FFFFFF; border-color: #b3d8ff;
background-color: #b3e19d; }
border-color: #b3e19d; } .el-button--primary.is-plain:hover,
.el-button--success.is-plain { .el-button--primary.is-plain:focus {
color: #67C23A; background: #409eff;
background: #f0f9eb; border-color: #409eff;
border-color: #c2e7b0; } color: #ffffff;
.el-button--success.is-plain:hover, .el-button--success.is-plain:focus { }
background: #67C23A; .el-button--primary.is-plain:active {
border-color: #67C23A; background: #3a8ee6;
color: #FFFFFF; } border-color: #3a8ee6;
.el-button--success.is-plain:active { color: #ffffff;
background: #5daf34; outline: none;
border-color: #5daf34; }
color: #FFFFFF; .el-button--primary.is-plain.is-disabled,
outline: none; } .el-button--primary.is-plain.is-disabled:hover,
.el-button--success.is-plain.is-disabled, .el-button--success.is-plain.is-disabled:hover, .el-button--success.is-plain.is-disabled:focus, .el-button--success.is-plain.is-disabled:active { .el-button--primary.is-plain.is-disabled:focus,
color: #a4da89; .el-button--primary.is-plain.is-disabled:active {
background-color: #f0f9eb; color: #8cc5ff;
border-color: #e1f3d8; } background-color: #ecf5ff;
.el-button--warning { border-color: #d9ecff;
color: #FFFFFF; }
background-color: #ff9900; .el-button--success {
border-color: #ff9900; } color: #ffffff;
.el-button--warning:hover, .el-button--warning:focus { background-color: #67c23a;
background: #ffad33; border-color: #67c23a;
border-color: #ffad33; }
color: #FFFFFF; } .el-button--success:hover,
.el-button--warning:active { .el-button--success:focus {
background: #e68a00; background: #85ce61;
border-color: #e68a00; border-color: #85ce61;
color: #FFFFFF; color: #ffffff;
outline: none; } }
.el-button--warning.is-active { .el-button--success:active {
background: #e68a00; background: #5daf34;
border-color: #e68a00; border-color: #5daf34;
color: #FFFFFF; } color: #ffffff;
.el-button--warning.is-disabled, .el-button--warning.is-disabled:hover, .el-button--warning.is-disabled:focus, .el-button--warning.is-disabled:active { outline: none;
color: #FFFFFF; }
background-color: #ffcc80; .el-button--success.is-active {
border-color: #ffcc80; } background: #5daf34;
.el-button--warning.is-plain { border-color: #5daf34;
color: #ff9900; color: #ffffff;
background: #fff5e6; }
border-color: #ffd699; } .el-button--success.is-disabled,
.el-button--warning.is-plain:hover, .el-button--warning.is-plain:focus { .el-button--success.is-disabled:hover,
background: #ff9900; .el-button--success.is-disabled:focus,
border-color: #ff9900; .el-button--success.is-disabled:active {
color: #FFFFFF; } color: #ffffff;
.el-button--warning.is-plain:active { background-color: #b3e19d;
background: #e68a00; border-color: #b3e19d;
border-color: #e68a00; }
color: #FFFFFF; .el-button--success.is-plain {
outline: none; } color: #67c23a;
.el-button--warning.is-plain.is-disabled, .el-button--warning.is-plain.is-disabled:hover, .el-button--warning.is-plain.is-disabled:focus, .el-button--warning.is-plain.is-disabled:active { background: #f0f9eb;
color: #ffc266; border-color: #c2e7b0;
background-color: #fff5e6; }
border-color: #ffebcc; } .el-button--success.is-plain:hover,
.el-button--danger { .el-button--success.is-plain:focus {
color: #FFFFFF; background: #67c23a;
background-color: #F56C6C; border-color: #67c23a;
border-color: #F56C6C; } color: #ffffff;
.el-button--danger:hover, .el-button--danger:focus { }
background: #f78989; .el-button--success.is-plain:active {
border-color: #f78989; background: #5daf34;
color: #FFFFFF; } border-color: #5daf34;
.el-button--danger:active { color: #ffffff;
background: #dd6161; outline: none;
border-color: #dd6161; }
color: #FFFFFF; .el-button--success.is-plain.is-disabled,
outline: none; } .el-button--success.is-plain.is-disabled:hover,
.el-button--danger.is-active { .el-button--success.is-plain.is-disabled:focus,
background: #dd6161; .el-button--success.is-plain.is-disabled:active {
border-color: #dd6161; color: #a4da89;
color: #FFFFFF; } background-color: #f0f9eb;
.el-button--danger.is-disabled, .el-button--danger.is-disabled:hover, .el-button--danger.is-disabled:focus, .el-button--danger.is-disabled:active { border-color: #e1f3d8;
color: #FFFFFF; }
background-color: #fab6b6; .el-button--warning {
border-color: #fab6b6; } color: #ffffff;
.el-button--danger.is-plain { background-color: #ff9900;
color: #F56C6C; border-color: #ff9900;
background: #fef0f0; }
border-color: #fbc4c4; } .el-button--warning:hover,
.el-button--danger.is-plain:hover, .el-button--danger.is-plain:focus { .el-button--warning:focus {
background: #F56C6C; background: #ffad33;
border-color: #F56C6C; border-color: #ffad33;
color: #FFFFFF; } color: #ffffff;
.el-button--danger.is-plain:active { }
background: #dd6161; .el-button--warning:active {
border-color: #dd6161; background: #e68a00;
color: #FFFFFF; border-color: #e68a00;
outline: none; } color: #ffffff;
.el-button--danger.is-plain.is-disabled, .el-button--danger.is-plain.is-disabled:hover, .el-button--danger.is-plain.is-disabled:focus, .el-button--danger.is-plain.is-disabled:active { outline: none;
color: #f9a7a7; }
background-color: #fef0f0; .el-button--warning.is-active {
border-color: #fde2e2; } background: #e68a00;
.el-button--info { border-color: #e68a00;
color: #FFFFFF; color: #ffffff;
background-color: #909399; }
border-color: #909399; } .el-button--warning.is-disabled,
.el-button--info:hover, .el-button--info:focus { .el-button--warning.is-disabled:hover,
background: #a6a9ad; .el-button--warning.is-disabled:focus,
border-color: #a6a9ad; .el-button--warning.is-disabled:active {
color: #FFFFFF; } color: #ffffff;
.el-button--info:active { background-color: #ffcc80;
background: #82848a; border-color: #ffcc80;
border-color: #82848a; }
color: #FFFFFF; .el-button--warning.is-plain {
outline: none; } color: #ff9900;
.el-button--info.is-active { background: #fff5e6;
background: #82848a; border-color: #ffd699;
border-color: #82848a; }
color: #FFFFFF; } .el-button--warning.is-plain:hover,
.el-button--info.is-disabled, .el-button--info.is-disabled:hover, .el-button--info.is-disabled:focus, .el-button--info.is-disabled:active { .el-button--warning.is-plain:focus {
color: #FFFFFF; background: #ff9900;
background-color: #c8c9cc; border-color: #ff9900;
border-color: #c8c9cc; } color: #ffffff;
.el-button--info.is-plain { }
color: #909399; .el-button--warning.is-plain:active {
background: #f4f4f5; background: #e68a00;
border-color: #d3d4d6; } border-color: #e68a00;
.el-button--info.is-plain:hover, .el-button--info.is-plain:focus { color: #ffffff;
background: #909399; outline: none;
border-color: #909399; }
color: #FFFFFF; } .el-button--warning.is-plain.is-disabled,
.el-button--info.is-plain:active { .el-button--warning.is-plain.is-disabled:hover,
background: #82848a; .el-button--warning.is-plain.is-disabled:focus,
border-color: #82848a; .el-button--warning.is-plain.is-disabled:active {
color: #FFFFFF; color: #ffc266;
outline: none; } background-color: #fff5e6;
.el-button--info.is-plain.is-disabled, .el-button--info.is-plain.is-disabled:hover, .el-button--info.is-plain.is-disabled:focus, .el-button--info.is-plain.is-disabled:active { border-color: #ffebcc;
color: #bcbec2; }
background-color: #f4f4f5; .el-button--danger {
border-color: #e9e9eb; } color: #ffffff;
.el-button--medium { background-color: #f56c6c;
padding: 10px 20px; border-color: #f56c6c;
font-size: 14px; }
border-radius: 4px; } .el-button--danger:hover,
.el-button--medium.is-round { .el-button--danger:focus {
padding: 10px 20px; } background: #f78989;
.el-button--medium.is-circle { border-color: #f78989;
padding: 10px; } color: #ffffff;
.el-button--small { }
padding: 9px 15px; .el-button--danger:active {
font-size: 12px; background: #dd6161;
border-radius: 3px; } border-color: #dd6161;
.el-button--small.is-round { color: #ffffff;
padding: 9px 15px; } outline: none;
.el-button--small.is-circle { }
padding: 9px; } .el-button--danger.is-active {
.el-button--mini { background: #dd6161;
padding: 7px 15px; border-color: #dd6161;
font-size: 12px; color: #ffffff;
border-radius: 3px; } }
.el-button--mini.is-round { .el-button--danger.is-disabled,
padding: 7px 15px; } .el-button--danger.is-disabled:hover,
.el-button--mini.is-circle { .el-button--danger.is-disabled:focus,
padding: 7px; } .el-button--danger.is-disabled:active {
.el-button--text { color: #ffffff;
border-color: transparent; background-color: #fab6b6;
color: #409EFF; border-color: #fab6b6;
background: transparent; }
padding-left: 0; .el-button--danger.is-plain {
padding-right: 0; } color: #f56c6c;
.el-button--text:hover, .el-button--text:focus { background: #fef0f0;
color: #66b1ff; border-color: #fbc4c4;
border-color: transparent; }
background-color: transparent; } .el-button--danger.is-plain:hover,
.el-button--text:active { .el-button--danger.is-plain:focus {
color: #3a8ee6; background: #f56c6c;
border-color: transparent; border-color: #f56c6c;
background-color: transparent; } color: #ffffff;
.el-button--text.is-disabled, .el-button--text.is-disabled:hover, .el-button--text.is-disabled:focus { }
border-color: transparent; } .el-button--danger.is-plain:active {
background: #dd6161;
border-color: #dd6161;
color: #ffffff;
outline: none;
}
.el-button--danger.is-plain.is-disabled,
.el-button--danger.is-plain.is-disabled:hover,
.el-button--danger.is-plain.is-disabled:focus,
.el-button--danger.is-plain.is-disabled:active {
color: #f9a7a7;
background-color: #fef0f0;
border-color: #fde2e2;
}
.el-button--info {
color: #ffffff;
background-color: #909399;
border-color: #909399;
}
.el-button--info:hover,
.el-button--info:focus {
background: #a6a9ad;
border-color: #a6a9ad;
color: #ffffff;
}
.el-button--info:active {
background: #82848a;
border-color: #82848a;
color: #ffffff;
outline: none;
}
.el-button--info.is-active {
background: #82848a;
border-color: #82848a;
color: #ffffff;
}
.el-button--info.is-disabled,
.el-button--info.is-disabled:hover,
.el-button--info.is-disabled:focus,
.el-button--info.is-disabled:active {
color: #ffffff;
background-color: #c8c9cc;
border-color: #c8c9cc;
}
.el-button--info.is-plain {
color: #909399;
background: #f4f4f5;
border-color: #d3d4d6;
}
.el-button--info.is-plain:hover,
.el-button--info.is-plain:focus {
background: #909399;
border-color: #909399;
color: #ffffff;
}
.el-button--info.is-plain:active {
background: #82848a;
border-color: #82848a;
color: #ffffff;
outline: none;
}
.el-button--info.is-plain.is-disabled,
.el-button--info.is-plain.is-disabled:hover,
.el-button--info.is-plain.is-disabled:focus,
.el-button--info.is-plain.is-disabled:active {
color: #bcbec2;
background-color: #f4f4f5;
border-color: #e9e9eb;
}
.el-button--medium {
padding: 10px 20px;
font-size: 14px;
border-radius: 4px;
}
.el-button--medium.is-round {
padding: 10px 20px;
}
.el-button--medium.is-circle {
padding: 10px;
}
.el-button--small {
padding: 9px 15px;
font-size: 12px;
border-radius: 3px;
}
.el-button--small.is-round {
padding: 9px 15px;
}
.el-button--small.is-circle {
padding: 9px;
}
.el-button--mini {
padding: 7px 15px;
font-size: 12px;
border-radius: 3px;
}
.el-button--mini.is-round {
padding: 7px 15px;
}
.el-button--mini.is-circle {
padding: 7px;
}
.el-button--text {
border-color: transparent;
color: #409eff;
background: transparent;
padding-left: 0;
padding-right: 0;
}
.el-button--text:hover,
.el-button--text:focus {
color: #66b1ff;
border-color: transparent;
background-color: transparent;
}
.el-button--text:active {
color: #3a8ee6;
border-color: transparent;
background-color: transparent;
}
.el-button--text.is-disabled,
.el-button--text.is-disabled:hover,
.el-button--text.is-disabled:focus {
border-color: transparent;
}
.el-button-group { .el-button-group {
display: inline-block; display: inline-block;
vertical-align: middle; } vertical-align: middle;
.el-button-group::before, }
.el-button-group::after { .el-button-group::before,
display: table; .el-button-group::after {
content: ""; } display: table;
.el-button-group::after { content: '';
clear: both; } }
.el-button-group > .el-button { .el-button-group::after {
float: left; clear: both;
position: relative; } }
.el-button-group > .el-button + .el-button { .el-button-group > .el-button {
margin-left: 0; } float: left;
.el-button-group > .el-button.is-disabled { position: relative;
z-index: 1; } }
.el-button-group > .el-button:first-child { .el-button-group > .el-button + .el-button {
border-top-right-radius: 0; margin-left: 0;
border-bottom-right-radius: 0; } }
.el-button-group > .el-button:last-child { .el-button-group > .el-button.is-disabled {
border-top-left-radius: 0; z-index: 1;
border-bottom-left-radius: 0; } }
.el-button-group > .el-button:first-child:last-child { .el-button-group > .el-button:first-child {
border-top-right-radius: 4px; border-top-right-radius: 0;
border-bottom-right-radius: 4px; border-bottom-right-radius: 0;
border-top-left-radius: 4px; }
border-bottom-left-radius: 4px; } .el-button-group > .el-button:last-child {
.el-button-group > .el-button:first-child:last-child.is-round { border-top-left-radius: 0;
border-radius: 20px; } border-bottom-left-radius: 0;
.el-button-group > .el-button:first-child:last-child.is-circle { }
border-radius: 50%; } .el-button-group > .el-button:first-child:last-child {
.el-button-group > .el-button:not(:first-child):not(:last-child) { border-top-right-radius: 4px;
border-radius: 0; } border-bottom-right-radius: 4px;
.el-button-group > .el-button:not(:last-child) { border-top-left-radius: 4px;
margin-right: -1px; } border-bottom-left-radius: 4px;
.el-button-group > .el-button:hover, .el-button-group > .el-button:focus, .el-button-group > .el-button:active { }
z-index: 1; } .el-button-group > .el-button:first-child:last-child.is-round {
.el-button-group > .el-button.is-active { border-radius: 20px;
z-index: 1; } }
.el-button-group > .el-dropdown > .el-button { .el-button-group > .el-button:first-child:last-child.is-circle {
border-top-left-radius: 0; border-radius: 50%;
border-bottom-left-radius: 0; }
border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group > .el-button:not(:first-child):not(:last-child) {
.el-button-group .el-button--primary:first-child { border-radius: 0;
border-right-color: rgba(255, 255, 255, 0.5); } }
.el-button-group .el-button--primary:last-child { .el-button-group > .el-button:not(:last-child) {
border-left-color: rgba(255, 255, 255, 0.5); } margin-right: -1px;
.el-button-group .el-button--primary:not(:first-child):not(:last-child) { }
border-left-color: rgba(255, 255, 255, 0.5); .el-button-group > .el-button:hover,
border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group > .el-button:focus,
.el-button-group .el-button--success:first-child { .el-button-group > .el-button:active {
border-right-color: rgba(255, 255, 255, 0.5); } z-index: 1;
.el-button-group .el-button--success:last-child { }
border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group > .el-button.is-active {
.el-button-group .el-button--success:not(:first-child):not(:last-child) { z-index: 1;
border-left-color: rgba(255, 255, 255, 0.5); }
border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group > .el-dropdown > .el-button {
.el-button-group .el-button--warning:first-child { border-top-left-radius: 0;
border-right-color: rgba(255, 255, 255, 0.5); } border-bottom-left-radius: 0;
.el-button-group .el-button--warning:last-child { border-left-color: rgba(255, 255, 255, 0.5);
border-left-color: rgba(255, 255, 255, 0.5); } }
.el-button-group .el-button--warning:not(:first-child):not(:last-child) { .el-button-group .el-button--primary:first-child {
border-left-color: rgba(255, 255, 255, 0.5); border-right-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5); } }
.el-button-group .el-button--danger:first-child { .el-button-group .el-button--primary:last-child {
border-right-color: rgba(255, 255, 255, 0.5); } border-left-color: rgba(255, 255, 255, 0.5);
.el-button-group .el-button--danger:last-child { }
border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--primary:not(:first-child):not(:last-child) {
.el-button-group .el-button--danger:not(:first-child):not(:last-child) { border-left-color: rgba(255, 255, 255, 0.5);
border-left-color: rgba(255, 255, 255, 0.5); border-right-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5); } }
.el-button-group .el-button--info:first-child { .el-button-group .el-button--success:first-child {
border-right-color: rgba(255, 255, 255, 0.5); } border-right-color: rgba(255, 255, 255, 0.5);
.el-button-group .el-button--info:last-child { }
border-left-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--success:last-child {
.el-button-group .el-button--info:not(:first-child):not(:last-child) { border-left-color: rgba(255, 255, 255, 0.5);
border-left-color: rgba(255, 255, 255, 0.5); }
border-right-color: rgba(255, 255, 255, 0.5); } .el-button-group .el-button--success:not(:first-child):not(:last-child) {
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--warning:first-child {
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--warning:last-child {
border-left-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--warning:not(:first-child):not(:last-child) {
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--danger:first-child {
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--danger:last-child {
border-left-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--danger:not(:first-child):not(:last-child) {
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--info:first-child {
border-right-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--info:last-child {
border-left-color: rgba(255, 255, 255, 0.5);
}
.el-button-group .el-button--info:not(:first-child):not(:last-child) {
border-left-color: rgba(255, 255, 255, 0.5);
border-right-color: rgba(255, 255, 255, 0.5);
}
src/theme/menu.css
...@@ -371,118 +371,157 @@ ...@@ -371,118 +371,157 @@
.fade-in-linear-enter-active, .fade-in-linear-enter-active,
.fade-in-linear-leave-active { .fade-in-linear-leave-active {
-webkit-transition: opacity 200ms linear; -webkit-transition: opacity 200ms linear;
transition: opacity 200ms linear; } transition: opacity 200ms linear;
}
.fade-in-linear-enter, .fade-in-linear-enter,
.fade-in-linear-leave, .fade-in-linear-leave,
.fade-in-linear-leave-active { .fade-in-linear-leave-active {
opacity: 0; } opacity: 0;
}
.el-fade-in-linear-enter-active, .el-fade-in-linear-enter-active,
.el-fade-in-linear-leave-active { .el-fade-in-linear-leave-active {
-webkit-transition: opacity 200ms linear; -webkit-transition: opacity 200ms linear;
transition: opacity 200ms linear; } transition: opacity 200ms linear;
}
.el-fade-in-linear-enter, .el-fade-in-linear-enter,
.el-fade-in-linear-leave, .el-fade-in-linear-leave,
.el-fade-in-linear-leave-active { .el-fade-in-linear-leave-active {
opacity: 0; } opacity: 0;
}
.el-fade-in-enter-active, .el-fade-in-enter-active,
.el-fade-in-leave-active { .el-fade-in-leave-active {
-webkit-transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); -webkit-transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); } transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
}
.el-fade-in-enter, .el-fade-in-enter,
.el-fade-in-leave-active { .el-fade-in-leave-active {
opacity: 0; } opacity: 0;
}
.el-zoom-in-center-enter-active, .el-zoom-in-center-enter-active,
.el-zoom-in-center-leave-active { .el-zoom-in-center-leave-active {
-webkit-transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); -webkit-transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); } transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
}
.el-zoom-in-center-enter, .el-zoom-in-center-enter,
.el-zoom-in-center-leave-active { .el-zoom-in-center-leave-active {
opacity: 0; opacity: 0;
-webkit-transform: scaleX(0); -webkit-transform: scaleX(0);
transform: scaleX(0); } transform: scaleX(0);
}
.el-zoom-in-top-enter-active, .el-zoom-in-top-enter-active,
.el-zoom-in-top-leave-active { .el-zoom-in-top-leave-active {
opacity: 1; opacity: 1;
-webkit-transform: scaleY(1); -webkit-transform: scaleY(1);
transform: scaleY(1); transform: scaleY(1);
-webkit-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
opacity 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
-webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
-webkit-transform-origin: center top; -webkit-transform-origin: center top;
transform-origin: center top; } transform-origin: center top;
}
.el-zoom-in-top-enter, .el-zoom-in-top-enter,
.el-zoom-in-top-leave-active { .el-zoom-in-top-leave-active {
opacity: 0; opacity: 0;
-webkit-transform: scaleY(0); -webkit-transform: scaleY(0);
transform: scaleY(0); } transform: scaleY(0);
}
.el-zoom-in-bottom-enter-active, .el-zoom-in-bottom-enter-active,
.el-zoom-in-bottom-leave-active { .el-zoom-in-bottom-leave-active {
opacity: 1; opacity: 1;
-webkit-transform: scaleY(1); -webkit-transform: scaleY(1);
transform: scaleY(1); transform: scaleY(1);
-webkit-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
opacity 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
-webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
-webkit-transform-origin: center bottom; -webkit-transform-origin: center bottom;
transform-origin: center bottom; } transform-origin: center bottom;
}
.el-zoom-in-bottom-enter, .el-zoom-in-bottom-enter,
.el-zoom-in-bottom-leave-active { .el-zoom-in-bottom-leave-active {
opacity: 0; opacity: 0;
-webkit-transform: scaleY(0); -webkit-transform: scaleY(0);
transform: scaleY(0); } transform: scaleY(0);
}
.el-zoom-in-left-enter-active, .el-zoom-in-left-enter-active,
.el-zoom-in-left-leave-active { .el-zoom-in-left-leave-active {
opacity: 1; opacity: 1;
-webkit-transform: scale(1, 1); -webkit-transform: scale(1, 1);
transform: scale(1, 1); transform: scale(1, 1);
-webkit-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1); transition: opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1), opacity 300ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1); -webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
opacity 300ms cubic-bezier(0.23, 1, 0.32, 1);
transition: transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
opacity 300ms cubic-bezier(0.23, 1, 0.32, 1),
-webkit-transform 300ms cubic-bezier(0.23, 1, 0.32, 1);
-webkit-transform-origin: top left; -webkit-transform-origin: top left;
transform-origin: top left; } transform-origin: top left;
}
.el-zoom-in-left-enter, .el-zoom-in-left-enter,
.el-zoom-in-left-leave-active { .el-zoom-in-left-leave-active {
opacity: 0; opacity: 0;
-webkit-transform: scale(0.45, 0.45); -webkit-transform: scale(0.45, 0.45);
transform: scale(0.45, 0.45); } transform: scale(0.45, 0.45);
}
.collapse-transition { .collapse-transition {
-webkit-transition: 0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out; -webkit-transition: 0.3s height ease-in-out, 0.3s padding-top ease-in-out,
transition: 0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out; } 0.3s padding-bottom ease-in-out;
transition: 0.3s height ease-in-out, 0.3s padding-top ease-in-out,
0.3s padding-bottom ease-in-out;
}
.horizontal-collapse-transition { .horizontal-collapse-transition {
-webkit-transition: 0.3s width ease-in-out, 0.3s padding-left ease-in-out, 0.3s padding-right ease-in-out; -webkit-transition: 0.3s width ease-in-out, 0.3s padding-left ease-in-out,
transition: 0.3s width ease-in-out, 0.3s padding-left ease-in-out, 0.3s padding-right ease-in-out; } 0.3s padding-right ease-in-out;
transition: 0.3s width ease-in-out, 0.3s padding-left ease-in-out,
0.3s padding-right ease-in-out;
}
.el-list-enter-active, .el-list-enter-active,
.el-list-leave-active { .el-list-leave-active {
-webkit-transition: all 1s; -webkit-transition: all 1s;
transition: all 1s; } transition: all 1s;
}
.el-list-enter, .el-list-leave-active { .el-list-enter,
.el-list-leave-active {
opacity: 0; opacity: 0;
-webkit-transform: translateY(-30px); -webkit-transform: translateY(-30px);
transform: translateY(-30px); } transform: translateY(-30px);
}
.el-opacity-transition { .el-opacity-transition {
-webkit-transition: opacity 0.3s cubic-bezier(0.55, 0, 0.1, 1); -webkit-transition: opacity 0.3s cubic-bezier(0.55, 0, 0.1, 1);
transition: opacity 0.3s cubic-bezier(0.55, 0, 0.1, 1); } transition: opacity 0.3s cubic-bezier(0.55, 0, 0.1, 1);
}
.el-menu { .el-menu {
border-right: solid 1px #e6e6e6; border-right: solid 1px #e6e6e6;
...@@ -490,118 +529,155 @@ ...@@ -490,118 +529,155 @@
position: relative; position: relative;
margin: 0; margin: 0;
padding-left: 0; padding-left: 0;
background-color: #FFFFFF; } background-color: #ffffff;
.el-menu::before, }
.el-menu::after { .el-menu::before,
display: table; .el-menu::after {
content: ""; } display: table;
.el-menu::after { content: '';
clear: both; } }
.el-menu.el-menu--horizontal { .el-menu::after {
border-bottom: solid 1px #e6e6e6; } clear: both;
.el-menu--horizontal { }
border-right: none; } .el-menu.el-menu--horizontal {
.el-menu--horizontal > .el-menu-item { border-bottom: solid 1px #e6e6e6;
float: left; }
height: 60px; .el-menu--horizontal {
line-height: 60px; border-right: none;
margin: 0; }
border-bottom: 2px solid transparent; .el-menu--horizontal > .el-menu-item {
color: #909399; } float: left;
.el-menu--horizontal > .el-menu-item a, height: 60px;
.el-menu--horizontal > .el-menu-item a:hover { line-height: 60px;
color: inherit; } margin: 0;
.el-menu--horizontal > .el-menu-item:not(.is-disabled):hover, .el-menu--horizontal > .el-menu-item:not(.is-disabled):focus { border-bottom: 2px solid transparent;
background-color: #fff; } color: #909399;
.el-menu--horizontal > .el-submenu { }
float: left; } .el-menu--horizontal > .el-menu-item a,
.el-menu--horizontal > .el-submenu:focus, .el-menu--horizontal > .el-submenu:hover { .el-menu--horizontal > .el-menu-item a:hover {
outline: none; } color: inherit;
.el-menu--horizontal > .el-submenu:focus .el-submenu__title, .el-menu--horizontal > .el-submenu:hover .el-submenu__title { }
color: #303133; } .el-menu--horizontal > .el-menu-item:not(.is-disabled):hover,
.el-menu--horizontal > .el-submenu.is-active .el-submenu__title { .el-menu--horizontal > .el-menu-item:not(.is-disabled):focus {
border-bottom: 2px solid #409EFF; background-color: #fff;
color: #303133; } }
.el-menu--horizontal > .el-submenu .el-submenu__title { .el-menu--horizontal > .el-submenu {
height: 60px; float: left;
line-height: 60px; }
border-bottom: 2px solid transparent; .el-menu--horizontal > .el-submenu:focus,
color: #909399; } .el-menu--horizontal > .el-submenu:hover {
.el-menu--horizontal > .el-submenu .el-submenu__title:hover { outline: none;
background-color: #fff; } }
.el-menu--horizontal > .el-submenu .el-submenu__icon-arrow { .el-menu--horizontal > .el-submenu:focus .el-submenu__title,
position: static; .el-menu--horizontal > .el-submenu:hover .el-submenu__title {
vertical-align: middle; color: #303133;
margin-left: 8px; }
margin-top: -3px; } .el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
.el-menu--horizontal .el-menu .el-menu-item, border-bottom: 2px solid #409eff;
.el-menu--horizontal .el-menu .el-submenu__title { color: #303133;
background-color: #FFFFFF; }
float: none; .el-menu--horizontal > .el-submenu .el-submenu__title {
height: 36px; height: 60px;
line-height: 36px; line-height: 60px;
padding: 0 10px; border-bottom: 2px solid transparent;
color: #909399; } color: #909399;
.el-menu--horizontal .el-menu .el-menu-item.is-active, }
.el-menu--horizontal .el-menu .el-submenu.is-active > .el-submenu__title { .el-menu--horizontal > .el-submenu .el-submenu__title:hover {
color: #303133; } background-color: #fff;
.el-menu--horizontal .el-menu-item:not(.is-disabled):hover, }
.el-menu--horizontal .el-menu-item:not(.is-disabled):focus { .el-menu--horizontal > .el-submenu .el-submenu__icon-arrow {
outline: none; position: static;
color: #303133; } vertical-align: middle;
.el-menu--horizontal > .el-menu-item.is-active { margin-left: 8px;
border-bottom: 2px solid #409EFF; margin-top: -3px;
color: #303133; } }
.el-menu--collapse { .el-menu--horizontal .el-menu .el-menu-item,
width: 64px; } .el-menu--horizontal .el-menu .el-submenu__title {
.el-menu--collapse > .el-menu-item [class^="el-icon-"], background-color: #ffffff;
.el-menu--collapse > .el-submenu > .el-submenu__title [class^="el-icon-"] { float: none;
margin: 0; height: 36px;
vertical-align: middle; line-height: 36px;
width: 24px; padding: 0 10px;
text-align: center; } color: #909399;
.el-menu--collapse > .el-menu-item .el-submenu__icon-arrow, }
.el-menu--collapse > .el-submenu > .el-submenu__title .el-submenu__icon-arrow { .el-menu--horizontal .el-menu .el-menu-item.is-active,
display: none; } .el-menu--horizontal .el-menu .el-submenu.is-active > .el-submenu__title {
.el-menu--collapse > .el-menu-item span, color: #303133;
.el-menu--collapse > .el-submenu > .el-submenu__title span { }
height: 0; .el-menu--horizontal .el-menu-item:not(.is-disabled):hover,
width: 0; .el-menu--horizontal .el-menu-item:not(.is-disabled):focus {
overflow: hidden; outline: none;
visibility: hidden; color: #303133;
display: inline-block; } }
.el-menu--collapse > .el-menu-item.is-active i { .el-menu--horizontal > .el-menu-item.is-active {
color: inherit; } border-bottom: 2px solid #409eff;
.el-menu--collapse .el-menu .el-submenu { color: #303133;
min-width: 200px; } }
.el-menu--collapse .el-submenu { .el-menu--collapse {
position: relative; } width: 64px;
.el-menu--collapse .el-submenu .el-menu { }
position: absolute; .el-menu--collapse > .el-menu-item [class^='el-icon-'],
margin-left: 5px; .el-menu--collapse > .el-submenu > .el-submenu__title [class^='el-icon-'] {
top: 0; margin: 0;
left: 100%; vertical-align: middle;
z-index: 10; width: 24px;
border: 1px solid #E4E7ED; text-align: center;
border-radius: 2px; }
-webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); .el-menu--collapse > .el-menu-item .el-submenu__icon-arrow,
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); } .el-menu--collapse > .el-submenu > .el-submenu__title .el-submenu__icon-arrow {
.el-menu--collapse .el-submenu.is-opened > .el-submenu__title .el-submenu__icon-arrow { display: none;
-webkit-transform: none; }
transform: none; } .el-menu--collapse > .el-menu-item span,
.el-menu--popup { .el-menu--collapse > .el-submenu > .el-submenu__title span {
z-index: 100; height: 0;
min-width: 200px; width: 0;
border: none; overflow: hidden;
padding: 5px 0; visibility: hidden;
border-radius: 2px; display: inline-block;
-webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); }
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); } .el-menu--collapse > .el-menu-item.is-active i {
.el-menu--popup-bottom-start { color: inherit;
margin-top: 5px; } }
.el-menu--popup-right-start { .el-menu--collapse .el-menu .el-submenu {
margin-left: 5px; min-width: 200px;
margin-right: 5px; } }
.el-menu--collapse .el-submenu {
position: relative;
}
.el-menu--collapse .el-submenu .el-menu {
position: absolute;
margin-left: 5px;
top: 0;
left: 100%;
z-index: 10;
border: 1px solid #e4e7ed;
border-radius: 2px;
-webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.el-menu--collapse
.el-submenu.is-opened
> .el-submenu__title
.el-submenu__icon-arrow {
-webkit-transform: none;
transform: none;
}
.el-menu--popup {
z-index: 100;
min-width: 200px;
border: none;
padding: 5px 0;
border-radius: 2px;
-webkit-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.el-menu--popup-bottom-start {
margin-top: 5px;
}
.el-menu--popup-right-start {
margin-left: 5px;
margin-right: 5px;
}
.el-menu-item { .el-menu-item {
height: 56px; height: 56px;
...@@ -612,108 +688,135 @@ ...@@ -612,108 +688,135 @@
list-style: none; list-style: none;
cursor: pointer; cursor: pointer;
position: relative; position: relative;
-webkit-transition: border-color .3s, background-color .3s, color .3s; -webkit-transition: border-color 0.3s, background-color 0.3s, color 0.3s;
transition: border-color .3s, background-color .3s, color .3s; transition: border-color 0.3s, background-color 0.3s, color 0.3s;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
white-space: nowrap; } white-space: nowrap;
.el-menu-item * { }
vertical-align: middle; } .el-menu-item * {
.el-menu-item i { vertical-align: middle;
color: #909399; } }
.el-menu-item:hover, .el-menu-item:focus { .el-menu-item i {
outline: none; color: #909399;
background-color: #ecf5ff; } }
.el-menu-item.is-disabled { .el-menu-item:hover,
opacity: 0.25; .el-menu-item:focus {
cursor: not-allowed; outline: none;
background: none !important; } background-color: var(--el-color-primary-light-8);
.el-menu-item [class^="el-icon-"] { }
margin-right: 5px; .el-menu-item.is-disabled {
width: 24px; opacity: 0.25;
text-align: center; cursor: not-allowed;
font-size: 18px; background: none !important;
vertical-align: middle; } }
.el-menu-item.is-active { .el-menu-item [class^='el-icon-'] {
color: #409EFF; } margin-right: 5px;
.el-menu-item.is-active i { width: 24px;
color: inherit; } text-align: center;
font-size: 18px;
vertical-align: middle;
}
.el-menu-item.is-active {
color: #409eff;
}
.el-menu-item.is-active i {
color: inherit;
}
.el-submenu { .el-submenu {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding-left: 0; } padding-left: 0;
.el-submenu__title { }
height: 56px; .el-submenu__title {
line-height: 56px; height: 56px;
font-size: 14px; line-height: 56px;
color: #303133; font-size: 14px;
padding: 0 20px; color: #303133;
list-style: none; padding: 0 20px;
cursor: pointer; list-style: none;
position: relative; cursor: pointer;
-webkit-transition: border-color .3s, background-color .3s, color .3s; position: relative;
transition: border-color .3s, background-color .3s, color .3s; -webkit-transition: border-color 0.3s, background-color 0.3s, color 0.3s;
-webkit-box-sizing: border-box; transition: border-color 0.3s, background-color 0.3s, color 0.3s;
box-sizing: border-box; -webkit-box-sizing: border-box;
white-space: nowrap; } box-sizing: border-box;
.el-submenu__title * { white-space: nowrap;
vertical-align: middle; } }
.el-submenu__title i { .el-submenu__title * {
color: #909399; } vertical-align: middle;
.el-submenu__title:hover, .el-submenu__title:focus { }
outline: none; .el-submenu__title i {
background-color: #ecf5ff; } color: #909399;
.el-submenu__title.is-disabled { }
opacity: 0.25; .el-submenu__title:hover,
cursor: not-allowed; .el-submenu__title:focus {
background: none !important; } outline: none;
.el-submenu__title:hover { background-color: #ecf5ff;
background-color: #ecf5ff; } }
.el-submenu .el-menu { .el-submenu__title.is-disabled {
border: none; } opacity: 0.25;
.el-submenu .el-menu-item { cursor: not-allowed;
height: 50px; background: none !important;
line-height: 50px; }
padding: 0 45px; .el-submenu__title:hover {
min-width: 200px; } background-color: #ecf5ff;
.el-submenu__icon-arrow { }
position: absolute; .el-submenu .el-menu {
top: 50%; border: none;
right: 20px; }
margin-top: -7px; .el-submenu .el-menu-item {
-webkit-transition: -webkit-transform .3s; height: 50px;
transition: -webkit-transform .3s; line-height: 50px;
transition: transform .3s; padding: 0 45px;
transition: transform .3s, -webkit-transform .3s; min-width: 200px;
font-size: 12px; } }
.el-submenu.is-active .el-submenu__title { .el-submenu__icon-arrow {
border-bottom-color: #409EFF; } position: absolute;
.el-submenu.is-opened > .el-submenu__title .el-submenu__icon-arrow { top: 50%;
-webkit-transform: rotateZ(180deg); right: 20px;
transform: rotateZ(180deg); } margin-top: -7px;
.el-submenu.is-disabled .el-submenu__title, -webkit-transition: -webkit-transform 0.3s;
.el-submenu.is-disabled .el-menu-item { transition: -webkit-transform 0.3s;
opacity: 0.25; transition: transform 0.3s;
cursor: not-allowed; transition: transform 0.3s, -webkit-transform 0.3s;
background: none !important; } font-size: 12px;
.el-submenu [class^="el-icon-"] { }
vertical-align: middle; .el-submenu.is-active .el-submenu__title {
margin-right: 5px; border-bottom-color: #409eff;
width: 24px; }
text-align: center; .el-submenu.is-opened > .el-submenu__title .el-submenu__icon-arrow {
font-size: 18px; } -webkit-transform: rotateZ(180deg);
transform: rotateZ(180deg);
}
.el-submenu.is-disabled .el-submenu__title,
.el-submenu.is-disabled .el-menu-item {
opacity: 0.25;
cursor: not-allowed;
background: none !important;
}
.el-submenu [class^='el-icon-'] {
vertical-align: middle;
margin-right: 5px;
width: 24px;
text-align: center;
font-size: 18px;
}
.el-menu-item-group > ul { .el-menu-item-group > ul {
padding: 0; } padding: 0;
}
.el-menu-item-group__title { .el-menu-item-group__title {
padding: 7px 0 7px 20px; padding: 7px 0 7px 20px;
line-height: normal; line-height: normal;
font-size: 12px; font-size: 12px;
color: #909399; } color: #909399;
}
.horizontal-collapse-transition .el-submenu__title .el-submenu__icon-arrow { .horizontal-collapse-transition .el-submenu__title .el-submenu__icon-arrow {
-webkit-transition: .2s; -webkit-transition: 0.2s;
transition: .2s; transition: 0.2s;
opacity: 0; } opacity: 0;
}
src/utils/axios.js
...@@ -20,7 +20,7 @@ const zImgPath = window.apiHostSetting.VUE_APP_ZIMG_URL ...@@ -20,7 +20,7 @@ const zImgPath = window.apiHostSetting.VUE_APP_ZIMG_URL
// 文件存储路径地址 // 文件存储路径地址
const filePath = getStaticPath() + 'upload/erp' const filePath = getStaticPath() + 'upload/erp'
const instance = axios.create({ const instance = axios.create({
baseURL: baseURL+'api/', baseURL: baseURL + 'api/',
timeout: 5 * 60 * 1000, timeout: 5 * 60 * 1000,
// headers: { // headers: {
// "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8", // "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
...@@ -43,12 +43,15 @@ instance.interceptors.request.use( ...@@ -43,12 +43,15 @@ instance.interceptors.request.use(
} }
config.data = data config.data = data
} }
if (HTTPNUM === 0) { // 如果配置了 skipLoading，跳过全局 loading
loading = Vue.prototype.$loading({ if (!config.skipLoading) {
background: 'rgba(0, 0, 0, 0.3)', if (HTTPNUM === 0) {
}) loading = Vue.prototype.$loading({
background: 'rgba(0, 0, 0, 0.3)',
})
}
HTTPNUM++
} }
HTTPNUM++
cancelToken.add(config) cancelToken.add(config)
return config return config
}, },
...@@ -62,9 +65,12 @@ instance.interceptors.request.use( ...@@ -62,9 +65,12 @@ instance.interceptors.request.use(
instance.interceptors.response.use( instance.interceptors.response.use(
(res) => { (res) => {
cancelToken.remove(res.config) cancelToken.remove(res.config)
HTTPNUM-- // 如果配置了 skipLoading，跳过全局 loading 的关闭
if (HTTPNUM === 0) { if (!res.config.skipLoading) {
loading.close() HTTPNUM--
if (HTTPNUM === 0) {
loading.close()
}
} }
if (res.status === 200) { if (res.status === 200) {
if (res.data.code === 401) { if (res.data.code === 401) {
...@@ -144,22 +150,25 @@ instance.interceptors.response.use( ...@@ -144,22 +150,25 @@ instance.interceptors.response.use(
// 服务器状态码不是200的情况 // 服务器状态码不是200的情况
(error) => { (error) => {
cancelToken.clear() cancelToken.clear()
HTTPNUM-- // 如果配置了 skipLoading，跳过全局 loading 的关闭和错误提示
if (HTTPNUM == 0) { if (!error.config || !error.config.skipLoading) {
Vue.prototype.$alert(error.message, 'Error', { HTTPNUM--
confirmButtonText: '确定', if (HTTPNUM == 0) {
callback: () => {}, Vue.prototype.$alert(error.message, 'Error', {
}) confirmButtonText: '确定',
loading.close() callback: () => {},
})
loading.close()
}
} }
return Promise.reject(error) return Promise.reject(error)
} }
) )
function get(url, params) { function get(url, params, config = {}) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
instance instance
.get(url, { params }) .get(url, { params, ...config })
.then((res) => { .then((res) => {
if (res.status === 200 && res.data) { if (res.status === 200 && res.data) {
resolve(res.data) resolve(res.data)
......
src/views/aboutus/aboutPage.vue
...@@ -2,133 +2,190 @@ ...@@ -2,133 +2,190 @@
<div class="about-us"> <div class="about-us">
<div class="banner-container"> <div class="banner-container">
<div <div
class="content-container flex lg:flex-row flex-col items-center gap-10 lg:gap-20 w-full-70 w-full-90 mx-auto py-10"> class="flex justify-between lg:flex-row flex-col items-center h-96 w-full-70 w-full-90 mx-auto pt-5 overflow-hidden">
<div class="left-content"> <div class="left-content">
<h3 <h3
class="banner-title font-semibold text-2xl lg:text-4xl text-center lg:text-left"> class="banner-title font-semibold text-2xl lg:text-5xl text-center lg:text-left">
跨境电商 用九猫ERP 跨境电商 用九猫ERP
</h3> </h3>
<div <div
class="text-sm px-8 text-center lg:text-left lg:text-lg lg:px-0 font-light text-textContent mb-8"> class="text-sm px-8 text-center lg:text-left lg:text-xl lg:px-0 text-textContent mt-10">
<span>以一站式跨境电商运营管理系统，助力卖家轻松实现业务增长</span> <span>以一站式跨境电商运营管理系统，助力卖家轻松实现业务增长</span>
</div> </div>
</div> </div>
<div class="map-container mt-5">
<div class="right-image"> <img src="../../assets/images/about/world.png" alt="world" />
</div>
</div>
</div>
<div class="w-3/4 flex flex-col m-auto mt-20">
<h2 class="text-center mt-10">品牌介绍</h2>
<div class="flex w-full justify-between gap-10">
<div
data-aos="fade-right"
class="w-3/4 flex-col items-center h-full lg:items-start">
<div
class="text-textTitle text-sm font-light lg:text-lg mt-4 lg:mt-8 lg:leading-7 lg:mt-7">
九猫（西安）科技有限公司成立于2022年，致力于为企业出海提供降本提效的全域数智化一站式管理解决方案
</div>
<div
class="mt-3 text-sm font-light text-textTitle lg:text-lg lg:mt-5 lg:leading-7">
<p class="mt-5">
九猫科技核心团队拥有超过7年的跨境电商ERP开发经验，设计及开发过的项目覆盖产品管理系统，订单管理系统，供应链系统，供应商系统，生产管理系统，仓库管理系统，营销系统，OA系统等等。
</p>
<p class="mt-5">
2022年开始转型并专注于DTC独立站平台的产品与服务，自主研发并推出“九猫ERP软件“。
大数据集成商家平台、营销、供应链、仓储物流、财务、报表等模块，纵向打通资源，横向综合业务，全方位深度赋能。
九猫人始终秉承着“顾客至上”的经营理念，以“保障用户数据安全、关心客户使用体验、促进产品不断创新”为己任，意在帮助更多的跨境电商企业实现精细化管理和数字化建设。
</p>
</div>
</div>
<div class="video-container w-1/2">
<video <video
width="100%" class="video flex justify-center items-center"
class="video" src="../../assets/video/abount-jomalls2-video.mp4"
src="../../assets/video/about-us-video.mp4" controls></video>
autoplay
loop
muted></video>
</div> </div>
</div> </div>
</div> </div>
<div class="about-section about-lx px-4 lg:px-0 lg:mt-28"> <div class="w-4/5 flex flex-col m-auto mt-20">
<div <h2 class="text-center">企业文化</h2>
class="about-content w-full-70 w-full-90 mx-auto flex flex-col justify-between items-center"> <div class="flex justify-center flex-wrap mt-10 gap-20 cursor-default">
<div <div
class="w-full flex flex-col items-center gap-16 lg:gap-32 lg:flex-row lg:justify-between"> class="culture-pic1 bg-center bg-cover w-80 h-56 overflow-hidden p-5 relative flex items-center justify-center">
<div <div
data-aos="fade-right" class="text-gray-200 text-2xl font-semibold absolute top-5 left-5">
class="w-full flex-col items-center h-full lg:w-137.5 lg:items-start"> 使命
<div </div>
class="text-textTitle text-2xl text-center font-medium lg:text-4xl lg:text-left"> <div class="text-gray-100 text-base text-center">
关于九猫 让全球生意更高效
</div>
<div
class="text-textTitle text-sm font-light lg:text-lg mt-4 lg:mt-8 lg:leading-7 lg:mt-7">
九猫（西安）科技有限公司成立于2022年，致力于为企业出海提供降本提效的全域数智化一站式管理解决方案
</div>
<div
class="mt-3 text-sm font-light text-textTitle lg:text-lg lg:mt-5 lg:leading-7">
<p class="mt-5">
九猫科技核心团队拥有超过7年的跨境电商ERP开发经验，设计及开发过的项目覆盖产品管理系统，订单管理系统，供应链系统，供应商系统，生产管理系统，仓库管理系统，营销系统，OA系统等等。
</p>
<p class="mt-5">
2022年开始转型并专注于DTC独立站平台的产品与服务，自主研发并推出“九猫ERP软件“。
大数据集成商家平台、营销、供应链、仓储物流、财务、报表等模块，纵向打通资源，横向综合业务，全方位深度赋能。
九猫人始终秉承着“顾客至上”的经营理念，以“保障用户数据安全、关心客户使用体验、促进产品不断创新”为己任，意在帮助更多的跨境电商企业实现精细化管理和数字化建设。
</p>
</div>
</div> </div>
<img
width="452px"
src="https://static.distributetop.com/office-site-new/office-site-resource/image/0e0f127374698f8a97694c65650aac91.jpg"
data-aos="fade-left"
class="mt-8 !h-395px lg:mt-0" />
</div> </div>
<div class="flex justify-between w-full mt-8 lg:mt-24"> <div
<div class="flex-col flex h-20 border-colorIcon lg:w-full"> class="culture-pic2 bg-center bg-cover w-80 h-56 overflow-hidden p-5 relative flex items-center justify-center">
<div <div
class="flex text-xl lg:text-5xl !lg:leading-10 text-blue-600 justify-start"> class="text-gray-200 text-2xl font-semibold absolute top-5 left-5">
TOP 1 愿景
</div>
<div
class="flex text-sm lg:text-xl text-textContent mt-0.5 justify-start">
行业市占率第一
</div>
</div> </div>
<div class="flex-col flex h-20 border-colorIcon lg:w-full border-l-2"> <div class="text-gray-100 text-base text-center">
<div 成为全球最大的电商IT服务公司
class="flex text-xl lg:text-5xl !lg:leading-10 text-blue-600 justify-center">
600000+
</div>
<div
class="flex text-sm lg:text-xl text-textContent mt-0.5 justify-center">
跨境企业的一致选择
</div>
</div> </div>
<div class="flex-col flex h-20 border-colorIcon lg:w-full border-l-2"> </div>
<div <div
class="flex text-xl lg:text-5xl !lg:leading-10 text-blue-600 justify-center"> class="culture-pic3 bg-center bg-cover w-80 h-56 overflow-hidden p-5 relative flex items-center justify-center">
20+ <div
</div> class="text-gray-200 text-2xl font-semibold absolute top-5 left-5">
<div 价值观
class="flex text-sm lg:text-xl text-textContent mt-0.5 justify-center">
服务中心
</div>
</div> </div>
<div class="flex-col flex h-20 border-colorIcon lg:w-full border-l-2"> <div class="text-gray-100 text-base text-center">
<div 客户第一、诚实正直
class="flex text-xl lg:text-5xl !lg:leading-10 text-blue-600 justify-center"> <br />
100+ 艰苦奋斗、敢于批评
</div> <br />
<div 团队合作、拥抱变化
class="flex text-sm lg:text-xl text-textContent mt-0.5 justify-center">
服务上市/IPO阶段企业
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="footer-bg mt-14 lg:mt-28"> <div class="bg-colorBg w-full flex flex-col m-auto mt-20 py-10">
<div class="footer-banner"> <h2 class="text-center">发展历程</h2>
<div class="footer-title">选择九猫，全面提升跨境业务效益！</div> <timeline />
<div class="footer-description">
已有60万+跨境卖家选择九猫ERP，实现业务高效增长
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import Timeline from './timeline.vue'
export default { export default {
name: 'aboutUs', name: 'aboutUs',
components: {
Timeline,
},
} }
</script> </script>
<style scoped> <style scoped lang="scss">
.left-content { .banner-container {
width: 30%; background-color: var(--background-color);
display: flex; .banner-title {
flex-direction: column; color: var(--primary-color);
gap: 20px; }
} }
.right-image {
width: 70%; .map-container {
width: 55%;
position: relative; position: relative;
height: 100%; img {
filter: grayscale(100%) hue-rotate(10deg) saturate(800%) brightness(110%);
width: 100%;
height: auto;
}
}
h2 {
color: var(--secondary-text-color);
font-size: 36px;
font-weight: 700;
cursor: default;
margin: 0 auto 40px;
position: relative;
padding-bottom: 10px;
display: inline-block;
width: fit-content;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
background-image: linear-gradient(
to right,
#ffffff00,
var(--secondary-color-light6),
var(--secondary-color-dark2),
var(--secondary-color-light6),
#ffffff00
);
}
}
$culture-pics: (
1: '03.jpg',
2: '05.jpg',
3: '02.jpg',
);
@each $num, $img in $culture-pics {
.culture-pic#{$num} {
position: relative;
overflow: hidden;
&::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
url('../../assets/images/about/#{$img}');
background-size: cover;
background-position: center;
transition: transform 0.3s ease;
z-index: 0;
}
&:hover::before {
transform: scale(1.05);
}
> * {
z-index: 1;
}
}
}
.video-container {
.video { .video {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -140,68 +197,12 @@ export default { ...@@ -140,68 +197,12 @@ export default {
border-right: 2px solid rgba(214, 222, 240, 1); border-right: 2px solid rgba(214, 222, 240, 1);
} }
} }
.footer-bg {
background: linear-gradient(180deg, #2554fe, #3572ff);
}
.footer-banner {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 80px 15px;
background-image: url(../../assets/images/home/06.png);
background-position-y: bottom;
background-repeat: no-repeat;
background-size: 100% 90px;
.footer-title {
font-weight: 500;
font-size: 36px;
margin-bottom: 20px;
max-width: 70vw;
text-align: center;
color: rgba(255, 255, 255, 1);
letter-spacing: 2px;
}
.footer-description {
font-weight: 300;
font-size: 18px;
margin-top: 8px;
margin-bottom: 40px;
color: rgba(255, 255, 255, 1);
}
}
@media (max-width: 1100px) { @media (max-width: 1100px) {
.left-content {
width: 100%;
gap: 8px;
}
.right-image {
width: 100%;
}
.border-colorIcon { .border-colorIcon {
&:not(:last-child) { &:not(:last-child) {
border-right: none; border-right: none;
} }
} }
.footer-banner {
padding: 40px 10px;
.footer-title {
font-size: 18px;
margin-bottom: 10px;
max-width: 90vw;
text-align: center;
color: rgba(255, 255, 255, 1);
}
.footer-description {
font-weight: 300;
font-size: 12px;
margin-top: 8px;
margin-bottom: 20px;
color: rgba(255, 255, 255, 1);
}
}
} }
</style> </style>
src/views/aboutus/timeline.vue 0 → 100644
<template>
<div class="w-full">
<div class="flex justify-center items-center mb-14">
<div v-for="(item, index) in timelineItems" :key="index">
<div class="flex items-center">
<div
class="timeline-dot rounded-full cursor-pointer transition-all duration-200"
@click="selectTime(index)"
:class="{ 'timeline-dot-current': currentIndex === index }"></div>
<div
v-if="index !== timelineItems.length - 1"
class="timeline-line w-64 h-px"></div>
</div>
<div class="-ml-3 mt-2 text-gray-600 font-semibold text-base">
{{ item.title }}
</div>
</div>
</div>
<div class="timeline-cards-container" ref="cardsContainer">
<div
class="timeline-cards-wrapper"
:style="{ transform: `translateX(${translateX}px)` }">
<div
v-for="(item, index) in timelineItems"
:key="index"
class="timeline-card-item"
ref="cardItems">
<div
class="timeline-card p-10 h-80 w-104 shadow-xl rounded-lg cursor-pointer"
:class="{ 'timeline-card-current': currentIndex === index }"
@click="selectTime(index)">
<div class="w-full text-gray-600 font-semibold text-2xl">
{{ item.title }}
</div>
<div class="bg-gray-200 mt-3 h-px" />
<el-timeline class="mt-5">
<el-timeline-item
v-for="(content, index) in item.content"
:key="index"
color="var(--el-color-primary-light-3)">
{{ content }}
</el-timeline-item>
</el-timeline>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
timelineItems: [
{
title: '2022年',
content: [],
},
{
title: '2023年',
content: [],
},
{
title: '2024年',
content: [],
},
{
title: '2025年',
content: [],
},
],
currentIndex: 0,
translateX: 0,
cardGap: 80, // gap-20 = 5rem = 80px
}
},
methods: {
selectTime(index) {
this.currentIndex = index
this.centerCard(index)
},
beforeChange(oldindex, index) {
this.currentIndex = index
this.centerCard(index)
},
centerCard(index) {
this.$nextTick(() => {
if (!this.$refs.cardsContainer || !this.$refs.cardItems) {
return
}
const container = this.$refs.cardsContainer
const containerWidth = container.offsetWidth
const cardItems = this.$refs.cardItems
if (!cardItems || cardItems.length === 0) {
return
}
// 获取第一个卡片的宽度（所有卡片宽度相同）
const cardWidth = cardItems[0].offsetWidth
const cardGap = this.cardGap
// 计算目标卡片的位置
// 每个卡片的位置 = index * (cardWidth + cardGap)
const targetCardLeft = index * (cardWidth + cardGap)
// 计算需要移动的距离，使目标卡片居中
// 容器中心位置 = containerWidth / 2
// 目标卡片中心位置 = targetCardLeft + cardWidth / 2
// translateX = 容器中心 - 目标卡片中心
const containerCenter = containerWidth / 2
const targetCardCenter = targetCardLeft + cardWidth / 2
this.translateX = containerCenter - targetCardCenter
})
},
},
created() {
this.currentIndex = this.timelineItems.length - 1
},
mounted() {
// 初始化时居中显示当前卡片
this.centerCard(this.currentIndex)
// 监听窗口大小变化，重新计算位置
this.handleResize = () => {
this.centerCard(this.currentIndex)
}
window.addEventListener('resize', this.handleResize)
},
beforeDestroy() {
// 清理事件监听器
if (this.handleResize) {
window.removeEventListener('resize', this.handleResize)
}
},
watch: {
currentIndex(newIndex) {
this.centerCard(newIndex)
},
},
}
</script>
<style scoped lang="scss">
.timeline-dot {
width: 20px;
height: 20px;
background-color: #eca1177a;
transition: all 0.2s ease;
}
.timeline-dot:hover {
background-color: var(--primary-color);
transition: all 0.2s ease;
}
.timeline-dot-current {
border: 5px solid var(--el-color-primary-light-7);
background-color: var(--primary-color);
}
.timeline-line {
background-color: var(--light-color);
}
.timeline-cards-container {
width: 100%;
overflow-x: hidden;
overflow-y: visible;
position: relative;
padding: 10px 0 50px 0;
}
.timeline-cards-wrapper {
display: flex;
justify-content: flex-start;
align-items: center;
transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
will-change: transform;
}
.timeline-card-item {
flex-shrink: 0;
margin-right: 80px; // gap-20 = 5rem = 80px
&:last-child {
margin-right: 0;
}
}
.timeline-card {
border: 1px solid transparent;
background-image: linear-gradient(
to bottom,
#ffffff 50%,
#ffffff 80%,
rgba(255, 255, 255, 0) 100%
),
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='18' viewBox='0 0 100 18'%3E%3Cpath fill='%23e3ba6d' fill-opacity='0.25' d='M61.82 18c3.47-1.45 6.86-3.78 11.3-7.34C78 6.76 80.34 5.1 83.87 3.42 88.56 1.16 93.75 0 100 0v6.16C98.76 6.05 97.43 6 96 6c-9.59 0-14.23 2.23-23.13 9.34-1.28 1.03-2.39 1.9-3.4 2.66h-7.65zm-23.64 0H22.52c-1-.76-2.1-1.63-3.4-2.66C11.57 9.3 7.08 6.78 0 6.16V0c6.25 0 11.44 1.16 16.14 3.42 3.53 1.7 5.87 3.35 10.73 7.24 4.45 3.56 7.84 5.9 11.31 7.34zM61.82 0h7.66a39.57 39.57 0 0 1-7.34 4.58C57.44 6.84 52.25 8 46 8S34.56 6.84 29.86 4.58A39.57 39.57 0 0 1 22.52 0h15.66C41.65 1.44 45.21 2 50 2c4.8 0 8.35-.56 11.82-2z'%3E%3C/path%3E%3C/svg%3E");
background-repeat: repeat;
transition: transform 0.2s ease, opacity 0.2s ease, border-color 0.2s ease;
&:hover {
transform: scale(1.05);
}
}
.timeline-card-current {
transform: scale(1.05);
border-color: rgba(153, 151, 148, 0.548);
}
::v-deep .el-timeline-item__tail {
border-left: 1px solid var(--el-color-primary-light-5) !important;
}
</style>
src/views/case/casePage.vue
...@@ -73,6 +73,7 @@ ...@@ -73,6 +73,7 @@
<div class="footer-bg"> <div class="footer-bg">
<div class="footer-banner"> <div class="footer-banner">
<div class="footer-title">与众多优秀企业共同选择，实现业绩高效增长</div> <div class="footer-title">与众多优秀企业共同选择，实现业绩高效增长</div>
<button class="footer-register-btn" @click="goToLogin">立即使用</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -80,6 +81,9 @@ ...@@ -80,6 +81,9 @@
<script> <script>
export default { export default {
name: 'casePage', name: 'casePage',
inject: {
scrollParent: 'scrollParent',
},
data() { data() {
return { return {
swiperCaseList: [ swiperCaseList: [
...@@ -148,6 +152,19 @@ export default { ...@@ -148,6 +152,19 @@ export default {
], ],
} }
}, },
methods: {
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
},
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -211,7 +228,7 @@ export default { ...@@ -211,7 +228,7 @@ export default {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 80px 15px; padding: 60px 15px;
background-image: url(../../assets/images/home/06.png); background-image: url(../../assets/images/home/06.png);
background-position-y: bottom; background-position-y: bottom;
background-repeat: no-repeat; background-repeat: no-repeat;
...@@ -234,6 +251,23 @@ export default { ...@@ -234,6 +251,23 @@ export default {
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
} }
} }
.footer-register-btn {
width: 200px;
height: 60px;
display: block;
background: rgba(59, 130, 246, 0.5);
border-radius: 10px;
border: 1px solid #ffffffd8;
font-size: 18px;
color: #e9e9e9;
cursor: pointer;
transition: all 0.3s ease;
}
.footer-register-btn:hover {
background: rgba(255, 255, 255);
color: rgba(59, 130, 246);
}
@media (max-width: 1100px) { @media (max-width: 1100px) {
.footer-banner { .footer-banner {
padding: 40px 10px; padding: 40px 10px;
......
src/views/contact.vue
<template> <template>
<div class="login_bg"> <div class="login_bg flex flex-col w-full h-full">
<div class="contact-header"> <div
class="contact-header px-5 lg:px-10 h-16 flex items-center justify-between">
<div class="header-image"> <div class="header-image">
<img src="../assets/logo.png" style="height: 40px" /> <img src="../assets/logo.png" style="height: 40px" />
</div> </div>
<div class="user-info"> <div class="user-info mt-2 flex items-center">
<!-- <div class="user-msg"> <el-popconfirm title="确定退出登录吗？" @confirm="logout">
<span class="user-name">{{ '小溪' }}</span> <div class="logout" title="退出登录" slot="reference">
<span>欢迎您</span> <img src="../assets/images/logout.svg" style="width: 20px" />
</div> --> </div>
<div class="logout" title="退出登录" @click="logout"> </el-popconfirm>
<img src="../assets/images/logout.png" />
</div>
</div> </div>
</div> </div>
<div class="login_content"> <div class="login_content">
<div class="no-authority"> <div class="no-authority absolute top-1/4 lg:top-1/3 lg:left-1/3">
<div style="display: flex; align-items: flex-end"> <div>
<div <div
v-if="userInfo && userInfo.erpKey"
class="text-center text-white"
style=" style="
text-align: center;
color: #fff;
font-size: 50px; font-size: 50px;
line-height: 100px; line-height: 100px;
font-family: '微软雅黑'; font-family: '微软雅黑';
" ">
v-if="userInfo && userInfo.erpKey">
<a <a
:href="`https://${userInfo && userInfo.erpKey}.jomalls.com`" :href="`https://${userInfo && userInfo.erpKey}.jomalls.com`"
target="_blank" target="_blank"
...@@ -34,15 +32,10 @@ ...@@ -34,15 +32,10 @@
</a> </a>
</div> </div>
<h1 <h1
style=" v-else
text-align: center; class="text-center text-white text-2xl lg:text-5xl font-medium tracking-wide"
color: #fff; style="font-family: '微软雅黑'">
font-size: 50px; 您尚未开通erp权限，请联系您的商务经理
line-height: 100px;
font-family: '微软雅黑';
"
v-else>
您尚未开通erp权限,请联系您的商务经理
</h1> </h1>
<!-- <b--> <!-- <b-->
<!-- @click="handleBind"--> <!-- @click="handleBind"-->
...@@ -57,26 +50,17 @@ ...@@ -57,26 +50,17 @@
<!-- </b>--> <!-- </b>-->
</div> </div>
<h2 <h2
style=" class="text-center text-white text-xl lg:text-4xl mt-10"
text-align: center; style="font-family: '微软雅黑'">
color: #fff; 联系电话：
font-size: 36px; <span @click="copy('18103641690')">18103641690</span>
line-height: 100px;
font-family: '微软雅黑';
">
联系电话:18103641690
</h2> </h2>
<h2 <h2
style=" class="text-center text-white text-xl lg:text-4xl mt-5"
text-align: center; style="font-family: '微软雅黑'">
color: #fff; 邮箱：mia@jomalls.com
font-size: 36px;
line-height: 50px;
font-family: '微软雅黑';
">
邮箱:mia@jomalls.com
</h2> </h2>
<div style="display:flex;justify-content: center"> <div style="display: flex; justify-content: center">
<el-button <el-button
style=" style="
text-align: center; text-align: center;
...@@ -91,7 +75,7 @@ ...@@ -91,7 +75,7 @@
返回首页 返回首页
</el-button> </el-button>
<el-button <el-button
:style="{width:userInfo && userInfo.erpKey?'180':''}" :style="{ width: userInfo && userInfo.erpKey ? '180' : '' }"
style=" style="
text-align: center; text-align: center;
font-size: 30px; font-size: 30px;
...@@ -210,43 +194,51 @@ export default { ...@@ -210,43 +194,51 @@ export default {
logout() { logout() {
localStorage.removeItem('userInfo') localStorage.removeItem('userInfo')
this.setUserInfo(undefined) this.setUserInfo(undefined)
this.$router.push('/login') this.$router.push('/home')
// 刷新页面
window.location.reload()
},
async copy(text) {
try {
// 优先使用 Clipboard API（现代浏览器）
await navigator.clipboard.writeText(text)
} catch (err) {
// 降级方案：使用 document.execCommand
const textarea = document.createElement('textarea')
textarea.value = text
document.body.appendChild(textarea)
textarea.focus()
textarea.select()
document.execCommand('copy')
document.body.removeChild(textarea)
} finally {
this.$message.success('复制成功')
}
}, },
}, },
} }
</script> </script>
<style scoped> <style scoped>
.login_bg {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
.login_content { .login_content {
flex: 1; flex: 1;
background: url(../assets/contact.jpg) center / cover no-repeat; background: url(../assets/contact.jpg) center / cover no-repeat;
position: relative; position: relative;
} }
@media (max-width: 1100px) {
.login_content {
background-image: linear-gradient(to top right, #464646, #bbbbbb);
}
}
.contact-header { .contact-header {
display: flex;
align-items: center;
background-color: #182633; background-color: #182633;
height: 60px;
padding: 0 100px;
justify-content: space-between;
} }
.user-msg { .user-msg {
color: #fff; color: #fff;
} }
.user-info {
display: flex;
align-items: center;
}
.logout img { .logout img {
width: 20px; width: 20px;
vertical-align: middle; vertical-align: middle;
...@@ -261,13 +253,6 @@ export default { ...@@ -261,13 +253,6 @@ export default {
margin-right: 10px; margin-right: 10px;
} }
.no-authority {
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 40%;
}
.contain { .contain {
flex: 1; flex: 1;
} }
......
src/views/help/components/bread.vue 0 → 100644
<template>
<div>
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item
v-for="(item, index) in breadList"
:key="item.path"
@click.native="handleBreadClick(index)">
<a href="javascript:void(0)">{{ item.name }}</a>
</el-breadcrumb-item>
</el-breadcrumb>
</div>
</template>
<script>
export default {
name: 'Bread',
computed: {
breadList() {
// currentPathNames 已经包含了帮助中心作为第一项
return this.$store.getters['path/currentPathNames'] || []
},
},
methods: {
handleBreadClick(index) {
// 当点击面包屑时，更新路径列表
const currentPathNames = this.breadList
if (index >= 0 && index < currentPathNames.length) {
const clickedItem = currentPathNames[index]
const newPathNames = currentPathNames.slice(0, index + 1)
this.$store.dispatch('path/setCurrentPathNames', newPathNames)
this.$router.push(`/help/${clickedItem.path}`)
}
},
},
}
</script>
src/views/help/components/homeGuides.vue 0 → 100644
<template>
<div>
<div
v-for="(tab, tabIndex) in tabs"
:key="tabIndex"
class="rounded-md bg-white p-5 mb-10">
<div class="title flex place-content-between mb-5">
<div class="title-left flex items-center">
<img class="h-8" :src="Logo" alt="logo" />
<div class="text-lg font-bold ml-3">{{ tab.title }}</div>
</div>
<div
class="more flex justify-center items-center"
@click="goToMore(tab)">
<div class="text-sm">查看更多</div>
<i class="el-icon-d-arrow-right"></i>
</div>
</div>
<div class="tabs flex gap-5">
<div
class="tab flex justify-center items-center text-gray-700 font-medium text-sm cursor-pointer"
v-for="(sub, index) in tab.content"
@click="setCurrentTab(tabIndex, index)"
:key="sub.key"
:class="{ active: getCurrentTab(tabIndex) === index }">
{{ sub.subtitle }}
</div>
</div>
<div class="tab-content grid grid-cols-3 gap-x-10 gap-y-8 mt-5">
<div
v-for="c in tab.content[getCurrentTab(tabIndex)].articles"
:key="c.article">
<a
@click.prevent="goToArticle(c)"
class="content-title text-gray-500 ml-8 cursor-pointer">
{{ c.article }}
</a>
</div>
</div>
</div>
</div>
</template>
<script>
import Logo from '../../../assets/jomall.png'
export default {
name: 'HomeGuides',
data() {
return {
Logo,
tabs: [
{
title: '入门必看',
url: 'beginner',
content: [
{
subtitle: '新手入门',
key: 'beginner',
articles: [
{
article: '九猫erp是什么?',
url: '/help/artical1',
},
{
article: '如何使用九猫erp?',
url: '/help/artical2',
},
],
},
],
},
],
currentTabs: {}, // 为每个tab组维护独立的currentTab
}
},
methods: {
setCurrentTab(tabIndex, index) {
this.$set(this.currentTabs, tabIndex, index)
},
getCurrentTab(tabIndex) {
return this.currentTabs[tabIndex] || 0
},
goToArticle(content) {
const articlePath = content.url.replace('/help/', '')
const breadcrumbPath = [
{ name: '帮助中心', path: 'index' },
{ name: '入门必看', path: 'beginner' },
{ name: content.article, path: articlePath },
]
this.$store.dispatch('path/setCurrentPathNames', breadcrumbPath)
this.$router.push(content.url)
},
goToMore(tab) {
const breadcrumbPath = [
{ name: '帮助中心', path: 'index' },
{ name: tab.title, path: tab.url },
]
this.$store.dispatch('path/setCurrentPathNames', breadcrumbPath)
this.$router.push(`/help/${tab.url}`)
},
},
}
</script>
<style scoped lang="scss">
.more {
color: var(--primary-color);
font-size: 14px;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
&:hover {
color: var(--light-color);
}
}
.tab {
width: 100px;
height: 40px;
border-radius: 60px;
background-color: var(--el-color-primary-light-9);
transition: all 0.2s ease;
&.active {
background-color: var(--el-color-primary-light-2);
color: white;
font-weight: 600;
}
&:hover:not(.active) {
color: var(--primary-color);
}
}
.content-title {
position: relative;
transition: all 0.2s ease;
&::before {
content: '';
display: block;
width: 6px;
height: 6px;
border-radius: 50%;
position: absolute;
left: -23px;
top: 8px;
background-color: var(--primary-color);
box-shadow: 0 0 0 5px #e6c07977;
}
&:hover {
color: var(--primary-color);
}
}
</style>
src/views/help/helpPage.vue 0 → 100644
<template>
<div>
<div class="top flex flex-col items-center py-16">
<div class="text-gray-700 text-4xl font-bold">帮助中心</div>
<el-input
v-model="keyword"
class="w-1/3 mt-5 search-input"
placeholder="请输入关键词查询..."
@keyup.enter.native="search">
<el-button slot="append" icon="el-icon-search" @click="search" />
</el-input>
</div>
<div class="content p-5">
<sideNav />
<div
class="right-content w-full h-full p-5"
:class="{ 'rounded-md bg-white': $route.path !== '/help/index' }">
<Bread v-if="$route.path !== '/help/index'" />
<router-view></router-view>
</div>
</div>
</div>
</template>
<script>
import sideNav from './sideNav.vue'
import Bread from './components/bread.vue'
export default {
name: 'helpPage',
components: {
sideNav,
Bread,
},
data() {
return {
keyword: '',
}
},
methods: {
search() {
console.log(this.keyword)
},
},
}
</script>
<style scoped lang="scss">
::v-deep .search-input .el-input__inner {
background-color: #ffffff;
height: 45px;
line-height: 48px;
font-size: 15px;
}
::v-deep .el-input--mini {
font-size: 25px;
cursor: pointer;
color: #fff;
}
::v-deep .el-input-group__append {
color: #eceaea;
background-color: var(--secondary-color);
border: none;
transition: all 0.2s ease;
&:hover {
background-color: var(--secondary-color-light2);
}
}
.content {
width: 100%;
height: 100%;
display: flex;
background-color: var(--background-color);
}
</style>
src/views/help/pages/Beginner/artical1.vue 0 → 100644
<template>
<div>
<h2 class="text-xl font-bold my-10">{{ title }}</h2>
<div class="content">
<p>
<strong>九猫erp</strong>
是一款专为电商卖家设计的智能管理工具，它集成了订单管理、库存管理、物流管理、财务管理等多种功能，帮助卖家实现高效运营。
</p>
<p>
<strong>九猫erp</strong>
支持多平台接入，包括淘宝、天猫、京东、拼多多等主流电商平台，卖家可以一键同步订单、库存、物流信息，实现跨平台管理。
</p>
</div>
</div>
</template>
<script>
export default {
name: 'Artical1',
data() {
return {
title: '九猫erp是什么?',
}
},
created() {},
}
</script>
<style scoped lang="scss">
.artical1 {
width: 100%;
height: 100%;
}
</style>
src/views/help/pages/Beginner/artical2.vue 0 → 100644
<template>
<div>
<h2 class="text-xl font-bold my-10">{{ title }}</h2>
<div class="content">
<p>
<strong>九猫erp</strong>
是一款专为电商卖家设计的智能管理工具，它集成了订单管理、库存管理、物流管理、财务管理等多种功能，帮助卖家实现高效运营。
</p>
<p>
<strong>九猫erp</strong>
支持多平台接入，包括淘宝、天猫、京东、拼多多等主流电商平台，卖家可以一键同步订单、库存、物流信息，实现跨平台管理。
</p>
</div>
</div>
</template>
<script>
export default {
name: 'Artical2',
data() {
return {
title: '如何使用九猫erp?',
}
},
created() {},
}
</script>
<style scoped lang="scss">
.artical1 {
width: 100%;
height: 100%;
}
</style>
src/views/help/pages/Beginner/beginner.vue 0 → 100644
<template>
<div class="w-full h-full bg-white rounded-md">
<div class="text-xl font-bold my-10">{{ title }}</div>
<div class="content">
<a
v-for="(t, index) in titles"
:key="t"
class="content-title text-gray-600 ml-8 block mb-3 pb-3 border-b border-gray-200"
@click="goArtical(t, index)"
:href="`/help/artical${index + 1}`">
{{ t }}
</a>
</div>
</div>
</template>
<script>
export default {
components: {},
data() {
return {
title: '',
titles: [],
}
},
created() {
const currentPathNames = this.$store.getters['path/currentPathNames']
this.title = currentPathNames[currentPathNames.length - 1].name
try {
const ctx = require.context('./', false, /\.vue$/)
ctx.keys().forEach((key) => {
if (/beginner\.vue$/i.test(key)) return
const mod = ctx(key)
const comp = mod && (mod.default || mod)
if (comp && typeof comp.data === 'function') {
const dataObj = comp.data.call({}) || {}
if (dataObj.title) {
this.titles.push(dataObj.title)
}
}
})
} catch (e) {
// ignore
}
},
methods: {
goArtical(title, index) {
// 调用 vuex action 添加文章路径
this.$store.dispatch('path/addArticlePath', { title, index })
},
},
}
</script>
<style scoped lang="scss">
.content-title {
position: relative;
transition: all 0.2s ease;
&::before {
content: '';
display: block;
width: 6px;
height: 6px;
border-radius: 50%;
position: absolute;
left: -23px;
top: 10px;
background-color: var(--primary-color);
box-shadow: 0 0 0 5px #e6c07977;
}
&:hover {
color: var(--primary-color);
}
}
</style>
src/views/help/pages/index.vue 0 → 100644
<template>
<div class="flex flex-col w-full">
<HomeGuides />
</div>
</template>
<script>
import HomeGuides from '../components/homeGuides.vue'
export default {
components: {
HomeGuides,
},
}
</script>
src/views/help/sideNav.vue 0 → 100644
<template>
<div class="side-nav mr-5 rounded-md">
<el-input
class="mt-3 ml-5 w-4/5 mb-5"
v-model="searchKeyword"
placeholder="在目录中搜索..."></el-input>
<el-menu
@select="handleSelect"
:unique-opened="true"
:default-active="activeMenu">
<span v-for="item in menuList" :key="item.path">
<el-submenu
v-if="item.children && item.children.length > 0"
:index="item.path">
<template slot="title">
<span>{{ item.name }}</span>
</template>
<el-menu-item
v-for="child in item.children"
:key="child.path"
:index="child.path">
<span>{{ child.name }}</span>
</el-menu-item>
</el-submenu>
<el-menu-item v-else :key="item.path" :index="item.path">
<span>{{ item.name }}</span>
</el-menu-item>
</span>
</el-menu>
</div>
</template>
<script>
export default {
name: 'sideNav',
data() {
return {
searchKeyword: '',
activeMenu: '',
menuList: [
{
id: 1,
path: 'mustSee',
name: '入门必看',
children: [{ id: 11, path: 'beginner', name: '新手入门' }],
},
{
id: 2,
path: 'pic',
name: '图文教程',
children: [{ id: 21, path: 'base', name: '基础数据维护' }],
},
{ id: 3, path: 'video', name: '视频教程' },
// { id: 4, path: 'problem', name: '常见问题' },
// { id: 5, path: 'contact', name: '联系我们' },
],
}
},
mounted() {
this.syncMenuWithRoute()
},
watch: {
$route() {
this.syncMenuWithRoute()
},
},
methods: {
syncMenuWithRoute() {
const path = this.$route && this.$route.path ? this.$route.path : ''
const match = path.match(/^\/help\/([^/]+)/)
const currentKey = match ? match[1] : ''
this.activeMenu = currentKey
},
handleSelect(key, keyPath) {
if (key === this.activeMenu) return
const names = []
for (const item of this.menuList) {
if (item.path === keyPath[0]) {
names.push({ name: item.name, path: item.path })
if (keyPath[1] && Array.isArray(item.children)) {
for (const child of item.children) {
if (child.path === keyPath[1]) {
names.push({ name: child.name, path: child.path })
break
}
}
}
break
}
}
// 使用 vuex 保存路径名称
this.$store.dispatch('path/setCurrentPathNames', names)
const target = keyPath[1] || keyPath[0]
this.$router.push(`/help/${target}`)
},
},
}
</script>
<style scoped lang="scss">
.side-nav {
background-color: #ffffff;
height: 100%;
width: 13%;
}
::v-deep .el-input--mini .el-input__inner {
background-color: var(--background-color);
height: 30px;
font-size: 14px;
}
::v-deep .el-menu {
border-right: none;
}
</style>
src/views/home.vue
...@@ -74,8 +74,6 @@ export default { ...@@ -74,8 +74,6 @@ export default {
.jomalls-home-page .header { .jomalls-home-page .header {
transition: all 0.3s; transition: all 0.3s;
border: 1px solid #eee;
background: #fff;
height: 60px; height: 60px;
position: sticky; position: sticky;
top: 0; top: 0;
......
src/views/homePage/forgetPassword.vue 0 → 100644
<template>
<el-dialog
:visible.sync="dialogVisible"
title="忘记密码"
:width="$isMobile ? '100%' : '36%'"
:center="true"
:close-on-click-modal="false"
:close-on-press-escape="true"
@close="handleClose"
@opened="handleOpened"
class="forget-dialog">
<el-radio-group
v-model="labelPosition"
class="radioGroup flex justify-center items-center mb-5"
size="small">
<el-radio-button label="passwordLogin">邮箱找回</el-radio-button>
<el-radio-button label="verificationLogin">验证码找回</el-radio-button>
</el-radio-group>
<el-form
size="medium"
:model="forgetForm"
ref="forgetForm"
class="forget-form flex flex-col flex-1">
<el-form-item
v-if="labelPosition === 'passwordLogin'"
prop="email"
label=""
:rules="[{ required: true, message: '请输入邮箱地址', type: 'email' }]">
<el-input
v-model="forgetForm.email"
prefix-icon="el-icon-message"
placeholder="请输入邮箱"></el-input>
</el-form-item>
<el-form-item
v-if="labelPosition === 'passwordLogin'"
prop="code"
label=""
:rules="[{ required: true, message: '请输入邮箱验证码' }]">
<div class="flex gap-5">
<div class="flex-1">
<el-input
v-model="forgetForm.code"
prefix-icon="el-icon-chat-line-square"
placeholder="请输入邮箱验证码"></el-input>
</div>
<div>
<el-button
class="get-code-button"
:disabled="getCodeDisabled"
:class="getCodeDisabled ? 'disabled' : 'code-btn'"
@click="verCode">
{{ codeCountDown === 0 ? '获取验证码' : `${codeCountDown}秒` }}
</el-button>
</div>
</div>
</el-form-item>
<el-form-item
v-if="labelPosition === 'verificationLogin'"
prop="phone"
:rules="[{ required: true, message: '请输入手机号' }]">
<el-input
prefix-icon="el-icon-phone"
v-model="forgetForm.phone"
placeholder="请输入手机号"></el-input>
</el-form-item>
<el-form-item
v-if="labelPosition === 'verificationLogin'"
prop="verifyKey"
label=""
:rules="[{ required: true, message: '请输入验证码' }]">
<div class="flex gap-5 mb-0">
<div class="flex-1">
<el-input
v-model="forgetForm.verifyKey"
prefix-icon="el-icon-postcard"
placeholder="请输入验证码,区分大小写"></el-input>
</div>
<div class="cursor-pointer" @click="getVerifycode">
<img class="w-20 lg:w-28 h-full" :src="VerifyUrl" />
</div>
</div>
</el-form-item>
<el-form-item
v-if="labelPosition === 'verificationLogin'"
prop="code"
label=""
:rules="[{ required: true, message: '请输入短信验证码' }]">
<div class="flex gap-5">
<div class="flex-1">
<el-input
v-model="forgetForm.code"
prefix-icon="el-icon-chat-line-square"
placeholder="请输入短信验证码"></el-input>
</div>
<div>
<el-button
class="get-code-button"
:disabled="getCodeDisabled"
:class="getCodeDisabled ? 'disabled' : 'code-btn'"
@click="forgetPhonecode">
{{ codeCountDown === 0 ? '获取验证码' : `${codeCountDown}秒` }}
</el-button>
</div>
</div>
</el-form-item>
<el-form-item
prop="password"
:rules="[{ required: true, message: '请输入新密码' }]">
<el-input
v-model="forgetForm.password"
placeholder="请输入新密码"
:type="showNewPwd ? 'text' : 'password'"
prefix-icon="el-icon-lock">
<i
@click="showNewPwd = !showNewPwd"
slot="suffix"
:class="{ eyes: true, open: !showNewPwd, close: showNewPwd }"></i>
</el-input>
</el-form-item>
<el-form-item
prop="confirmNewPassword"
:rules="[{ validator: validatePass, trigger: 'blur' }]">
<el-input
v-model="forgetForm.confirmNewPassword"
placeholder="请再次输入新密码"
:type="showAgNewPwd ? 'text' : 'password'"
prefix-icon="el-icon-lock">
<i
@click="showAgNewPwd = !showAgNewPwd"
slot="suffix"
:class="{
eyes: true,
open: !showAgNewPwd,
close: showAgNewPwd,
}"></i>
</el-input>
</el-form-item>
<slot name="footer">
<div class="footer-buttons flex flex-col gap-2 w-full mt-auto">
<el-button
class="reset-password w-full lg:h-10 lg:text-base text-white"
round
@click="resetPassword">
重置密码
</el-button>
<el-button
class="login-btn w-full lg:h-10 lg:text-base text-white"
round
@click="handleClose">
无需重置，直接登录
</el-button>
</div>
</slot>
</el-form>
</el-dialog>
</template>
<script>
import { post, get } from '@/utils/axios'
import md5 from 'js-md5'
export default {
name: 'ForgetPassword',
props: {
visible: { type: Boolean, default: false },
},
data() {
return {
labelPosition: 'passwordLogin',
validatePass: (rule, value, callback) => {
if (!value) {
callback(new Error('请再次输入密码'))
} else if (value !== this.forgetForm.password) {
callback(new Error('两次输入密码不一致'))
} else {
callback()
}
},
forgetForm: {},
VerifyUrl: '',
verifyKeyTime: undefined,
showNewPwd: false,
showAgNewPwd: false,
codeCountDown: 0,
timer: null,
}
},
computed: {
getCodeDisabled() {
return this.codeCountDown > 0
},
dialogVisible: {
get() {
return this.visible
},
set(val) {
if (!val) {
this.$emit('close')
}
},
},
},
watch: {
visible(val) {
if (val) {
if (this.labelPosition === 'verificationLogin') {
this.getVerifycode()
}
} else {
this.clearTimer()
}
},
labelPosition() {
this.initForm()
},
},
methods: {
initForm() {
this.forgetForm = {}
this.codeCountDown = 0
if (this.labelPosition === 'verificationLogin') {
this.getVerifycode()
}
this.$nextTick(() => {
this.$refs.forgetForm && this.$refs.forgetForm.clearValidate()
})
},
clearTimer() {
if (this.timer) clearInterval(this.timer)
this.timer = null
},
async verCode() {
try {
await new Promise((resolve, reject) => {
this.$refs.forgetForm.validateField('email', (m) => {
m ? reject() : resolve()
})
})
} catch {
return
}
try {
const res = await get('business/user/emailcode', {
email: this.forgetForm.email,
})
this.codeCountDown = 60
this.timer = setInterval(() => {
this.codeCountDown--
if (this.codeCountDown <= 0) {
this.clearTimer()
}
}, 1000)
this.$message.success(res.message)
} catch (e) {
console.error(e)
}
},
async forgetPhonecode() {
try {
await new Promise((resolve, reject) => {
this.$refs.forgetForm.validateField('phone', (m) => {
m ? reject() : resolve()
})
})
} catch {
return
}
try {
const res = await post('business/user/phonecode', {
account: this.forgetForm.phone,
verifyKey: this.verifyKeyTime,
verifyCode: this.forgetForm.verifyKey,
})
this.codeCountDown = 60
this.timer = setInterval(() => {
this.codeCountDown--
if (this.codeCountDown <= 0) {
this.clearTimer()
}
}, 1000)
this.$message.success(res.message)
} catch (e) {
this.getVerifycode()
console.error(e)
}
},
// 重置密码
resetPassword() {
try {
this.$refs.forgetForm.validate()
} catch {
return
}
try {
const hash = md5.create()
hash.update(this.forgetForm.password)
const passwordHash = hash.hex()
post('business/user/restPassword', {
password: passwordHash,
account: this.forgetForm.email
? this.forgetForm.email
: this.forgetForm.phone,
code: this.forgetForm.code,
}).then((res) => {
if (res.code === 200) {
this.$message.success('密码修改成功')
this.$emit('close')
}
})
} catch (e) {
console.error(e)
}
},
getVerifycode() {
this.verifyKeyTime = new Date().getTime()
get(
'business/user/verifycode',
{
verifyKey: this.verifyKeyTime,
},
{ skipLoading: true }
)
.then((res) => {
if (res.code === 200) {
this.VerifyUrl = res.message
} else {
this.VerifyUrl = ''
}
})
.catch(() => {
this.VerifyUrl = ''
})
},
handleClose() {
this.$emit('close')
},
handleOpened() {
this.initForm()
},
},
beforeDestroy() {
this.clearTimer()
},
}
</script>
<style scoped lang="scss">
.forget-dialog ::v-deep .el-dialog__header {
padding: 40px 0 20px 0;
}
.forget-dialog ::v-deep .el-dialog__title {
font-size: 26px;
font-weight: 500;
letter-spacing: 2px;
}
.forget-dialog ::v-deep .el-dialog__body {
padding: 0 60px 20px;
height: 460px;
display: flex;
flex-direction: column;
}
@media (max-width: 1100px) {
.forget-dialog ::v-deep .el-dialog {
margin-top: 10vh;
min-height: 200px;
}
.forget-dialog ::v-deep .el-dialog__title {
font-size: 20px;
display: flex;
flex-direction: column;
}
.forget-dialog ::v-deep .el-dialog__body {
padding: 0 30px 20px;
display: flex;
flex-direction: column;
}
}
.reset-password {
background-image: linear-gradient(
to right,
var(--primary-color) 0%,
#d59723 51%,
#f0cb66 100%
);
&:hover {
background-image: linear-gradient(
to right,
var(--hover-color) 0%,
#cf9e42 51%,
#eed183 100%
);
color: #fff;
}
&:focus {
background-image: linear-gradient(
to right,
var(--hover-color) 0%,
#cf9e42 51%,
#eed183 100%
);
color: #fff;
border: 1px solid var(--hover-color);
}
}
.login-btn {
background: #ffffff;
color: #838383;
border: 1px solid #a8a8a8;
&:hover {
background: #ffffff;
color: #949494;
border: 1px solid #c7c7c7;
}
&:focus {
background: #ffffff;
color: #838383;
border: 1px solid #a8a8a8;
}
}
.get-code-button:disabled:hover {
background-color: #d0d2d8;
color: #666;
}
.disabled {
background-color: #d0d2d8;
color: #666;
margin-left: 10px;
}
.code-btn {
background: linear-gradient(
180deg,
var(--primary-color) 0%,
var(--primary-color) 100%
);
border: none;
color: #fff;
}
.eyes {
display: inline-block;
height: 14px;
width: 18px;
margin-top: 11px;
margin-right: 5px;
cursor: pointer;
}
.eyes.open {
background: url('../../assets/eyes-open.png') no-repeat center / cover;
}
.eyes.close {
background: url('../../assets/eyes-closed.png') no-repeat center / cover;
}
.forget-dialog ::v-deep .el-button + .el-button {
margin-left: 0;
}
</style>
src/views/homePage/index.vue
<template> <template>
<div class="home-page"> <div class="home-page">
<div class="banner-images px-5 lg:px-0"> <div
class="banner w-11/12 lg:w-8/12 mx-auto lg:px-5 lg:py-20"
:class="{ loged: userInfo }">
<div <div
class="banner-container flex-col items-center mt-8 mb-10 lg:flex-row lg:justify-between lg:items-center lg:mt-0 gap-4 lg:gap-20"> class="banner-container flex h-full flex-col items-center mt-8 mb-10 lg:flex-row lg:justify-between lg:items-center lg:mt-0 gap-4 lg:gap-5"
<div class="left-content mb-4 lg:mb-0"> :class="{ 'lg:flex-col': userInfo }">
<div
class="left-content w-full flex flex-col gap-10 mb-4 lg:mb-0"
:class="{ 'lg:w-full': userInfo }">
<h3 <h3
class="left-content-title text-base lg:text-2xl lg:font-bold text-center lg:text-left"> class="left-content-title text-base lg:text-3xl font-bold text-center lg:text-left"
:class="{ 'lg:text-center': userInfo }">
让跨境电商更智能 让跨境电商更智能
</h3> </h3>
<h2 <h2
class="left-content-title-high-light font-bold text-center lg:text-left"> class="text-2xl lg:text-4xl font-bold text-center lg:text-left"
九猫科技·全球电商增长伙伴 :class="{ 'lg:text-center': userInfo }">
<span class="left-content-title-high-light">九猫科技</span>
<span class="text-gray-600">·全球电商增长伙伴</span>
</h2> </h2>
<p class="left-content-description text-center lg:text-left">
<!-- <span class="high-light">60万+</span> --> <div
<span>跨境全链路智能解决方案,一站式跨境电商操作系统</span> class="left-content-description flex flex-col gap-4 lg:gap-7 text-sm lg:text-xl text-gray-600 text-center lg:text-left"
<span class="high-light">20+</span> :class="{ 'lg:text-center': userInfo }">
<span>主流跨境平台，助力卖家全球出海</span> <p>
</p> <span>跨境全链路智能解决方案，一站式跨境电商操作系统</span>
</div> </p>
<div class="right-content"> <p>
<video <span class="high-light font-bold">20+</span>
width="100%" <span>主流跨境平台，助力卖家全球出海</span>
class="video" </p>
src="../../assets/video/home-video.mp4"
autoplay
loop
muted></video>
</div>
</div>
</div>
<product-intro />
<div class="docking-platform flex justify-center">
<div>
<div class="flex justify-center flex-col items-center mb-10 gap-2">
<h3 class="text-textContent lx-title mb-8" style="text-align: center">
对接平台
</h3>
<div class="text-sm font-light text-textContent text-center">
国家权威机构及亚马逊多重实力认证
</div>
</div>
<div class="platforms mt-30">
<div class="platform-item"><img src="../../assets/logo1.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo2.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo3.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo4.jpg" /></div>
<div class="platform-item">
<a href="https://hubs.ly/Q02Y1gQR0" target="_blank">
<img src="../../assets/logo19.png" />
</a>
</div> </div>
<div class="platform-item"><img src="../../assets/logo6.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo7.png" /></div> <button
<div class="platform-item"><img src="../../assets/logo8.jpg" /></div> class="register-btn-text block mx-auto lg:mx-0 w-20 h-8 lg:w-36 lg:h-11 rounded-md text-xs lg:text-lg cursor-pointer text-white"
<div class="platform-item"><img src="../../assets/logo9.jpg" /></div> :class="{ hidden: userInfo }"
<div class="platform-item"><img src="../../assets/logo10.jpg" /></div> @click="registerDialog = true">
<div class="platform-item"><img src="../../assets/logo11.jpg" /></div> 立即注册
<div class="platform-item"><img src="../../assets/logo12.jpg" /></div> </button>
<div class="platform-item"><img src="../../assets/logo13.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo14.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo15.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo16.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo17.jpg" /></div>
<div class="platform-item"><img src="../../assets/logo18.jpg" /></div>
</div> </div>
<login v-if="!userInfo" />
</div> </div>
</div> </div>
<div class="footer-bg">
<div class="footer-banner"> <platform />
<p class="footer-title">人效全面提升、业绩翻倍增长，从此刻开始！</p> <product-intro />
<p class="footer-description">
九猫ERP将帮助您提升每一个人员效率，快速实现业务增长 <Register :visible="registerDialog" @close="registerDialog = false" />
</p>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import ProductIntro from '../../components/product-intro.vue' import ProductIntro from '../../components/product-intro.vue'
import Login from './login.vue'
import Register from './register.vue'
import Platform from './platform.vue'
export default { export default {
name: 'homePage', name: 'homePage',
components: { components: {
ProductIntro, ProductIntro,
Login,
Register,
Platform,
},
inject: {
scrollParent: 'scrollParent',
}, },
data() { data() {
return { return {
bannerImages: [ registerDialog: false,
{ image: require('../../assets/banner/1.jpg') }, userInfo: JSON.parse(localStorage.getItem('userInfo')),
{ image: require('../../assets/banner/2.jpg') }, }
{ image: require('../../assets/banner/3.jpg') }, },
{ image: require('../../assets/banner/4.jpg') }, mounted() {
{ image: require('../../assets/banner/5.jpg') }, // 若通过路由参数请求打开注册弹窗，则在进入首页后自动打开
{ image: require('../../assets/banner/6.jpg') }, if (
{ image: require('../../assets/banner/7.jpg') }, this.$route &&
{ image: require('../../assets/banner/8.jpg') }, this.$route.query &&
{ image: require('../../assets/banner/9.jpg') }, this.$route.query.openRegister === '1'
], ) {
this.registerDialog = true
} }
}, },
watch: {
$route: {
handler(to) {
if (to && to.query && to.query.openRegister === '1') {
this.registerDialog = true
}
},
immediate: false,
},
},
methods: {
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
},
} }
</script> </script>
<style scoped> <style scoped lang="scss">
.banner-images { .banner {
width: 70vw; height: 600px;
margin: 0 auto;
height: 30vw;
padding-top: 40px;
} }
.loged {
/* .banner-images-inner {
width: 100%;
} */
.banner-container {
display: flex;
/* align-items: center; */
height: 100%; height: 100%;
} }
.left-content {
width: 30%; @media (max-width: 1100px) {
display: flex; .banner {
flex-direction: column;
gap: 20px;
}
.right-content {
width: 70%;
height: 100%;
border-radius: 20px;
.video {
width: 100%;
height: 100%; height: 100%;
object-fit: fill;
} }
} }
.left-content-title {
/* font-size: 24px; */
}
.left-content-title-high-light {
font-size: 40px;
color: #2253fd;
}
.left-content-description {
font-size: 18px;
color: #777;
}
.high-light {
color: #2253fd;
font-weight: bold;
}
.docking-platform {
background: #ebf1fc;
padding: 100px 0;
}
.docking-platform h2 {
color: #000;
font-weight: 500;
}
.platforms { .register-btn-text {
display: grid; background: var(--primary-color);
gap: 10px; box-shadow: 0 4px 8px 0 var(--shadow-color);
grid-template-columns: repeat(9, 1fr); &:hover {
} background: var(--hover-color);
.footer-bg { color: #fff;
background: linear-gradient(180deg, #2554fe, #3572ff);
}
.footer-banner {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 80px 15px;
background-image: url(../../assets/images/home/06.png);
background-position-y: bottom;
background-repeat: no-repeat;
background-size: 100% 90px;
.footer-title {
font-weight: 500;
font-size: 36px;
margin-bottom: 20px;
max-width: 70vw;
text-align: center;
color: rgba(255, 255, 255, 1);
letter-spacing: 2px;
} }
.footer-description { &:focus {
font-weight: 300; background: var(--hover-color);
font-size: 18px; color: #fff;
margin-top: 8px;
margin-bottom: 40px;
color: rgba(255, 255, 255, 1);
} }
} }
@media screen and (max-width: 1440px) {
.platforms {
grid-template-columns: repeat(6, 1fr);
}
}
@media screen and (max-width: 1100px) {
.docking-platform {
padding: 40px 20px 40px;
}
.footer-banner {
padding: 40px 10px;
.footer-title {
font-size: 18px;
margin-bottom: 10px;
max-width: 90vw;
text-align: center;
color: rgba(255, 255, 255, 1);
}
.footer-description {
font-weight: 300;
font-size: 12px;
margin-top: 8px;
margin-bottom: 20px;
color: rgba(255, 255, 255, 1);
}
}
.banner-images {
width: 100%;
height: auto;
padding-top: unset;
}
.left-content-title-high-light {
font-size: 24px;
}
.left-content {
width: 100%;
gap: 6px;
}
.right-content {
width: 100%;
}
.left-content-description {
font-size: 12px;
}
.platforms {
grid-template-columns: repeat(3, 1fr);
}
.platform-item {
padding: 10px !important;
}
.home-page::v-deep .el-carousel__indicators { .left-content-title {
display: none; color: var(--secondary-text-color);
}
} }
.platform-item { .left-content-title-high-light {
padding: 20px; color: var(--darker-text-color);
background-color: #fff;
overflow: hidden;
border-radius: 6px;
} }
.platforms img { .high-light {
width: 100%; color: var(--primary-color);
}
.lx-title {
font-size: 2.25rem;
color: #1a2035;
font-weight: 500;
font-size: 1.25rem;
line-height: 1.75rem;
margin-bottom: 0.25rem;
max-width: 840px;
text-align: center;
--tw-text-opacity: 1;
color: rgba(26, 32, 53, var(--tw-text-opacity));
letter-spacing: 1px;
}
@media (min-width: 1024px) {
.lx-title {
font-size: 2.25rem;
line-height: 2.75rem;
}
} }
</style> </style>
src/views/homePage/login.vue 0 → 100644
<template>
<div class="w-full flex justify-end">
<div
class="login-content lg:px-10 py-6 shadow-lg lg:shadow-lg flex flex-col rounded-4xl">
<div
class="login-text flex flex-col lg:flex-row items-center lg:items-end">
<div
class="login-text-welcome font-bold lg:font-normal text-2xl mb-2 lg:mb-0">
欢迎登录
</div>
<div
class="login-text-intro lg:font-normal text-xs lg:text-sm lg:ml-2 text-gray-400">
智能化订单处理 数字化供采平台 多维度数据分析
</div>
</div>
<el-radio-group
v-model="labelPosition"
class="radioGroup mt-5 flex justify-center items-center mb-5"
size="small"
@change="clickChange">
<el-radio-button label="passwordLogin">密码登录</el-radio-button>
<el-radio-button label="verificationLogin">验证码登录</el-radio-button>
</el-radio-group>
<el-form
size="medium"
:model="ruleForm"
:rules="rules"
ref="ruleForm"
class="login_form w-full flex flex-col flex-1 mx-auto lg:mx-0">
<el-form-item
class="lg:mt-5 w-3/4 lg:w-full mx-auto lg:mx-0"
v-if="labelPosition === 'passwordLogin'"
prop="email">
<el-input
prefix-icon="el-icon-user-solid"
class="lg:bg-white"
v-model="ruleForm.email"
placeholder="请输入手机号或邮箱"></el-input>
</el-form-item>
<el-form-item
v-if="labelPosition === 'passwordLogin'"
prop="password"
class="lg:mb-5 w-3/4 lg:w-full mx-auto lg:mx-0">
<el-input
:type="showPwd ? 'text' : 'password'"
prefix-icon="el-icon-lock"
class="lg:bg-white"
v-model="ruleForm.password"
placeholder="请输入密码"
@keyup.enter.native="submitForm">
<i
@click="showPwd = !showPwd"
slot="suffix"
:class="{ eyes: true, open: !showPwd, close: showPwd }"></i>
</el-input>
</el-form-item>
<el-form-item
class="lg:mb-5 w-3/4 lg:w-full mx-auto lg:mx-0"
v-if="labelPosition === 'verificationLogin'"
prop="phone">
<el-input
prefix-icon="el-icon-phone"
style="background: #fff"
v-model="ruleForm.phone"
placeholder="请输入手机号"></el-input>
</el-form-item>
<el-form-item
v-if="labelPosition === 'verificationLogin'"
class="lg:mb-5 w-3/4 lg:w-full mx-auto lg:mx-0"
prop="verifyKey"
label="">
<div class="flex gap-1 mb-0">
<div class="flex-1">
<el-input
v-model="ruleForm.verifyKey"
prefix-icon="el-icon-postcard"
placeholder="请输入验证码(区分大小写)"></el-input>
</div>
<div class="cursor-pointer" @click="getVerifycode">
<img class="w-20 lg:w-32 h-full" :src="VerifyUrl" />
</div>
</div>
</el-form-item>
<el-form-item
class="lg:mb-5 w-3/4 lg:w-full mx-auto lg:mx-0"
v-if="labelPosition === 'verificationLogin'"
prop="code">
<div class="flex gap-1 mb-0">
<div class="flex-1">
<el-input
v-model="ruleForm.code"
prefix-icon="el-icon-chat-line-square"
placeholder="请输入短信验证码"></el-input>
</div>
<el-button
class="w-22 text-white text-xs lg:text-base border-0"
:disabled="getCodeDisabled"
:class="getCodeDisabled ? 'disabled' : 'get-code-button'"
@click="verPhonecode">
{{ codeCountDown === 0 ? '获取验证码' : `${codeCountDown}秒` }}
</el-button>
</div>
</el-form-item>
<div class="login-bottom mt-auto">
<div class="text-center">
<button
class="login-btn w-3/4 lg:w-full h-8 lg:h-10 text-sm lg:text-lg text-white mx-auto lg:mx-0 rounded-md"
@click="submitForm">
登录
</button>
</div>
<div
class="login-bottom-text flex justify-center items-center mt-5 lg:text-base text-xs">
<div
class="forget-password text-gray-400 cursor-pointer"
@click="forgetPassword">
忘记密码
</div>
<el-divider direction="vertical" class="bottom-line"></el-divider>
<div
class="register-btn-text cursor-pointer"
@click="registerDialog = true">
马上注册
</div>
</div>
</div>
</el-form>
</div>
<ForgetPassword
v-if="isShowModal"
:visible="isShowModal"
@close="isShowModal = false" />
<Register :visible="registerDialog" @close="registerDialog = false" />
</div>
</template>
<script>
import { post, get } from '../../utils/axios'
import md5 from 'js-md5'
import { mapMutations } from 'vuex'
import Register from '@/views/homePage/register.vue'
import ForgetPassword from '@/views/homePage/forgetPassword.vue'
export default {
name: 'login',
components: {
Register,
ForgetPassword,
},
data() {
return {
registerDialog: false,
VerifyUrl: '',
labelPosition: 'passwordLogin',
isShowModal: false,
ruleForm: {
password: '',
email: '',
},
codeCountDown: 0,
rules: {
email: [
{ required: true, message: '请输入邮箱或手机号', trigger: 'blur' },
],
password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
phone: [
{ required: true, message: '请输入手机号', trigger: 'blur' },
{
pattern: /^1[3,4,5,6,7,8,9][0-9]{9}$/,
message: '请输入正确手机号码',
trigger: ['blur', 'change'],
},
],
code: [
{ required: true, message: '请输入短信验证码', trigger: 'blur' },
],
verifyKey: [
{ required: true, message: '请输入验证码', trigger: 'blur' },
],
},
showPwd: false,
}
},
computed: {
getCodeDisabled() {
return this.codeCountDown > 0
},
},
methods: {
...mapMutations(['setUserInfo']),
initForm() {
this.ruleForm = {}
this.codeCountDown = 0
if (this.labelPosition === 'verificationLogin') {
this.getVerifycode()
}
this.$nextTick(() => {
this.$refs.ruleForm && this.$refs.ruleForm.clearValidate()
})
},
clearTimer() {
if (this.timer) clearInterval(this.timer)
this.timer = null
},
async verPhonecode() {
try {
await new Promise((resolve, reject) => {
this.$refs.ruleForm.validateField('phone', (m) => {
m ? reject() : resolve()
})
})
} catch {
return
}
try {
const res = await post('business/user/phonecode', {
account: this.ruleForm.phone,
verifyKey: this.verifyKeyTime,
verifyCode: this.ruleForm.verifyKey,
})
this.codeCountDown = 60
this.timer = setInterval(() => {
this.codeCountDown--
if (this.codeCountDown <= 0) {
clearInterval(this.timer)
}
}, 1000)
this.$message.success(res.message)
} catch (e) {
this.getVerifycode()
console.error(e)
}
},
forgetPassword() {
this.isShowModal = true
},
submitForm(e) {
e.preventDefault()
this.$refs.ruleForm.validate((valid) => {
if (valid) {
let parmes = {}
if (this.ruleForm.password) {
const hash = md5.create()
hash.update(this.ruleForm.password)
const passwordHash = hash.hex()
parmes = {
account: this.ruleForm.email
? this.ruleForm.email
: this.ruleForm.phone,
password: passwordHash,
}
} else {
parmes = {
account: this.ruleForm.email
? this.ruleForm.email
: this.ruleForm.phone,
code: this.ruleForm.code,
}
}
let url = `business/user/login`
post(url, parmes).then((res) => {
if (res.code === 200) {
localStorage.setItem('userInfo', JSON.stringify(res.data))
this.setUserInfo(JSON.parse(JSON.stringify(res.data)))
this.ruleForm = {}
this.$router.push('/contact')
}
})
}
})
},
getVerifycode() {
this.verifyKeyTime = new Date().getTime()
get(
'business/user/verifycode',
{
verifyKey: this.verifyKeyTime,
},
{ skipLoading: true }
)
.then((res) => {
if (res.code === 200) {
this.VerifyUrl = res.message
} else {
this.VerifyUrl = ''
}
})
.catch(() => {
this.VerifyUrl = ''
})
},
clickChange() {
this.initForm()
},
},
}
</script>
<style scoped lang="scss">
.login-content {
width: 500px;
height: 430px;
}
@media (max-width: 1024px) {
.login-content {
width: 100%;
}
}
.login_form::v-deep .el-input__inner {
height: 42px;
line-height: 42px;
}
@media (max-width: 1024px) {
.login_form::v-deep .el-input__inner {
height: 32px;
font-size: 12px;
}
}
.get-code-button {
background: var(--primary-color);
&:hover {
background: var(--hover-color);
color: #fff;
}
&:focus {
background: var(--hover-color);
color: #fff;
}
&:disabled {
background-color: #d0d2d8;
color: #666;
}
}
.disabled {
background-color: #f0f0f0;
color: #666;
border: 1px solid #cccccc;
cursor: not-allowed;
}
.code-btn {
background: linear-gradient(
180deg,
var(--primary-color) 0%,
var(--primary-color) 100%
);
}
.login-btn {
background: var(--primary-color);
box-shadow: 0 4px 8px 0 var(--shadow-color);
&:hover {
background: var(--hover-color);
color: #fff;
}
&:focus {
background: var(--hover-color);
color: #fff;
}
}
.forget-password {
&:hover {
color: rgb(119, 118, 118);
}
}
.register-btn-text {
color: var(--primary-color);
&:hover {
color: var(--hover-color);
}
}
.eyes {
display: inline-block;
height: 18px;
width: 18px;
margin-top: 11px;
margin-right: 5px;
cursor: pointer;
}
.eyes.open {
background: url('../../assets/eyes-open.png') no-repeat center / cover;
}
.eyes.close {
background: url('../../assets/eyes-closed.png') no-repeat center / cover;
}
</style>
src/views/homePage/platform.vue 0 → 100644
<template>
<div class="docking-platform flex justify-center py-8">
<vue-seamless-scroll
:data="platforms"
:class-option="classOption"
class="warp">
<ul class="flex flex-wrap">
<li
class="platform-item flex justify-center items-center w-20"
v-for="platform in platforms"
:key="platform.name">
<a
v-if="platform.link"
:href="platform.link"
target="_blank"
class="flex justify-center items-center w-full h-full">
<img
class="platform-image"
:src="
require(`../../assets/platforms/${platform.name}.${platform.type}`)
"
:alt="platform.name" />
</a>
<img
v-else
class="platform-image"
:src="
require(`../../assets/platforms/${platform.name}.${platform.type}`)
"
:alt="platform.name" />
</li>
</ul>
</vue-seamless-scroll>
</div>
</template>
<script>
// https://chenxuan0000.github.io/vue-seamless-scroll/zh/guide/
import vueSeamlessScroll from 'vue-seamless-scroll'
export default {
name: 'platform',
components: {
vueSeamlessScroll,
},
data() {
return {
platforms: [
{ name: 'logo1', type: 'png' },
{ name: 'logo2', type: 'svg' },
{ name: 'logo3', type: 'svg' },
{ name: 'logo4', type: 'png' },
{ name: 'logo5', type: 'svg' },
{ name: 'logo6', type: 'png' },
{ name: 'logo7', type: 'png' },
{ name: 'logo8', type: 'svg' },
{ name: 'logo9', type: 'svg' },
{ name: 'logo10', type: 'svg' },
{ name: 'logo11', type: 'png' },
{ name: 'logo12', type: 'png' },
{ name: 'logo13', type: 'png' },
{ name: 'logo15', type: 'png' },
{ name: 'logo16', type: 'svg' },
{ name: 'logo17', type: 'svg' },
{ name: 'logo18', type: 'svg' },
{ name: 'logo19', type: 'png', link: 'https://hubs.ly/Q02Y1gQR0' },
],
classOption: {
step: 0.6, // 数值越大速度滚动越快
hoverStop: true, // 是否开启鼠标悬停stop
direction: 1, // 0向下 1向上 2向左 3向右
autoPlay: true, // 是否自动滚动
openWatch: true, // 开启数据实时监控刷新dom
},
}
},
}
</script>
<style scoped lang="scss">
.docking-platform {
width: 100%;
height: 150px;
background: var(--background-color);
}
.warp {
width: 70%;
height: 100px;
overflow: hidden;
}
.platform-item {
flex: 0 0 auto;
width: 140px;
height: 60px;
}
@media (max-width: 1100px) {
.warp {
width: 90%;
}
.platform-item {
width: 33%;
}
}
.platform-image {
width: 80%;
transition: filter 0.3s ease;
filter: grayscale(100%) brightness(0.6) contrast(0.2);
}
</style>
src/views/homePage/register.vue 0 → 100644
<template>
<el-dialog
:visible.sync="dialogVisible"
title="用户注册"
:width="$isMobile ? '100%' : '36%'"
:center="true"
:close-on-click-modal="false"
:close-on-press-escape="true"
@close="closeDialog"
@opened="handleOpened"
class="register-dialog">
<el-radio-group
v-model="labelPosition"
class="radioGroup flex justify-center items-center mb-5"
size="small">
<el-radio-button label="phone">手机号注册</el-radio-button>
<el-radio-button label="mailbox">邮箱注册</el-radio-button>
</el-radio-group>
<el-form
size="medium"
:model="registerForm"
:rules="rules"
ref="registerForm"
class="login_form flex flex-col flex-1">
<el-form-item v-if="labelPosition === 'mailbox'" prop="email" label="">
<el-input
v-model="registerForm.email"
prefix-icon="el-icon-message"
placeholder="请输入邮箱"></el-input>
</el-form-item>
<el-form-item v-if="labelPosition === 'mailbox'" prop="code" label="">
<div class="flex gap-5">
<div class="flex-1">
<el-input
v-model="registerForm.code"
prefix-icon="el-icon-postcard"
placeholder="请输入邮箱验证码"></el-input>
</div>
<div>
<el-button
class="get-code-button"
style="width: 112px"
:disabled="getCodeDisabled"
:class="getCodeDisabled ? 'disabled' : 'code-btn'"
@click="verCode">
{{ codeCountDown === 0 ? '获取验证码' : `${codeCountDown}秒` }}
</el-button>
</div>
</div>
</el-form-item>
<el-form-item v-if="labelPosition === 'phone'" prop="phone">
<el-input
v-model="registerForm.phone"
prefix-icon="el-icon-phone"
placeholder="请输入手机号"></el-input>
</el-form-item>
<el-form-item v-if="labelPosition === 'phone'" prop="verifyKey">
<div class="flex gap-5">
<div class="flex-1">
<el-input
v-model="registerForm.verifyKey"
prefix-icon="el-icon-postcard"
placeholder="请输入验证码,区分大小写"></el-input>
</div>
<div class="cursor-pointer" @click="getVerifycode">
<img class="w-20 lg:w-28 h-full" :src="VerifyUrl" />
</div>
</div>
</el-form-item>
<el-form-item v-if="labelPosition === 'phone'" prop="code">
<div class="flex gap-5">
<div class="flex-1">
<el-input
v-model="registerForm.code"
prefix-icon="el-icon-chat-line-square"
placeholder="请输入短信验证码"></el-input>
</div>
<div>
<el-button
class="get-code-button ml-2 w-28 border-none text-sm text-white"
:disabled="getCodeDisabled"
:class="getCodeDisabled ? 'disabled' : 'code-btn'"
@click="verPhonecode">
{{ codeCountDown === 0 ? '获取验证码' : `${codeCountDown}秒` }}
</el-button>
</div>
</div>
</el-form-item>
<el-form-item prop="password">
<el-input
type="password"
v-model="registerForm.password"
prefix-icon="el-icon-lock"
placeholder="请输入密码"
autocomplete="off"></el-input>
</el-form-item>
<el-form-item prop="checkPass">
<el-input
type="password"
prefix-icon="el-icon-lock"
v-model="registerForm.checkPass"
placeholder="请再次输入密码"
autocomplete="off"></el-input>
</el-form-item>
<el-form-item prop="companyName">
<el-input
v-model="registerForm.companyName"
prefix-icon="el-icon-s-home"
placeholder="请输入公司名称"></el-input>
</el-form-item>
<el-form-item prop="job">
<el-input
v-model="registerForm.job"
prefix-icon="el-icon-s-order"
placeholder="请输入职务"></el-input>
</el-form-item>
</el-form>
<div class="bottom-section mt-auto">
<div
class="agree-terms mb-5"
:class="agreeAnimate ? 'agree-animate' : ''">
<el-checkbox v-model="isRead" label="" :indeterminate="false" />
<span class="tos-link text-sm">
阅读并同意
<a class="link" href="/protocol/term" target="_blank">
《九猫ERP条款与协议》
</a>
<span>和</span>
<a class="link" href="/protocol/privacy" target="_blank">
《隐私协议》
</a>
</span>
</div>
<div class="register-btn-container mb-5 text-center">
<button
class="register-btn w-full h-10 text-base text-white rounded-lg cursor-pointer rounded-md"
@click="onRegister">
立即注册
</button>
</div>
<div class="bottom-login-link text-sm mb-2 text-center">
已有账号？
<span
class="cursor-pointer"
style="color: var(--primary-color)"
@click="goToLogin">
马上登录
</span>
</div>
</div>
</el-dialog>
</template>
<script>
import { get, post } from '@/utils/axios'
import md5 from 'js-md5'
export default {
name: 'register',
inject: {
scrollParent: 'scrollParent',
},
props: {
visible: {
type: Boolean,
default: false,
},
},
data() {
var validatePass2 = (rule, value, callback) => {
if (value === '') {
callback(new Error('请再次输入密码'))
} else if (value !== this.registerForm.password) {
callback(new Error('两次输入密码不一致!'))
} else {
callback()
}
}
return {
VerifyUrl: '',
verifyKeyTime: '',
labelPosition: 'phone',
registerForm: {},
isRead: false,
agreeAnimate: false,
codeCountDown: 0,
timer: null,
rules: {
email: [
{ required: true, message: '请输入邮箱', trigger: 'blur' },
{
type: 'email',
message: '请输入正确的邮箱地址',
trigger: ['blur', 'change'],
},
],
phone: [
{ required: true, message: '请输入手机号', trigger: 'blur' },
{
pattern: /^1[3,4,5,6,7,8,9][0-9]{9}$/,
message: '请输入正确手机号码',
trigger: ['blur', 'change'],
},
],
code: [{ required: true, message: '请输入验证码', trigger: 'blur' }],
verifyKey: [
{ required: true, message: '请输入验证码', trigger: 'blur' },
],
password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
checkPass: [
{ required: true, message: '请再次输入密码', trigger: 'blur' },
{ validator: validatePass2, trigger: 'blur' },
],
companyName: [
{ required: true, message: '请输入公司名称', trigger: 'blur' },
],
job: [{ required: true, message: '请输入职务', trigger: 'blur' }],
},
showPwd: false,
}
},
computed: {
getCodeDisabled() {
return this.codeCountDown > 0
},
dialogVisible: {
get() {
return this.visible
},
set(val) {
if (!val) {
this.closeDialog()
}
},
},
},
watch: {
visible(newVal) {
if (!newVal) {
this.clearTimer()
}
},
labelPosition() {
this.initForm()
},
},
methods: {
initForm() {
this.registerForm = {}
this.codeCountDown = 0
if (this.labelPosition === 'phone') {
this.getVerifycode()
}
this.$nextTick(() => {
this.$refs.registerForm && this.$refs.registerForm.clearValidate()
})
},
clearTimer() {
if (this.timer) clearInterval(this.timer)
this.timer = null
},
closeDialog() {
this.$emit('close')
},
async goToLogin() {
this.$emit('close')
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
async verCode() {
try {
await new Promise((resolve, reject) => {
this.$refs.registerForm.validateField('email', (m) => {
m ? reject() : resolve()
})
})
} catch {
return
}
try {
const res = await get('business/user/emailcode', {
email: this.registerForm.email,
})
this.codeCountDown = 60
this.clearTimer()
this.timer = setInterval(() => {
this.codeCountDown--
if (this.codeCountDown <= 0) {
this.clearTimer()
}
}, 1000)
this.$message.success(res.message)
} catch (e) {
console.error(e)
}
},
async verPhonecode() {
try {
await new Promise((resolve, reject) => {
this.$refs.registerForm.validateField('phone', (m) => {
m ? reject() : resolve()
})
})
} catch {
return
}
try {
const res = await post('business/user/phonecode', {
account: this.registerForm.phone,
verifyKey: this.verifyKeyTime,
verifyCode: this.registerForm.verifyKey,
})
this.codeCountDown = 60
this.clearTimer()
this.timer = setInterval(() => {
this.codeCountDown--
if (this.codeCountDown <= 0) {
this.clearTimer()
}
}, 1000)
this.$message.success(res.message)
} catch (e) {
this.getVerifycode()
console.error(e)
}
},
onRegister() {
this.$refs.registerForm.validate((valid) => {
if (valid) {
if (!this.isRead) {
this.agreeAnimate = true
setTimeout(() => {
this.agreeAnimate = false
}, 700)
return
}
const { code, companyName, email, job, password, phone } =
this.registerForm
const hash = md5.create()
hash.update(password)
const passwordHash = hash.hex()
post('business/user/register', {
code: code,
companyName: companyName,
email: email,
job: job,
password: passwordHash,
account: email ? email : phone,
}).then((res) => {
this.$message.success(res.message)
if (res.code === 200) {
this.registerForm = {}
this.$router.push('/')
}
})
}
})
},
getVerifycode() {
this.verifyKeyTime = new Date().getTime()
get(
'business/user/verifycode',
{
verifyKey: this.verifyKeyTime,
},
{ skipLoading: true }
)
.then((res) => {
if (res.code === 200) {
this.VerifyUrl = res.message
} else {
this.VerifyUrl = ''
}
})
.catch(() => {
this.VerifyUrl = ''
})
},
handleOpened() {
this.initForm()
},
},
beforeDestroy() {
this.clearTimer()
},
}
</script>
<style scoped lang="scss">
::v-deep .el-dialog {
margin-top: 10vh !important;
}
.register-dialog ::v-deep .el-dialog__header {
padding: 40px 0 20px 0;
}
.register-dialog ::v-deep .el-dialog__title {
font-size: 26px;
font-weight: 500;
letter-spacing: 2px;
}
.register-dialog ::v-deep .el-dialog__body {
padding: 0 60px 20px;
height: 630px;
display: flex;
flex-direction: column;
}
@media (max-width: 1100px) {
.forget-dialog ::v-deep .el-dialog {
margin-top: 10vh;
height: 80%;
}
.register-dialog ::v-deep .el-dialog__title {
font-size: 20px;
display: flex;
flex-direction: column;
}
.register-dialog ::v-deep .el-dialog__body {
padding: 0 30px 20px;
display: flex;
flex-direction: column;
}
}
.get-code-button:disabled:hover {
background-color: #d0d2d8;
color: #666;
}
@keyframes shake {
0% {
transform: translateX(0);
}
25% {
transform: translateX(-2.57rem);
}
50% {
transform: translateX(0);
}
75% {
transform: translateX(2.57rem);
}
100% {
transform: translateX(0);
}
}
.agree-animate {
animation: shake 0.4s;
}
.register-btn {
background: var(--primary-color);
box-shadow: 0 4px 8px 0 var(--shadow-color);
}
.code-btn {
background: linear-gradient(
180deg,
var(--primary-color) 0%,
var(--primary-color) 100%
);
}
.disabled {
background-color: #d0d2d8;
color: #666;
margin-left: 10px;
}
</style>
src/views/login.vue
...@@ -273,7 +273,7 @@ ...@@ -273,7 +273,7 @@
<script> <script>
import { post, get } from '../utils/axios' import { post, get } from '../utils/axios'
import md5 from 'js-md5' import md5 from 'js-md5'
import {mapMutations, mapState} from 'vuex' import {mapMutations} from 'vuex'
export default { export default {
name: 'login', name: 'login',
components: {}, components: {},
......
src/views/price/pricePage.vue
...@@ -10,29 +10,9 @@ ...@@ -10,29 +10,9 @@
</div> </div>
</div> </div>
<div class="content-body"> <div class="content-body">
<div class="price-container"> <PriceTable />
<div class="price-columns">
<div
v-for="(c, i) in priceColumns"
:key="i"
class="price-column"
:class="`${c.labelClass || ''} ${c.class || ''}`">
{{ c.label }}
</div>
</div>
<div class="price-items">
<div v-for="(p, i) in prices" :key="i" class="price-item">
<div
v-for="(c, j) in priceColumns"
:key="j"
class="price-value"
:class="`${c.valueClass || ''} ${c.class || ''}`"
v-html="value(c, p)"></div>
</div>
</div>
</div>
</div> </div>
<div class="lx-section py-12 bg-colorBg lg:px-0 lg:mt-28 lg:py-28"> <div class="lx-section py-8 bg-colorBg lg:px-0 lg:mt-28 lg:py-16">
<div <div
class="flex justify-between items-center flex-col-reverse lg:flex-row mx-auto w-full-70 w-full-90"> class="flex justify-between items-center flex-col-reverse lg:flex-row mx-auto w-full-70 w-full-90">
<div class="lx-l-section lg:w-2/4"> <div class="lx-l-section lg:w-2/4">
...@@ -70,16 +50,17 @@ ...@@ -70,16 +50,17 @@
</div> </div>
</div> </div>
</div> </div>
<button class="register-btn-text">获取报价</button>
<div <div
class="lx-r-section flex flex-col justify-center items-center lg:w-2/4"> class="lx-r-section flex flex-col justify-center items-center lg:w-2/4">
<h3 <h3
class="lg:hidden text-xl mb-6 lg:mb-12 text-textTitle font-medium tracking-1px text-center"> class="lg:hidden text-xl mb-6 lg:mb-12 text-textTitle font-medium tracking-1px text-center">
获得 600000+ 客户的认可 获得 600000+ 客户的认可
</h3> </h3>
<div class="w-full"> <div class="w-full ml-60">
<img <img
width="100%" width="50%"
src="https://static.distributetop.com/office-site-new/office-site-resource/image/f82253344129c62059d13f3f333725dd.png" :src="require('@/assets/images/product/01.png')"
alt="亚马逊ERP系统一套多少钱-九猫ERP" /> alt="亚马逊ERP系统一套多少钱-九猫ERP" />
</div> </div>
</div> </div>
...@@ -101,7 +82,8 @@ ...@@ -101,7 +82,8 @@
<div class="lx-question-card"> <div class="lx-question-card">
<div class="mb-4 flex items-center" style="font-size: 0px"> <div class="mb-4 flex items-center" style="font-size: 0px">
<span <span
class="inline-flex flex-shrink-0 justify-center items-center text-white text-lg font-medium w-10 h-10 mr-4 rounded-full bg-blue-600"> class="inline-flex flex-shrink-0 justify-center items-center text-white text-lg font-medium w-10 h-10 mr-4 rounded-full"
style="background: var(--primary-color)">
01 01
</span> </span>
<span class="text-lg text-textTitle font-medium"> <span class="text-lg text-textTitle font-medium">
...@@ -116,7 +98,8 @@ ...@@ -116,7 +98,8 @@
<div class="lx-question-card"> <div class="lx-question-card">
<div class="mb-4 flex items-center" style="font-size: 0px"> <div class="mb-4 flex items-center" style="font-size: 0px">
<span <span
class="inline-flex flex-shrink-0 justify-center items-center text-white text-lg font-medium w-10 h-10 mr-4 rounded-full bg-blue-600"> class="inline-flex flex-shrink-0 justify-center items-center text-white text-lg font-medium w-10 h-10 mr-4 rounded-full"
style="background: var(--primary-color)">
02 02
</span> </span>
<span class="text-lg text-textTitle font-medium"> <span class="text-lg text-textTitle font-medium">
...@@ -130,7 +113,8 @@ ...@@ -130,7 +113,8 @@
<div class="lx-question-card"> <div class="lx-question-card">
<div class="mb-4 flex items-center" style="font-size: 0px"> <div class="mb-4 flex items-center" style="font-size: 0px">
<span <span
class="inline-flex flex-shrink-0 justify-center items-center text-white text-lg font-medium w-10 h-10 mr-4 rounded-full bg-blue-600"> class="inline-flex flex-shrink-0 justify-center items-center text-white text-lg font-medium w-10 h-10 mr-4 rounded-full"
style="background: var(--primary-color)">
03 03
</span> </span>
<span class="text-lg text-textTitle font-medium"> <span class="text-lg text-textTitle font-medium">
...@@ -150,7 +134,8 @@ ...@@ -150,7 +134,8 @@
<div class="lx-question-card"> <div class="lx-question-card">
<div class="mb-4 flex items-center" style="font-size: 0px"> <div class="mb-4 flex items-center" style="font-size: 0px">
<span <span
class="inline-flex flex-shrink-0 justify-center items-center text-white text-lg font-medium w-10 h-10 mr-4 rounded-full bg-blue-600"> class="inline-flex flex-shrink-0 justify-center items-center text-white text-lg font-medium w-10 h-10 mr-4 rounded-full"
style="background: var(--primary-color)">
04 04
</span> </span>
<span class="text-lg text-textTitle font-medium"> <span class="text-lg text-textTitle font-medium">
...@@ -193,20 +178,19 @@ ...@@ -193,20 +178,19 @@
</div> </div>
</div> </div>
</div> </div>
<div class="footer-bg">
<div class="footer-banner">
<div class="footer-title">选择九猫，开始高效管理跨境电商业务</div>
<div class="footer-description">
已有超过60万卖家在使用九猫ERP，提升业务管理效益
</div>
<!---->
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import PriceTable from './priceTable.vue'
export default { export default {
name: 'pricePage', name: 'pricePage',
components: {
PriceTable,
},
inject: {
scrollParent: 'scrollParent',
},
data() { data() {
return { return {
priceColumns: [ priceColumns: [
...@@ -228,6 +212,7 @@ export default { ...@@ -228,6 +212,7 @@ export default {
return d return d
}, },
valueClass: 'list', valueClass: 'list',
class: 'h-2x',
}, },
{ {
label: '价格', label: '价格',
...@@ -511,6 +496,17 @@ export default { ...@@ -511,6 +496,17 @@ export default {
} }
return value return value
}, },
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
}, },
} }
</script> </script>
...@@ -596,9 +592,20 @@ export default { ...@@ -596,9 +592,20 @@ export default {
.content-body { .content-body {
width: 1400px; width: 1400px;
margin: 0 auto; margin: 0 auto;
padding: 100px 0; padding: 30px 0;
}
.register-btn-text {
width: 150px;
height: 42px;
display: block;
background: var(--primary-color);
box-shadow: 0 4px 8px 0 var(--shadow-color);
border-radius: 4px;
font-size: 18px;
color: #fff;
cursor: pointer;
margin-top: 400px;
} }
.price-container { .price-container {
display: flex; display: flex;
border-radius: 8px; border-radius: 8px;
...@@ -617,6 +624,7 @@ export default { ...@@ -617,6 +624,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
white-space: nowrap; white-space: nowrap;
border-bottom: solid 1px #eee;
} }
.price-column { .price-column {
...@@ -652,6 +660,18 @@ export default { ...@@ -652,6 +660,18 @@ export default {
.price-item:not(:last-child) { .price-item:not(:last-child) {
border-right: solid 1px #eee; border-right: solid 1px #eee;
} }
.price-item:last-child {
border-right: solid 1px #eee;
}
.last-value {
border-bottom: none !important;
}
.last-column {
border-bottom: none;
}
</style> </style>
<style scoped lang="scss"> <style scoped lang="scss">
.price-container .fs-20 { .price-container .fs-20 {
...@@ -704,7 +724,7 @@ export default { ...@@ -704,7 +724,7 @@ export default {
color: #1a2035; color: #1a2035;
font-size: 1.25rem; font-size: 1.25rem;
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgba(37, 84, 254, var(--tw-text-opacity)); color: var(--primary-color);
line-height: 1; line-height: 1;
} }
.lx-question-card { .lx-question-card {
...@@ -761,44 +781,13 @@ export default { ...@@ -761,44 +781,13 @@ export default {
width: 8px; width: 8px;
height: 8px; height: 8px;
border-radius: 50%; border-radius: 50%;
background: #70b3ff; background: var(--light-color);
position: absolute; position: absolute;
left: -20px; left: -20px;
top: 8px; top: 8px;
} }
} }
.footer-bg {
background: linear-gradient(180deg, #2554fe, #3572ff);
}
.footer-banner {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 80px 15px;
background-image: url(../../assets/images/home/06.png);
background-position-y: bottom;
background-repeat: no-repeat;
background-size: 100% 90px;
.footer-title {
font-weight: 500;
font-size: 36px;
margin-bottom: 20px;
max-width: 70vw;
text-align: center;
color: rgba(255, 255, 255, 1);
letter-spacing: 2px;
}
.footer-description {
font-weight: 300;
font-size: 18px;
margin-top: 8px;
margin-bottom: 40px;
color: rgba(255, 255, 255, 1);
}
}
@media (min-width: 1024px) { @media (min-width: 1024px) {
.lx-title { .lx-title {
font-size: 2.25rem; font-size: 2.25rem;
...@@ -830,24 +819,6 @@ export default { ...@@ -830,24 +819,6 @@ export default {
} }
} }
} }
.footer-banner {
padding: 40px 10px;
.footer-title {
font-size: 18px;
margin-bottom: 10px;
max-width: 90vw;
text-align: center;
color: rgba(255, 255, 255, 1);
}
.footer-description {
font-weight: 300;
font-size: 12px;
margin-top: 8px;
margin-bottom: 20px;
color: rgba(255, 255, 255, 1);
}
}
.lx-question-card { .lx-question-card {
padding: 1.5rem; padding: 1.5rem;
} }
...@@ -923,5 +894,13 @@ export default { ...@@ -923,5 +894,13 @@ export default {
.price-item { .price-item {
padding-bottom: 0; padding-bottom: 0;
} }
.last-value {
border-bottom: none !important;
}
.last-column {
border-bottom: none;
}
} }
</style> </style>
src/views/price/priceTable.vue 0 → 100644
<template>
<div>
<el-table
:data="tableData"
@cell-mouse-enter="handleMouseEnter"
@cell-mouse-leave="handleMouseLeave"
:cell-class-name="cellClassName"
:header-cell-class-name="headerCellClassName"
:header-row-style="{
fontSize: '18px',
color: '#1a2035',
height: '100px',
}"
:row-style="{ height: '60px', fontSize: '15px' }">
<el-table-column
v-for="(column, index) in tableColumns"
align="center"
:key="index"
:label="column">
<template slot="header">
{{ column }}
</template>
<template slot-scope="scope">
<span v-if="scope.row[index] === true">✔️</span>
<span v-else-if="scope.row[index] === false">❌</span>
<span v-else-if="typeof scope.row[index] === 'object'">
<div v-for="item in scope.row[index]" :key="item">
{{ item }}
</div>
</span>
<span v-else>{{ scope.row[index] }}</span>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
name: 'PriceTable',
data() {
return {
hoverCol: null,
prices: [
{
name: 'shopify版',
chargeType: '一次性收费',
price: '10$',
radius: 'shopify',
accountsCount: '不限',
deploymentType: 'SaaS',
rechargeAmount: '0', //充值金额
featureCustomization: false, // 功能定制
permissionManage: true, // 权限管理
financialManage: true, // 财务管理
statisticalReport: true, // 统计报表
orderManage: true, // 订单管理
logisticsManage: true, // 物流管理
orderStorage: '180天', // 订单数据存储
logsRetainDays: '90天', // 操作日志查看天数
shopCount: 50, // 店铺数量
imageStorage: '4G', // 图片空间
trainingType: '线上培训', // 培训方式
exclusivePM: true, // 专属产品经理
},
{
name: '试用版',
chargeType: ['免费3个月', '或3000单'], // 收费方式
price: 0, // 价格
radius: 'other',
accountsCount: 10, // 账号数量
rechargeAmount: '0', // 充值金额
deploymentType: 'SaaS', // 部署方式
featureCustomization: false, // 功能定制
permissionManage: true, // 权限管理
financialManage: true, // 财务管理
statisticalReport: true, // 统计报表
orderManage: true, // 订单管理
logisticsManage: true, // 物流管理
orderStorage: '3个月或试用套餐结束', // 订单数据存储
logsRetainDays: '3个月或试用套餐结束', // 操作日志查看天数
shopCount: 20, // 店铺数量
imageStorage: '2G', // 图片空间
trainingType: '线上培训', // 培训方式
exclusivePM: false, // 专属产品经理
},
{
name: '基础版',
chargeType: '按单收费', // 收费方式
price: '0.2元/单', // 价格
radius: 'other',
accountsCount: 100, // 账号数量
rechargeAmount: '首充10000元', // 充值金额
deploymentType: 'SaaS', // 部署方式
featureCustomization: false, // 功能定制
permissionManage: true, // 权限管理
financialManage: true, // 财务管理
statisticalReport: true, // 统计报表
orderManage: true, // 订单管理
logisticsManage: true, // 物流管理
orderStorage: '180天', // 订单数据存储
logsRetainDays: '90天', // 操作日志查看天数
shopCount: 50, // 店铺数量
imageStorage: '4G', // 图片空间
trainingType: '线上培训', // 培训方式
exclusivePM: true, // 专属产品经理
},
{
name: '进阶版',
chargeType: '按单收费', // 收费方式
price: '0.16元/单', // 价格
radius: 'other',
accountsCount: '不限', // 账号数量
rechargeAmount: '首充30000元', // 充值金额
deploymentType: 'SaaS', // 部署方式
featureCustomization: '优化', // 功能定制
permissionManage: true, // 权限管理
financialManage: true, // 财务管理
statisticalReport: true, // 统计报表
orderManage: true, // 订单管理
logisticsManage: true, // 物流管理
orderStorage: '360天', // 订单数据存储
logsRetainDays: '180天', // 操作日志查看天数
shopCount: 100, // 店铺数量
imageStorage: '10G', // 图片空间
trainingType: ['每周线上回访', '每年3次上门回访', '每年3次上门实施'], // 培训方式
exclusivePM: true, // 专属产品经理
},
{
name: '尊享版',
chargeType: '按月收费', // 收费方式
price: 9800, // 价格
radius: 'other',
accountsCount: '不限', // 账号数量
rechargeAmount: '季付', // 充值金额
deploymentType: 'SaaS', // 部署方式
featureCustomization: '优化+通用定制', // 功能定制
permissionManage: true, // 权限管理
financialManage: true, // 财务管理
statisticalReport: true, // 统计报表
orderManage: true, // 订单管理
logisticsManage: true, // 物流管理
orderStorage: '一直存储', // 订单数据存储
logsRetainDays: '360天', // 操作日志查看天数
shopCount: '不限', // 店铺数量
imageStorage: '50G', // 图片空间
trainingType: ['每周线上回访', '每年6次上门回访', '每年4次上门实施'], // 培训方式
exclusivePM: true, // 专属产品经理
},
{
name: '至尊版',
chargeType: '按月收费', // 收费方式
price: 29800, // 价格
radius: 'other',
accountsCount: '不限', // 账号数量
rechargeAmount: '季付', // 充值金额
deploymentType: 'SaaS或阿里云独立部署', // 部署方式
featureCustomization: '支持个性化定制', // 功能定制
permissionManage: true, // 权限管理
financialManage: true, // 财务管理
statisticalReport: true, // 统计报表
orderManage: true, // 订单管理
logisticsManage: true, // 物流管理
orderStorage: '一直存储', // 订单数据存储
logsRetainDays: '360天', // 操作日志查看天数
shopCount: '不限', // 店铺数量
imageStorage: '100G', // 图片空间
trainingType: ['每周线上回访', '每年3次上门回访', '每年6次上门实施'], // 培训方式
exclusivePM: true, // 专属产品经理
},
],
priceColumns: [
{
label: '版本',
value: 'name',
},
{
label: '适用范围',
value: 'radius',
},
{
label: '收费方式',
value: 'chargeType',
},
{
label: '价格',
value: 'price',
},
{ label: '账号数量', value: 'accountsCount' },
{ label: '充值金额', value: 'rechargeAmount' },
{ label: '部署方式', value: 'deploymentType' },
{ label: '功能定制', value: 'featureCustomization' },
{ label: '权限管理', value: 'permissionManage' },
{ label: '财务管理', value: 'financialManage' },
{ label: '统计报表', value: 'statisticalReport' },
{ label: '订单管理', value: 'orderManage' },
{ label: '物流管理', value: 'logisticsManage' },
{ label: '订单数据存储', value: 'orderStorage' },
{ label: '操作日志查看天数', value: 'logsRetainDays' },
{ label: '店铺数量', value: 'shopCount' },
{ label: '图片空间', value: 'imageStorage' },
{
label: '培训方式',
value: 'trainingType',
},
{ label: '专属产品经理', value: 'exclusivePM' },
],
}
},
computed: {
// 转换后的表格标题行
tableColumns() {
return [
this.priceColumns[0].label,
...this.prices.map((i) => i[this.priceColumns[0].value]),
]
},
// 转换后的表格内容
tableData() {
const arr = []
for (let i = 1; i < this.priceColumns.length; i++) {
arr.push([this.priceColumns[i].label])
}
for (const price of this.prices) {
for (let i = 1; i < this.priceColumns.length; i++) {
arr[i - 1].push(price[this.priceColumns[i].value])
}
}
return arr
},
},
methods: {
handleMouseEnter(row, column, cell) {
// 第一列（索引为0）不触发高亮
if (cell && cell.cellIndex === 0) {
this.hoverCol = null
return
}
this.hoverCol = cell ? cell.cellIndex : null
},
handleMouseLeave() {
this.hoverCol = null
},
cellClassName({ columnIndex }) {
return columnIndex === this.hoverCol ? 'col-hover' : ''
},
headerCellClassName({ columnIndex }) {
return columnIndex === this.hoverCol ? 'col-hover' : ''
},
addHeaderEventListeners() {
const table = this.$el.querySelector('.el-table')
if (!table) return
const headerCells = table.querySelectorAll('thead th')
headerCells.forEach((cell, index) => {
// 第一列不添加事件
if (index === 0) return
cell.addEventListener('mouseenter', () => {
this.hoverCol = index
})
cell.addEventListener('mouseleave', () => {
this.hoverCol = null
})
})
},
},
mounted() {
this.$nextTick(() => {
this.addHeaderEventListeners()
})
},
}
</script>
<style scoped>
/* 表头背景色 */
::v-deep .el-table__header th {
background-color: var(--background-color) !important;
}
/* 高亮表格hover */
::v-deep .el-table tbody tr:hover > td {
background-color: #f5f7fa !important;
}
/* 高亮当前列（表头与表体） */
::v-deep .el-table td.col-hover,
::v-deep .el-table th.col-hover {
border-right: 2px solid var(--primary-color);
border-left: 2px solid var(--primary-color);
}
/* 表头顶部边框 */
::v-deep .el-table thead th.col-hover {
border-top: 2px solid var(--primary-color);
background-color: var(--primary-color) !important;
border-radius: 10px 10px 0 0;
color: #ffffff;
}
/* 表体最后一列底部边框 */
::v-deep .el-table tbody tr:last-child td.col-hover {
border-bottom: 2px solid var(--primary-color);
border-radius: 0 0 10px 10px;
}
</style>
src/views/product/productPlatform.vue
...@@ -41,66 +41,6 @@ ...@@ -41,66 +41,6 @@
</div> </div>
</div> </div>
</div> </div>
<div
class="platforms mt-4 grid grid-cols-3 lg:grid-cols-9 gap-x-5 gap-y-8 w-full-70 w-full-90 mx-auto">
<div class="platform-item">
<img src="../../assets/logo1.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo2.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo3.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo4.jpg" />
</div>
<div class="platform-item">
<a href="https://hubs.ly/Q02Y1gQR0" target="_blank">
<img src="../../assets/logo19.png" />
</a>
</div>
<div class="platform-item">
<img src="../../assets/logo6.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo7.png" />
</div>
<div class="platform-item">
<img src="../../assets/logo8.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo9.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo10.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo11.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo12.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo13.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo14.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo15.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo16.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo17.jpg" />
</div>
<div class="platform-item">
<img src="../../assets/logo18.jpg" />
</div>
</div>
</div> </div>
<div class="platform-module mt-12 lg:mt-28"> <div class="platform-module mt-12 lg:mt-28">
<div class="cont-title"> <div class="cont-title">
...@@ -122,7 +62,7 @@ ...@@ -122,7 +62,7 @@
<div class="footer-description"> <div class="footer-description">
选用九猫ERP，让你的跨境电商全面高效增长 选用九猫ERP，让你的跨境电商全面高效增长
</div> </div>
<!----> <button class="footer-register-btn" @click="goToLogin">立即使用</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -136,6 +76,9 @@ import adImg from '../../assets/images/home/04.png' ...@@ -136,6 +76,9 @@ import adImg from '../../assets/images/home/04.png'
export default { export default {
name: 'productPlatform', name: 'productPlatform',
components: { ProductDesc }, components: { ProductDesc },
inject: {
scrollParent: 'scrollParent',
},
data() { data() {
return { return {
moduleItems: [ moduleItems: [
...@@ -694,6 +637,19 @@ export default { ...@@ -694,6 +637,19 @@ export default {
], ],
} }
}, },
methods: {
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
},
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -732,7 +688,7 @@ export default { ...@@ -732,7 +688,7 @@ export default {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 80px 15px; padding: 60px 15px;
background-image: url(../../assets/images/home/06.png); background-image: url(../../assets/images/home/06.png);
background-position-y: bottom; background-position-y: bottom;
background-repeat: no-repeat; background-repeat: no-repeat;
...@@ -755,6 +711,23 @@ export default { ...@@ -755,6 +711,23 @@ export default {
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
} }
} }
.footer-register-btn {
width: 200px;
height: 60px;
display: block;
background: rgba(59, 130, 246, 0.5);
border-radius: 10px;
border: 1px solid #ffffffd8;
font-size: 18px;
color: #e9e9e9;
cursor: pointer;
transition: all 0.3s ease;
}
.footer-register-btn:hover {
background: rgba(255, 255, 255);
color: rgba(59, 130, 246);
}
@media (max-width: 1100px) { @media (max-width: 1100px) {
.left-content { .left-content {
width: 100%; width: 100%;
......
src/views/product/production.vue 0 → 100644
<template>
<div class="productionManagement">
<div class="banner-container">
<div
class="content-container w-3/5 h-1/12 m-auto pt-10 flex flex-col items-center gap-4">
<h3
class="font-semibold text-lg lg:text-3xl text-center lg:text-center">
多业务形态、全场景覆盖
</h3>
</div>
<div
class="lg:h-112 h-full flex flex-wrap justify-center items-center gap-2 lg:gap-1 my-6 m-auto">
<div
v-for="(item, index) in videos"
:key="index"
class="video-bg w-1/4 lg:w-40 h-40 lg:h-96 rounded-sm flex flex-col items-center justify-center cursor-pointer border-solid border-2 border-white transition-all duration-300 text-xs lg:text-base lg:hover:w-80 lg:hover:h-104"
@click="playVideo(item.link)">
<!-- 默认样式 -->
<div
class="video-content-default flex flex-col items-center justify-center">
<Icon
class="mb-8 lg:h-10 h-5 w-5 lg:w-10"
icon="icon-park-solid:play" />
<div class="mb-3">{{ item.title }}</div>
<div>{{ item.subTitle }}</div>
</div>
<!-- hover样式 -->
<div class="video-content-hover text-2xl">
<div>{{ item.title + item.subTitle }}</div>
<div class="divider"></div>
<Icon
class="mb-8"
icon="icon-park-solid:play"
width="45"
height="
45" />
</div>
</div>
</div>
</div>
<div class="h-full py-10" ref="tabsSection">
<div
class="pt-10 w-full m-auto flex justify-center items-center gap-8 lg:gap-20">
<div
class="product-tabs-item lg:w-48 font-semibold text-gray-500 flex flex-col items-center gap-2 cursor-pointer"
:class="{ active: activeTab === item.key }"
v-for="item in productNavs"
@click="onClickTab(item.key)"
:key="item.key">
<Icon :icon="item.icon" class="lg:w-10 w-4 lg:h-10 h-4" />
<span class="lg:text-base text-xs">{{ item.name }}</span>
<div
class="active-line"
:class="{ active: activeTab === item.key }"></div>
</div>
</div>
<!-- 九猫ERP -->
<div
v-if="activeTab === 'product'"
class="flex flex-col items-center justify-center bg-white lg:p-10 py-5 lg:w-3/5 w-full m-auto">
<img
class="erp-image"
src="../../assets/images/product/erp/01.png"
alt="九猫ERP01" />
<img
class="erp-image"
src="../../assets/images/product/erp/02.png"
alt="九猫ERP02" />
<img
class="erp-image"
src="../../assets/images/product/erp/03.png"
alt="九猫ERP03" />
<img
class="erp-image"
src="../../assets/images/product/erp/04.png"
alt="九猫ERP04" />
<img
class="erp-image"
src="../../assets/images/product/erp/05.png"
alt="九猫ERP05" />
<img
class="erp-image"
src="../../assets/images/product/erp/06.png"
alt="九猫ERP06" />
</div>
<!-- POD和满印供应链 -->
<div
class="custom-content w-full"
v-else-if="activeTab === 'custom-chain'">
<div class="flex flex-col m-auto">
<h2 class="text-center mt-10">业务介绍</h2>
<div
class="lg:w-8/12 w-full px-5 lg:px-0 m-auto flex justify-around items-center gap-32">
<div class="video-container w-1/3">
<video
width="100%"
class="video"
src="../../assets/video/abount-jomalls2-video.mp4"
controls></video>
</div>
<div class="w-2/3 h-full lg:text-base text-xs font-light">
<p>
九猫（西安）科技有限公司成立于2022年，致力于为企业出海提供降本提效的全域数智化一站式管理解决方案
</p>
<p class="mt-5">
九猫科技核心团队拥有超过7年的跨境电商ERP开发经验，设计及开发过的项目覆盖产品管理系统，订单管理系统，供应链系统，供应商系统，生产管理系统，仓库管理系统，营销系统，OA系统等等。
</p>
<p class="mt-5">
2022年开始转型并专注于DTC独立站平台的产品与服务，自主研发并推出“九猫ERP软件“。
大数据集成商家平台、营销、供应链、仓储物流、财务、报表等模块，纵向打通资源，横向综合业务，全方位深度赋能。
</p>
<p class="mt-5">
九猫人始终秉承着“顾客至上”的经营理念，以“保障用户数据安全、关心客户使用体验、促进产品不断创新”为己任，意在帮助更多的跨境电商企业实现精细化管理和数字化建设。
</p>
</div>
</div>
</div>
<div class="flex flex-col w-3/4 m-auto">
<h2 class="text-center mt-10">Jomall快捷生产</h2>
<div class="w-full flex justify-around items-center">
<div>
<div class="flex flex-col">
<h4>快捷订单生产</h4>
<div class="desc-item">拣胚单、生产单一图一码，生产精准</div>
<div class="desc-item">多种方式排产，不易浪费</div>
<div class="desc-item">订单时间处理快</div>
<div class="desc-item">数据可追踪，责任到人</div>
<div class="desc-item">机器、系统API对接(数据直接传输)</div>
</div>
<div class="flex flex-col">
<h4>传统订单生产</h4>
<div class="desc-item">EXCEL表格或纸质对接</div>
<div class="desc-item">依赖经验，滞后人工统计</div>
<div class="desc-item">人工排产，易出错浪费</div>
<div class="desc-item">生产计划相应反应较慢</div>
<div class="desc-item">订单时间处理时间长</div>
<div class="desc-item">生产错误率高</div>
</div>
</div>
<img
width="800"
src="../../assets/images/product/costom/01.png"
alt="Jomall快捷生产" />
</div>
</div>
<div class="w-10/12 m-auto flex flex-col">
<h2 class="text-center mt-10">工艺优势</h2>
<div class="flex justify-around">
<div class="craft-item">
<div class="cirque"></div>
<div class="square">
数码
<br />
直喷
</div>
<div class="desc-craft">
通过在衣服上直接喷射彩色墨水的方式打印
</div>
<div class="flex justify-around gap-10">
<div class="craft-machine">
<h4>GTX PRO B</h4>
<img
src="../../assets/images/product/costom/gtxprob.png"
alt="GTX PRO B" />
<div>
<div class="machine-desc">满足工业级服装打印生产需求</div>
<div class="machine-desc">
高速打印颜色丰富、精维的设计图案
</div>
<div class="machine-desc">最大打印尺寸40.6cm × 53.3cm</div>
<div class="machine-desc">纯棉等天然纤维面料的效果更好</div>
</div>
</div>
<div class="craft-machine">
<h4>GTX 600</h4>
<img
src="../../assets/images/product/costom/gtx600.png"
alt="GTX 600" />
<div>
<div class="machine-desc">满足工业级服装打印生产需求</div>
<div class="machine-desc">高饱和度打印</div>
<div class="machine-desc">最大打印尺寸61cm × 61cm</div>
<div class="machine-desc">纯棉等天然纤维面料的效果更好</div>
</div>
</div>
</div>
</div>
<div class="craft-item">
<div class="cirque"></div>
<div class="square">
白墨
<br />
烫画
</div>
<div class="desc-craft">
图案打印在特殊转印膜上通过高温和压力将图案转印到织物
</div>
<div class="craft-machine">
<h4>数码白墨烫画机</h4>
<img
src="../../assets/images/product/costom/th.png"
alt="数码白墨烫画机" />
<div>
<div class="machine-desc">
进口板卡，白彩同出套位精准，易撕不易裂
</div>
<div class="machine-desc">自检系统、自动上粉抖粉、搅拌</div>
<div class="machine-desc">
适用于多种面料，包括、涤棉、化纤等
</div>
</div>
</div>
</div>
<div class="craft-item">
<div class="cirque"></div>
<div class="square">
单头
<br />
刺绣
</div>
<div class="desc-craft">15单针绣到织物上</div>
<div class="craft-machine">
<h4>刺绣机</h4>
<img
src="../../assets/images/product/costom/cx.png"
alt="刺绣机" />
<div>
<div class="machine-desc">
支持平绣、成帽绣、成衣绣、袜子绣、口袋绣、八合一、绳子绣、成鞋绣
</div>
<div class="machine-desc">平绣面积400cm × 600cm</div>
<div class="machine-desc">帽绣面积360cm × 80cm</div>
<div class="machine-desc">成衣绣面积300cm × 300cm</div>
</div>
</div>
</div>
</div>
</div>
<div class="flex m-auto flex-col">
<h2 class="text-center mt-10">满印供应链</h2>
<div class="w-8/12 m-auto flex justify-around gap-32">
<div class="w-1/2">
<div class="text-gray-500 text-base mb-4">
LA
POD位于广东省广州市番禺区，支持白墨烫画，直喷、刺绣等多种工艺，自营车间规划近12台PRO
B直喷机以及X600机器;搭载自动化分拣系统，折衣、打包等全自动流水线提升订单处理效率与准确性，九猫物流衔接全球物流渠道，优化尾程配送时效成本
</div>
<img
src="../../assets/images/product/costom/01.png"
alt="满印供应链" />
</div>
<div class="w-1/2">
<img
src="../../assets/images/product/costom/02.png"
alt="工厂地址" />
<div class="text-gray-800 font-bold text-lg mt-4">
<div>工厂名称：九猫中国供应链</div>
<div>工厂地址：中国广东省广州市番禺区兴南大道403号</div>
</div>
</div>
</div>
</div>
</div>
<!-- 九猫美国供应链 -->
<div v-else-if="activeTab === 'supply-chain'">
<div class="flex flex-col m-auto">
<h2 class="text-center mt-10">业务介绍</h2>
<div class="w-8/12 m-auto flex justify-around items-center gap-32">
<div class="video-container">
<video
width="100%"
class="video"
src="../../assets/video/abount-jomalls2-video.mp4"
controls></video>
</div>
<div class="w-2/3 h-full text-base font-light">
<p>
九猫（西安）科技有限公司成立于2022年，致力于为企业出海提供降本提效的全域数智化一站式管理解决方案
</p>
<p class="mt-5">
九猫科技核心团队拥有超过7年的跨境电商ERP开发经验，设计及开发过的项目覆盖产品管理系统，订单管理系统，供应链系统，供应商系统，生产管理系统，仓库管理系统，营销系统，OA系统等等。
</p>
<p class="mt-5">
2022年开始转型并专注于DTC独立站平台的产品与服务，自主研发并推出“九猫ERP软件“。
大数据集成商家平台、营销、供应链、仓储物流、财务、报表等模块，纵向打通资源，横向综合业务，全方位深度赋能。
</p>
<p class="mt-5">
九猫人始终秉承着“顾客至上”的经营理念，以“保障用户数据安全、关心客户使用体验、促进产品不断创新”为己任，意在帮助更多的跨境电商企业实现精细化管理和数字化建设。
</p>
</div>
</div>
<h2 class="w-full text-center">Jomall快捷生产</h2>
<div class="w-full flex justify-around items-center">
<div>
<div class="flex flex-col">
<h4>快捷订单生产</h4>
<div class="desc-item">拣胚单、生产单一图一码，生产精准</div>
<div class="desc-item">多种方式排产，不易浪费</div>
<div class="desc-item">订单时间处理快</div>
<div class="desc-item">数据可追踪，责任到人</div>
<div class="desc-item">机器、系统API对接(数据直接传输)</div>
</div>
<div class="flex flex-col">
<h4>传统订单生产</h4>
<div class="desc-item">EXCEL表格或纸质对接</div>
<div class="desc-item">依赖经验，滞后人工统计</div>
<div class="desc-item">人工排产，易出错浪费</div>
<div class="desc-item">生产计划相应反应较慢</div>
<div class="desc-item">订单时间处理时间长</div>
<div class="desc-item">生产错误率高</div>
</div>
</div>
<img
width="800"
src="../../assets/images/product/costom/01.png"
alt="Jomall快捷生产" />
</div>
</div>
<div class="w-10/12 m-auto flex flex-col">
<h2 class="text-center mt-10">工艺优势</h2>
<div class="flex justify-around">
<div class="craft-item">
<div class="cirque"></div>
<div class="square">
数码
<br />
直喷
</div>
<div class="desc-craft">
通过在衣服上直接喷射彩色墨水的方式打印
</div>
<div class="flex justify-around gap-10">
<div class="craft-machine">
<h4>GTX PRO B</h4>
<img
src="../../assets/images/product/costom/gtxprob.png"
alt="GTX PRO B" />
<div>
<div class="machine-desc">满足工业级服装打印生产需求</div>
<div class="machine-desc">
高速打印颜色丰富、精维的设计图案
</div>
<div class="machine-desc">最大打印尺寸40.6cm × 53.3cm</div>
<div class="machine-desc">纯棉等天然纤维面料的效果更好</div>
</div>
</div>
<div class="craft-machine">
<h4>GTX 600</h4>
<img
src="../../assets/images/product/costom/gtx600.png"
alt="GTX 600" />
<div>
<div class="machine-desc">满足工业级服装打印生产需求</div>
<div class="machine-desc">高饱和度打印</div>
<div class="machine-desc">最大打印尺寸61cm × 61cm</div>
<div class="machine-desc">纯棉等天然纤维面料的效果更好</div>
</div>
</div>
</div>
</div>
<div class="flex">
<Icon
class="mt-5"
icon="foundation:arrow-left"
width="150"
color="var(--el-color-primary-light-7)" />
<div class="flex flex-col items-center gap-4">
<img
width="300"
src="../../assets/images/product/supply/01.png"
alt="数码直喷" />
<img
width="300"
src="../../assets/images/product/supply/02.png"
alt="白墨烫画" />
</div>
<Icon
class="self-end mb-5"
icon="foundation:arrow-right"
width="150"
color="var(--el-color-primary-light-7)" />
</div>
<div class="craft-item">
<div class="cirque"></div>
<div class="square">
白墨
<br />
烫画
</div>
<div class="desc-craft">
图案打印在特殊转印膜上通过高温和压力将图案转印到织物
</div>
<div class="craft-machine">
<h4>数码白墨烫画机</h4>
<img
src="../../assets/images/product/costom/th.png"
alt="数码白墨烫画机" />
<div>
<div class="machine-desc">
进口板卡，白彩同出套位精准，易撕不易裂
</div>
<div class="machine-desc">自检系统、自动上粉抖粉、搅拌</div>
<div class="machine-desc">
适用于多种面料，包括、涤棉、化纤等
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 九猫物流 -->
<div
v-else-if="activeTab === 'logistics'"
class="flex items-center justify-center bg-white lg:p-10 py-5 lg:w-3/5 w-full">
<img
class="erp-image"
src="../../assets/images/product/logistic/01.png"
alt="九猫物流01" />
</div>
</div>
<div class="video-cont" :class="playIcon ? 'active' : ''">
<div class="video-player">
<video
ref="player"
controls
:src="currentVideoSrc"
class="video"></video>
<i class="el-icon-circle-close" @click="closeVideo"></i>
</div>
</div>
</div>
</template>
<script>
import { Icon } from '@iconify/vue2'
export default {
name: 'productionManagement',
inject: {
scrollParent: 'scrollParent',
},
components: {
Icon,
},
data() {
return {
activeTab: 'product',
productNavs: [
{
name: '九猫ERP',
key: 'product',
icon: 'ant-design:product-filled',
},
{
name: 'POD和满印供应链',
key: 'custom-chain',
icon: 'tabler:paint',
},
{
name: '九猫美国供应链',
key: 'supply-chain',
icon: 'fa7-solid:earth',
},
{
name: '九猫物流',
key: 'logistics',
icon: 'mdi:truck-fast-outline',
},
],
videos: [
{
title: '电商ERP',
subTitle: '解决方案',
link: require('../../assets/video/abount-jomalls2-video.mp4'),
},
{
title: '云仓',
subTitle: '解决方案',
link: require('../../assets/video/abount-jomalls2-video.mp4'),
},
{
title: '快速了解',
subTitle: '九猫',
link: require('../../assets/video/abount-jomalls2-video.mp4'),
},
{
title: '产销一体化',
subTitle: '解决方案',
link: require('../../assets/video/abount-jomalls2-video.mp4'),
},
{
title: '分销数字一体化',
subTitle: '解决方案',
link: require('../../assets/video/abount-jomalls2-video.mp4'),
},
],
currentVideo: 3,
playIcon: false,
currentVideoSrc: '',
}
},
created() {
const tab = this.$route && this.$route.query && this.$route.query.tab
const validKeys = ['product', 'custom-chain', 'supply-chain', 'logistics']
if (validKeys.includes(tab)) {
this.activeTab = tab
}
},
mounted() {
const tab = this.$route && this.$route.query && this.$route.query.tab
const validKeys = ['product', 'custom-chain', 'supply-chain', 'logistics']
if (validKeys.includes(tab)) {
this.scrollToTabs()
}
},
watch: {
'$route.query.tab'(newTab) {
const validKeys = ['product', 'custom-chain', 'supply-chain', 'logistics']
if (validKeys.includes(newTab)) {
this.activeTab = newTab
this.scrollToTabs()
}
},
},
methods: {
scrollToTabs() {
this.$nextTick(() => {
const el = this.$refs && this.$refs.tabsSection
const container = this.scrollParent && this.scrollParent()
if (!el || !container) return
const rect = el.getBoundingClientRect()
const containerRect = container.getBoundingClientRect()
const current = container.scrollTop || 0
const headerOffset = 80
const delta = rect.top - containerRect.top
const top = current + delta - headerOffset
container.scrollTo({ top, behavior: 'smooth' })
})
},
onClickTab(key) {
this.activeTab = key
const query = Object.assign({}, this.$route.query, { tab: key })
this.$router.replace({ path: this.$route.path, query }).catch(() => {})
this.scrollToTabs()
},
async goToLogin() {
await this.$router.push('/home').catch(() => {})
},
playVideo(videoSrc) {
this.currentVideoSrc = videoSrc
this.playIcon = true
this.$nextTick(() => {
this.$refs.player.play()
})
},
closeVideo() {
this.playIcon = false
this.$refs.player.pause()
this.currentVideoSrc = ''
},
},
}
</script>
<style scoped lang="scss">
.video-bg {
position: relative;
color: var(--secondary-text-color);
background-color: var(--background-color);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360' viewBox='0 0 360 360'%3E%3Cpath fill='%23f6be9d' fill-opacity='0.13' d='M0 85.02l4.62-4.27a49.09 49.09 0 0 0 7.33 3.74l-1.2 10.24 2.66.87 5.05-9c2.62.65 5.34 1.08 8.12 1.28L28.6 98h2.8l2.02-10.12c2.74-.2 5.46-.62 8.12-1.28l5.05 8.99 2.66-.86-1.2-10.24c2.55-1.03 5-2.29 7.33-3.74l7.58 7 2.26-1.65-4.3-9.38a48.3 48.3 0 0 0 5.8-5.8l9.38 4.3 1.65-2.26-7-7.58a49.09 49.09 0 0 0 3.74-7.33l10.24 1.2.87-2.66-9-5.05a48.07 48.07 0 0 0 1.28-8.12L88 41.4v-2.8l-10.12-2.02c-.2-2.74-.62-5.46-1.28-8.12l8.99-5.05-.86-2.66-10.24 1.2c-1.03-2.55-2.29-5-3.74-7.33l7-7.58-1.65-2.26-9.38 4.3a48.3 48.3 0 0 0-5.8-5.8L62.42 0h2.16l-1.25 2.72a50.31 50.31 0 0 1 3.95 3.95l9.5-4.36 3.52 4.85-7.08 7.68c.94 1.6 1.79 3.27 2.54 4.98l10.38-1.21 1.85 5.7-9.11 5.12c.39 1.8.68 3.65.87 5.52L90 37v6l-10.25 2.05a49.9 49.9 0 0 1-.87 5.52l9.11 5.12-1.85 5.7-10.38-1.21c-.75 1.7-1.6 3.37-2.54 4.98l7.08 7.68-3.52 4.85-9.5-4.36a50.31 50.31 0 0 1-3.95 3.95l4.36 9.5-4.85 3.52-7.68-7.08c-1.6.94-3.27 1.79-4.98 2.54l1.21 10.38-5.7 1.85-5.12-9.11c-1.8.39-3.65.68-5.52.87L33 100h-6l-2.05-10.25a49.9 49.9 0 0 1-5.52-.87l-5.12 9.11-5.7-1.85 1.21-10.38c-1.7-.75-3.37-1.6-4.98-2.54L0 87.68v-2.66zM0 52.7V27.3l8.38 4.84a22.96 22.96 0 0 0 0 15.72L0 52.7zm0-39.16A39.91 39.91 0 0 1 26 .2v17.15a22.98 22.98 0 0 0-13.62 7.86L0 18.06v-4.52zm0 52.92v-4.52l12.38-7.15A22.98 22.98 0 0 0 26 62.65V79.8A39.91 39.91 0 0 1 0 66.46zM34 79.8V62.65a22.98 22.98 0 0 0 13.62-7.86l14.85 8.58A39.97 39.97 0 0 1 34 79.8zm32.48-23.36l-14.86-8.58a22.96 22.96 0 0 0 0-15.72l14.86-8.58A39.86 39.86 0 0 1 70 40a39.9 39.9 0 0 1-3.52 16.44zm-4.01-39.8L47.62 25.2A22.98 22.98 0 0 0 34 17.35V.2a39.97 39.97 0 0 1 28.47 16.43v.01zM0 50.38l5.98-3.45a25.01 25.01 0 0 1 0-13.88L0 29.6v20.78zm.5-34.35l11.48 6.63c3.27-3.4 7.44-5.8 12.02-6.94V2.47A37.96 37.96 0 0 0 .5 16.04v-.01zm0 47.92A37.96 37.96 0 0 0 24 77.53V64.28a24.97 24.97 0 0 1-12.02-6.95L.5 63.96v-.01zM36 77.53a37.96 37.96 0 0 0 23.5-13.57l-11.48-6.63A24.97 24.97 0 0 1 36 64.28v13.25zm29.5-23.96a37.91 37.91 0 0 0 0-27.14l-11.48 6.63a25.01 25.01 0 0 1 0 13.88l11.49 6.63h-.01zm-6-37.53A37.96 37.96 0 0 0 36 2.47v13.25c4.66 1.15 8.8 3.6 12.02 6.95l11.48-6.63zM30 54a14 14 0 1 1 0-28 14 14 0 0 1 0 28zm0-2a12 12 0 1 0 0-24 12 12 0 0 0 0 24zm0-2a10 10 0 1 1 0-20 10 10 0 0 1 0 20zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm77.47 45.17l-1.62-5.97 5.67-2.06 2.61 5.64c1.09-.25 2.2-.44 3.33-.58l.52-6.2h6.04l.52 6.2c1.13.14 2.24.33 3.33.58l2.6-5.64 5.68 2.06-1.62 5.97c1.02.51 2 1.07 2.95 1.69l4.35-4.38 4.62 3.88-3.53 5c.8.84 1.53 1.71 2.23 2.62l5.52-2.6 3.02 5.23-4.98 3.46c.46 1.06.86 2.14 1.2 3.25l6.02-.54 1.05 5.94-5.84 1.54c.07 1.16.07 2.32 0 3.48l5.84 1.54-1.05 5.94-6.02-.54c-.34 1.1-.74 2.2-1.2 3.25l4.98 3.46-3.02 5.22-5.52-2.6c-.7.92-1.44 1.8-2.23 2.62l3.53 5-4.62 3.89-4.35-4.38a30.2 30.2 0 0 1-2.95 1.69l1.62 5.97-5.67 2.06-2.61-5.64c-1.09.25-2.2.44-3.33.58l-.52 6.2h-6.04l-.52-6.2a30.27 30.27 0 0 1-3.33-.58l-2.6 5.64-5.68-2.06 1.62-5.97c-1.01-.5-2-1.07-2.95-1.69l-4.35 4.38-4.62-3.88 3.53-5a32.5 32.5 0 0 1-2.23-2.62l-5.52 2.6-3.02-5.23 4.98-3.46a29.66 29.66 0 0 1-1.2-3.25l-6.02.54-1.05-5.94 5.84-1.54a30.28 30.28 0 0 1 0-3.48l-5.84-1.54 1.05-5.94 6.02.54c.34-1.1.74-2.2 1.2-3.25l-4.98-3.46 3.02-5.22 5.52 2.6c.7-.92 1.44-1.8 2.23-2.62l-3.53-5 4.62-3.89 4.35 4.38a30.2 30.2 0 0 1 2.95-1.69zm15.2-1.12l-.5-6.05h-2.34l-.5 6.05c-2.18.13-4.3.5-6.32 1.1l-2.54-5.5-2.2.8 1.6 5.85a27.97 27.97 0 0 0-5.56 3.21l-4.27-4.3-1.79 1.5 3.5 4.95a28.14 28.14 0 0 0-4.12 4.92l-5.5-2.59-1.16 2.02 4.98 3.46a27.8 27.8 0 0 0-2.2 6.03l-6.03-.55-.4 2.3 5.86 1.54a28.3 28.3 0 0 0 0 6.42l-5.87 1.55.4 2.3 6.05-.56a27.8 27.8 0 0 0 2.2 6.03l-5 3.47 1.17 2.02 5.49-2.59a28.14 28.14 0 0 0 4.12 4.92l-3.5 4.96 1.79 1.5 4.27-4.31a27.97 27.97 0 0 0 5.56 3.21l-1.6 5.85 2.2.8 2.54-5.5c2.02.6 4.14.97 6.32 1.1l.5 6.05h2.34l.5-6.05c2.18-.13 4.3-.5 6.32-1.1l2.54 5.5 2.2-.8-1.6-5.85a27.97 27.97 0 0 0 5.56-3.21l4.27 4.3 1.79-1.5-3.5-4.95a28.14 28.14 0 0 0 4.12-4.92l5.5 2.59 1.16-2.02-4.98-3.46a27.8 27.8 0 0 0 2.2-6.03l6.03.55.4-2.3-5.86-1.54a28.3 28.3 0 0 0 0-6.42l5.87-1.55-.4-2.3-6.05.56a27.8 27.8 0 0 0-2.2-6.03l4.99-3.46-1.17-2.02-5.49 2.59a28.14 28.14 0 0 0-4.12-4.92l3.5-4.96-1.79-1.5-4.27 4.31a27.97 27.97 0 0 0-5.56-3.21l1.6-5.85-2.2-.8-2.54 5.5c-2.02-.6-4.14-.97-6.32-1.1l.01-.01zM121 128a8 8 0 1 1 0-16 8 8 0 0 1 0 16zm0-2a6 6 0 1 0 0-12 6 6 0 0 0 0 12zm0-18a5 5 0 1 1 0-10 5 5 0 0 1 0 10zm8.49 3.51a5 5 0 1 1 6.95-7.2 5 5 0 0 1-6.95 7.2zM133 120a5 5 0 1 1 10 0 5 5 0 0 1-10 0zm-3.51 8.49a5 5 0 1 1 7.2 6.95 5 5 0 0 1-7.2-6.95zM121 132a5 5 0 1 1 0 10 5 5 0 0 1 0-10zm-8.49-3.51a5 5 0 1 1-6.95 7.2 5 5 0 0 1 6.95-7.2zM109 120a5 5 0 1 1-10 0 5 5 0 0 1 10 0zm3.51-8.49a5 5 0 1 1-7.2-6.95 5 5 0 0 1 7.2 6.95zM121 106a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm9.9 4.1a3 3 0 1 0 4.39-4.09 3 3 0 0 0-4.39 4.09zm4.1 9.9a3 3 0 1 0 6 0 3 3 0 0 0-6 0zm-4.1 9.9a3 3 0 1 0 4.09 4.39 3 3 0 0 0-4.09-4.39zM121 134a3 3 0 1 0 0 6 3 3 0 0 0 0-6zm-9.9-4.1a3 3 0 1 0-4.39 4.09 3 3 0 0 0 4.39-4.09zM107 120a3 3 0 1 0-6 0 3 3 0 0 0 6 0zm4.1-9.9a3 3 0 1 0-4.09-4.39 3 3 0 0 0 4.09 4.39zm129.42-6.95v.01c.87.07 1.74.17 2.6.3l1.5-3.91 1.94-3.64 3.89.97v4.13l-.5 4.13c.83.28 1.64.59 2.44.93l2.42-3.43 2.76-3.07 3.54 1.88-1 4-1.49 3.89c.73.47 1.45.97 2.15 1.49l3.19-2.76 3.42-2.3 2.97 2.67-1.93 3.65-2.38 3.4c.6.64 1.2 1.3 1.76 1.99l3.68-1.94 3.85-1.48 2.29 3.28-2.7 3.11-3.12 2.82c.43.76.84 1.53 1.22 2.32l4.04-1 4.1-.5 1.43 3.73-3.37 2.37-3.7 1.98c.23.84.44 1.68.62 2.54l4.17.01 4.1.5.48 3.97-3.85 1.48-4.06 1.02c.03.87.03 1.75 0 2.62l4.06 1.02 3.85 1.48-.48 3.97-4.1.51h-4.17c-.18.86-.39 1.71-.63 2.54l3.7 1.98 3.38 2.37-1.43 3.73-4.1-.5-4.04-1c-.38.79-.79 1.56-1.22 2.32l3.13 2.82 2.7 3.11-2.3 3.28-3.85-1.48-3.68-1.95a37 37 0 0 1-1.76 2l2.38 3.41 1.93 3.64-2.97 2.67-3.42-2.3-3.19-2.76a40.1 40.1 0 0 1-2.15 1.48l1.48 3.9 1 4-3.53 1.88-2.76-3.07-2.42-3.43c-.8.33-1.61.65-2.45.93l.5 4.13v4.13l-3.88.97-1.94-3.65-1.5-3.9c-.86.13-1.73.23-2.6.31L240 187l-1 4h-4l-1-4-.52-4.16a37.6 37.6 0 0 1-2.6-.3l-1.5 3.91-1.94 3.64-3.89-.97v-4.13l.5-4.13c-.83-.28-1.64-.59-2.44-.93l-2.42 3.43-2.76 3.07-3.54-1.88 1-4 1.49-3.89c-.74-.47-1.45-.97-2.15-1.49l-3.19 2.76-3.42 2.3-2.97-2.67 1.93-3.65 2.38-3.4c-.61-.65-1.2-1.31-1.76-1.99l-3.68 1.94-3.85 1.48-2.29-3.28 2.7-3.11 3.12-2.82c-.43-.76-.84-1.53-1.22-2.32l-4.04 1-4.1.5-1.43-3.73 3.37-2.37 3.7-1.98c-.23-.84-.44-1.68-.62-2.54l-4.17-.01-4.1-.5-.48-3.97 3.85-1.48 4.06-1.02c-.03-.87-.03-1.75 0-2.62l-4.06-1.02-3.85-1.48.48-3.97 4.1-.51h4.17c.18-.86.39-1.71.63-2.54l-3.7-1.98-3.38-2.37 1.43-3.73 4.1.5 4.04 1c.38-.79.79-1.56 1.22-2.32l-3.13-2.82-2.7-3.11 2.3-3.28 3.85 1.48 3.68 1.95a37 37 0 0 1 1.76-2l-2.38-3.41-1.93-3.64 2.97-2.67 3.42 2.3 3.19 2.76c.7-.52 1.41-1.02 2.15-1.48l-1.48-3.9-1-4 3.53-1.88 2.76 3.07 2.42 3.43c.8-.33 1.61-.65 2.45-.93l-.5-4.13v-4.13l3.88-.97 1.94 3.65 1.5 3.9c.86-.13 1.73-.23 2.6-.31L234 99l1-4h4l1 4 .52 4.15zm-14.3 3.4c-1.83.54-3.6 1.21-5.3 2l-3.5-4.97-1.38-1.53-.88.47.5 2 2.16 5.67a38.09 38.09 0 0 0-4.66 3.22l-4.61-4-1.71-1.15-.75.67.97 1.82 3.47 4.98a38.22 38.22 0 0 0-3.79 4.28l-5.37-2.84-1.92-.74-.57.82 1.35 1.56 4.52 4.09a37.9 37.9 0 0 0-2.64 5l-5.89-1.45-2.04-.25-.36.94 1.69 1.18 5.36 2.87a37.74 37.74 0 0 0-1.35 5.5l-6.08.01-2.04.25-.12 1 1.92.73 5.9 1.5a38.54 38.54 0 0 0 0 5.65l-5.9 1.49-1.92.74.12.99 2.04.25 6.08.01c.31 1.86.77 3.7 1.35 5.5l-5.36 2.87-1.7 1.18.37.94 2.04-.25 5.9-1.46a37.9 37.9 0 0 0 2.63 5.01l-4.52 4.1-1.35 1.55.57.82 1.92-.74 5.37-2.84a38.22 38.22 0 0 0 3.8 4.28l-3.48 4.98-.97 1.82.75.67 1.7-1.15 4.62-4a38.09 38.09 0 0 0 4.66 3.22l-2.17 5.67-.5 2 .89.47 1.38-1.53 3.5-4.98c1.7.8 3.47 1.47 5.3 2l-.73 6.04v2.06l.97.24.97-1.82 2.2-5.68c1.83.36 3.7.6 5.62.68L236 187l.5 2h1l.5-2 .75-6.04a38.2 38.2 0 0 0 5.62-.68l2.2 5.68.97 1.82.97-.24v-2.06l-.73-6.03c1.83-.54 3.6-1.21 5.3-2l3.5 4.97 1.38 1.53.88-.47-.5-2-2.16-5.67a38.09 38.09 0 0 0 4.66-3.22l4.61 4 1.71 1.15.75-.67-.97-1.82-3.47-4.98a38.22 38.22 0 0 0 3.79-4.28l5.37 2.84 1.92.74.57-.82-1.35-1.56-4.52-4.09c1-1.6 1.88-3.27 2.64-5l5.89 1.45 2.04.25.36-.94-1.69-1.18-5.36-2.87a37.4 37.4 0 0 0 1.35-5.5l6.08-.01 2.04-.25.12-1-1.92-.73-5.9-1.5c.14-1.88.14-3.77 0-5.65l5.9-1.49 1.92-.74-.12-.99-2.04-.25-6.08-.01a37.4 37.4 0 0 0-1.35-5.5l5.36-2.87 1.7-1.18-.37-.94-2.04.25-5.9 1.46a37.9 37.9 0 0 0-2.63-5.01l4.52-4.1 1.35-1.55-.57-.82-1.92.74-5.37 2.84a38.22 38.22 0 0 0-3.8-4.28l3.48-4.98.97-1.82-.75-.67-1.7 1.15-4.62 4a38.09 38.09 0 0 0-4.66-3.22l2.17-5.67.5-2-.89-.47-1.38 1.53-3.5 4.98c-1.7-.8-3.47-1.47-5.3-2l.73-6.04v-2.06l-.97-.24-.97 1.82-2.2 5.68c-1.83-.36-3.7-.6-5.62-.68L238 99l-.5-2h-1l-.5 2-.75 6.04c-1.92.09-3.8.32-5.62.68l-2.2-5.68-.97-1.82-.97.24v2.06l.73 6.03zm-5.85 5.65A34.82 34.82 0 0 1 236 108v6a28.8 28.8 0 0 0-12.63 3.39l-3-5.2v.01zm2.8.83l1 1.74a30.8 30.8 0 0 1 9.83-2.63v-2.01a32.8 32.8 0 0 0-10.83 2.9zm-4.53.17l3 5.2a29.12 29.12 0 0 0-9.24 9.24l-5.2-3a35.18 35.18 0 0 1 11.44-11.44zm-.67 2.84a33.19 33.19 0 0 0-7.93 7.93l1.74 1a31.18 31.18 0 0 1 7.2-7.2l-1.01-1.73zm-11.77 10.33h-.01l5.2 3A28.8 28.8 0 0 0 208 142h-6a34.82 34.82 0 0 1 4.2-15.63zm.83 2.8a32.8 32.8 0 0 0-2.9 10.83h2.01a30.8 30.8 0 0 1 2.63-9.83l-1.74-1zM202.01 144h6.01c.15 4.41 1.3 8.73 3.38 12.63l-5.2 3a34.82 34.82 0 0 1-4.19-15.63zm2.12 2a32.8 32.8 0 0 0 2.9 10.84l1.74-1a30.8 30.8 0 0 1-2.63-9.84h-2.01zm3.07 15.36l5.2-3c2.34 3.74 5.5 6.9 9.24 9.24l-3 5.2a35.18 35.18 0 0 1-11.44-11.44zm2.84.67a33.19 33.19 0 0 0 7.93 7.93l1-1.74a31.18 31.18 0 0 1-7.2-7.2l-1.73 1.01zm10.33 11.77v.01l3-5.2A28.85 28.85 0 0 0 236 172v6a34.82 34.82 0 0 1-15.63-4.2zm2.8-.83a32.8 32.8 0 0 0 10.83 2.9v-2.01a30.8 30.8 0 0 1-9.83-2.63l-1 1.74zm14.83 5.02v-6.01c4.41-.15 8.73-1.3 12.63-3.38l3 5.2a34.82 34.82 0 0 1-15.63 4.19zm2-2.12a32.8 32.8 0 0 0 10.84-2.9l-1-1.74a30.8 30.8 0 0 1-9.84 2.63v2.01zm15.36-3.07l-3-5.2c3.74-2.34 6.9-5.5 9.24-9.24l5.2 3a35.18 35.18 0 0 1-11.44 11.44zm.67-2.84a33.19 33.19 0 0 0 7.93-7.93l-1.74-1a31.18 31.18 0 0 1-7.2 7.2l1.01 1.73zm11.77-10.33h.01l-5.2-3A28.85 28.85 0 0 0 266 144h6a34.82 34.82 0 0 1-4.2 15.63zm-.83-2.8a32.8 32.8 0 0 0 2.9-10.83h-2.01a30.8 30.8 0 0 1-2.63 9.83l1.74 1zm5.02-14.83h-6.01a28.85 28.85 0 0 0-3.38-12.63l5.2-3a34.82 34.82 0 0 1 4.19 15.63zm-2.12-2a32.8 32.8 0 0 0-2.9-10.84l-1.74 1a30.8 30.8 0 0 1 2.63 9.84h2.01zm-3.07-15.36l-5.2 3a29.12 29.12 0 0 0-9.24-9.24l3-5.2a35.18 35.18 0 0 1 11.44 11.44zm-2.84-.67a33.19 33.19 0 0 0-7.93-7.93l-1 1.74a31.18 31.18 0 0 1 7.2 7.2l1.73-1.01zM238 108a34.82 34.82 0 0 1 15.63 4.19l-3 5.2a28.85 28.85 0 0 0-12.63-3.38V108zm12.84 5.02a32.8 32.8 0 0 0-10.84-2.9v2.01a30.8 30.8 0 0 1 9.83 2.63l1-1.74h.01zM237 156a13 13 0 1 1 0-26 13 13 0 0 1 0 26zm0-2a11 11 0 1 0 0-22 11 11 0 0 0 0 22zM137.54 0h56.92l-.74 1.03c.57.7 1.12 1.4 1.64 2.14l7.75-2.9 2 3.46-6.38 5.25c.37.82.72 1.65 1.03 2.5l8.22-.8 1.04 3.86-7.52 3.43c.15.88.26 1.77.35 2.67L210 22v4l-8.15 1.36c-.09.9-.2 1.8-.35 2.67l7.52 3.43-1.04 3.86-8.22-.8c-.31.85-.66 1.68-1.03 2.5l6.38 5.25-2 3.46-7.75-2.9c-.52.74-1.07 1.45-1.64 2.14l4.8 6.73-2.82 2.83-6.73-4.8c-.7.56-1.4 1.11-2.14 1.63l2.9 7.75-3.46 2-5.25-6.38c-.82.37-1.65.72-2.5 1.03l.8 8.22-3.86 1.04-3.43-7.52c-.88.15-1.77.26-2.67.35L168 68h-4l-1.36-8.15c-.9-.09-1.8-.2-2.67-.35l-3.43 7.52-3.86-1.04.8-8.22c-.85-.31-1.68-.66-2.5-1.03l-5.25 6.38-3.46-2 2.9-7.75a36.15 36.15 0 0 1-2.14-1.64l-6.73 4.8-2.83-2.82 4.8-6.73c-.56-.7-1.11-1.4-1.63-2.14l-7.75 2.9-2-3.46 6.38-5.25c-.37-.82-.72-1.65-1.03-2.5l-8.22.8-1.04-3.86 7.52-3.43c-.15-.88-.26-1.77-.35-2.67L122 26v-4l8.15-1.36c.09-.9.2-1.8.35-2.67l-7.52-3.43 1.04-3.86 8.22.8c.31-.85.66-1.68 1.03-2.5l-6.38-5.25 2-3.46 7.75 2.9c.52-.74 1.07-1.45 1.64-2.14L137.54 0zm2.43 0l.83 1.17a34.14 34.14 0 0 0-3.38 4.4l-7.63-2.86-.33.58 6.29 5.18a33.79 33.79 0 0 0-2.13 5.12l-8.1-.78-.18.64 7.42 3.37a34.02 34.02 0 0 0-.72 5.5L124 23.68v.66l8.04 1.34c.1 1.88.33 3.72.72 5.5l-7.42 3.38.18.64 8.1-.78a33.88 33.88 0 0 0 2.13 5.12l-6.29 5.18.33.58 7.63-2.86c1 1.56 2.14 3.03 3.38 4.4l-4.73 6.63.47.47 6.63-4.73a34.14 34.14 0 0 0 4.4 3.38l-2.86 7.63.58.33 5.18-6.29c1.63.84 3.35 1.56 5.12 2.13l-.78 8.1.64.18 3.37-7.42c1.79.39 3.63.63 5.5.72l1.35 8.04h.66l1.34-8.04c1.88-.1 3.72-.33 5.5-.72l3.38 7.42.64-.18-.78-8.1a33.88 33.88 0 0 0 5.12-2.13l5.18 6.29.58-.33-2.86-7.63c1.56-1 3.03-2.14 4.4-3.38l6.63 4.73.47-.47-4.73-6.63a34.14 34.14 0 0 0 3.38-4.4l7.63 2.86.33-.58-6.29-5.18a33.79 33.79 0 0 0 2.13-5.12l8.1.78.18-.64-7.42-3.37c.39-1.79.63-3.63.72-5.5l8.04-1.35v-.66l-8.04-1.34c-.1-1.88-.33-3.72-.72-5.5l7.42-3.38-.18-.64-8.1.78a33.79 33.79 0 0 0-2.13-5.12l6.29-5.18-.33-.58-7.63 2.86c-1-1.56-2.14-3.03-3.38-4.4l.83-1.17h-52.06V0zm-2.82 27h14.15A15.02 15.02 0 0 0 163 38.7v14.15A29.01 29.01 0 0 1 137.15 27zm12.57-27H163v9.3A15.02 15.02 0 0 0 151.3 21h-14.15a28.99 28.99 0 0 1 12.57-21zM169 52.85V38.7A15.02 15.02 0 0 0 180.7 27h14.15A29.01 29.01 0 0 1 169 52.85zM182.28 0a28.99 28.99 0 0 1 12.57 21H180.7A15.02 15.02 0 0 0 169 9.3V0h13.28zm-42.82 29A27.03 27.03 0 0 0 161 50.54V40.25A17.04 17.04 0 0 1 149.75 29h-10.29zm14.16-29a27.04 27.04 0 0 0-14.16 19h10.29A17.04 17.04 0 0 1 161 7.75V0h-7.38zM171 50.54A27.03 27.03 0 0 0 192.54 29h-10.29A17.04 17.04 0 0 1 171 40.25v10.29zM178.38 0H171v7.75A17.04 17.04 0 0 1 182.25 19h10.29a27.04 27.04 0 0 0-14.16-19zM166 34a10 10 0 1 1 0-20 10 10 0 0 1 0 20zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm-39.51 176.15l-10.67-7.95 6-10.4 12.23 5.27a23.97 23.97 0 0 1 8.4-4.86L144 177h12l1.55 13.21a23.97 23.97 0 0 1 8.4 4.86l12.23-5.27 6 10.4-10.67 7.95a24 24 0 0 1 0 9.7l10.67 7.95-6 10.4-12.23-5.27a23.97 23.97 0 0 1-8.4 4.86L156 249h-12l-1.55-13.21a23.97 23.97 0 0 1-8.4-4.86l-12.23 5.27-6-10.4 10.67-7.95a24.1 24.1 0 0 1 0-9.7zm29.25-16.4l-1.5-12.75h-8.48l-1.5 12.76c-3.75 1-7.1 2.99-9.79 5.65l-11.8-5.08-4.23 7.34 10.3 7.68c-.98 3.7-.98 7.6 0 11.3l-10.3 7.68 4.23 7.34 11.8-5.08a22.1 22.1 0 0 0 9.8 5.65l1.5 12.76h8.47l1.5-12.76c3.75-1 7.1-2.99 9.79-5.65l11.8 5.08 4.23-7.34-10.3-7.68c.98-3.7.98-7.6 0-11.3l10.3-7.68-4.23-7.34-11.8 5.08a21.98 21.98 0 0 0-9.8-5.65l.01-.01zM150 225a12 12 0 1 1 0-24 12 12 0 0 1 0 24zm0-2a10 10 0 1 0 0-20 10 10 0 0 0 0 20zm3.53 67.72l4.26.07.51 1.93-3.65 2.19c.11.63.2 1.27.25 1.92L159 298v2l-4.1 1.17c-.05.65-.14 1.29-.25 1.92l3.65 2.2-.51 1.92-4.26.07c-.22.61-.47 1.21-.74 1.8l2.96 3.05-1 1.74-4.13-1.04a24.1 24.1 0 0 1-1.18 1.54l2.07 3.72-1.42 1.42-3.72-2.07c-.5.41-1.01.8-1.54 1.18l1.04 4.13-1.74 1-3.05-2.96c-.59.27-1.19.52-1.8.74l-.07 4.26-1.93.51-2.19-3.65c-.63.11-1.27.2-1.92.25L132 327h-2l-1.17-4.1c-.65-.05-1.29-.14-1.92-.25l-2.2 3.65-1.92-.51-.07-4.26c-.61-.22-1.21-.47-1.8-.74l-3.05 2.96-1.74-1 1.04-4.13a24.1 24.1 0 0 1-1.54-1.18l-3.72 2.07-1.42-1.42 2.07-3.72c-.41-.5-.8-1.01-1.18-1.54l-4.13 1.04-1-1.74 2.96-3.05c-.27-.59-.52-1.19-.74-1.8l-4.26-.07-.51-1.93 3.65-2.19c-.11-.63-.2-1.27-.25-1.92L103 300v-2l4.1-1.17c.05-.65.14-1.29.25-1.92l-3.65-2.2.51-1.92 4.26-.07c.22-.61.47-1.21.74-1.8l-2.96-3.05 1-1.74 4.13 1.04c.38-.53.77-1.04 1.18-1.54l-2.07-3.72 1.42-1.42 3.72 2.07c.5-.41 1.01-.8 1.54-1.18l-1.04-4.13 1.74-1 3.05 2.96c.59-.27 1.19-.52 1.8-.74l.07-4.26 1.93-.51 2.19 3.65c.63-.11 1.27-.2 1.92-.25L130 271h2l1.17 4.1c.65.05 1.29.14 1.92.25l2.2-3.65 1.92.51.07 4.26c.61.22 1.21.47 1.8.74l3.05-2.96 1.74 1-1.04 4.13c.53.38 1.04.77 1.54 1.18l3.72-2.07 1.42 1.42-2.07 3.72c.41.5.8 1.01 1.18 1.54l4.13-1.04 1 1.74-2.96 3.05c.27.59.52 1.19.74 1.8zM109 299a22 22 0 1 0 44 0 22 22 0 0 0-44 0zm27.11-10.86l-3 5.22a6 6 0 0 0-4.21 0l-3.01-5.22a11.95 11.95 0 0 1 10.22 0zm1.74 1a12 12 0 0 1 5.1 8.86h-6.01a6.01 6.01 0 0 0-2.1-3.64l3-5.22h.01zm-13.7 0l3.02 5.22a6.01 6.01 0 0 0-2.1 3.64h-6.03a12 12 0 0 1 5.11-8.86zm-5.1 10.86h6.01a6.01 6.01 0 0 0 2.1 3.64l-3 5.22a12 12 0 0 1-5.12-8.86h.01zm6.84 9.86l3-5.22a6 6 0 0 0 4.21 0l3.01 5.22a11.95 11.95 0 0 1-10.22 0zm11.96-1l-3.02-5.22a6.01 6.01 0 0 0 2.1-3.64h6.03a12 12 0 0 1-5.11 8.86zm-4.68-19.62a10.04 10.04 0 0 0-4.34 0l1.05 1.82c.74-.1 1.5-.1 2.24 0l1.05-1.82zm5.2 3l-1.05 1.82c.46.59.84 1.24 1.12 1.94h2.1a9.99 9.99 0 0 0-2.17-3.76zm-14.74 0a9.99 9.99 0 0 0-2.17 3.76h2.1c.28-.7.66-1.35 1.12-1.94l-1.05-1.82zm-2.17 9.76a9.99 9.99 0 0 0 2.17 3.76l1.05-1.82a8.01 8.01 0 0 1-1.12-1.94h-2.1zm7.37 6.76c1.43.32 2.91.32 4.34 0l-1.05-1.82c-.74.1-1.5.1-2.24 0l-1.05 1.82zm9.54-3a9.99 9.99 0 0 0 2.17-3.76h-2.1c-.28.7-.66 1.35-1.12 1.94l1.05 1.82zM127 299a4 4 0 1 1 8 0 4 4 0 0 1-8 0zm2 0a2 2 0 1 0 4 0 2 2 0 0 0-4 0zm15 0a4 4 0 1 1 8 0 4 4 0 0 1-8 0zm-6.5 11.26a4 4 0 1 1 4 6.93 4 4 0 0 1-4-6.93zm-13 0a4 4 0 1 1-4 6.93 4 4 0 0 1 4-6.93zM118 299a4 4 0 1 1-8 0 4 4 0 0 1 8 0zm6.5-11.26a4 4 0 1 1-4-6.93 4 4 0 0 1 4 6.93zm13 0a4 4 0 1 1 4-6.93 4 4 0 0 1-4 6.93zM146 299a2 2 0 1 0 4 0 2 2 0 0 0-4 0zm-7.5 12.99a2 2 0 1 0 1.66 3.64 2 2 0 0 0-1.66-3.64zm-15 0a2 2 0 1 0-2.15 3.38 2 2 0 0 0 2.15-3.38zM116 299a2 2 0 1 0-4 0 2 2 0 0 0 4 0zm7.5-12.99a2 2 0 1 0-1.66-3.64 2 2 0 0 0 1.66 3.64zm15 0a2 2 0 1 0 2.15-3.38 2 2 0 0 0-2.15 3.38zm103.8-61.7l-.8-8.22 5.8-1.55 3.42 7.52c2.26-.43 4.57-.74 6.92-.9L259 213h6l1.36 8.16c2.35.16 4.66.47 6.92.9l3.42-7.52 5.8 1.55-.8 8.22c2.21.77 4.37 1.66 6.45 2.68l5.25-6.38 5.2 3-2.9 7.74a60.25 60.25 0 0 1 5.53 4.25l6.73-4.8 4.24 4.24-4.8 6.73a60.25 60.25 0 0 1 4.25 5.53l7.74-2.9 3 5.2-6.38 5.25a59.62 59.62 0 0 1 2.68 6.45l8.22-.8 1.55 5.8-7.52 3.42c.43 2.26.74 4.57.9 6.92L330 278v6l-8.16 1.36a60.03 60.03 0 0 1-.9 6.92l7.52 3.42-1.55 5.8-8.22-.8a59.62 59.62 0 0 1-2.68 6.45l6.38 5.25-3 5.2-7.74-2.9a60.25 60.25 0 0 1-4.25 5.53l4.8 6.73-4.24 4.24-6.73-4.8a60.25 60.25 0 0 1-5.53 4.25l2.9 7.74-5.2 3-5.25-6.38a59.62 59.62 0 0 1-6.45 2.68l.8 8.22-5.8 1.55-3.42-7.52c-2.26.43-4.57.74-6.92.9L265 349h-6l-1.36-8.16a60.03 60.03 0 0 1-6.92-.9l-3.42 7.52-5.8-1.55.8-8.22a59.62 59.62 0 0 1-6.45-2.68l-5.25 6.38-5.2-3 2.9-7.74a60.25 60.25 0 0 1-5.53-4.25l-6.73 4.8-4.24-4.24 4.8-6.73a60.25 60.25 0 0 1-4.25-5.53l-7.74 2.9-3-5.2 6.38-5.25a59.62 59.62 0 0 1-2.68-6.45l-8.22.8-1.55-5.8 7.52-3.42c-.43-2.29-.73-4.6-.9-6.92L194 284v-6l8.16-1.36c.16-2.35.47-4.66.9-6.92l-7.52-3.42 1.55-5.8 8.22.8c.77-2.2 1.66-4.35 2.68-6.45l-6.38-5.25 3-5.2 7.74 2.9a60.25 60.25 0 0 1 4.25-5.53l-4.8-6.73 4.24-4.24 6.73 4.8a60.25 60.25 0 0 1 5.53-4.25l-2.9-7.74 5.2-3 5.25 6.38a59.62 59.62 0 0 1 6.45-2.68zm2.12 1.4c-3.15 1-6.19 2.27-9.08 3.77l-5.19-6.3-2.3 1.33 2.86 7.65a58.24 58.24 0 0 0-7.79 5.98l-6.65-4.75-1.88 1.88 4.75 6.65a58.24 58.24 0 0 0-5.98 7.79l-7.65-2.86-1.33 2.3 6.3 5.2a57.64 57.64 0 0 0-3.77 9.07l-8.12-.79-.69 2.58 7.43 3.38a58 58 0 0 0-1.27 9.73l-8.06 1.35v2.66l8.06 1.35c.15 3.32.58 6.58 1.27 9.73l-7.43 3.38.7 2.58 8.11-.79c1 3.15 2.27 6.19 3.77 9.08l-6.3 5.19 1.33 2.3 7.65-2.86a58.24 58.24 0 0 0 5.98 7.79l-4.75 6.65 1.88 1.88 6.65-4.75a60.3 60.3 0 0 0 7.79 5.98l-2.86 7.65 2.3 1.33 5.2-6.3a56.99 56.99 0 0 0 9.07 3.77l-.79 8.12 2.58.69 3.38-7.43c3.15.69 6.4 1.12 9.73 1.27l1.35 8.06h2.66l1.35-8.06c3.32-.15 6.58-.58 9.73-1.27l3.38 7.43 2.58-.7-.79-8.11c3.15-1 6.19-2.27 9.08-3.77l5.19 6.3 2.3-1.33-2.86-7.65a58.24 58.24 0 0 0 7.79-5.98l6.65 4.75 1.88-1.88-4.75-6.65a60.3 60.3 0 0 0 5.98-7.79l7.65 2.86 1.33-2.3-6.3-5.2a56.99 56.99 0 0 0 3.77-9.07l8.12.79.69-2.58-7.43-3.38a58 58 0 0 0 1.27-9.73l8.06-1.35v-2.66l-8.06-1.35a58.04 58.04 0 0 0-1.27-9.73l7.43-3.38-.7-2.58-8.11.79c-1-3.15-2.27-6.19-3.77-9.08l6.3-5.19-1.33-2.3-7.65 2.86a58.24 58.24 0 0 0-5.98-7.79l4.75-6.65-1.88-1.88-6.65 4.75a58.24 58.24 0 0 0-7.79-5.98l2.86-7.65-2.3-1.33-5.2 6.3a57.64 57.64 0 0 0-9.07-3.77l.79-8.12-2.58-.69-3.38 7.43a58 58 0 0 0-9.73-1.27l-1.35-8.06h-2.66l-1.35 8.06c-3.32.15-6.58.58-9.73 1.27l-3.38-7.43-2.58.7.79 8.11zm4.58 50.1a13.96 13.96 0 0 0 0 10.39l-33.88 19.55A52.77 52.77 0 0 1 209 281c0-8.94 2.21-17.37 6.12-24.75L249 275.8v.01zm2-3.47l-33.87-19.56A52.97 52.97 0 0 1 260 228.04v39.1a13.99 13.99 0 0 0-9 5.2zm0 17.32a13.99 13.99 0 0 0 9 5.2v39.1a52.97 52.97 0 0 1-42.87-24.74L251 289.66zm13 5.2a13.99 13.99 0 0 0 9-5.2l33.87 19.56A52.97 52.97 0 0 1 264 333.96v-39.1zm11-8.66a13.96 13.96 0 0 0 0-10.4l33.88-19.55A52.77 52.77 0 0 1 315 281c0 8.94-2.21 17.37-6.12 24.75L275 286.2zm-2-13.86a13.99 13.99 0 0 0-9-5.2v-39.1a52.97 52.97 0 0 1 42.87 24.74L273 272.34zm-57.04-13.3A50.8 50.8 0 0 0 211 281a50.8 50.8 0 0 0 4.96 21.96l30.62-17.68c-.78-2.8-.78-5.76 0-8.56l-30.62-17.68zm4-6.93l30.62 17.68a16.08 16.08 0 0 1 7.42-4.29v-35.35a50.96 50.96 0 0 0-38.04 21.96zm0 57.78A50.96 50.96 0 0 0 258 331.85V296.5a15.98 15.98 0 0 1-7.42-4.29l-30.62 17.68zM266 331.85a50.96 50.96 0 0 0 38.04-21.96l-30.62-17.68a16.08 16.08 0 0 1-7.42 4.29v35.35zm42.04-28.89A50.8 50.8 0 0 0 313 281a50.8 50.8 0 0 0-4.96-21.96l-30.62 17.68c.78 2.8.78 5.76 0 8.56l30.62 17.68zm-4-50.85A50.96 50.96 0 0 0 266 230.15v35.35c2.86.74 5.41 2.25 7.42 4.29l30.62-17.68zM262 290a9 9 0 1 1 0-18 9 9 0 0 1 0 18zm0-2a7 7 0 1 0 0-14 7 7 0 0 0 0 14zM0 242.64l2.76.4 4.75 2.27a38.2 38.2 0 0 1 2.85-3.4l-3.06-4.28-1.69-5.11 3.07-2.58 4.74 2.55 3.69 3.76a37.96 37.96 0 0 1 3.84-2.22l-1.42-5.07.17-5.38 3.76-1.37 3.6 4.02 2.17 4.79c1.42-.34 2.88-.6 4.37-.77L34 225l2-5h4l2 5 .4 5.25c1.49.17 2.95.43 4.37.77l2.18-4.8 3.59-4 3.76 1.36.17 5.38-1.42 5.07c1.33.67 2.6 1.41 3.84 2.22l3.69-3.76 4.74-2.55 3.07 2.58-1.69 5.11-3.06 4.29a38.2 38.2 0 0 1 2.85 3.4l4.75-2.28 5.33-.77 2 3.46-3.33 4.23-4.34 2.98c.59 1.36 1.1 2.75 1.52 4.17l5.23-.52 5.27 1.1.7 3.94-4.58 2.84-5.1 1.31a38.6 38.6 0 0 1 0 4.44l5.1 1.3 4.58 2.85-.7 3.93-5.27 1.1-5.23-.5a36.3 36.3 0 0 1-1.52 4.16l4.34 2.98 3.33 4.23-2 3.46-5.33-.77-4.75-2.27a38.2 38.2 0 0 1-2.85 3.4l3.06 4.28 1.69 5.11-3.07 2.58-4.74-2.55-3.69-3.76a37.96 37.96 0 0 1-3.84 2.22l1.42 5.07-.17 5.38-3.76 1.37-3.6-4.02-2.17-4.79c-1.42.34-2.88.6-4.37.77L42 311l-2 5h-4l-2-5-.4-5.25a37.87 37.87 0 0 1-4.37-.77l-2.18 4.8-3.59 4-3.76-1.36-.17-5.38 1.42-5.07c-1.32-.66-2.6-1.4-3.84-2.22l-3.69 3.76-4.74 2.55-3.07-2.58 1.69-5.11 3.06-4.29a38.2 38.2 0 0 1-2.85-3.4l-4.75 2.28-2.76.4v-8.17l3.1-2.13a37.72 37.72 0 0 1-1.52-4.17l-1.58.16v-8.82l.06-.01a38.6 38.6 0 0 1 0-4.44l-.06-.01v-8.82l1.58.16c.43-1.43.94-2.82 1.52-4.17L0 250.8v-8.17.01zm0 1.87v3.89l5.62 3.84a35.74 35.74 0 0 0-2.55 7.02l-3.07-.3v4.75l2.2.56a36.42 36.42 0 0 0 0 7.46l-2.2.56v4.75l3.07-.3a35.2 35.2 0 0 0 2.55 7.02L0 287.6v3.89l1.76-.26 6.41-3.07c1.4 2.06 3 3.98 4.8 5.71l-4.14 5.78-1.01 3.07 1.22 1.03 2.85-1.52 4.98-5.08c2 1.45 4.16 2.7 6.45 3.73l-1.9 6.84.1 3.23 1.5.55 2.15-2.4 2.94-6.48a35.9 35.9 0 0 0 7.34 1.3L36 311l1.2 3h1.6l1.2-3 .55-7.09a35.9 35.9 0 0 0 7.34-1.29l2.94 6.47 2.15 2.4 1.5-.54.1-3.23-1.9-6.84a35.96 35.96 0 0 0 6.45-3.73l4.98 5.08 2.85 1.52 1.22-1.03-1-3.07-4.15-5.78a35.8 35.8 0 0 0 4.8-5.7l6.4 3.06 3.2.46.8-1.38-2-2.54-5.85-4.01c1.1-2.24 1.95-4.6 2.55-7.02l7.07.7 3.16-.66.28-1.58-2.75-1.7-6.88-1.77c.26-2.48.26-4.98 0-7.46l6.88-1.77 2.75-1.7-.28-1.58-3.16-.66-7.07.7a35.74 35.74 0 0 0-2.55-7.02l5.86-4 2-2.55-.8-1.38-3.2.46-6.41 3.07c-1.4-2.06-3-3.98-4.8-5.71l4.14-5.78 1.01-3.07-1.22-1.03-2.85 1.52-4.98 5.08c-2-1.45-4.16-2.7-6.45-3.73l1.9-6.84-.1-3.23-1.5-.55-2.15 2.4-2.94 6.48a35.9 35.9 0 0 0-7.34-1.3L40 225l-1.2-3h-1.6l-1.2 3-.55 7.09c-2.48.17-4.94.6-7.34 1.29l-2.94-6.47-2.15-2.4-1.5.54-.1 3.23 1.9 6.84a35.96 35.96 0 0 0-6.45 3.73l-4.98-5.08-2.85-1.52-1.22 1.03 1 3.07 4.15 5.78a36.18 36.18 0 0 0-4.8 5.7l-6.4-3.06L0 244.5v.01zM38 272a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-2a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm0-26a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm24 24a4 4 0 1 1 8 0 4 4 0 0 1-8 0zm-24 24a4 4 0 1 1 0 8 4 4 0 0 1 0-8zm-24-24a4 4 0 1 1-8 0 4 4 0 0 1 8 0zm24-26a2 2 0 1 0 0-4 2 2 0 0 0 0 4zm26 26a2 2 0 1 0 4 0 2 2 0 0 0-4 0zm-26 26a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm-26-26a2 2 0 1 0-4 0 2 2 0 0 0 4 0zm3.37 22.63a12 12 0 1 1 16.17-17.74 12 12 0 0 1-16.17 17.74zm0-45.26a12 12 0 1 1 17.74 16.17 12 12 0 0 1-17.74-16.17zm45.26 0a12 12 0 1 1-16.17 17.74 12 12 0 0 1 16.17-17.74zm0 45.26a12 12 0 1 1-17.74-16.17 12 12 0 0 1 17.74 16.17zm-15.56-29.7a10 10 0 1 0 14.39-13.9 10 10 0 0 0-14.39 13.9zm0 14.14a10 10 0 1 0 13.9 14.39 10 10 0 0 0-13.9-14.39zm-14.14 0a10 10 0 1 0-14.39 13.9 10 10 0 0 0 14.39-13.9zm0-14.14a10 10 0 1 0-13.9-14.39 10 10 0 0 0 13.9 14.39zm230.9-245.4l-.08-4.18 1.93-.52 2.04 3.67c1.07-.2 2.16-.35 3.26-.43L270 10h2l1.02 4.07c1.1.08 2.2.22 3.26.43l2.04-3.67 1.93.52-.07 4.19a27 27 0 0 1 3.04 1.26l2.91-3.01 1.74 1-1.16 4.03c.91.62 1.78 1.29 2.61 2l3.6-2.15 1.41 1.41-2.16 3.6c.72.83 1.4 1.7 2 2.6l4.04-1.15 1 1.74-3.01 2.91c.48.98.9 2 1.26 3.04l4.2-.07.5 1.93-3.66 2.04c.2 1.07.35 2.16.43 3.26L303 41v2l-4.07 1.02a26.9 26.9 0 0 1-.43 3.26l3.67 2.04-.52 1.93-4.19-.07a27.82 27.82 0 0 1-1.26 3.04l3.01 2.91-1 1.74-4.03-1.16c-.62.91-1.29 1.78-2 2.61l2.15 3.6-1.41 1.41-3.6-2.16c-.83.72-1.7 1.4-2.6 2l1.15 4.04-1.74 1-2.91-3.01a27 27 0 0 1-3.04 1.26l.07 4.2-1.93.5-2.04-3.66c-1.07.2-2.16.35-3.26.43L272 74h-2l-1.02-4.07a26.9 26.9 0 0 1-3.26-.43l-2.04 3.67-1.93-.52.07-4.19a27.82 27.82 0 0 1-3.04-1.26l-2.91 3.01-1.74-1 1.16-4.03c-.9-.62-1.78-1.29-2.61-2l-3.6 2.15-1.41-1.41 2.16-3.6c-.72-.83-1.4-1.7-2-2.6l-4.04 1.15-1-1.74 3.01-2.91a27 27 0 0 1-1.26-3.04l-4.2.07-.5-1.93 3.66-2.04c-.2-1.07-.35-2.16-.43-3.26L239 43v-2l4.07-1.02c.08-1.1.22-2.2.43-3.26l-3.67-2.04.52-1.93 4.19.07a27 27 0 0 1 1.26-3.04l-3.01-2.91 1-1.74 4.03 1.16c.62-.91 1.29-1.78 2-2.61l-2.15-3.6 1.41-1.41 3.6 2.16c.83-.72 1.7-1.4 2.6-2l-1.15-4.04 1.74-1 2.91 3.01a27 27 0 0 1 3.04-1.26l.01-.01zM271 68a26 26 0 1 0 0-52 26 26 0 0 0 0 52zm0-9a17 17 0 1 1 0-34 17 17 0 0 1 0 34zm0-2a15 15 0 1 0 0-30 15 15 0 0 0 0 30zm0-8a7 7 0 1 1 0-14 7 7 0 0 1 0 14zm0-2a5 5 0 1 0 0-10 5 5 0 0 0 0 10zm0-14a2 2 0 1 1 0-4 2 2 0 0 1 0 4zm9 9a2 2 0 1 1 4 0 2 2 0 0 1-4 0zm-9 9a2 2 0 1 1 0 4 2 2 0 0 1 0-4zm-9-9a2 2 0 1 1-4 0 2 2 0 0 1 4 0zm47.93 53.79l-1.8-3.91 1.63-1.18 3.15 2.92c.4-.17.82-.3 1.25-.4L315 89h2l.84 4.21c.43.1.85.24 1.25.4l3.15-2.9 1.62 1.17-1.8 3.9c.3.33.55.69.78 1.06l4.26-.5.62 1.9-3.75 2.1c.04.44.04.87 0 1.31l3.75 2.1-.62 1.9-4.26-.5c-.23.38-.49.74-.77 1.06l1.8 3.91-1.63 1.18-3.15-2.92c-.4.17-.82.3-1.25.4L317 113h-2l-.84-4.21c-.43-.1-.85-.24-1.25-.4l-3.15 2.9-1.62-1.17 1.8-3.9a8.03 8.03 0 0 1-.78-1.06l-4.26.5-.62-1.9 3.75-2.1a8.1 8.1 0 0 1 0-1.31l-3.75-2.1.62-1.9 4.26.5c.23-.38.49-.74.77-1.06zM316 106a5 5 0 1 0 0-10 5 5 0 0 0 0 10zM75.73 179.2l-.6-2.1 1.74-1 1.51 1.57a9.93 9.93 0 0 1 2.1-.55L81 175h2l.53 2.12c.72.1 1.42.3 2.09.55l1.51-1.56 1.74 1-.6 2.1c.56.45 1.07.96 1.52 1.52l2.1-.6 1 1.74-1.56 1.51c.25.67.44 1.37.55 2.1L94 186v2l-2.12.53a9.9 9.9 0 0 1-.55 2.09l1.56 1.51-1 1.74-2.1-.6a9.93 9.93 0 0 1-1.52 1.52l.6 2.1-1.74 1-1.51-1.56c-.67.25-1.37.44-2.1.55L83 199h-2l-.53-2.12c-.71-.1-1.42-.3-2.09-.55l-1.51 1.56-1.74-1 .6-2.1a9.93 9.93 0 0 1-1.52-1.52l-2.1.6-1-1.74 1.56-1.51a9.93 9.93 0 0 1-.55-2.1L70 188v-2l2.12-.53c.1-.72.3-1.42.55-2.09l-1.56-1.51 1-1.74 2.1.6c.45-.56.96-1.07 1.52-1.52v-.01zm2.15.94a8.04 8.04 0 0 0-2.74 2.74l-.14.25a7.96 7.96 0 0 0 0 7.74l.14.25a8.04 8.04 0 0 0 2.74 2.74l.25.14a7.96 7.96 0 0 0 7.74 0l.25-.14a8.04 8.04 0 0 0 2.74-2.74l.14-.25a7.96 7.96 0 0 0 0-7.74l-.14-.25a8.04 8.04 0 0 0-2.74-2.74l-.25-.14a7.96 7.96 0 0 0-7.74 0l-.25.14zM82 193a6 6 0 1 1 0-12 6 6 0 0 1 0 12zm0-2a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm278 3.18l-3.8 5.6-7.18-3.51 2.6-8.07a32.15 32.15 0 0 1-3.07-2.46l-7.27 4.35-5.04-6.22 5.82-6.26c-.64-1.13-1.2-2.3-1.7-3.52l-8.45.73-1.8-7.8 7.95-3.07a32.5 32.5 0 0 1 0-3.9l-7.95-3.07 1.8-7.8 8.45.73a31.7 31.7 0 0 1 1.7-3.52l-5.82-6.26 5.04-6.22 7.27 4.35c.97-.88 2-1.7 3.07-2.46l-2.6-8.07 7.19-3.5 3.79 5.59v64.36zm0-3.53v-57.3l-4.46-6.58-4.1 2 2.53 7.87a30.14 30.14 0 0 0-5.13 4.1l-7.08-4.24-2.88 3.55 5.65 6.09a29.87 29.87 0 0 0-2.82 5.86l-8.24-.7-1.03 4.46 7.73 2.99a30.34 30.34 0 0 0 0 6.5l-7.73 3 1.03 4.45 8.24-.7a29.87 29.87 0 0 0 2.82 5.86l-5.65 6.1 2.88 3.54 7.08-4.23a30.14 30.14 0 0 0 5.13 4.09l-2.54 7.86 4.11 2 4.46-6.57zm0-51.57v5.71l-3.56-3.8a24.94 24.94 0 0 1 3.56-1.91zm0 22.68l-14.17 6.64c-2.5-9.5.77-19.57 8.38-25.78l5.79 10.5v8.64zm0 23.16a25.08 25.08 0 0 1-13.32-13.9l13.32-2.55v16.45zm0-43.64l-.39.2.39.4v-.6zm0 18.29v-2.35l-6.3-11.44a22.93 22.93 0 0 0-6.43 19.76l12.73-5.97zm0 23.15v-12.23l-10.47 2.01A23.1 23.1 0 0 0 360 182.72zM0 129.82l1 1.46a31.8 31.8 0 0 1 3.8-.86L6 122h8l1.2 8.42c1.3.21 2.57.5 3.8.86l4.8-7.06 7.18 3.51-2.6 8.07c1.07.76 2.1 1.58 3.07 2.46l7.27-4.35 5.04 6.22-5.82 6.26c.64 1.13 1.2 2.3 1.7 3.52l8.45-.73 1.8 7.8-7.95 3.07c.08 1.3.08 2.6 0 3.9l7.95 3.07-1.8 7.8-8.45-.73a33.5 33.5 0 0 1-1.7 3.52l5.82 6.26-5.04 6.22-7.27-4.35c-.97.88-2 1.7-3.07 2.46l2.6 8.07-7.19 3.5-4.78-7.05c-1.24.36-2.51.65-3.8.86L14 202H6l-1.2-8.42a31.8 31.8 0 0 1-3.8-.86l-1 1.46v-64.36zm0 3.53v57.3l.2-.29c2.02.7 4.15 1.2 6.34 1.44l1.17 8.2h4.58l1.17-8.2c2.2-.25 4.32-.74 6.35-1.44l4.65 6.87 4.1-2-2.53-7.87a30.14 30.14 0 0 0 5.13-4.1l7.08 4.24 2.88-3.55-5.65-6.09c1.14-1.83 2.1-3.8 2.82-5.86l8.24.7 1.03-4.46-7.73-2.99a30.7 30.7 0 0 0 0-6.5l7.73-3-1.03-4.45-8.24.7a29.87 29.87 0 0 0-2.82-5.86l5.65-6.1-2.88-3.54-7.08 4.23a30.14 30.14 0 0 0-5.13-4.09l2.54-7.86-4.11-2-4.65 6.86a29.82 29.82 0 0 0-6.35-1.44l-1.17-8.2H7.7l-1.17 8.2c-2.2.25-4.32.74-6.35 1.44l-.19-.29H0zm34.17 35.05l-16.26-7.62a7.94 7.94 0 0 0-.8-2.44l8.68-15.72a24.95 24.95 0 0 1 8.38 25.78zm-.85 2.63a25.01 25.01 0 0 1-21.94 15.93l2.23-17.82a8.3 8.3 0 0 0 2.07-1.5l17.64 3.39zM0 139.08A24.92 24.92 0 0 1 10 137c5 0 9.65 1.47 13.56 4l-12.28 13.1a8.06 8.06 0 0 0-2.56 0L0 144.8v-5.72zm0 22.68v-8.65l2.88 5.23c-.4.77-.66 1.59-.79 2.44l-2.09.98zm0 23.16v-16.45l4.32-.83c.6.6 1.3 1.11 2.07 1.5l2.23 17.82c-2.97-.16-5.9-.85-8.62-2.04zM10 156a6 6 0 1 1 0 12 6 6 0 0 1 0-12zm0 2a4 4 0 1 0 0 8 4 4 0 0 0 0-8zM0 141.28v.6l9.48 10.13c.35-.02.7-.02 1.04 0l9.87-10.54A22.9 22.9 0 0 0 10 139c-3.58 0-6.98.82-10 2.28zm0 18.29l.34-.16c.09-.34.2-.67.32-.99l-.66-1.2v2.35zm0 23.15c1.97.95 4.1 1.63 6.34 1.99l-1.8-14.33a11.6 11.6 0 0 1-.83-.6l-3.71.7v12.24zm13.66 1.99a23.03 23.03 0 0 0 16.8-12.21l-14.17-2.72c-.27.21-.55.42-.84.6l-1.79 14.33zm19.07-19.17a22.93 22.93 0 0 0-6.42-19.75l-6.97 12.63c.12.32.23.65.32.99l13.07 6.13zM137.54 360l-4.07-5.7 2.83-2.83 6.73 4.8c.7-.56 1.4-1.11 2.14-1.63l-2.9-7.75 3.46-2 5.25 6.38c.82-.37 1.65-.72 2.5-1.03l-.8-8.22 3.86-1.04 3.43 7.52c.88-.15 1.77-.26 2.67-.35L164 340h4l1.36 8.15c.9.09 1.8.2 2.67.35l3.43-7.52 3.86 1.04-.8 8.22c.85.31 1.68.66 2.5 1.03l5.25-6.38 3.46 2-2.9 7.75c.74.52 1.45 1.07 2.14 1.64l6.73-4.8 2.83 2.82-4.07 5.7h-56.92zm2.43 0h52.06l3.9-5.46-.47-.47-6.63 4.73a34.14 34.14 0 0 0-4.4-3.38l2.86-7.63-.58-.33-5.18 6.29a33.79 33.79 0 0 0-5.12-2.13l.78-8.1-.64-.18-3.37 7.42a34.02 34.02 0 0 0-5.5-.72l-1.35-8.04h-.66l-1.34 8.04c-1.88.1-3.72.33-5.5.72l-3.38-7.42-.64.18.78 8.1a33.88 33.88 0 0 0-5.12 2.13l-5.18-6.29-.58.33 2.86 7.63c-1.56 1-3.03 2.14-4.4 3.38l-6.63-4.73-.47.47 3.9 5.46zm9.75 0a28.83 28.83 0 0 1 13.28-4.85V360h-13.28zm32.56 0H169v-4.85c4.9.5 9.42 2.22 13.28 4.85zm-28.66 0H161v-2.54a26.8 26.8 0 0 0-7.38 2.54zm24.76 0a26.8 26.8 0 0 0-7.38-2.54V360h7.38zM358.79 0h-1.21l1.5 3.28a48.3 48.3 0 0 0-5.8 5.8l-9.38-4.3-1.65 2.26 7 7.58a47.84 47.84 0 0 0-3.74 7.33l-10.24-1.2-.86 2.66 8.99 5.05a47.91 47.91 0 0 0-1.28 8.12L332 38.6v2.8l10.12 2.02c.2 2.78.63 5.5 1.28 8.12l-9 5.05.87 2.66 10.24-1.2c1.04 2.54 2.29 5 3.74 7.33l-7 7.58 1.65 2.26 9.38-4.3a48.3 48.3 0 0 0 5.8 5.8l-4.3 9.38 2.26 1.65 2.96-2.73v2.66l-2.84 2.62-4.85-3.52 4.36-9.5a50.31 50.31 0 0 1-3.95-3.95l-9.5 4.36-3.52-4.85 7.08-7.68a49.83 49.83 0 0 1-2.54-4.98l-10.38 1.21-1.85-5.7 9.11-5.12a49.9 49.9 0 0 1-.87-5.52L330 43v-6l10.25-2.05c.19-1.87.48-3.72.87-5.52l-9.11-5.12 1.85-5.7 10.38 1.21c.75-1.71 1.6-3.37 2.54-4.98l-7.08-7.68 3.52-4.85 9.5 4.36a50.31 50.31 0 0 1 3.95-3.95L355.42 0h3.37zM360 52.7l-6.48 3.74A39.86 39.86 0 0 1 350 40a39.9 39.9 0 0 1 3.52-16.44L360 27.3v25.4zm0-39.16v4.52l-2.47-1.43c.77-1.07 1.6-2.1 2.47-3.09zm0 52.92c-.87-.99-1.7-2.02-2.47-3.1l2.47-1.42v4.52zm0-16.07V29.61l-5.5-3.18a37.91 37.91 0 0 0 0 27.14l5.5-3.18zM62.42 360h2.16l3.11-6.78-4.85-3.52-7.68 7.08a49.83 49.83 0 0 0-4.98-2.54l1.21-10.38-5.7-1.85-5.12 9.11a49.9 49.9 0 0 0-5.52-.87L33 340h-6l-2.05 10.25c-1.85.19-3.7.48-5.52.87l-5.12-9.11-5.7 1.85 1.21 10.38c-1.71.75-3.37 1.6-4.98 2.54L0 352.32v5.17-2.5l4.62 4.26a47.84 47.84 0 0 1 7.33-3.74l-1.2-10.24 2.66-.86 5.05 8.99a47.91 47.91 0 0 1 8.12-1.28L28.6 342h2.8l2.02 10.12c2.78.2 5.5.63 8.12 1.28l5.05-9 2.66.87-1.2 10.24c2.54 1.04 5 2.29 7.33 3.74l7.58-7 2.26 1.65-2.8 6.1zM360 244.51l-1.44-.2-.8 1.38 2 2.54.24.17v-3.89zm0 14.45l-4-.4-3.16.66-.28 1.58 2.75 1.7 4.69 1.2v-4.74zm0 13.33l-4.7 1.2-2.74 1.71.28 1.58 3.16.66 4-.4v-4.75zm0 15.31l-.24.17-2 2.54.8 1.38 1.44-.2v-3.89zm0 5.76l-2.57.37-2-3.46 3.33-4.23 1.24-.85v8.17zm0-14.31l-3.65.36-5.27-1.1-.7-3.94 4.58-2.84 5.04-1.3v8.82zm0-13.28l-5.04-1.3-4.58-2.84.7-3.93 5.27-1.1 3.65.35v8.82zm0-14.96l-1.24-.85-3.33-4.23 2-3.46 2.57.37v8.17zm0 101.5V360h-4.58l-3.11-6.78 4.85-3.52 2.84 2.62v-.01zm0 2.67l-2.96-2.73-2.26 1.65 2.8 6.1H360v-5.02z'%3E%3C/path%3E%3C/svg%3E");
}
.video-content-hover {
position: absolute;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
opacity: 0;
visibility: hidden;
transform: translateY(50px);
transition: none;
}
.divider {
height: 2px;
width: 110%;
margin: 30px 0;
background: linear-gradient(to right, #ffffff, #5c5c5c, #fff);
}
// 只在桌面端应用hover效果
@media (hover: hover) {
.video-bg:hover {
.video-content-default {
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.video-content-hover {
opacity: 1;
visibility: visible;
transform: translateY(0);
transition: opacity 0.8s ease, visibility 0.8s ease, transform 0.8s ease;
}
}
}
.product-tabs-item {
transition: all 0.2s ease-in-out;
&:hover {
color: var(--light-color);
img {
filter: none;
}
.active-line {
width: 80%;
opacity: 1;
}
}
img {
filter: grayscale(1) brightness(0.7);
transition: filter 0.3s ease;
}
&.active {
color: var(--primary-color);
&:hover {
color: var(--primary-color);
}
img {
filter: none;
}
}
}
.active-line {
width: 0;
height: 3px;
background: linear-gradient(
to right,
rgba(243, 193, 100, 0.137),
var(--primary-color),
rgba(243, 193, 100, 0.137)
);
opacity: 0;
transform: translateY(2px);
transition: width 0.3s ease, opacity 0.3s ease;
&.active {
width: 50%;
opacity: 1;
}
}
h2 {
color: var(--secondary-text-color);
font-size: 28px;
font-weight: 700;
cursor: default;
margin: 0 auto 40px;
position: relative;
padding-bottom: 10px;
display: inline-block;
width: fit-content;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 3px;
background-image: linear-gradient(
to right,
#ffffff00,
var(--secondary-color-light6),
var(--secondary-color-dark2),
var(--secondary-color-light6),
#ffffff00
);
}
}
h3 {
color: var(--secondary-color-light2);
font-weight: 700;
cursor: default;
position: relative;
padding-bottom: 10px;
&::after {
content: '';
display: block;
width: 100%;
height: 3px;
margin: 20px auto 0;
background-image: linear-gradient(
to right,
var(--secondary-color-light4),
var(--primary-color)
);
}
}
h4 {
font-size: 22px;
color: var(--secondary-color-light1);
font-weight: 600;
margin: 10px 0 10px 0;
}
.erp-image {
border-radius: 5px;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
margin-bottom: 50px;
padding: 40px;
width: 90%;
}
@media (max-width: 1100px) {
.erp-image {
padding: 5px;
}
}
.desc-item {
position: relative;
color: var(--el-color-primary-dark-1);
margin-left: 23px;
margin-bottom: 5px;
font-size: 18px;
&::before {
background-color: var(--primary-color);
border-radius: 50%;
position: absolute;
left: -18px;
top: 10px;
content: '';
width: 5px;
height: 5px;
box-shadow: 0 0 0 5px var(--shadow-color);
}
}
.craft-item {
display: flex;
flex-direction: column;
align-items: center;
min-width: 0;
.cirque {
width: 100px;
height: 100px;
border-radius: 50%;
border: 10px solid var(--primary-color);
}
.square {
width: 80px;
height: 80px;
background-color: var(--secondary-color);
position: relative;
top: -50px;
left: 50px;
color: #fff;
text-align: center;
padding: 10px;
font-size: 20px;
font-weight: 500;
}
.desc-craft {
color: #666;
margin-top: -20px;
margin-left: 30px;
}
}
.craft-machine {
display: flex;
flex-direction: column;
align-items: center;
max-width: 300px;
img {
margin-bottom: 20px;
height: 150px;
}
.machine-desc {
position: relative;
color: var(--el-color-primary-dark-1);
margin-left: 23px;
margin-bottom: 5px;
font-size: 16px;
&::before {
background-color: var(--primary-color);
border-radius: 50%;
position: absolute;
left: -18px;
top: 10px;
content: '';
width: 5px;
height: 5px;
box-shadow: 0 0 0 5px var(--shadow-color);
}
}
}
.video-container {
position: relative;
height: 100%;
margin: 50px auto;
.video {
width: 100%;
height: 100%;
object-fit: fill;
}
}
.video-cont {
position: fixed;
top: 0;
left: 0;
display: none;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
z-index: 100000;
&.active {
display: flex;
justify-content: center;
align-items: center;
}
.video-player {
width: 60vw;
height: 600px;
margin: auto;
position: relative;
.video {
width: 100%;
height: 100%;
}
i {
position: absolute;
top: 5px;
right: 30px;
cursor: pointer;
font-size: 30px;
color: #fff;
z-index: 100001;
}
}
}
</style>
src/views/product/productionCustom.vue
...@@ -35,7 +35,8 @@ ...@@ -35,7 +35,8 @@
<div class="product-custom-cont bg-colorBg py-14 mt-10 lg:mt-28 lg:py-28"> <div class="product-custom-cont bg-colorBg py-14 mt-10 lg:mt-28 lg:py-28">
<div class="custom-container mx-auto"> <div class="custom-container mx-auto">
<div class="cont-title"> <div class="cont-title">
<div class="flex justify-center flex-col items-center gap-2 mb-14 lg:mb-28"> <div
class="flex justify-center flex-col items-center gap-2 mb-14 lg:mb-28">
<h3 <h3
class="font-medium text-xl lg:text-3xl" class="font-medium text-xl lg:text-3xl"
style="text-align: center"> style="text-align: center">
...@@ -211,7 +212,7 @@ ...@@ -211,7 +212,7 @@
<div class="footer-banner"> <div class="footer-banner">
<div class="footer-title">高效选品 潮流热卖</div> <div class="footer-title">高效选品 潮流热卖</div>
<div class="footer-description">追求柔性供应链最优解 支持独品/代工</div> <div class="footer-description">追求柔性供应链最优解 支持独品/代工</div>
<!----> <button class="footer-register-btn" @click="goToLogin">立即使用</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -226,6 +227,9 @@ import adImg from '../../assets/images/home/04.png' ...@@ -226,6 +227,9 @@ import adImg from '../../assets/images/home/04.png'
export default { export default {
name: 'productionCustom', name: 'productionCustom',
components: { ProductDesc }, components: { ProductDesc },
inject: {
scrollParent: 'scrollParent',
},
data() { data() {
return { return {
isLeftHover: true, isLeftHover: true,
...@@ -385,6 +389,17 @@ export default { ...@@ -385,6 +389,17 @@ export default {
this.isRightHover = true this.isRightHover = true
this.isLeftHover = false this.isLeftHover = false
}, },
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
}, },
} }
</script> </script>
...@@ -501,7 +516,7 @@ export default { ...@@ -501,7 +516,7 @@ export default {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 80px 15px; padding: 60px 15px;
background-image: url(../../assets/images/home/06.png); background-image: url(../../assets/images/home/06.png);
background-position-y: bottom; background-position-y: bottom;
background-repeat: no-repeat; background-repeat: no-repeat;
...@@ -530,6 +545,23 @@ export default { ...@@ -530,6 +545,23 @@ export default {
.product-custom-bottom-module { .product-custom-bottom-module {
width: 70vw; width: 70vw;
} }
.footer-register-btn {
width: 200px;
height: 60px;
display: block;
background: rgba(59, 130, 246, 0.5);
border-radius: 10px;
border: 1px solid #ffffffd8;
font-size: 18px;
color: #e9e9e9;
cursor: pointer;
transition: all 0.3s ease;
}
.footer-register-btn:hover {
background: rgba(255, 255, 255);
color: rgba(59, 130, 246);
}
@media (max-width: 1100px) { @media (max-width: 1100px) {
.content-container { .content-container {
width: 90vw; width: 90vw;
......
src/views/product/productionLogistics.vue
...@@ -184,7 +184,7 @@ ...@@ -184,7 +184,7 @@
<div class="footer-description text-center lg:text-left"> <div class="footer-description text-center lg:text-left">
九猫ERP助力精准核算业务利润与高效决策，业财一体化不再是难事 九猫ERP助力精准核算业务利润与高效决策，业财一体化不再是难事
</div> </div>
<!----> <button class="footer-register-btn" @click="goToLogin">立即使用</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -196,6 +196,9 @@ export default { ...@@ -196,6 +196,9 @@ export default {
components: { components: {
ProductLogisticsDesc, ProductLogisticsDesc,
}, },
inject: {
scrollParent: 'scrollParent',
},
data() { data() {
return { return {
navigateKey: 'df', navigateKey: 'df',
...@@ -371,6 +374,17 @@ export default { ...@@ -371,6 +374,17 @@ export default {
this.navigateKey = key this.navigateKey = key
this.$refs.logisticsCarousel.setActiveItem(index) this.$refs.logisticsCarousel.setActiveItem(index)
}, },
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
}, },
} }
</script> </script>
...@@ -474,7 +488,7 @@ export default { ...@@ -474,7 +488,7 @@ export default {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 80px 15px; padding: 60px 15px;
background-image: url(../../assets/images/home/06.png); background-image: url(../../assets/images/home/06.png);
background-position-y: bottom; background-position-y: bottom;
background-repeat: no-repeat; background-repeat: no-repeat;
...@@ -497,6 +511,23 @@ export default { ...@@ -497,6 +511,23 @@ export default {
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
} }
} }
.footer-register-btn {
width: 200px;
height: 60px;
display: block;
background: rgba(59, 130, 246, 0.5);
border-radius: 10px;
border: 1px solid #ffffffd8;
font-size: 18px;
color: #e9e9e9;
cursor: pointer;
transition: all 0.3s ease;
}
.footer-register-btn:hover {
background: rgba(255, 255, 255);
color: rgba(59, 130, 246);
}
@media (max-width: 1100px) { @media (max-width: 1100px) {
.content-container { .content-container {
height: auto; height: auto;
......
src/views/product/productionManagement.vue
...@@ -134,15 +134,6 @@ ...@@ -134,15 +134,6 @@
</div> </div>
</div> </div>
</div> </div>
<div class="footer-bg">
<div class="footer-banner">
<div class="footer-title">亚马逊ERP一体化管理，开启高效决策新体验</div>
<div class="footer-description text-center lg:text-left">
九猫ERP助力精准核算业务利润与高效决策，业财一体化不再是难事
</div>
<!---->
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
...@@ -176,8 +167,7 @@ export default { ...@@ -176,8 +167,7 @@ export default {
id: 'realtime-profit-stats', id: 'realtime-profit-stats',
img: financesImg, img: financesImg,
title: '实时利润统计', title: '实时利润统计',
subTitle: subTitle: '利润数据每小时更新，把握业务盈利情况，及时调整策略',
'利润数据每小时更新，把握业务盈利情况，及时调整策略',
items: [ items: [
{ {
title: '即时查看平台利润', title: '即时查看平台利润',
...@@ -192,35 +182,30 @@ export default { ...@@ -192,35 +182,30 @@ export default {
title: '店铺费用自动分摊', title: '店铺费用自动分摊',
subTitle: '站点实时查看成本和利润', subTitle: '站点实时查看成本和利润',
}, },
], ],
}, },
{ {
id: 'settlement-center', id: 'settlement-center',
img: cwglImg, img: cwglImg,
title: '财务管理', title: '财务管理',
subTitle: subTitle: '在线审批报销，财务直接在系统进行业绩统计，工资绩效分配',
'在线审批报销，财务直接在系统进行业绩统计，工资绩效分配',
items: [ items: [
{ {
title: '财务审批', title: '财务审批',
subTitle: subTitle: '订单退款财务直接线上审批核实，省时省力',
'订单退款财务直接线上审批核实，省时省力',
}, },
{ {
title: '工资绩效管理', title: '工资绩效管理',
subTitle: subTitle: '入职即可管理工资和绩效，根据店铺分红直接统计每月工资',
'入职即可管理工资和绩效，根据店铺分红直接统计每月工资',
}, },
{ {
title: '对账系统', title: '对账系统',
subTitle: subTitle: '工厂生产对账、广告对账、物流对账一应俱全',
'工厂生产对账、广告对账、物流对账一应俱全',
}, },
], ],
}, },
{ {
id: 'replenishment-advice', id: 'replenishment-advice',
img: productionImg, img: productionImg,
...@@ -446,13 +431,11 @@ export default { ...@@ -446,13 +431,11 @@ export default {
id: 'visualization-ad-report', id: 'visualization-ad-report',
img: adImg, img: adImg,
title: '广告管理', title: '广告管理',
subTitle: subTitle: '统一管理所有类型广告，整合提供多维广告报告',
'统一管理所有类型广告，整合提供多维广告报告',
items: [ items: [
{ {
title: '多类型广告统一管理', title: '多类型广告统一管理',
subTitle: subTitle: '支持一站式管理Google、Facebook、TikTok广告账户',
'支持一站式管理Google、Facebook、TikTok广告账户',
}, },
{ {
title: '广告数据集成分析', title: '广告数据集成分析',
...@@ -461,13 +444,11 @@ export default { ...@@ -461,13 +444,11 @@ export default {
}, },
{ {
title: '导出账单', title: '导出账单',
subTitle: subTitle: '支持导出多个广告账户账单，方便财务后期核算',
'支持导出多个广告账户账单，方便财务后期核算',
}, },
{ {
title: '广告预警', title: '广告预警',
subTitle: subTitle: '设置广告花费上限或者预算，一旦超支会电话通知',
'设置广告花费上限或者预算，一旦超支会电话通知',
}, },
], ],
}, },
...@@ -475,13 +456,11 @@ export default { ...@@ -475,13 +456,11 @@ export default {
id: 'ad-analysis', id: 'ad-analysis',
img: lrImg, img: lrImg,
title: '利润统计', title: '利润统计',
subTitle: subTitle: '实时利润统计把握业务盈利情况，及时调整策略',
'实时利润统计把握业务盈利情况，及时调整策略',
items: [ items: [
{ {
title: '即时查看平台利润', title: '即时查看平台利润',
subTitle: subTitle: '即时获取店铺账单数据，以及销售SKU数据',
'即时获取店铺账单数据，以及销售SKU数据',
}, },
{ {
title: '支持当日利润分析', title: '支持当日利润分析',
...@@ -490,8 +469,7 @@ export default { ...@@ -490,8 +469,7 @@ export default {
}, },
{ {
title: '订单自动算出利润', title: '订单自动算出利润',
subTitle: subTitle: '根据商品成本、物流费用、工艺费用等算出订单利润率',
'根据商品成本、物流费用、工艺费用等算出订单利润率',
}, },
], ],
}, },
...@@ -499,23 +477,19 @@ export default { ...@@ -499,23 +477,19 @@ export default {
id: 'keyword-management', id: 'keyword-management',
img: keywordImg, img: keywordImg,
title: '业绩报表', title: '业绩报表',
subTitle: subTitle: '自动抓取整合业绩指标，业绩趋势一表尽览',
'自动抓取整合业绩指标，业绩趋势一表尽览',
items: [ items: [
{ {
title: '人员业绩高效核算', title: '人员业绩高效核算',
subTitle: subTitle: '负责人、开发人双维度业绩统计，自动计算毛利润和毛利率',
'负责人、开发人双维度业绩统计，自动计算毛利润和毛利率',
}, },
{ {
title: '业绩统计维度广', title: '业绩统计维度广',
subTitle: subTitle: '支持条件筛选，统计不同SKU、新老品类的利润表现等',
'支持条件筛选，统计不同SKU、新老品类的利润表现等',
}, },
{ {
title: '每日业绩排名', title: '每日业绩排名',
subTitle: subTitle: '提供不同人员每日销售排名，直观清晰查看绩效变动',
'提供不同人员每日销售排名，直观清晰查看绩效变动',
}, },
{ {
title: '店铺经营结果自动统计', title: '店铺经营结果自动统计',
...@@ -524,10 +498,6 @@ export default { ...@@ -524,10 +498,6 @@ export default {
}, },
], ],
}, },
], ],
subKey: 'realtime-profit-stats', subKey: 'realtime-profit-stats',
productNavs: [ productNavs: [
...@@ -709,6 +679,17 @@ export default { ...@@ -709,6 +679,17 @@ export default {
el.scrollIntoView({ behavior: 'smooth', block: 'center' }) el.scrollIntoView({ behavior: 'smooth', block: 'center' })
} }
}, },
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
}, },
} }
</script> </script>
...@@ -865,37 +846,6 @@ export default { ...@@ -865,37 +846,6 @@ export default {
.banner-title { .banner-title {
// font-size: 36px; // font-size: 36px;
} }
.footer-bg {
background: linear-gradient(180deg, #2554fe, #3572ff);
}
.footer-banner {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 80px 15px;
background-image: url(../../assets/images/home/06.png);
background-position-y: bottom;
background-repeat: no-repeat;
background-size: 100% 90px;
.footer-title {
font-weight: 500;
font-size: 36px;
margin-bottom: 20px;
max-width: 70vw;
text-align: center;
color: rgba(255, 255, 255, 1);
letter-spacing: 2px;
}
.footer-description {
font-weight: 300;
font-size: 18px;
margin-top: 8px;
margin-bottom: 40px;
color: rgba(255, 255, 255, 1);
}
}
.high-light { .high-light {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgba(37, 84, 254, var(--tw-text-opacity)); color: rgba(37, 84, 254, var(--tw-text-opacity));
...@@ -978,24 +928,6 @@ export default { ...@@ -978,24 +928,6 @@ export default {
margin: 0 auto; margin: 0 auto;
height: auto; height: auto;
} }
.footer-banner {
padding: 40px 10px;
.footer-title {
font-size: 18px;
margin-bottom: 10px;
max-width: 90vw;
text-align: center;
color: rgba(255, 255, 255, 1);
}
.footer-description {
font-weight: 300;
font-size: 12px;
margin-top: 8px;
margin-bottom: 20px;
color: rgba(255, 255, 255, 1);
}
}
.cooperation-container { .cooperation-container {
width: 90vw; width: 90vw;
} }
......
src/views/protocol.vue
<template> <template>
<div class="page_main"> <div class="page_main h-full">
<el-tabs type="card" v-model="activeName"> <el-tabs type="card" v-model="activeName">
<el-tab-pane name="term" label="九猫ERP条款与协议"> <el-tab-pane name="term" label="九猫ERP条款与协议">
<h4 class="title">前言</h4> <h4 class="title">前言</h4>
...@@ -613,10 +613,6 @@ export default { ...@@ -613,10 +613,6 @@ export default {
</script> </script>
<style scoped> <style scoped>
.page_main {
height: 100%;
}
.el-tabs { .el-tabs {
height: 100%; height: 100%;
display: flex; display: flex;
...@@ -635,6 +631,10 @@ export default { ...@@ -635,6 +631,10 @@ export default {
/* text-align: center; */ /* text-align: center; */
margin-bottom: 10px; margin-bottom: 10px;
} }
p, li, h4 {
color: #3d3d3d
}
p, p,
li { li {
margin-bottom: 10px; margin-bottom: 10px;
......
src/views/support/financialPage.vue
...@@ -254,6 +254,7 @@ ...@@ -254,6 +254,7 @@
<div class="footer-description"> <div class="footer-description">
九猫ERP，将为您提供全维的业务解决方案 九猫ERP，将为您提供全维的业务解决方案
</div> </div>
<button class="footer-register-btn" @click="goToLogin">立即使用</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -268,6 +269,9 @@ import adImg from '../../assets/images/home/04.png' ...@@ -268,6 +269,9 @@ import adImg from '../../assets/images/home/04.png'
export default { export default {
name: 'financialPage', name: 'financialPage',
components: { ProductDesc }, components: { ProductDesc },
inject: {
scrollParent: 'scrollParent',
},
data() { data() {
return { return {
financialControlList: [ financialControlList: [
...@@ -482,6 +486,19 @@ export default { ...@@ -482,6 +486,19 @@ export default {
], ],
} }
}, },
methods: {
async goToLogin() {
// 跳转到首页
await this.$router.push('/home').catch(() => {})
// 使用 scrollParent 进行滚动
this.$nextTick(() => {
this.scrollParent().scrollTo({
top: 0,
behavior: 'smooth',
})
})
},
},
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -528,7 +545,7 @@ export default { ...@@ -528,7 +545,7 @@ export default {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 80px 15px; padding: 60px 15px;
background-image: url(../../assets/images/home/06.png); background-image: url(../../assets/images/home/06.png);
background-position-y: bottom; background-position-y: bottom;
background-repeat: no-repeat; background-repeat: no-repeat;
...@@ -551,6 +568,23 @@ export default { ...@@ -551,6 +568,23 @@ export default {
color: rgba(255, 255, 255, 1); color: rgba(255, 255, 255, 1);
} }
} }
.footer-register-btn {
width: 200px;
height: 60px;
display: block;
background: rgba(59, 130, 246, 0.5);
border-radius: 10px;
border: 1px solid #ffffffd8;
font-size: 18px;
color: #e9e9e9;
cursor: pointer;
transition: all 0.3s ease;
}
.footer-register-btn:hover {
background: rgba(255, 255, 255);
color: rgba(59, 130, 246);
}
@media (max-width: 1100px) { @media (max-width: 1100px) {
.footer-banner { .footer-banner {
padding: 40px 10px; padding: 40px 10px;
......
tailwind.config.js
...@@ -3,7 +3,30 @@ module.exports = { ...@@ -3,7 +3,30 @@ module.exports = {
purge: ['./src/**/*.{vue,js,ts,jsx,tsx}'], purge: ['./src/**/*.{vue,js,ts,jsx,tsx}'],
theme: { theme: {
extend: { extend: {
colors: {
'primary-color': 'var(--primary-color)',
'secondary-color': 'var(--secondary-color)',
},
width: { width: {
104: '26rem',
112: '28rem',
120: '30rem',
128: '32rem',
144: '36rem',
160: '40rem',
192: '48rem',
224: '56rem',
256: '64rem',
288: '72rem',
320: '80rem',
384: '96rem',
512: '128rem',
576: '144rem',
640: '160rem',
},
height: {
104: '26rem',
112: '28rem',
120: '30rem', 120: '30rem',
128: '32rem', 128: '32rem',
144: '36rem', 144: '36rem',
...@@ -33,9 +56,16 @@ module.exports = { ...@@ -33,9 +56,16 @@ module.exports = {
68: '68px', 68: '68px',
}, },
marginTop: { marginTop: {
30:'120px' 30: '120px'
}, },
}, },
}, },
variants: {
extend: {
width: ['hover'],
height: ['hover'],
}
},
plugins: [], plugins: [],
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment