Skip to content

肖康 / cloudSystem

Go to a project
Commit 023dafcc by LJM
Options

概括

parent f53fb824
Inline Side-by-side
Showing with 536 additions and 1119 deletions
src/assets/css/index/index.less
.home-index {
width: 99%;
padding-left: 20px;
padding-bottom: 20px;
.survey-top {
padding-top: 20px;
li {
padding: 7px 8px 9px 12px;
width: 24%;
height: 128px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
.top {
.t1 {
font-size: 14px;
color: #333333;
font-weight: 500;
}
.t2 {
width: 24px;
height: 24px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
font-size: 14px;
color: #646b78;
cursor: pointer;
transition: all 0.2s ease;
&:hover {
border: 1px solid #1969F9;
color: #1969f9;
}
}
}
.cen {
margin-top: 13px;
margin-bottom: 18px;
align-items: flex-end;
.mr {
margin-right: 26px;
}
.t1 {
font-size: 14px;
color: #333333;
line-height: 20px;
font-weight: 500;
}
.t2 {
font-size: 30px;
color: #1969f9;
font-weight: bold;
line-height: 35px;
margin-left: 3px;
}
}
.bottom {
.t1 {
font-size: 12px;
color: #646b78;
font-weight: 500;
}
width: 99%;
padding-left: 20px;
padding-bottom: 20px;
.t2 {
font-size: 12px;
color: #333333;
}
}
}
}
.survey-show {
margin-top: 25px;
margin-bottom: 25px;
padding: 20px 0 17px 0;
height: 131px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
li {
position: relative;
width: 15%;
height: 94px;
.iconfont {
font-size: 30px;
color: #A3ADC2;
}
.t1 {
font-size: 14px;
color: #333333;
margin-top: 11px;
}
.t2 {
font-size: 14px;
color: #a1acc1;
margin-top: 8px;
}
.color1 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #F35656;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
.color2 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #FC7A28;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
.color3 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #EEB602;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
.color4 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #29C0D6;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
.color5 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #4DD35B;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
.wrap {
width: 100%;
height: 94px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #E5EBF6;
.survey-top {
padding-top: 20px;
padding-left: 10px;
cursor: pointer;
transition: all 0.4s ease;
display: block;
}
&:hover {
.wrap {
transform: translateY(-8px);
}
.color1 {
transform: translateY(0);
}
li {
padding: 7px 8px 9px 12px;
width: 24%;
height: 128px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
.top {
.t1 {
font-size: 14px;
color: #333333;
font-weight: 500;
}
.t2 {
width: 24px;
height: 24px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
font-size: 14px;
color: #646b78;
cursor: pointer;
transition: all 0.2s ease;
&:hover {
border: 1px solid #1969F9;
color: #1969f9;
}
}
}
.cen {
margin-top: 13px;
margin-bottom: 18px;
align-items: flex-end;
.mr {
margin-right: 26px;
}
.t1 {
font-size: 14px;
color: #333333;
line-height: 20px;
font-weight: 500;
}
.t2 {
font-size: 30px;
color: #1969f9;
font-weight: bold;
line-height: 35px;
margin-left: 3px;
}
}
.t1 {
color: #1969f9;
.bottom {
.t1 {
font-size: 12px;
color: #646b78;
font-weight: 500;
}
.t2 {
font-size: 12px;
color: #333333;
}
}
}
}
}
}
.rate-box {
margin-top: 25px;
height: 178px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
padding: 10px 10px 12px 12px;
position: relative;
&:hover {
&::after {
content: "";
position: absolute;
width: 231px;
height: 58px;
background: url(../../images/tips.png) no-repeat;
background-size: 100% 100%;
left: 50%;
top: 50%;
margin-top: -29px;
margin-left: -115px;
}
}
.top {
.title {
font-size: 16px;
color: #333333;
font-weight: 500;
}
.tab {
height: 28px;
background: #F1F4FA;
.survey-show {
margin-top: 25px;
margin-bottom: 25px;
padding: 20px 0 17px 0;
height: 131px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #BEC9DF;
text-align: center;
border: 1px solid #E5EBF6;
li {
width: 52px;
box-sizing: border-box;
font-size: 12px;
color: #646b78;
text-align: center;
height: 21px;
border-right: 1px solid #BEC9DF;
padding: 0 5px;
cursor: pointer;
&.curr {
color: #1969f9;
}
&:last-child {
border-right: none;
}
}
}
}
.status {
margin-top: 60px;
height: 18px;
background: #DFE5F1;
border-radius: 9px;
li {
position: relative;
span {
position: absolute;
right: 6px;
top: -45px;
font-size: 22px;
color: #333333;
font-weight: bold;
}
&.color1 {
background: #4DD35B;
border-radius: 9px 0 0 9px;
}
position: relative;
width: 15%;
height: 94px;
&.color2 {
background: #FF9D4D;
}
&.color3 {
background: #629AFF;
}
}
}
}
.offer {
margin-top: 25px;
height: 300px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
padding: 16px 0 0 14px;
.box {
flex: 0 0 49.5%;
position: relative;
&:hover {
&::after {
content: "";
position: absolute;
width: 231px;
height: 58px;
background: url(../../images/tips.png) no-repeat;
background-size: 100% 100%;
left: 50%;
top: 50%;
margin-top: -29px;
margin-left: -115px;
}
}
.iconfont {
font-size: 30px;
color: #A3ADC2;
}
.head {
padding-right: 100px;
.t1 {
font-size: 14px;
color: #333333;
margin-top: 11px;
}
.t1 {
font-size: 16px;
color: #333333;
}
.t2 {
font-size: 14px;
color: #a1acc1;
margin-top: 8px;
}
.tab {
width: 160px;
height: 28px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
text-align: center;
li {
font-size: 12px;
color: #646b78;
text-align: center;
height: 21px;
border-right: 1px solid #BEC9DF;
padding: 0 5px;
cursor: pointer;
&.curr {
color: #1969f9;
.color1 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #F35656;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
&:last-child {
border-right: none;
.color2 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #FC7A28;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
}
}
}
.list {
width: 100%;
border: 1px solid #E5EBF6;
.color3 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #EEB602;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
tr {
th {
height: 44px;
background: #F1F4FA;
border-radius: 2px 2px 0px 0px;
font-size: 14px;
color: #333333;
font-weight: normal;
}
td {
height: 44px;
background: #FFFFFF;
font-size: 12px;
color: #333333;
.color4 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #29C0D6;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
&.first {
text-align: center;
.color5 {
position: absolute;
right: 7px;
top: -21px;
width: 45px;
height: 40px;
line-height: 40px;
background: #4DD35B;
border-radius: 0px 0px 100px 100px;
font-size: 16px;
color: #ffffff;
text-align: center;
}
}
}
}
}
}
.inquiry {
height: 300px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
margin-top: 30px;
.wrap {
width: 100%;
height: 94px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #E5EBF6;
padding-top: 20px;
padding-left: 10px;
cursor: pointer;
transition: all 0.4s ease;
display: block;
}
.head {
margin-left: 20px;
margin-right: 7px;
border-bottom: 1px solid #E5EBF6;
&:hover {
.wrap {
transform: translateY(-8px);
}
.tab {
li {
position: relative;
padding: 0 8px;
height: 42px;
background: #F1F4FA;
border-radius: 2px 2px 0px 0px;
border-right: 1px solid #E5EBF6;
border-left: 1px solid #E5EBF6;
font-size: 14px;
color: #646b78;
cursor: pointer;
&:first-child {
border-left: none;
border-right: none;
}
&.curr {
background: #FFFFFF;
color: #333333;
font-size: 16px;
&:after {
position: absolute;
left: 0;
width: 100%;
height: 1px;
background: #FFFFFF;
content: '';
bottom: -1px;
}
}
}
}
.params-wrap {
.tabs {
margin-right: 9px;
height: 28px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
text-align: center;
li {
width: 40px;
box-sizing: border-box;
font-size: 12px;
color: #646b78;
text-align: center;
height: 21px;
border-right: 1px solid #BEC9DF;
padding: 0 5px;
cursor: pointer;
&.curr {
color: #1969f9;
}
.color1 {
transform: translateY(0);
}
&:last-child {
border-right: none;
.t1 {
color: #1969f9;
}
}
}
}
}
.el-form-item {
margin-bottom: 0 !important;
}
.rate-box {
margin-top: 25px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
padding: 20px;
position: relative;
.el-form-item__content {
line-height: inherit !important;
.progressbar-box {
width: 100%;
margin-top: 30px;
}
}
}
.wrap {
margin-top: 20px;
width: 100%;
.box1 {
width: 80%;
.offer {
position: relative;
margin-top: 25px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
padding: 20px;
&:hover {
&::after {
content: "";
position: absolute;
width: 231px;
height: 58px;
background: url(../../images/tips.png) no-repeat;
background-size: 100% 100%;
left: 50%;
top: 50%;
margin-top: -89px;
margin-left: -115px;
}
}
}
.box2 {
width: 20%;
.offer-content {
margin-top: 20px;
height: 360px;
.t1 {
font-size: 12px;
color: #646b78;
margin-bottom: 6px;
}
.echarts-box {
flex: 0 0 60%;
height: 100%;
}
.inp {
width: 80%;
height: 32px;
border-radius: 2px;
border: 1px solid #BEC9DF;
text-indent: 10px;
font-size: 12px;
&::-webkit-input-placeholder {
color: #a1acc1;
}
.list-box {
flex: 0 0 40%;
height: 100%;
.one {
width: 20px;
height: 20px;
border-radius: 50%;
background: #f56c6c;
font-size: 12px;
color: #fff;
}
.two {
width: 20px;
height: 20px;
border-radius: 50%;
background: #409eff;
font-size: 12px;
color: #fff;
}
.three {
width: 20px;
height: 20px;
border-radius: 50%;
background: #67c23a;
font-size: 12px;
color: #fff;
}
.num{
width: 20px;
height: 20px;
border-radius: 50%;
}
}
}
}
}
}
.p-date {
height: 28px !important;
line-height: 28px !important;
}
.el-icon-date:before {
content: "\e78e";
position: relative;
top: -6px !important;
}
.el-date-editor .el-range-separator {
line-height: 19px !important;
font-size: 14px !important;
color: #646b78 !important;
}
.el-date-editor .el-range__close-icon {
line-height: 23px !important;
}
}
src/assets/css/index/index.min.css
......@@ -180,283 +180,63 @@
}
.home-index .rate-box {
margin-top: 25px;
height: 178px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
padding: 10px 10px 12px 12px;
padding: 20px;
position: relative;
}
.home-index .rate-box:hover::after {
content: "";
position: absolute;
width: 231px;
height: 58px;
background: url(../../images/tips.png) no-repeat;
background-size: 100% 100%;
left: 50%;
top: 50%;
margin-top: -29px;
margin-left: -115px;
}
.home-index .rate-box .top .title {
font-size: 16px;
color: #333333;
font-weight: 500;
}
.home-index .rate-box .top .tab {
height: 28px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
text-align: center;
}
.home-index .rate-box .top .tab li {
width: 52px;
box-sizing: border-box;
font-size: 12px;
color: #646b78;
text-align: center;
height: 21px;
border-right: 1px solid #BEC9DF;
padding: 0 5px;
cursor: pointer;
}
.home-index .rate-box .top .tab li.curr {
color: #1969f9;
}
.home-index .rate-box .top .tab li:last-child {
border-right: none;
}
.home-index .rate-box .status {
margin-top: 60px;
height: 18px;
background: #DFE5F1;
border-radius: 9px;
}
.home-index .rate-box .status li {
position: relative;
}
.home-index .rate-box .status li span {
position: absolute;
right: 6px;
top: -45px;
font-size: 22px;
color: #333333;
font-weight: bold;
}
.home-index .rate-box .status li.color1 {
background: #4DD35B;
border-radius: 9px 0 0 9px;
}
.home-index .rate-box .status li.color2 {
background: #FF9D4D;
}
.home-index .rate-box .status li.color3 {
background: #629AFF;
.home-index .rate-box .progressbar-box {
width: 100%;
margin-top: 30px;
}
.home-index .offer {
margin-top: 25px;
height: 300px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
padding: 16px 0 0 14px;
}
.home-index .offer .box {
flex: 0 0 49.5%;
position: relative;
}
.home-index .offer .box:hover::after {
content: "";
position: absolute;
width: 231px;
height: 58px;
background: url(../../images/tips.png) no-repeat;
background-size: 100% 100%;
left: 50%;
top: 50%;
margin-top: -29px;
margin-left: -115px;
}
.home-index .offer .box .head {
padding-right: 100px;
}
.home-index .offer .box .head .t1 {
font-size: 16px;
color: #333333;
}
.home-index .offer .box .head .tab {
width: 160px;
height: 28px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
text-align: center;
}
.home-index .offer .box .head .tab li {
font-size: 12px;
color: #646b78;
text-align: center;
height: 21px;
border-right: 1px solid #BEC9DF;
padding: 0 5px;
cursor: pointer;
}
.home-index .offer .box .head .tab li.curr {
color: #1969f9;
}
.home-index .offer .box .head .tab li:last-child {
border-right: none;
}
.home-index .offer .box .list {
width: 100%;
border: 1px solid #E5EBF6;
}
.home-index .offer .box .list tr th {
height: 44px;
background: #F1F4FA;
border-radius: 2px 2px 0px 0px;
font-size: 14px;
color: #333333;
font-weight: normal;
}
.home-index .offer .box .list tr td {
height: 44px;
background: #FFFFFF;
font-size: 12px;
color: #333333;
}
.home-index .offer .box .list tr td.first {
text-align: center;
}
.home-index .inquiry {
height: 300px;
margin-top: 25px;
background: #FFFFFF;
border-radius: 2px;
border: 1px solid #E5EBF6;
margin-top: 30px;
}
.home-index .inquiry .head {
margin-left: 20px;
margin-right: 7px;
border-bottom: 1px solid #E5EBF6;
padding: 20px;
}
.home-index .inquiry .head .tab li {
position: relative;
padding: 0 8px;
height: 42px;
background: #F1F4FA;
border-radius: 2px 2px 0px 0px;
border-right: 1px solid #E5EBF6;
border-left: 1px solid #E5EBF6;
font-size: 14px;
color: #646b78;
cursor: pointer;
}
.home-index .inquiry .head .tab li:first-child {
border-left: none;
border-right: none;
.home-index .offer .offer-content {
margin-top: 20px;
height: 360px;
}
.home-index .inquiry .head .tab li.curr {
background: #FFFFFF;
color: #333333;
font-size: 16px;
.home-index .offer .offer-content .echarts-box {
flex: 0 0 60%;
height: 100%;
}
.home-index .inquiry .head .tab li.curr:after {
position: absolute;
left: 0;
width: 100%;
height: 1px;
background: #FFFFFF;
content: '';
bottom: -1px;
.home-index .offer .offer-content .list-box {
flex: 0 0 40%;
height: 100%;
}
.home-index .inquiry .head .params-wrap .tabs {
margin-right: 9px;
height: 28px;
background: #F1F4FA;
border-radius: 2px;
border: 1px solid #BEC9DF;
text-align: center;
}
.home-index .inquiry .head .params-wrap .tabs li {
width: 40px;
box-sizing: border-box;
.home-index .offer .offer-content .list-box .one {
width: 20px;
height: 20px;
border-radius: 50%;
background: #f56c6c;
font-size: 12px;
color: #646b78;
text-align: center;
height: 21px;
border-right: 1px solid #BEC9DF;
padding: 0 5px;
cursor: pointer;
color: #fff;
}
.home-index .inquiry .head .params-wrap .tabs li.curr {
color: #1969f9;
}
.home-index .inquiry .head .params-wrap .tabs li:last-child {
border-right: none;
}
.home-index .inquiry .head .params-wrap .el-form-item {
margin-bottom: 0 !important;
}
.home-index .inquiry .head .params-wrap .el-form-item__content {
line-height: inherit !important;
}
.home-index .inquiry .wrap {
margin-top: 20px;
width: 100%;
}
.home-index .inquiry .wrap .box1 {
width: 80%;
position: relative;
}
.home-index .inquiry .wrap .box1:hover::after {
content: "";
position: absolute;
width: 231px;
height: 58px;
background: url(../../images/tips.png) no-repeat;
background-size: 100% 100%;
left: 50%;
top: 50%;
margin-top: -89px;
margin-left: -115px;
}
.home-index .inquiry .wrap .box2 {
width: 20%;
}
.home-index .inquiry .wrap .box2 .t1 {
.home-index .offer .offer-content .list-box .two {
width: 20px;
height: 20px;
border-radius: 50%;
background: #409eff;
font-size: 12px;
color: #646b78;
margin-bottom: 6px;
color: #fff;
}
.home-index .inquiry .wrap .box2 .inp {
width: 80%;
height: 32px;
border-radius: 2px;
border: 1px solid #BEC9DF;
text-indent: 10px;
.home-index .offer .offer-content .list-box .three {
width: 20px;
height: 20px;
border-radius: 50%;
background: #67c23a;
font-size: 12px;
color: #fff;
}
.home-index .inquiry .wrap .box2 .inp::-webkit-input-placeholder {
color: #a1acc1;
}
.home-index .p-date {
height: 28px !important;
line-height: 28px !important;
}
.home-index .el-icon-date:before {
content: "\e78e";
position: relative;
top: -6px !important;
}
.home-index .el-date-editor .el-range-separator {
line-height: 19px !important;
font-size: 14px !important;
color: #646b78 !important;
}
.home-index .el-date-editor .el-range__close-icon {
line-height: 23px !important;
.home-index .offer .offer-content .list-box .num {
width: 20px;
height: 20px;
border-radius: 50%;
}
/*# sourceMappingURL=index.min.css.map */
\ No newline at end of file
src/assets/css/index/index.min.css.map
{"version":3,"sources":["index.less"],"names":[],"mappings":"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","file":"index.min.css"}
\ No newline at end of file
{"version":3,"sources":["index.less"],"names":[],"mappings":"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","file":"index.min.css"}
\ No newline at end of file
src/views/Index/index.vue
<template>
<div class="home-index boxsiz">
<Menu/>
<ul class="survey-top row bothSide">
<li class="boxsiz">
<p class="top row bothSide verCenter">
<span class="t1">SKU数</span>
<em class="t2 row rowCenter verCenter boxsiz">周</em>
</p>
<p class="cen row rowCenter">
<span class="t1">上架</span>
<span class="t2">{{data.weekly_sku_count}}</span>
</p>
<p class="bottom">
<span class="t1">总上传SKU数：</span>
<span class="t2">{{data.all_sku_count}}</span>
</p>
</li>
<li class="boxsiz">
<p class="top row bothSide verCenter">
<span class="t1">商品总数</span>
<em class="t2 row rowCenter verCenter boxsiz">周</em>
</p>
<p class="cen row rowCenter">
<span class="t1">型号</span>
<span class="t2 mr">{{data.weekly_spu_count}}</span>
<span class="t1">品牌</span>
<span class="t2">{{data.brand_count}}</span>
</p>
<p class="bottom">
<span class="t1">总商品数：</span>
<span class="t2">{{data.all_spu_count}}</span>
</p>
</li>
<li class="boxsiz">
<p class="top row bothSide verCenter">
<span class="t1">询价总型号数</span>
<em class="t2 row rowCenter verCenter boxsiz">周</em>
</p>
<p class="cen row rowCenter">
<span class="t2">{{data.weekly_inquiry_count}}</span>
</p>
<p class="bottom">
<span class="t1">历史询价总型号数：</span>
<span class="t2">{{data.all_inquiry_count}}</span>
</p>
</li>
<li class="boxsiz">
<p class="top row bothSide verCenter">
<span class="t1">报价总型号数</span>
<em class="t2 row rowCenter verCenter boxsiz">周</em>
</p>
<p class="cen row rowCenter">
<span class="t2">{{data.weekly_quote_count}}</span>
</p>
<p class="bottom">
<span class="t1">历史报价总型号数：</span>
<span class="t2">{{data.all_quote_count}}</span>
</p>
</li>
</ul>
<ul class="survey-show row avarage boxsiz">
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/enter">
<i class="iconfont iconjinzhi"></i>
<p class="t1">未通过SKU</p>
</a>
<span class="color1 rowCenter verCenter">{{data.reject_sku_count}}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/list">
<i class="iconfont iconclose"></i>
<p class="t1">下架SKU</p>
</a>
<span class="color2">{{data.off_shelf_sku_count}}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/inquire">
<i class="iconfont iconjinzhi1"></i>
<p class="t1">待报价</p>
</a>
<span class="color3">{{data.weekly_inquiry_ready_count||0}}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/quote">
<i class="iconfont iconjinzhi2"></i>
<p class="t1">已选中报价</p>
</a>
<span class="color4">{{data.weekly_quote_selected_count}}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/quote">
<i class="iconfont iconjinzhi2"></i>
<p class="t1">已成单报价</p>
</a>
<span class="color5">{{data.weekly_quote_deal_count}}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz">
<i class="iconfont iconjinzhi3 "></i>
<p class="t2">未完待续</p>
</a>
</li>
</ul>
<div class="rate-box boxsiz">
<div class="top row bothSide">
<span class="title">报价转化率分析</span>
<ul class="tab row rowCenter verCenter boxsiz">
<li class="row rowCenter verCenter curr">报价率</li>
<li class="row rowCenter verCenter">选中率</li>
<li class="row rowCenter verCenter">成单率</li>
</ul>
</div>
<ul class="row status">
<li style="width: 30%" class="color1">
<span>90%</span>
</li>
<li style="width: 20%" class="color2">
<span>32%</span>
</li>
<li style="width: 20%" class="color3">
<span>32%</span>
</li>
</ul>
<div class="home-index boxsiz">
<Menu/>
<ul class="survey-top row bothSide">
<li class="boxsiz">
<p class="top row bothSide verCenter">
<span class="t1">SKU数</span>
<em class="t2 row rowCenter verCenter boxsiz">周</em>
</p>
<p class="cen row rowCenter">
<span class="t1">上架</span>
<span class="t2">{{ data.weekly_sku_count }}</span>
</p>
<p class="bottom">
<span class="t1">总上传SKU数：</span>
<span class="t2">{{ data.all_sku_count }}</span>
</p>
</li>
<li class="boxsiz">
<p class="top row bothSide verCenter">
<span class="t1">商品总数</span>
<em class="t2 row rowCenter verCenter boxsiz">周</em>
</p>
<p class="cen row rowCenter">
<span class="t1">型号</span>
<span class="t2 mr">{{ data.weekly_spu_count }}</span>
<span class="t1">品牌</span>
<span class="t2">{{ data.brand_count }}</span>
</p>
<p class="bottom">
<span class="t1">总商品数：</span>
<span class="t2">{{ data.all_spu_count }}</span>
</p>
</li>
<li class="boxsiz">
<p class="top row bothSide verCenter">
<span class="t1">询价总型号数</span>
<em class="t2 row rowCenter verCenter boxsiz">周</em>
</p>
<p class="cen row rowCenter">
<span class="t2">{{ data.weekly_inquiry_count }}</span>
</p>
<p class="bottom">
<span class="t1">历史询价总型号数：</span>
<span class="t2">{{ data.all_inquiry_count }}</span>
</p>
</li>
<li class="boxsiz">
<p class="top row bothSide verCenter">
<span class="t1">报价总型号数</span>
<em class="t2 row rowCenter verCenter boxsiz">周</em>
</p>
<p class="cen row rowCenter">
<span class="t2">{{ data.weekly_quote_count }}</span>
</p>
<p class="bottom">
<span class="t1">历史报价总型号数：</span>
<span class="t2">{{ data.all_quote_count }}</span>
</p>
</li>
</ul>
<ul class="survey-show row avarage boxsiz">
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/enter">
<i class="iconfont iconjinzhi"></i>
<p class="t1">未通过SKU</p>
</a>
<span class="color1 rowCenter verCenter">{{ data.reject_sku_count }}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/list">
<i class="iconfont iconclose"></i>
<p class="t1">下架SKU</p>
</a>
<span class="color2">{{ data.off_shelf_sku_count }}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/inquire">
<i class="iconfont iconjinzhi1"></i>
<p class="t1">待报价</p>
</a>
<span class="color3">{{ data.weekly_inquiry_ready_count || 0 }}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/quote">
<i class="iconfont iconjinzhi2"></i>
<p class="t1">已选中报价</p>
</a>
<span class="color4">{{ data.weekly_quote_selected_count }}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz" href="/#/quote">
<i class="iconfont iconjinzhi2"></i>
<p class="t1">已成单报价</p>
</a>
<span class="color5">{{ data.weekly_quote_deal_count }}</span>
</li>
<li class="boxsiz">
<a class="wrap boxsiz">
<i class="iconfont iconjinzhi3 "></i>
<p class="t2">未完待续</p>
</a>
</li>
</ul>
<div class="rate-box boxsiz">
<div class="rate-tab row bothSide verCenter">
<div class="row">
<el-radio-group v-model="tabPosition" @change="change">
<el-radio-button label="1">询价报价率</el-radio-button>
<el-radio-button label="2">报价选中率</el-radio-button>
<el-radio-button label="3">报价选中率</el-radio-button>
</el-radio-group>
</div>
<div class="row">
<el-radio-group v-model="tabDate" @change="change">
<el-radio-button label="1">昨日</el-radio-button>
<el-radio-button label="2">本周</el-radio-button>
<el-radio-button label="3">本月</el-radio-button>
<el-radio-button label="4">本年</el-radio-button>
</el-radio-group>
</div>
<div class="offer row boxsiz">
<div class="box column boxsiz">
<div class="head row bothSide boxsiz">
<span class="t1">报价优势分析</span>
<!-- <ul class="tab row rowCenter verCenter boxsiz">
<li class="row rowCenter verCenter curr">今日</li>
<li class="row rowCenter verCenter">本周</li>
<li class="row rowCenter verCenter">本月</li>
<li class="row rowCenter verCenter">全年</li>
</ul>-->
</div>
<div id="echarts_box" style="width: 100%;height:300px;"></div>
</div>
<div class="box boxsiz">
<table class="list">
<tbody>
<tr>
<th>周排名</th>
<th align="left">优势型号</th>
<th align="left">品牌</th>
<th align="left">上榜次数</th>
</tr>
<tr>
<td class="first">1</td>
<td>NRF51822-QFAA-NRF51822</td>
<td>NORDIC</td>
<td>3</td>
</tr>
<tr>
<td class="first">1</td>
<td>NRF51822-QFAA-NRF51822</td>
<td>NORDIC</td>
<td>3</td>
</tr>
<tr>
<td class="first">1</td>
<td>NRF51822-QFAA-NRF51822</td>
<td>NORDIC</td>
<td>3</td>
</tr>
<tr>
<td class="first">1</td>
<td>NRF51822-QFAA-NRF51822</td>
<td>NORDIC</td>
<td>3</td>
</tr>
<tr>
<td class="first">1</td>
<td>NRF51822-QFAA-NRF51822</td>
<td>NORDIC</td>
<td>3</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="progressbar-box">
<el-progress :text-inside="true" :stroke-width="26" :percentage="70" status="warning"></el-progress>
</div>
</div>
<div class="offer boxsiz">
<div class="offer-tab row verCenter bothSide">
<div class="row">
<el-radio-group v-model="offerPosition" @change="change">
<el-radio-button label="1">询价量</el-radio-button>
<el-radio-button label="2">报价量</el-radio-button>
<el-radio-button label="3">成单量</el-radio-button>
</el-radio-group>
</div>
<div class="inquiry">
<div class="head row bothSide verCenter boxsiz" style="margin-left: 0;">
<ul class="tab row boxsiz">
<li class="row rowCenter verCenter boxsiz curr">询报价总数</li>
<li class="row rowCenter verCenter boxsiz">未报价型号数</li>
</ul>
<div class="params-wrap row">
<ul class="tabs row rowCenter verCenter boxsiz">
<li class="row rowCenter verCenter curr">今日</li>
<li class="row rowCenter verCenter">本周</li>
<li class="row rowCenter verCenter">本月</li>
<li class="row rowCenter verCenter">全年</li>
</ul>
<el-form>
<el-form-item label="">
<el-date-picker :disabled="isDisabled" class="p-date" v-model="date" type="daterange" range-separator="至"
start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</el-form-item>
</el-form>
</div>
</div>
<div class="wrap row">
<div class="box1">
<div id="echarts_box1" style="width: 100%;height:300px;position:relative; top: -25px;"></div>
</div>
<div class="box2">
<p class="t1">单个型号询报价总数分析</p>
<input type="text" placeholder="请输入型号" class="inp boxsiz" :disabled="isDisabled" />
<div id="echarts_box2" style="width: 100%;height:200px;"></div>
</div>
</div>
<div class="row">
<el-radio-group v-model="offerDate" @change="change">
<el-radio-button label="1">本月</el-radio-button>
<el-radio-button label="2">本年</el-radio-button>
</el-radio-group>
</div>
</div>
<div class="offer-content row bothSide verCenter">
<div id="echarts_box" class="echarts-box"></div>
<div class="list-box">
<el-table :data="tableData">
<el-table-column prop="numbers" label="排名" align="center" width="50">
<template slot-scope="scope">
<template v-if="scope.$index==0">
<span class="one row rowCenter verCenter">1</span>
</template>
<template v-else-if="scope.$index==1">
<span class="two row rowCenter verCenter">2</span>
</template>
<template v-else-if="scope.$index==2">
<span class="three row rowCenter verCenter">3</span>
</template>
<template v-else>
<span class="num row rowCenter verCenter"> {{ scope.$index + 1 }}</span>
</template>
</template>
</el-table-column>
<el-table-column prop="goods" label="型号" width="180"></el-table-column>
<el-table-column prop="brand" label="品牌"></el-table-column>
<el-table-column prop="nums" label="询价次数"></el-table-column>
</el-table>
</div>
</div>
</div>
</div>
</template>
<script>
import Vue from 'vue';
import Menu from "@/components/menu.vue";
import * as echarts from 'echarts';
import {
Form,
FormItem,
Message,
DatePicker
} from 'element-ui';
import Vue from 'vue';
import Menu from "@/components/menu.vue";
import * as echarts from 'echarts';
import {DatePicker, Form, FormItem, Message, Progress, Radio, RadioButton, RadioGroup, Table, TableColumn, Tabs} from 'element-ui';
Vue.prototype.$message = Message
Vue.prototype.$message = Message;
Vue.use(Form).use(FormItem).use(DatePicker).use(Tabs).use(Radio).use(RadioGroup).use(RadioButton).use(Progress).use(Table).use(TableColumn);
Vue.use(Form).use(FormItem).use(DatePicker);
export default {
name: "index",
data() {
return {
isDisabled:true,
date: '',
data: {
"weekly_quote_selected_count": 100,
"weekly_spu_count": 100,
"all_sku_count": 100,
"reject_sku_count": 100,
"weekly_quote_deal_count": 100,
"off_shelf_sku_count": 100,
"weekly_quote_count": 100,
"brand_count": 100,
"weekly_sku_count": 100,
"all_spu_count": 100,
"weekly_inquiry_count": 1006,
"all_quote_count": 100,
"all_inquiry_count": 100
}
};
},
mounted() {
this.getData();
console.log("测试发布环境1")
export default {
name: "index",
data() {
return {
isDisabled: true,
date: '',
tabPosition: 1,
tabDate: 1,
offerPosition: 1,
offerDate: 1,
tableData: [
{numbers: 1, goods: 'CFD321324ASC12', brand: 'Ti', nums: 10},
{numbers: 2, goods: 'CFD321324ASC12', brand: 'Ti', nums: 10},
{numbers: 3, goods: 'CFD321324ASC12', brand: 'Ti', nums: 10},
{numbers: 4, goods: 'CFD321324ASC12', brand: 'Ti', nums: 10},
{numbers: 5, goods: 'CFD321324ASC12', brand: 'Ti', nums: 10},
{numbers: 6, goods: 'CFD321324ASC12', brand: 'Ti', nums: 10},
{numbers: 7, goods: 'CFD321324ASC12', brand: 'Ti', nums: 10},
{numbers: 8, goods: 'CFD321324ASC12', brand: 'Ti', nums: 10}
],
data: {
weekly_quote_selected_count: 100,
weekly_spu_count: 100,
all_sku_count: 100,
reject_sku_count: 100,
weekly_quote_deal_count: 100,
off_shelf_sku_count: 100,
weekly_quote_count: 100,
brand_count: 100,
weekly_sku_count: 100,
all_spu_count: 100,
weekly_inquiry_count: 1006,
all_quote_count: 100,
all_inquiry_count: 100
}
};
},
mounted() {
this.getData();
},
methods: {
change(e) {
console.log(e)
},
methods: {
getData() {
this.$http('get', "/api/statistics/index", {}).then(res => {
if (res.code === 0) {
this.data = res.data
} else {
this.$message(res.msg);
}
})
var myChart = echarts.init(document.getElementById('echarts_box'));
var myChart1 = echarts.init(document.getElementById('echarts_box1'));
var myChart2 = echarts.init(document.getElementById('echarts_box2'));
var option = {
xAxis: {
type: 'category',
data: ['10-01', '10-02', '10-03', '10-04', '10-05', '10-06', '10-07']
},
yAxis: {
type: 'value'
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
smooth: true
}, {
data: [120, 232, 901, 134, 50, 1330, 1320],
type: 'line',
smooth: true
}]
};
var option1 = {
tooltip: {
trigger: 'item'
},
legend: {
top: '5%',
left: 'center'
},
series: [{
name: '访问来源',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '40',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [{
value: 1048,
name: ''
},
{
value: 735,
name: ''
},
{
value: 580,
name: ''
},
{
value: 484,
name: ''
},
{
value: 300,
name: ''
}
]
}]
};
getData() {
this.$http('get', "/api/statistics/index", {}).then(res => {
if (res.code === 0) {
this.data = res.data
} else {
this.$message({
message: res.msg,
type: 'warning'
});
}
})
myChart.setOption(option);
myChart1.setOption(option);
myChart2.setOption(option1);
var myChart = echarts.init(document.getElementById('echarts_box'));
var option = {
title: {
text: '近七天数据'
},
tooltip: {},
xAxis: {
data: ['10-1', '10-2', '10-3', '10-4', '10-5', '10-6']
},
yAxis: {},
series: [
{
name: '询价量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}
]
};
myChart.setOption(option);
window.onresize = function () {
myChart.resize();
myChart1.resize();
myChart2.resize();
};
}
},
components: {
Menu
window.onresize = function () {
myChart.resize();
};
}
};
},
components: {
Menu
}
};
</script>
<style scoped>
@import "../../assets/css/index/index.min.css";
@import "../../assets/css/index/index.min.css";
</style>
\ No newline at end of file
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 sign in to comment