|
@@ -2,6 +2,12 @@
|
|
|
<div>
|
|
|
<div class="right-bar">
|
|
|
<ul class="right-bar-center">
|
|
|
+ <li class="right-bar-item" v-show="storeStatus && storeStatus.uuid">
|
|
|
+ <a @click="goShop" class="title" target="_blank">
|
|
|
+ <i class="iconfont icon-dianpu icon-xlg"></i>
|
|
|
+ </a>
|
|
|
+ <div class="sidebar-menu"><a title="我的店铺" target="_blank">我的店铺</a></div>
|
|
|
+ </li>
|
|
|
<li class="right-bar-item" @mouseenter="loadCarCount()">
|
|
|
<a @click="goCart" class="title" target="_blank">
|
|
|
<i class="iconfont icon-shopping-cart icon-xlg"></i>
|
|
@@ -84,7 +90,8 @@
|
|
|
page: 1,
|
|
|
count: 3,
|
|
|
currentPage: 1,
|
|
|
- chatCount: 0
|
|
|
+ chatCount: 0,
|
|
|
+ showMyshop: false
|
|
|
}
|
|
|
},
|
|
|
components: {
|
|
@@ -111,17 +118,11 @@
|
|
|
},
|
|
|
tab () {
|
|
|
return this.$store.state.chat.tab.tab.data
|
|
|
+ },
|
|
|
+ storeStatus () {
|
|
|
+ return this.$store.state.option.storeStatus.data
|
|
|
}
|
|
|
},
|
|
|
-// mounted () {
|
|
|
-// this.$nextTick(() => {
|
|
|
-// this.getChatCount()
|
|
|
-// // 刷新统计信息
|
|
|
-// setInterval(() => {
|
|
|
-// this.getChatCount()
|
|
|
-// }, 10000)
|
|
|
-// })
|
|
|
-// },
|
|
|
methods: {
|
|
|
listenPage: function (p) {
|
|
|
this.page = p
|
|
@@ -180,6 +181,9 @@
|
|
|
window.open('/user#/cart')
|
|
|
}
|
|
|
},
|
|
|
+ goShop: function () {
|
|
|
+ window.location.href = '/vendor#/index'
|
|
|
+ },
|
|
|
goWebChat: function () {
|
|
|
if (!this.user.logged) {
|
|
|
this.goLogin()
|
|
@@ -252,278 +256,280 @@
|
|
|
}
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
- a[disabled] {
|
|
|
- cursor: not-allowed;
|
|
|
- }
|
|
|
- em,i{
|
|
|
- font-style: inherit;
|
|
|
- }
|
|
|
- .right-bar ul li{
|
|
|
- position: relative;
|
|
|
- }
|
|
|
- .right-bar ul li .sidebar-menu {
|
|
|
- position: absolute;
|
|
|
- display: block;
|
|
|
- right: -100%;
|
|
|
- top: 0px;
|
|
|
- bottom: 0;
|
|
|
- width: 100px;
|
|
|
- line-height: 38px;
|
|
|
- height: 38px;
|
|
|
- color: #ffffff;
|
|
|
- background: #555;
|
|
|
- -webkit-transform: translateX(100%);
|
|
|
- -moz-transform: translateX(100%);
|
|
|
- -ms-transform: translateX(100%);
|
|
|
- -o-transform: translateX(100%);
|
|
|
- transform: translateX(100%);
|
|
|
- -webkit-transition: transform .5s;
|
|
|
- -moz-transition: transform .5s;
|
|
|
- -ms-transition: transform .5s;
|
|
|
- -o-transition: transform .5s;
|
|
|
- transition: transform .5s;
|
|
|
- z-index: 19;
|
|
|
- }
|
|
|
- .right-bar ul li .sidebar-menu a{
|
|
|
- background-color: #555555;
|
|
|
- }
|
|
|
- .right-bar ul li:hover a{
|
|
|
- background-color: #555555;
|
|
|
- }
|
|
|
- .right-bar ul li:hover .sidebar-menu {
|
|
|
- display: block;
|
|
|
- -webkit-transform: translateX(-72px);
|
|
|
- -moz-transform: translateX(-72px);
|
|
|
- -ms-transform: translateX(-72px);
|
|
|
- -o-transform: translateX(-72px);
|
|
|
- transform: translateX(-72px);
|
|
|
- }
|
|
|
- /*浏览记录*/
|
|
|
- .right-bar ul li .foot-record{
|
|
|
- /* display: none; */
|
|
|
- width: 210px !important;
|
|
|
- max-height: 230px;
|
|
|
- line-height: 30px;
|
|
|
- /* right: 200px;*/
|
|
|
- top: inherit;
|
|
|
- bottom: -100%;
|
|
|
- height: inherit;
|
|
|
- /*padding-bottom: 10px;*/
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record h3{
|
|
|
- line-height: 39px;
|
|
|
- border-bottom: #767575 1px solid;
|
|
|
- text-align: left;
|
|
|
- padding-left: 10px;
|
|
|
- width: 96%;
|
|
|
- display: inline-block;
|
|
|
- margin: 0 auto;
|
|
|
- font-size: 12px;
|
|
|
- height: 39px;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record h3:hover a{
|
|
|
- color: #fbb029;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record h3 a{
|
|
|
- color: #fff;
|
|
|
- background-color: inherit;
|
|
|
- line-height: 39px;
|
|
|
- text-align: left;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl{
|
|
|
- padding-top: 5px;
|
|
|
- display: inline-block;
|
|
|
- background: #555;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl,.right-bar ul li .foot-record dl dd{
|
|
|
- width: 100%;
|
|
|
- margin: 0 auto;
|
|
|
- background: #555;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd{
|
|
|
- line-height: 22px;
|
|
|
- width: 100%;
|
|
|
- display: inline-block;
|
|
|
- float: left;
|
|
|
- height: 22px;
|
|
|
- position: relative;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd a{
|
|
|
- display: inline-block;
|
|
|
- height: 22px;
|
|
|
- padding: 0 10px;
|
|
|
- width: 91%;
|
|
|
- font-size: 12px;
|
|
|
- color: #fff;
|
|
|
- line-height: 22px;
|
|
|
- white-space: nowrap;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- background: none;
|
|
|
- text-align: left;
|
|
|
- padding-right: 44px;
|
|
|
- }
|
|
|
- .right-bar ul li a i{
|
|
|
- font-size: 20px;
|
|
|
- }
|
|
|
- .right-bar .remind-point {
|
|
|
- width: 8px;
|
|
|
- height: 8px;
|
|
|
- display: block;
|
|
|
- border-radius: 100%;
|
|
|
- background: red;
|
|
|
- position: relative;
|
|
|
- top: -31px;
|
|
|
- right: -21px;
|
|
|
- }
|
|
|
- .right-bar ul li li a:hover div.foot-record{
|
|
|
- display: inline-block !important;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd:hover{
|
|
|
- background: #fff;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd:hover a{
|
|
|
- color: #333;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd:hover div.hover-shows{
|
|
|
- display: inline-block;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd div.hover-shows{
|
|
|
+a[disabled] {
|
|
|
+ cursor: not-allowed;
|
|
|
+}
|
|
|
+em,
|
|
|
+i {
|
|
|
+ font-style: inherit;
|
|
|
+}
|
|
|
+.right-bar ul li {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.right-bar ul li .sidebar-menu {
|
|
|
+ position: absolute;
|
|
|
+ display: block;
|
|
|
+ right: -100%;
|
|
|
+ top: 0px;
|
|
|
+ bottom: 0;
|
|
|
+ width: 100px;
|
|
|
+ line-height: 38px;
|
|
|
+ height: 38px;
|
|
|
+ color: #ffffff;
|
|
|
+ background: #555;
|
|
|
+ -webkit-transform: translateX(100%);
|
|
|
+ -moz-transform: translateX(100%);
|
|
|
+ -ms-transform: translateX(100%);
|
|
|
+ -o-transform: translateX(100%);
|
|
|
+ transform: translateX(100%);
|
|
|
+ -webkit-transition: transform 0.5s;
|
|
|
+ -moz-transition: transform 0.5s;
|
|
|
+ -ms-transition: transform 0.5s;
|
|
|
+ -o-transition: transform 0.5s;
|
|
|
+ transition: transform 0.5s;
|
|
|
+ z-index: 19;
|
|
|
+}
|
|
|
+.right-bar ul li .sidebar-menu a {
|
|
|
+ background-color: #555555;
|
|
|
+}
|
|
|
+.right-bar ul li:hover a {
|
|
|
+ background-color: #555555;
|
|
|
+}
|
|
|
+.right-bar ul li:hover .sidebar-menu {
|
|
|
+ display: block;
|
|
|
+ -webkit-transform: translateX(-72px);
|
|
|
+ -moz-transform: translateX(-72px);
|
|
|
+ -ms-transform: translateX(-72px);
|
|
|
+ -o-transform: translateX(-72px);
|
|
|
+ transform: translateX(-72px);
|
|
|
+}
|
|
|
+/*浏览记录*/
|
|
|
+.right-bar ul li .foot-record {
|
|
|
+ /* display: none; */
|
|
|
+ width: 210px !important;
|
|
|
+ max-height: 230px;
|
|
|
+ line-height: 30px;
|
|
|
+ /* right: 200px;*/
|
|
|
+ top: inherit;
|
|
|
+ bottom: -100%;
|
|
|
+ height: inherit;
|
|
|
+ /*padding-bottom: 10px;*/
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record h3 {
|
|
|
+ line-height: 39px;
|
|
|
+ border-bottom: #767575 1px solid;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 10px;
|
|
|
+ width: 96%;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 auto;
|
|
|
+ font-size: 12px;
|
|
|
+ height: 39px;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record h3:hover a {
|
|
|
+ color: #fbb029;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record h3 a {
|
|
|
+ color: #fff;
|
|
|
+ background-color: inherit;
|
|
|
+ line-height: 39px;
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl {
|
|
|
+ padding-top: 5px;
|
|
|
+ display: inline-block;
|
|
|
+ background: #555;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl,
|
|
|
+.right-bar ul li .foot-record dl dd {
|
|
|
+ width: 100%;
|
|
|
+ margin: 0 auto;
|
|
|
+ background: #555;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd {
|
|
|
+ line-height: 22px;
|
|
|
+ width: 100%;
|
|
|
+ display: inline-block;
|
|
|
+ float: left;
|
|
|
+ height: 22px;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd a {
|
|
|
+ display: inline-block;
|
|
|
+ height: 22px;
|
|
|
+ padding: 0 10px;
|
|
|
+ width: 91%;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 22px;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ background: none;
|
|
|
+ text-align: left;
|
|
|
+ padding-right: 44px;
|
|
|
+}
|
|
|
+.right-bar ul li a i {
|
|
|
+ font-size: 20px;
|
|
|
+}
|
|
|
+.right-bar .remind-point {
|
|
|
+ width: 8px;
|
|
|
+ height: 8px;
|
|
|
+ display: block;
|
|
|
+ border-radius: 100%;
|
|
|
+ background: red;
|
|
|
+ position: relative;
|
|
|
+ top: -31px;
|
|
|
+ right: -21px;
|
|
|
+}
|
|
|
+.right-bar ul li li a:hover div.foot-record {
|
|
|
+ display: inline-block !important;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd:hover {
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd:hover a {
|
|
|
+ color: #333;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd:hover div.hover-shows {
|
|
|
+ display: inline-block;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd div.hover-shows {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 2px;
|
|
|
+ max-width: 55px;
|
|
|
+ line-height: 20px;
|
|
|
+ padding-right: 0;
|
|
|
+ z-index: 100;
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd div.hover-shows span {
|
|
|
+ display: inline-block;
|
|
|
+ width: 30px;
|
|
|
+ height: 20px;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 20px;
|
|
|
+ background: #e04b38;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 5px;
|
|
|
+ opacity: 0;
|
|
|
+ margin-top: 1px;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd:first-child {
|
|
|
+ /* margin-top: 5px;*/
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd:last-child {
|
|
|
+ /* margin-bottom: 10px;*/
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd div.hover-shows a {
|
|
|
+ font-size: 23px;
|
|
|
+ float: right;
|
|
|
+ width: 20px;
|
|
|
+ padding: 0;
|
|
|
+ text-align: center;
|
|
|
+ color: #999;
|
|
|
+ top: -2px;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd div.hover-shows a:hover {
|
|
|
+ color: #fbb029;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd div.hover-shows em {
|
|
|
+ display: inline-block;
|
|
|
+ position: absolute;
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ border-top: 8px solid transparent;
|
|
|
+ border-left: 7px solid #fbb029;
|
|
|
+ border-bottom: 8px solid transparent;
|
|
|
+ left: -158px;
|
|
|
+ top: 4px;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd div.hover-shows em.off {
|
|
|
+ border-left: 8px solid #b2b0b0;
|
|
|
+}
|
|
|
+.right-bar ul li .foot-record dl dd div.hover-shows span.off {
|
|
|
+ opacity: 1;
|
|
|
+}
|
|
|
+/*浏览记录结束*/
|
|
|
+.right-bar ul li .contact-us {
|
|
|
+ /*right: 200px;*/
|
|
|
+ height: 180px;
|
|
|
+ padding-top: 10px;
|
|
|
+ width: 210px;
|
|
|
+ top: -76px;
|
|
|
+}
|
|
|
+.right-bar ul li .contact-us p {
|
|
|
+ line-height: 33px;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 10px;
|
|
|
+ margin-bottom: 0;
|
|
|
+ white-space: nowrap;
|
|
|
+ font-size: 12px;
|
|
|
+}
|
|
|
+.right-bar ul li .contact-us .contact-btn {
|
|
|
+ width: 62px;
|
|
|
+ height: 18px;
|
|
|
+ line-height: 18px;
|
|
|
+ background: #ef7f03;
|
|
|
+ display: inline-block;
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 12px;
|
|
|
+ border-radius: 5px;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+.right-bar-item {
|
|
|
+ width: 36px;
|
|
|
+ /* height: 38px;*/
|
|
|
+}
|
|
|
+.right-bar .right-bar-item a.title {
|
|
|
+ display: inline-block;
|
|
|
+ width: 36px;
|
|
|
+ height: 38px;
|
|
|
+ line-height: 38px;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+.right-bar {
|
|
|
+ position: fixed;
|
|
|
+ z-index: 1000;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ width: 36px;
|
|
|
+ height: 100%;
|
|
|
+
|
|
|
+ .right-bar-center {
|
|
|
position: absolute;
|
|
|
- top: 0;
|
|
|
- right: 2px;
|
|
|
- max-width: 55px;
|
|
|
- line-height: 20px;
|
|
|
- padding-right: 0;
|
|
|
- z-index: 100;
|
|
|
- display: none;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd div.hover-shows span{
|
|
|
- display: inline-block;
|
|
|
- width: 30px;
|
|
|
- height: 20px;
|
|
|
- text-align: center;
|
|
|
- line-height: 20px;
|
|
|
- background: #e04b38;
|
|
|
- color: #fff;
|
|
|
- border-radius: 5px;
|
|
|
- opacity: 0;
|
|
|
- margin-top: 1px;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd:first-child{
|
|
|
- /* margin-top: 5px;*/
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd:last-child{
|
|
|
- /* margin-bottom: 10px;*/
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd div.hover-shows a{
|
|
|
- font-size: 23px;
|
|
|
- float: right;
|
|
|
- width: 20px;
|
|
|
+ top: 60%;
|
|
|
+ transform: translateY(-50%);
|
|
|
+ list-style: none;
|
|
|
padding: 0;
|
|
|
- text-align: center;
|
|
|
- color: #999;
|
|
|
- top: -2px;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd div.hover-shows a:hover{
|
|
|
- color: #fbb029;
|
|
|
+ width: 100%;
|
|
|
}
|
|
|
- .right-bar ul li .foot-record dl dd div.hover-shows em{
|
|
|
- display: inline-block;
|
|
|
+
|
|
|
+ .right-bar-bottom {
|
|
|
position: absolute;
|
|
|
- width: 0;
|
|
|
- height: 0;
|
|
|
- border-top: 8px solid transparent;
|
|
|
- border-left: 7px solid #fbb029;
|
|
|
- border-bottom: 8px solid transparent;
|
|
|
- left: -158px;
|
|
|
- top: 4px;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd div.hover-shows em.off{
|
|
|
- border-left: 8px solid #b2b0b0;
|
|
|
- }
|
|
|
- .right-bar ul li .foot-record dl dd div.hover-shows span.off{
|
|
|
- opacity: 1;
|
|
|
- }
|
|
|
- /*浏览记录结束*/
|
|
|
- .right-bar ul li .contact-us{
|
|
|
- /*right: 200px;*/
|
|
|
- height: 180px;
|
|
|
- padding-top: 10px;
|
|
|
- width: 210px;
|
|
|
- top: -76px;
|
|
|
- }
|
|
|
- .right-bar ul li .contact-us p{
|
|
|
- line-height: 33px;
|
|
|
- text-align: left;
|
|
|
- padding-left: 10px;
|
|
|
- margin-bottom: 0;
|
|
|
- white-space: nowrap;
|
|
|
- font-size: 12px;
|
|
|
- }
|
|
|
- .right-bar ul li .contact-us .contact-btn{
|
|
|
- width: 62px;
|
|
|
- height: 18px;
|
|
|
- line-height: 18px;
|
|
|
- background: #ef7f03;
|
|
|
- display: inline-block;
|
|
|
- text-align: center;
|
|
|
- color: #fff;
|
|
|
- font-size: 12px;
|
|
|
- border-radius: 5px;
|
|
|
- padding: 0;
|
|
|
- }
|
|
|
- .right-bar-item{
|
|
|
- width: 36px;
|
|
|
- /* height: 38px;*/
|
|
|
- }
|
|
|
- .right-bar .right-bar-item a.title{
|
|
|
- display: inline-block;
|
|
|
- width: 36px;
|
|
|
- height: 38px;
|
|
|
- line-height: 38px;
|
|
|
- padding: 0;
|
|
|
- }
|
|
|
- .right-bar {
|
|
|
- position: fixed;
|
|
|
- z-index: 1000;
|
|
|
right: 0;
|
|
|
- top: 0;
|
|
|
+ bottom: 0;
|
|
|
width: 36px;
|
|
|
- height: 100%;
|
|
|
+ }
|
|
|
|
|
|
- .right-bar-center {
|
|
|
- position: absolute;
|
|
|
- top: 60%;
|
|
|
- transform: translateY(-50%);
|
|
|
- list-style: none;
|
|
|
- padding: 0;
|
|
|
+ .right-bar-item {
|
|
|
+ a {
|
|
|
+ position: relative;
|
|
|
+ display: block;
|
|
|
width: 100%;
|
|
|
- }
|
|
|
-
|
|
|
- .right-bar-bottom {
|
|
|
- position: absolute;
|
|
|
- right: 0;
|
|
|
- bottom: 0;
|
|
|
- width: 36px;
|
|
|
- }
|
|
|
-
|
|
|
- .right-bar-item {
|
|
|
- a {
|
|
|
- position: relative;
|
|
|
- display: block;
|
|
|
- width: 100%;
|
|
|
- color: #fff;
|
|
|
- background-color: #5078CB;
|
|
|
- text-align: center;
|
|
|
- -webkit-transition: background-color ease .5s;
|
|
|
- -moz-transition: background-color ease 0.5s;
|
|
|
- -ms-transition: background-color ease 0.5s;
|
|
|
- -o-transition: background-color ease 0.5s;
|
|
|
- transition: background-color ease 0.5s;
|
|
|
- z-index: 20;
|
|
|
- font-size: 12px;
|
|
|
- }
|
|
|
+ color: #fff;
|
|
|
+ background-color: #5078cb;
|
|
|
+ text-align: center;
|
|
|
+ -webkit-transition: background-color ease 0.5s;
|
|
|
+ -moz-transition: background-color ease 0.5s;
|
|
|
+ -ms-transition: background-color ease 0.5s;
|
|
|
+ -o-transition: background-color ease 0.5s;
|
|
|
+ transition: background-color ease 0.5s;
|
|
|
+ z-index: 20;
|
|
|
+ font-size: 12px;
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|