|
|
@@ -20,17 +20,17 @@
|
|
|
<span
|
|
|
:class="['font-set',prodData.dateValue === 1 ? 'hidden':'']"
|
|
|
>{{[' -',' -',this.$i18n.t('dataAnaly.days7Before'),this.$i18n.t('dataAnaly.days30Before'),this.$i18n.t('dataAnaly.fromThePreviousDay'),this.$i18n.t('dataAnaly.monthBefore')][prodData.dateValue]}}</span>
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.newProdRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.newProdRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.newProdRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.newProdRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -68,17 +68,17 @@
|
|
|
class="pointerBuT el-icon-bottom"
|
|
|
v-if="prodData.rate.visitedProdRate < 0 && prodData.dateValue !== 1"
|
|
|
></span> -->
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.visitedProdRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.visitedProdRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.visitedProdRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.visitedProdRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -111,17 +111,17 @@
|
|
|
class="pointerBuT el-icon-bottom"
|
|
|
v-if="prodData.rate.dynamicSaleRate < 0 && prodData.dateValue !== 1"
|
|
|
></span> -->
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.dynamicSaleRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.dynamicSaleRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.dynamicSaleRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.dynamicSaleRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -164,17 +164,17 @@
|
|
|
class="pointerBuT el-icon-bottom"
|
|
|
v-if="prodData.rate.exposeRate < 0 && prodData.dateValue !== 1"
|
|
|
></span> -->
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.shareVisitRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.shareVisitRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.shareVisitRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.shareVisitRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -210,17 +210,17 @@
|
|
|
class="pointerBuT el-icon-bottom"
|
|
|
v-if="prodData.rate.browseRate < 0 && prodData.dateValue !== 1"
|
|
|
></span> -->
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.browseRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.browseRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.browseRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.browseRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -256,17 +256,17 @@
|
|
|
class="pointerBuT el-icon-bottom"
|
|
|
v-if="prodData.rate.visitorRate < 0 && prodData.dateValue !== 1"
|
|
|
></span> -->
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.visitorRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.visitorRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.visitorRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.visitorRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -304,17 +304,17 @@
|
|
|
class="pointerBuT el-icon-bottom"
|
|
|
v-if="prodData.rate.addCartRate < 0 && prodData.dateValue !== 1"
|
|
|
></span> -->
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.addCartRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.addCartRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.addCartRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.addCartRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -350,17 +350,17 @@
|
|
|
class="pointerBuT el-icon-bottom"
|
|
|
v-if="prodData.rate.orderNumRate < 0 && prodData.dateValue !== 1"
|
|
|
></span> -->
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.orderNumRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.orderNumRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.orderNumRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.orderNumRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -396,17 +396,17 @@
|
|
|
class="pointerBuT el-icon-bottom"
|
|
|
v-if="prodData.rate.payNumRate < 0 && prodData.dateValue !== 1"
|
|
|
></span> -->
|
|
|
- <img
|
|
|
+ <img
|
|
|
src="~@/assets/img/downArrow.png"
|
|
|
- v-if="prodData.rate.payNumRate < 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ v-if="prodData.rate.payNumRate < 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
- <img
|
|
|
- src="~@/assets/img/upArrow.png"
|
|
|
- v-if="prodData.rate.payNumRate > 0 && prodData.dateValue !== 1"
|
|
|
- style="margin-bottom: 2px"
|
|
|
- width="8px"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/upArrow.png"
|
|
|
+ v-if="prodData.rate.payNumRate > 0 && prodData.dateValue !== 1"
|
|
|
+ style="margin-bottom: 2px"
|
|
|
+ width="8px"
|
|
|
height="10px" alt="">
|
|
|
<span
|
|
|
class="font-set"
|
|
|
@@ -427,100 +427,100 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-export default {
|
|
|
- props: {
|
|
|
- prodData: {
|
|
|
- type: Object,
|
|
|
- default: null
|
|
|
- }
|
|
|
- },
|
|
|
- filters: {
|
|
|
- ratio (value) {
|
|
|
- value = isNaN(value) ? 0 : value
|
|
|
- if (value < 0) {
|
|
|
- return value * -1 + '%'
|
|
|
+ export default {
|
|
|
+ props: {
|
|
|
+ prodData: {
|
|
|
+ type: Object,
|
|
|
+ default: null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ ratio (value) {
|
|
|
+ value = isNaN(value) ? 0 : value
|
|
|
+ if (value < 0) {
|
|
|
+ return value * -1 + '%'
|
|
|
+ }
|
|
|
+ return value + '%'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ data: {
|
|
|
+ newProd: 0, // 新增商品数
|
|
|
+ visitedProd: 0, // 被访问商品数
|
|
|
+ dynamicSale: 0, // 动销商品数
|
|
|
+ expose: 0, // 商品曝光数
|
|
|
+ browse: 0, // 商品浏览量
|
|
|
+ visitor: 0, // 商品访客数
|
|
|
+ addCart: 0, // 加购件数
|
|
|
+ orderNum: 0, // 下单件数
|
|
|
+ payNum: 0 // 支付件数
|
|
|
+ } // 商品整体概况数据
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getChange () {
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ prodData: {
|
|
|
+ handler (newValue, oldValue) {
|
|
|
+ },
|
|
|
+ deep: true
|
|
|
}
|
|
|
- return value + '%'
|
|
|
- }
|
|
|
- },
|
|
|
- data () {
|
|
|
- return {
|
|
|
- data: {
|
|
|
- newProd: 0, // 新增商品数
|
|
|
- visitedProd: 0, // 被访问商品数
|
|
|
- dynamicSale: 0, // 动销商品数
|
|
|
- expose: 0, // 商品曝光数
|
|
|
- browse: 0, // 商品浏览量
|
|
|
- visitor: 0, // 商品访客数
|
|
|
- addCart: 0, // 加购件数
|
|
|
- orderNum: 0, // 下单件数
|
|
|
- payNum: 0 // 支付件数
|
|
|
- } // 商品整体概况数据
|
|
|
- }
|
|
|
- },
|
|
|
- mounted () {
|
|
|
- },
|
|
|
- methods: {
|
|
|
- getChange () {
|
|
|
- }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- prodData: {
|
|
|
- handler (newValue, oldValue) {
|
|
|
- },
|
|
|
- deep: true
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
-.font-set {
|
|
|
- color: darkgrey;
|
|
|
- font-size: 12px;
|
|
|
- margin-right: 10px;
|
|
|
-}
|
|
|
-.pointerUpT {
|
|
|
- // border-width: 0 4px 5px 4px;
|
|
|
- // border-color: #fff #fff #ff0000 #fff;
|
|
|
- // border-style: solid;
|
|
|
- // height: 0;
|
|
|
- // width: 0;
|
|
|
- color: #ff0000;
|
|
|
-}
|
|
|
-.pointerBuT {
|
|
|
- color: greenyellow;
|
|
|
-}
|
|
|
-.hidden {
|
|
|
- visibility: hidden; // 不显示内容,但是需要占位
|
|
|
-}
|
|
|
-.table {
|
|
|
- border-collapse: collapse;
|
|
|
-}
|
|
|
-.table tr {
|
|
|
- margin: 5px 0;
|
|
|
- border-bottom: 1px whitesmoke solid; // 每一行表格的结束的分割线
|
|
|
-}
|
|
|
-.table tr td {
|
|
|
- padding-top: 5px;
|
|
|
- padding-bottom: 5px;
|
|
|
- text-align: left;
|
|
|
- line-height: 2em;
|
|
|
-}
|
|
|
-.table tr td span {
|
|
|
- margin-top: 0.5em;
|
|
|
-}
|
|
|
-.ranking-text {
|
|
|
- font-size: 12px;
|
|
|
- font-weight: 400;
|
|
|
- color: #666666;
|
|
|
-}
|
|
|
-.font-green {
|
|
|
- color: #3CC480;
|
|
|
-}
|
|
|
-.font-gray {
|
|
|
- color: darkgrey;
|
|
|
-}
|
|
|
-.font-red {
|
|
|
- color: #FF4141;
|
|
|
-}
|
|
|
-</style>
|
|
|
+ .font-set {
|
|
|
+ color: darkgrey;
|
|
|
+ font-size: 12px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+ .pointerUpT {
|
|
|
+ // border-width: 0 4px 5px 4px;
|
|
|
+ // border-color: #fff #fff #ff0000 #fff;
|
|
|
+ // border-style: solid;
|
|
|
+ // height: 0;
|
|
|
+ // width: 0;
|
|
|
+ color: #ff0000;
|
|
|
+ }
|
|
|
+ .pointerBuT {
|
|
|
+ color: greenyellow;
|
|
|
+ }
|
|
|
+ .hidden {
|
|
|
+ visibility: hidden; // 不显示内容,但是需要占位
|
|
|
+ }
|
|
|
+ .table {
|
|
|
+ border-collapse: collapse;
|
|
|
+ }
|
|
|
+ .table tr {
|
|
|
+ margin: 5px 0;
|
|
|
+ border-bottom: 1px whitesmoke solid; // 每一行表格的结束的分割线
|
|
|
+ }
|
|
|
+ .table tr td {
|
|
|
+ padding-top: 5px;
|
|
|
+ padding-bottom: 5px;
|
|
|
+ text-align: left;
|
|
|
+ line-height: 2em;
|
|
|
+ }
|
|
|
+ .table tr td span {
|
|
|
+ margin-top: 0.5em;
|
|
|
+ }
|
|
|
+ .ranking-text {
|
|
|
+ font-size: 12px;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ .font-green {
|
|
|
+ color: #3CC480;
|
|
|
+ }
|
|
|
+ .font-gray {
|
|
|
+ color: darkgrey;
|
|
|
+ }
|
|
|
+ .font-red {
|
|
|
+ color: #FF4141;
|
|
|
+ }
|
|
|
+</style>
|