Skip to content

O
offical_web
Commit d1c569f1 by qinjianhui
Options

feat: 首页

parent 583553b5
Showing with 812 additions and 1066 deletions
src/assets/css/common.css
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
button,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video,
input {
body {
margin: 0;
padding: 0;
border: 0;
......@@ -81,961 +12,196 @@ html,
body {
width: 100%;
height: 100%;
/* font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
"Microsoft YaHei", "微软雅黑", Arial, sans-serif; */
color: #222;
}
@media screen and (min-width: 768px) {
::-webkit-scrollbar {
width: 10px;
height: 10px;
background-color: transparent;
}
::-webkit-scrollbar-thumb {
border-radius: 5px;
background-color: rgba(221, 221, 221, 1);
transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-webkit-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
}
::-webkit-scrollbar-track {
border: none;
outline: none;
background-color: rgba(0, 0, 0, 0);
}
div {
box-sizing: border-box;
}
/* @font-face
{
font-family: Alibaba PuHuiTi;
src: url(../fonts/Alibaba-PuHuiTi-Light.ttf),url(../fonts/Alibaba-PuHuiTi-Heavy.ttf),url(../fonts/Alibaba-PuHuiTi-Light.ttf),url(../fonts/Alibaba-PuHuiTi-Medium.ttf),url(../fonts/Alibaba-PuHuiTi-Regular.ttf);
} */
.el-form-item--mini.el-form-item,
.el-form-item--small.el-form-item {
margin-bottom: 10px;
}
.el-dialog__header {
padding: 8px 20px 5px 20px;
ul li {
list-style: none;
}
.el-dialog__body {
padding: 10px 20px 0;
.mt-10 {
margin-top: 10px;
}
.el-dialog__footer {
padding: 10px 20px 10px 20px;
text-align: center;
.mt-20 {
margin-top: 20px;
}
.plTableBox .el-table--mini td,
.plTableBox .el-table--mini th {
padding: 3px 0 !important;
.mt-30 {
margin-top: 30px;
}
.el-table--mini td,
.el-table--mini th {
padding: 3px 0;
.mt-80 {
margin-top: 80px;
}
.el-tabs--border-card>.el-tabs__content {
padding: 10px;
.mb-8 {
margin-bottom: 8px;
}
.el-tabs__header {
.mb-10 {
margin-bottom: 10px;
}
.el-table .cell {
padding-left: 6px;
padding-right: 6px;
white-space: nowrap;
}
.el-table--striped .el-table__body tr.el-table__row--striped.current-row td {
background-color: #35e6dc !important;
}
.height>td {
background-color: #ff4747 !important;
color: #fff;
}
/* .el-table tr:hover>td{
background-color: #35e6dc !important;
} */
.my-table .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
background-color: #67c23a;
border-color: #67c23a;
}
.menu-disabled-view .el-dropdown-menu__item.is-disabled {
color: #303133;
font-weight: 600;
border-bottom: 1px solid #ebeef5;
}
.el-dropdown-menu--medium .el-dropdown-menu__item {
padding: 0 15px;
}
.menu-disabled-view .menu-cherd {
padding-left: 35px;
}
.el-form-item--mini .el-form-item__content,
.el-form-item--mini .el-form-item__label {
line-height: 26px;
}
.el-form-item--mini .el-form-item__label {
padding-right: 5px;
}
.el-input--mini .el-input__inner {
height: 26px;
line-height: 26px;
padding: 0 8px;
.mb-20 {
margin-bottom: 20px;
}
.el-input--prefix .el-input__inner {
padding-left: 26px;
.mb-30 {
margin-bottom: 30px;
}
/* .e .el-input__inner {
padding: 0 8px ;
} */
.el-input__suffix {
right: 2px;
.mr-10 {
margin-right: 10px;
}
.el-input__icon {
width: 18px;
.mr-20 {
margin-right: 20px;
}
.el-input--suffix .el-input__inner {
padding-right: 18px;
.mr-30 {
margin-right: 30px;
}
.el-input-number--mini {
line-height: 24px;
.ml-10 {
margin-left: 10px;
}
.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before {
content: '*';
color: #f55555;
font-size: 18px;
font-weight: 600;
.ml-20 {
margin-left: 20px;
}
.el-button+.el-button,
.el-button+.el-dropdown {
margin-left: 5px;
.ml-30 {
margin-left: 30px;
}
.el-button--mini,
.el-button--mini.is-round {
padding: 6px 8px;
.flex {
display: flex;
}
/* 全局样式 */
.image-view-c {
display: flex;
.flex-center {
justify-content: center;
align-items: center;
}
.flex-column {
display: flex;
flex-direction: column;
height: calc(100% - 10px);
}
.erp-index-container {
width: 100%;
background-color: #eff3f6;
height: calc(100vh - 120px);
box-sizing: border-box;
padding: 0 15px;
}
.footerWidth {
height: calc(100vh - 140px);
}
.footerWidth2 {
height: calc(100vh - 322px);
}
.tree-tabs-conter .el-tabs__item,
.footer-edit .el-tabs__item {
line-height: 25px;
height: 25px;
font-weight: 600;
.flex-between {
justify-content: space-between;
align-items: center;
}
.erp-index-container-h {
height: calc(100vh - 85px);
padding-top: 10px;
.items-center {
align-items: center;
}
.erp-select-item {
padding-top: 10px;
.justify-center {
justify-content: center;
}
.addBtn {
width: 80px;
height: 30px;
display: inline-block;
background: rgba(29, 138, 207, 1);
border-radius: 2px;
color: #ffffff;
text-align: center;
line-height: 30px;
margin-right: 20px;
cursor: pointer;
.justify-between {
justify-content: space-between;
}
.otherBtn {
min-width: 80px;
height: 30px;
background: rgba(255, 255, 255, 1);
border: 1px solid rgba(239, 239, 239, 1);
border-radius: 2px;
color: #222222;
margin-right: 20px;
text-align: center;
line-height: 30px;
display: inline-block;
cursor: pointer;
padding: 0 15px;
.flex-1 {
flex: 1;
}
.otherBtn:hover {
background: rgba(255, 255, 255, 1);
border: 1px solid rgba(29, 138, 207, 1);
color: rgba(29, 138, 207, 1);
.flex-col {
flex-direction: column
}
.index-tableOperate {
font-size: 14px;
flex-wrap: wrap;
.py-10 {
padding: 10px 0;
}
.tableOperate {
font-size: 14px;
.px-10 {
padding: 0 10px;
}
.index-tableOperate>div {
cursor: pointer;
border-radius: 4px;
height: 40px;
line-height: 40px;
color: #ffffff;
font-weight: bold;
padding: 0 24px;
margin-right: 20px;
margin-bottom: 20px;
.py-20 {
padding: 20px 0;
}
ul li {
list-style: none;
.px-20 {
padding: 0 20px;
}
/* 公用 */
.height-100 {
height: 100%;
.py-30 {
padding: 30px 0;
}
.my-flex {
display: flex;
.px-30 {
padding: 0 30px;
}
.my-flex-1 {
flex: 1;
.py-24 {
padding: 24px 0;
}
.pageinationCon {
position: relative;
box-sizing: border-box;
width: 100%;
display: flex;
justify-content: center;
margin: 0 auto;
padding: 3px 15px;
/* background-color: #eff3f6; */
height: 40px;
.px-24 {
padding: 0 24px;
}
.tree-view {
padding-top: 10px;
min-width: 168px;
max-width: 200px;
overflow: auto;
position: relative;
height: 100%;
padding-bottom: 10px;
box-sizing: border-box;
.mt-16 {
margin-top: 16px;
}
.tree-view-show {
width: 15px;
height: 30px;
margin: auto;
right: 10px;
cursor: pointer;
text-align: center;
.font-light {
font-weight: 300;
}
.tree-view-show i {
color: #409eff;
.font-size-18 {
font-size: 18px;
line-height: 30px;
font-weight: bold;
}
.tree-view-show i:hover {
color: #1d8acf;
}
.pop-tree-view .el-checkbox:last-of-type {
margin-right: 8px;
}
.tree-view .el-tree {
height: 100%;
overflow: auto;
border: 1px solid #e4e7ed;
box-sizing: border-box;
}
.my-table-cont {
padding: 0;
overflow: auto;
width: 100%;
position: relative;
/* user-select:none */
}
.my-flex-table {
position: relative;
overflow: auto;
width: calc(100% - 230px);
}
.my-table {
width: 99.9% !important;
}
.file-view {
width: 220px;
min-height: 440px;
padding: 20px;
background: #fff;
color: #333;
font-size: 14px;
}
.icon-view {
width: 23px;
height: 23px;
.font-size-16 {
font-size: 16px;
line-height: 23px;
border-radius: 4px;
text-align: center;
display: inline-block;
color: #fff;
cursor: pointer;
vertical-align: middle;
}
.icon-view:not(:first-child) {
margin-left: 5px;
}
.icon-edit-view {
background-color: #ff9900;
}
.icon-edit-view:hover {
background-color: #ffd36a;
}
.icon-del-view {
background-color: #f56c6c;
}
.icon-del-view:hover {
background-color: #f78989;
}
.icon-tools-view {
background-color: #8cc34b;
}
.icon-tools-view:hover {
background-color: #85ce61;
}
.icon-primary-view {
background-color: #409eff;
}
.icon-primary-view:hover {
background-color: #66b1ff;
}
.text-red {
color: #d50000;
}
.menu {
z-index: 999;
width: 80px;
padding: 10px;
position: absolute;
background-color: #fff;
box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.21);
}
.menu_item {
text-align: center;
cursor: pointer;
font-size: 14px;
line-height: 25px;
color: #333333;
}
.menu_item:hover {
background-color: #409eff;
color: #fff;
}
.pop-p {
position: relative;
min-height: 24px;
margin-top: 3px;
margin-bottom: 10px;
.font-size-14 {
font-size: 14px;
line-height: 28px;
color: #333;
font-weight: bold;
text-align: center;
}
.my-table-title {
background-color: #fff;
border: 1px solid #ebeef5;
padding: 5px;
}
.picture-img-title {
line-height: 60px;
margin-right: 8px;
width: 60px;
text-align: right;
}
.footer-edit {
position: relative;
height: auto;
background-color: #fff;
}
.tree-tabs-conter {
background: #fff;
height: 280px;
}
.table-setting {
position: absolute;
left: 0;
top: 5px;
z-index: 998;
}
.tabcolounm-checkbox {
width: 500px;
}
.tabcolounm-checkbox li {
float: left;
width: 150px;
box-sizing: border-box;
}
.tabcolounm-checkbox .el-checkbox__label {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 90px;
vertical-align: middle;
}
.el-button--warning:focus,
.el-button--warning:hover {
background-color: rgb(253, 183, 77);
border-color: rgb(253, 183, 77);
}
.el-button--warning:active {
background-color: rgb(250, 167, 43);
border-color: rgb(250, 167, 43);
}
.pop-form-body .el-dialog__body {
padding: 0px 20px;
}
/* .pop-form-body .el-dialog__footer {
text-align: left;
} */
.my-table .el-input__inner {
border: none;
}
.show-column {
position: absolute;
z-index: 5;
right: 0px;
top: 6px;
.w-full-70 {
width: 70vw;
}
.custom-tree-node {
font-size: 14px;
.gap-100 {
gap: 100px;
}
.el-tree-node__content {
height: 28px;
.text-textContent {
--tw-text-opacity: 1;
color: rgba(92, 94, 102, var(--tw-text-opacity));
}
.el-tree-node__content strong {
.lx-title {
font-size: 36px;
color: #1a2035;
font-weight: 500;
color: #303133;
}
.el-dialog {
padding-bottom: 10px;
}
.rotate-90 {
transform: rotate(90deg);
}
.rotate-270 {
transform: rotate(270deg);
}
.router-but-view {
display: inline-block;
padding: 0 7px;
border-radius: 2px;
line-height: 23px;
cursor: pointer;
background-color: #409eff;
color: #fff;
height: 23px;
}
.router-icon {
margin-left: 1px;
margin-top: 3px;
display: inline-block;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAADT0lEQVRoQ+1ZTYhOYRR+noWS/G2IiRolC1N+Itkoo/yMWMmEFArFUCIWLJgFG1OKSUSRYmSkidIwqVnYMZOIyMJPIkR+srF5dL7e+/XOO/f7/2Zud3xnee655z3P+5xzz3nfS6RcmPL4kX4Ako4BOJpSJlopSSkNPhN2DUCZ7N0B0A/gLYDVANY7P4X0XwAcBFAfrZsUA40key0ISRsBXHMBFaPfCuBS0gAmk/zqANhuvnEBlapPrAZaSJ51AA4AaHMAitHb7hsLiRfxRwB//Xx2MeXTjwIwya+7pGqgzNof/NqIA9Bata0ZWkfZyWEAAyRTMRv500MNwNBmSrz3GgNJ7Lq/5v/NgKQVAOYAaIjpornI+QCgD8Bzkj2SbPrcHRj/dhPqSwDdJH/kclY2A5IOAzheYQp1kNzkQNzI4cuGu/0ku+KelwWg2ic36zmSWgC059mQzSSvhs9LBiDJ5nWb26spR0iekHQBwPY8jutJviu7iCUtB3A/WMBGji6ST4pBJGmaCzK8PGgi2e3G6vEAlrkLhnme31sk11UCYA+AM56DTpLNgcNxAGyu9+U0ye+B3RoAdmyMpI2kHRGzImkqgMcA6pzyM8kplQA4D2Cn56CB5IvA4SwArzxdplDj2JH0HsB096yf5ILQTlIHgA2efgZJOz9npKQakHQbwFrP2QSSvwIAFoTtWiQnSR7KAeA1gJnuWS/JxhgApwDs8/SLSD4qF0B48dVMsjMAMAbAH093j+SqmMCaANz19BdJ7oixs5qz2otkLMms/1IZMCqNUl/qSH4KQNg1yXxP10rSwGdF0tIw2Oh2wtvdAbcOAJ6SnBv4yV7GFRynJY126WGd15frXt4/BGCLRIfzyK7Hui+An3HpFOiMRevwKwP9FpJXygZgL0qa7QLJFUcfyYUx9VJE3HlN2knujUmx4hnwqLXPmzW0QWngbDIpI8makjWnSuUcyV1xTkqqgRj0ltfWcJbEOL9McpukxQBscbOzJlas2KfyAYCbUYOrOgCPkYkA/I6ZXcsvTElmY7aF5BvJZ4WMXEqXnkLFOB4um4pSaLiCzLdODUDSLNQYqDFQ4Q7kTKEK/Sby+oi4Xk/3j+5EeK/ioqn4H5APb+oB/APRHiipvXbpTgAAAABJRU5ErkJggg==);
width: 16px;
height: 16px;
background-size: 100% 100%;
}
.el-table .el-image__error {
font-size: 12px;
line-height: 14px;
}
.text-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.calcul-tat-bar {
width: 220px;
margin-right: 6px;
border: 1px solid #e5e5e5;
border-radius: 10px 10px 0 0;
height: 100%;
box-sizing: border-box;
}
.calcul-tat-bar li {
height: 30px;
line-height: 30px;
}
.calcul-tat-bar ul {
overflow: auto;
background: #fff;
}
.tabt-bar-nav {
background-color: #cccccc;
color: #fff;
border-radius: 10px 10px 0 0;
cursor: pointer;
overflow: hidden;
width: 100%;
height: 40px;
line-height: 40px;
}
.tabt-bar-nav2 {
background-color: #ebeef5;
width: 100%;
color: #333;
height: 40px;
line-height: 40px;
}
.calcul-tat-bar .active {
background: #4267b2;
}
.calcul-tat-bar span {
text-align: center;
font-size: 14px;
}
.calcul-tat-bar-li {
cursor: pointer;
border-bottom: 1px solid #ebeef5;
box-sizing: border-box;
}
.billInfo {
width: 100%;
position: absolute;
bottom: 0;
left: 0;
height: 20px;
background: rgba(242, 242, 242, 1);
color: #999999;
font-size: 12px;
line-height: 20px;
text-align: center;
--tw-text-opacity: 1;
color: rgba(26, 32, 53, var(--tw-text-opacity));
letter-spacing: 1px;
}
.supply-list {
border-bottom: 1px solid #dcdfe6;
padding: 8px 0;
}
.supply-list li {
color: #303133;
font-size: 16px;
font-weight: 600;
line-height: 20px;
display: inline-block;
}
.supply-list li:not(:first-child) {
padding: 0 6px;
font-weight: 500;
font-size: 12px;
line-height: 24px;
margin-left: 8px;
background: #fff;
color: #606266;
border: 1px solid #dcdfe6;
border-radius: 4px;
box-sizing: border-box;
cursor: pointer;
}
.attribute-checkbox .el-checkbox {
min-width: 110px;
border: 1px solid #dcdfe6;
box-sizing: border-box;
border-radius: 4px;
padding-left: 5px;
padding-right: 5px;
margin-right: 10px;
margin-bottom: 10px;
}
.attribute-checkbox .el-checkbox__label {
vertical-align: middle;
display: inline-block;
width: 120px;
box-sizing: border-box;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.pop-p-but {
position: absolute;
display: inline-block;
right: 0;
top: 0;
height: 20px;
}
/* .pop-p-but .el-button--mini {
padding: 3px 5px;
} */
.my-table-column {
color: #f56c6c;
font-size: 16px;
}
.tooltip-ul li {
padding: 2px;
}
.text-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.box .el-tabs__content {
height: calc(100% - 25px);
box-sizing: border-box;
}
.box .el-tab-pane {
height: 100%;
}
.box .el-tabs__item {
line-height: 25px;
height: 25px;
font-weight: 600;
}
.summary-but {
position: relative;
top: 2px;
margin-right: 10px;
margin-bottom: -4px;
cursor: pointer;
display: inline-block;
width: 24px;
height: 24px;
background-image: url(data:image/png;base64,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);
/* 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%;
}
.summary-but.issummary {
background-image: url(data:image/png;base64,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);
}
.el-table-column1 {
font-size: 12px;
line-height: 20px !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.el-table thead {
color: #666 !important;
}
.el-table th>.cell {
padding-left: 3px;
padding-right: 3px;
/* line-height: 20px; */
}
.plTableBox .el-table th>.cell {
padding-left: 3px !important;
padding-right: 3px !important;
/* line-height: 20px; */
}
.el-table .cell,
.el-table--border td:first-child .cell,
.el-table--border th:first-child .cell {
padding-left: 3px;
}
.func-btn-wrap {
display: inline-block;
padding-top: 1px;
overflow: hidden;
vertical-align: top;
}
.func-btn-wrap>div,
.func-btn-wrap>button {
margin-left: 5px;
display: inline;
}
.highlight::after {
position: absolute;
top: -2px;
right: -2px;
content: '';
background: red;
height: 10px;
width: 10px;
border-radius: 5px;
box-shadow: 1px 1px 8px 2px rgb(4, 197, 255);
}
.el-color-picker__panel .el-button--mini {
padding: 0 8px !important;
.text-sm {
font-size: 18px;
}
.table_wrap {
flex: 1;
.w-full {
width: 100%;
padding: 0 10px;
box-sizing: border-box;
position: relative;
overflow-x: hidden;
overflow-y: auto;
}
.narrow_spacing .el-form-item {
margin-bottom: 5px !important;
}
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
background-color: #aad2ff;
}
.account_operation span {
display: inline-block;
text-align: center;
cursor: pointer;
}
.account_operation span:nth-of-type(1) {
width: 16px;
}
.account_operation span:nth-of-type(2) {}
.account_operation span:nth-of-type(3) {
width: 16px;
}
.el-input.is-disabled .el-input__inner {
cursor: text;
}
.el-table th.gutter {
display: table-cell !important;
}
.el-table colgroup.gutter {
display: table-cell !important;
}
.el-table .warning-row {
background: oldlace;
}
.el-table .success-row {
background: #f0f9eb;
}
.statistical .el-table__footer-wrapper tbody td {
background-color: #ddd;
}
.statistical .el-table__footer-wrapper tbody td .cell {
font-weight: bolder;
font-size: 14px;
}
.el-image-viewer__close .el-icon-circle-close {
color: #efefef;
}
.reject .el-message-box__content {
padding: 5px 15px 0;
}
.reject .el-message-box__input {
padding-top: 0;
}
.reject .el-input--mini .el-input__inner {
height: 34px;
}
.vxe-header--column,
.vxe-body--column {
vertical-align: middle;
}
/* .page_content{
display: flex;
height: 100%;
flex-direction: column;
} */
.el-cascader-panel .el-cascader-menu {
width: 230px;
}
.el-message {
z-index: 7000 !important;
margin-top: 400px !important;
}
.el-select.green .el-input__inner {
color: green;
font-weight: bold;
}
.el-select.red .el-input__inner {
color: red;
font-weight: bold;
}
.status_circle {
width: 10px;
height: 10px;
display: inline-block;
/* background-color: green; */
border-radius: 5px;
margin-right: 5px;
}
.el-cascader-panel .el-cascader-menu__wrap {
height: auto;
max-height: 500px;
}
.account_popper {
box-sizing: border-box;
}
.el-input-number.is-without-controls .el-input__inner {
text-align: left;
padding: 0 8px;
}
.el-dialog__footer .el-button{
width: 100px;
}
.operate-popper{
min-width: 100px;
@media screen and (max-width: 1100px) {
.lx-title {
font-size: 20px;
}
.text-sm {
font-size: 12px;
}
}
\ No newline at end of file
src/assets/css/index.css
.container {
max-width: 1280px;
margin: 0 auto;
display: flex;
align-items: center;
}
.link {
color: #2a6ffe;
text-decoration: none;
}
.link:hover {
color: #2386ee;
color: #525558;
}
.text-center {
text-align: center;
}
\ No newline at end of file
src/components/head.vue
......@@ -59,7 +59,8 @@ export default {
return {
navbar: [
{ name: '首页', path: '/home' },
{ name: '核心功能', path: '/function' },
{ name: '产品', path: '/product' },
// { name: '核心功能', path: '/function' },
// { name: '价格', path: '/price' },
{ name: '需求痛点', path: '/demand_pain_point' },
{ name: '一件定制', path: 'https://jomalls.com/custom/' },
......@@ -113,13 +114,13 @@ export default {
</script>
<style scoped>
.header {
/* .header {
position: fixed;
z-index: 999;
top: 0;
right: 0;
left: 0;
}
} */
.user-name {
margin-right: 10px;
......@@ -132,6 +133,13 @@ export default {
.logout {
margin-right: 30px;
}
.container {
width: 70rem;
margin: 0 auto;
display: flex;
align-items: center;
}
@media screen and (max-width: 1100px) {
.header {
......@@ -142,33 +150,32 @@ export default {
.header.no-shadow {
box-shadow: none !important;
}
.logo {
float: left;
margin-top: 10px;
}
.navbar {
float: left;
margin-left: 100px;
flex: 1;
overflow: hidden;
}
.navbar_item {
float: left;
position: relative;
}
.navbar_item:hover a {
color: #f19240;
.navbar_item_wrap {
display: flex;
align-items: center;
justify-content: center;
gap: 50px;
width: 100%;
overflow: hidden;
padding: 0;
}
.navbar_item + .navbar_item {
margin-left: 30px;
.navbar_item:hover a {
color: #409EFF;
}
.navbar_item a {
display: block;
height: 60px;
line-height: 60px;
text-decoration: none;
padding: 0 20px;
color: #fff;
color: #000;
font-size: 16px;
}
.right_btn,
.user-info {
......@@ -195,12 +202,12 @@ export default {
position: relative;
margin-right: 20px;
cursor: pointer;
color: #fff;
font-size: 16px;
}
.reg-btn {
cursor: pointer;
color: #fff;
font-size:16px;
}
.login-btn::after {
......@@ -219,7 +226,7 @@ export default {
}
.active a {
color: #f19240;
color: #409EFF;
font-weight: bold;
}
......@@ -227,7 +234,7 @@ export default {
content: '';
width: 20px;
height: 2px;
background-color: #f19240;
background-color: #409EFF;
border-radius: 4px;
display: block;
position: absolute;
......
src/components/product-intro.vue
<template>
<div class="product-intro">
<div class="function_bg">
<h2
:style="`text-align: center;font-weight:400;letter-spacing:4px; ${
$isMobile
? 'padding-bottom:30px;font-size:20px'
: 'padding-bottom: 40px;font-size:28px'
}`">
产品优势
</h2>
<div class="function_bg w-full-70 fade-up-animation">
<div class="flex justify-center flex-col items-center">
<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="product-pros">
<div class="product-pros-card">
<div
......@@ -34,9 +34,199 @@
</div>
</div>
</div>
<div class="home-module-container">
<div class="home-module">
<div
class="home-module-item flex justify-center"
v-for="(item, index) in moduleItems"
:key="index">
<div class="content flex w-full-70 gap-100 fade-up-animation">
<div class="img">
<img :src="item.img" />
</div>
<div class="module-content">
<div class="title">
<span class="main-title">{{ item.title }}</span>
<span class="sub-title">{{ item.subTitle }}</span>
</div>
<div class="desc">
<div
class="desc-item"
v-for="(t, index) in item.items"
:key="index">
<div class="desc-title">
<span class="desc-main-title">{{ t.title }}</span>
<span class="desc-sub-title">{{ t.subTitle }}</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section-reason w-full-70 fade-up-animation">
<div class="section-reason-title">
<div class="flex justify-center flex-col items-center">
<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>
<div class="reason-list flex justify-between">
<div class="section-reason-item">
<div class="season-top flex flex-col items-center">
<svg
t="1733125042270"
class="icon"
viewBox="0 0 1271 1024"
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="text-textPrimary font-normal mt-10 text-sm font-size-18">
贴合跨境卖家核心使用场景
</p>
<div class="mt-16 flex flex-col items-center">
<p class="text-textPrimary mb-10 font-light font-size-14">
SaaS软件，无需下载即可使用
</p>
<p class="text-textPrimary mb-10 font-light font-size-14">
对接支付、物流等系统，全链路闭环管理
</p>
<p class="text-textPrimary mb-10 font-light font-size-14">
功能版块全，包含进销存、财务、广告等
</p>
</div>
</div>
<div class="reason-card-type flex flex-col items-center">
<p class="reason-tip">10+</p>
<p class="reason-tip-description">跨境产品模块</p>
</div>
</div>
<div class="section-reason-item">
<div class="season-top flex flex-col items-center">
<svg
t="1733125115126"
class="icon"
viewBox="0 0 1024 1024"
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="text-textPrimary font-normal mt-10 text-sm font-size-18">
深度开发能力与数据安全护航
</p>
<div class="mt-16 flex flex-col items-center">
<p class="text-textPrimary mb-10 font-light font-size-14">
自研亿级任务调度引擎，运行快速
</p>
<p class="text-textPrimary mb-10 font-light font-size-14">
定期检测漏洞，签署、严守保密协议
</p>
<p class="text-textPrimary mb-10 font-light font-size-14">
亚马逊SPN服务商，国家高新技术企业认定
</p>
</div>
</div>
<div class="reason-card-type flex flex-col items-center">
<p class="reason-tip">0.1s</p>
<p class="reason-tip-description">快速响应</p>
</div>
</div>
<div class="section-reason-item">
<div class="season-top flex flex-col items-center">
<svg
t="1733125190985"
class="icon"
viewBox="0 0 1024 1024"
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="text-textPrimary font-normal mt-10 text-sm font-size-18">
全程专业服务，满足卖家需求
</p>
<div class="mt-16 flex flex-col items-center">
<p class="text-textPrimary mb-10 font-light font-size-14">
软件顾问、实施、售后全流程服务
</p>
<p class="text-textPrimary mb-10 font-light font-size-14">
一体化专业服务，深度赋能客户
</p>
<p class="text-textPrimary mb-10 font-light font-size-14">
为软件使用负责，持续交付新功能
</p>
</div>
</div>
<div class="reason-card-type flex flex-col items-center">
<p class="reason-tip">20+</p>
<p class="reason-tip-description">服务中心</p>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import purchaseImg from '../assets/images/home/01.png'
import financesImg from '../assets/images/home/02.png'
import statementsImg from '../assets/images/home/03.png'
import adImg from '../assets/images/home/04.png'
export default {
name: 'productIntro',
data() {
......@@ -50,11 +240,6 @@ export default {
{
text: '自定义“补货规则”，系统结合销售周期、在途和库存数据等指标智能计算',
},
{ text: '自动生成采购需求' },
{ text: '科学规避断货、滞销风险' },
{
text: '释放库存成本，建立良性库存，优化资金流结构，提高资金周转率',
},
],
},
{
......@@ -62,22 +247,17 @@ export default {
title: '订单管理',
texts: [
{ text: '订单批量审核，异常状态标识归纳，超时自动拆单发货' },
{
text: '支持自定义规则进行物流商自动匹配，智能物流推荐，科学预估包裹运费，提前把控物流成本，降低亏损风险',
},
{ text: '一键获取面单、智能打单发货、回传跟踪号到平台。' },
{ text: '订单管理与包裹管理相结合' },
],
]
},
{
icon: 'icon-cangku_cangchuguanli_o',
title: '仓储管理',
texts: [
{ text: '科学的批次生成逻辑及拣货路径。' },
{ text: '支持扫码枪操作，软硬件协作，提高库内作业水平。' },
{
text: '本地仓、海外仓、FBA仓数据及时同步，一键配货和扣减库存，扣减逻辑科学合理，杜绝库存不清、超卖等问题。',
},
// { text: '支持扫码枪操作，软硬件协作，提高库内作业水平。' },
// {
// text: '本地仓、海外仓、FBA仓数据及时同步，一键配货和扣减库存，扣减逻辑科学合理，杜绝库存不清、超卖等问题。',
// },
],
},
{
......@@ -85,7 +265,7 @@ export default {
title: '报表分析',
texts: [
{ text: '全局数据可视化分析，快速了解核心数据，高效进行决策。' },
{ text: '多维数据报表，随时了解财务、经营状况，支撑业务决策。' },
// { text: '多维数据报表，随时了解财务、经营状况，支撑业务决策。' },
],
},
{
......@@ -95,13 +275,13 @@ export default {
{
text: '与供应商、仓库高效协同，生产数据灵活追踪，一键生成交货单。',
},
{
text: '生产周期较长的大订单可拆解，支持按批次交货，以应对企业紧急采购需求。',
},
{
text: '自定义内向交货数量，企业和供应商可根据产品近期销售走向和实际产能灵活增减区间。',
},
{ text: '多供应商集中管理，建立多维度的绩效考评机制。' },
// {
// text: '生产周期较长的大订单可拆解，支持按批次交货，以应对企业紧急采购需求。',
// },
// {
// text: '自定义内向交货数量，企业和供应商可根据产品近期销售走向和实际产能灵活增减区间。',
// },
// { text: '多供应商集中管理，建立多维度的绩效考评机制。' },
],
},
{
......@@ -111,11 +291,11 @@ export default {
{
text: '数据模型完整，采用SPU+SKU的管理模式，可从SPU维度查看产品、供应商、采购URL及所有SKU信息，增减SKU方便灵活，规格型号统一管理。',
},
{ text: '对接刊登系统，实现整套资料一键免费刊登多独立站平台。' },
{
text: '可以对重点产品添加Tag，便于快速筛选，优先进行销售数据分析。',
},
{ text: '定制设计器在线创作，POD产品一键合成，实现高效出品。' },
// { text: '对接刊登系统，实现整套资料一键免费刊登多独立站平台。' },
// {
// text: '可以对重点产品添加Tag，便于快速筛选，优先进行销售数据分析。',
// },
// { text: '定制设计器在线创作，POD产品一键合成，实现高效出品。' },
],
},
{
......@@ -125,12 +305,12 @@ export default {
{
text: '现金流向和流量的预估功能和预算实时查询，使财务人员提前做好防备措施，掌控资金安全，提高资金利用效率。',
},
{
text: '可将由生产活动、销售活动、采购活动输入的信息自动计入财务模块生成总账、会计报表。',
},
{
text: '根据企业需求，自定义营运分析指标公式，方便快捷核算每个阶段经营成果。',
},
// {
// text: '可将由生产活动、销售活动、采购活动输入的信息自动计入财务模块生成总账、会计报表。',
// },
// {
// text: '根据企业需求，自定义营运分析指标公式，方便快捷核算每个阶段经营成果。',
// },
],
},
{
......@@ -140,10 +320,10 @@ export default {
{
text: '多平台、多店铺统一管理。',
},
{
text: '支持多店铺之间导入商品。',
},
{ text: '支持商品一键发布下架'},
// {
// text: '支持多店铺之间导入商品。',
// },
// { text: '支持商品一键发布下架' },
],
},
{
......@@ -151,18 +331,127 @@ export default {
title: '物流管理',
texts: [
{ text: '自定义申报报关信息，按需快速申报，避免高昂关税。' },
{ text: '物流轨迹状态实时跟踪，实现包裹一站式查询与异常提醒。' },
{ text: '统计发货、自动计算运费，方便运费核算。' },
// { text: '物流轨迹状态实时跟踪，实现包裹一站式查询与异常提醒。' },
// { text: '统计发货、自动计算运费，方便运费核算。' },
],
},
],
moduleItems: [
{
img: purchaseImg,
title: '进销存一体管理',
subTitle:
'打通采购、发货、物流等环节，1688一键下单，智能提供补货建议',
items: [
{
title: '采购业务场景全覆盖',
subTitle: '支持1688下单/委外加工/退换货等采购方式，可多维度管理',
},
{
title: '智能补货建议',
subTitle:
'自动追踪全球销量与库存情况，区分物流渠道运输时效和费用提供补货方案',
},
{
title: '物流全链条追踪管理',
subTitle: '全链条跟踪物流轨迹，对比物流价格，优化物流成本',
},
{
title: '一站式管库存',
subTitle:
'集成海外仓与物流商，统一管理本地仓/海外仓/FBA仓库存和在途库存',
},
],
},
{
img: financesImg,
title: '财务精准管理',
subTitle:
'每日实时利润统计，订单级回款跟踪，自动提现，业财一体化管理',
items: [
{
title: '实时看利润',
subTitle: '精准核算利润，实时整合提供利润报表，反哺销售决策调整',
},
{
title: '成本严控制',
subTitle: '业务成本一目了然，隐形费用自动识别，精准统计所有成本',
},
{
title: '资金流追踪',
subTitle: '全链条跟踪物流轨迹，对比物流价格，优化物流成本',
},
],
},
{
img: statementsImg,
title: '多维度数据报表',
subTitle:
'自动形成利润报表、采购报表、库存报表、业绩报表等，数据可视化',
items: [
{
title: '利润报表',
subTitle:
'实时整合平台数据，精准核算利润，每日出具利润报表，支撑财务核算所需',
},
{
title: '产品表现报表',
subTitle:
'整合Listing所有运营数据，支持同比、环比分析，快速识别爆款产品',
},
{
title: 'BI自定义数据分析',
subTitle:
'自定义经营数据驾驶舱，实时监测业务数据，可联动分析，了解业务实况',
},
],
},
{
img: adImg,
title: '全流程广告管理',
subTitle:
'投放前挖掘优质词，投中使用自动规则提效，投后溯源、对比分析广告转化率',
items: [
{
title: '投放前：挖优质词定策略',
subTitle:
'自动分析广告历史表现、行业大盘表现、挖优质词，规划广告投放结构，助力卖家抢量',
},
{
title: '投放中：自动规则提效',
subTitle:
'跨广告类型管理，分时策略、自动规则、关键词抢位等工具高效投放，实时数据优化调整',
},
{
title: '投放后：精准透视分析',
subTitle:
'全局分析广告效果，对比、细分、溯源、透视广告表现，分析词根，挖掘优质投放策略',
},
],
},
],
}
},
methods: {
freeTrial() {
window.open('https://demo.jomalls.com')
},
mounted() {
const observer = new IntersectionObserver((entries) => {
console.log(entries)
entries.forEach((entry) => {
if (entry.isIntersecting) {
entry.target.classList.add('fade-up-visible')
} else {
entry.target.classList.remove('fade-up-visible')
}
})
})
this.$el.querySelectorAll('.fade-up-animation').forEach((item) => {
observer.observe(item)
})
this._animationObserver = observer
},
beforeDestroy() {
this._animationObserver.disconnect()
},
methods: {},
}
</script>
<style scoped lang="scss">
......@@ -170,7 +459,6 @@ export default {
padding: 100px 0;
}
.function_bg {
width: 60vw;
margin: 0 auto;
}
......@@ -180,9 +468,9 @@ export default {
}
.product-pros-card {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(3, 1fr);
gap: 10px;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
margin-top: 80px;
}
.card-item {
......@@ -223,6 +511,151 @@ export default {
.card-text:not(:last-child) {
margin-bottom: 6px;
}
.home-module-container {
margin-top: 100px;
}
.home-module-item {
padding: 150px 0;
margin: 0 auto;
.img {
flex: 1;
img {
width: 100%;
height: 100%;
}
}
.module-content {
flex: 1;
letter-spacing: 2px;
}
}
.home-module-item:nth-child(even) .content {
flex-direction: row-reverse;
}
.home-module-item:nth-child(odd) {
background-color: #f8f9ff;
}
.home-module-item:not(:last-child) {
margin-bottom: 18px;
}
.module-content {
.title {
display: flex;
flex-direction: column;
margin-bottom: 36px;
.main-title {
font-size: 36px;
margin-bottom: 10px;
}
.sub-title {
font-size: 16px;
color: #000;
}
}
.desc {
padding-left: 24px;
.desc-item {
position: relative;
&::before {
background-color: #2554fe;
border-radius: 50%;
position: absolute;
left: -23px;
top: 10px;
content: '';
width: 6px;
height: 6px;
box-shadow: 0 0 0 5px rgba(37, 84, 254, 0.1);
}
&:not(:last-child) {
margin-bottom: 18px;
}
.desc-title {
display: flex;
flex-direction: column;
gap: 8px;
.desc-main-title {
color: #000;
font-size: 20px;
}
.desc-sub-title {
font-size: 16px;
color: #606266;
}
}
}
}
}
.product-intro::v-deep {
.fade-up-animation {
transition: all 0.3s ease;
opacity: 0.2;
transform: translateY(100px);
}
.fade-up-visible {
opacity: 1;
transform: translateY(0);
}
}
.section-reason {
margin: 0 auto;
}
.section-reason-item {
background-color: rgba(255, 255, 255, 1);
border-radius: 20px;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
box-shadow: 0 0 16px 0 rgba(180, 189, 221, 1),
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;
.reason-card-type {
overflow: hidden;
padding-top: 20px;
padding-bottom: 30px;
--tw-text-opacity: 1;
color: rgba(255, 255, 255, 1);
width: 100%;
border-radius: 0 0 16px 16px;
background-image: url(../assets/images/home/05.png);
background-size: 100% 100%;
background-repeat: no-repeat;
.reason-tip {
font-family: Helvetica Neue;
font-size: 32px;
letter-spacing: 2px;
font-weight: 500;
line-height: 40px;
}
}
}
.section-reason-item:hover {
transform: translateY(-8px);
box-shadow: 10px 10px 38px 0 hsla(0, 0%, 100%, 0.3),
0 0 14px 0 rgba(202, 210, 238, 0.2),
28px 36px 50px 0 rgba(180, 189, 221, 0.46);
}
.season-top {
padding: 24px 40px 36px;
}
.reason-card-title {
font-weight: 500;
font-size: 30px;
margin-top: 16px;
--tw-text-opacity: 1;
color: rgba(26, 32, 53, 1);
}
.text-textPrimary {
color: rgba(58, 64, 87, 1);
}
.reason-list {
margin-top: 80px;
}
@media screen and (max-width: 1100px) {
.function_bg {
......@@ -265,5 +698,22 @@ export default {
.card-item-name {
font-size: 16px;
}
.product-pros-card {
margin-top: 40px;
}
.home-module-container[data-v-3ba2a52e] {
margin-top: 20px;
}
.home-module-item {
padding: 10px 0;
.content {
width: 90vw;
display: block;
}
.img {
width: 100%;
}
}
}
</style>
src/main.js
......@@ -21,11 +21,12 @@ import './styles/index.scss'
const isMobile = () => window.innerWidth <= 1100
Vue.util.defineReactive(Vue.prototype, '$isMobile', isMobile())
document.querySelector('html').style.fontSize = window.innerWidth / 100 + 'px'
window.addEventListener('resize', () => {
Vue.prototype.$isMobile = isMobile()
document.querySelector('html').style.fontSize = window.innerWidth / 100 + 'px'
})
new Vue({
store,
router,
......
src/views/home.vue
<template>
<div class="home-page">
<div class="jomalls-home-page">
<Head :shadow="headerShadow" />
<main class="home-main">
......@@ -46,27 +46,46 @@ export default {
}
</script>
<style scoped>
.home-page {
.jomalls-home-page {
box-sizing: border-box;
height: 100%;
overflow: hidden auto;
overflow: hidden;
display: flex;
flex-direction: column;
}
.home-page::-webkit-scrollbar {
width: 0;
.home-main::-webkit-scrollbar {
width: 6px;
}
.home-page .header {
.home-main::-webkit-scrollbar-thumb {
border-radius: 10px;
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: rgba(162, 161, 161, 0.2);
}
.home-main::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 0;
background: rgba(0, 0, 0, 0.1);
}
.jomalls-home-page .header {
transition: all 0.3s;
border: 1px solid #eee;
background: #fff;
}
.home-page.scrolling .header {
box-shadow: 0 2px 10px 0 rgb(0 39 98 / 66%);
.jomalls-home-page.scrolling .header {
/* box-shadow: 0 2px 10px 0 rgb(0 39 98 / 66%);
background-color: rgba(27, 28, 29, 0.9);
backdrop-filter: blur(10px);
backdrop-filter: blur(10px); */
}
.home-main {
/* padding-top: 60px; */
flex: 1;
overflow-y: auto;
/* background-color: #f5f5f5; */
}
</style>
src/views/homePage/index.vue
<template>
<div class="home-page">
<div class="banner-images">
<el-carousel
<!-- 轮播图先注释 -->
<!-- <el-carousel
class="banner-images-inner"
:interval="5000"
arrow="always"
......@@ -12,39 +13,72 @@
:src="item.image"
style="width: 100vw; height: 100%; object-fit: cover" />
</el-carousel-item>
</el-carousel>
</el-carousel> -->
<div class="banner-container">
<div class="left-content">
<h3 class="left-content-title">在以亚马逊为主的跨境电商ERP中</h3>
<h2 class="left-content-title-high-light">九猫ERP市占率第一</h2>
<p class="left-content-description">
<span class="high-light">60万+</span>
<span>跨境卖家的一致选择，支持</span>
<span class="high-light">20+</span>
<span>主流跨境平台，助力卖家全球出海</span>
</p>
</div>
<div class="right-content">
<video
width="100%"
class="video"
src="../../assets/video/home-video.mp4"
autoplay
loop
muted></video>
</div>
</div>
</div>
<product-intro />
<div class="docking-platform">
<h2
:style="`text-align: center; padding: 20px; font-size: ${
$isMobile ? '18px' : '24px'
}`">
对接平台
</h2>
<div class="platforms">
<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 class="docking-platform flex justify-center">
<div>
<div class="flex justify-center flex-col items-center">
<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 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 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 class="footer-bg">
<div class="footer-banner">
<p class="footer-title">人效全面提升、业绩翻倍增长，从此刻开始！</p>
<p class="footer-description">
九猫ERP将帮助您提升每一个人员效率，快速实现业务增长
</p>
</div>
</div>
</div>
......@@ -76,25 +110,64 @@ export default {
</script>
<style scoped>
.banner-images {
font-size: 48px;
width: 100%;
display: flex;
/* font-size: 48px; */
width: 70vw;
margin: 0 auto;
height: 30vw;
padding-top: 40px;
/* display: flex;
justify-content: center;
align-items: center;
background: linear-gradient(to bottom, #0089ff 0%, #0089ff 20%, #e8eef9);
background: linear-gradient(to bottom, #0089ff 0%, #0089ff 20%, #e8eef9); */
}
.banner-images-inner {
/* .banner-images-inner {
width: 100%;
} */
.banner-container {
display: flex;
align-items: center;
height: 100%;
}
.left-content {
width: 30%;
display: flex;
flex-direction: column;
gap: 20px;
}
.right-content {
width: 70%;
height: 100%;
border-radius: 20px;
.video {
width: 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: url(../../assets/footer.jpg) center / cover no-repeat;
padding: 0 100px 70px;
background: #ebf1fc;
padding: 100px 0;
}
.docking-platform h2 {
color: #fff;
color: #000;
font-weight: 500;
}
.platforms {
......@@ -102,7 +175,37 @@ export default {
gap: 10px;
grid-template-columns: repeat(9, 1fr);
}
.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 screen and (max-width: 1440px) {
.platforms {
grid-template-columns: repeat(6, 1fr);
......
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