mirror of
https://gitee.com/lab1024/smart-admin.git
synced 2025-10-02 02:06:38 +08:00
Breadcrumbs added except : order list / shopping cart / coupon list / address management
This commit is contained in:
Vion
parent
fcb6dc26bd
commit
2f5ef11c15
@ -3,6 +3,9 @@ body {
|
||||
font-family: DINPro, 'PingFang SC', miui, 'Hiragino Sans GB', 'Microsoft Yahei', sans-serif;
|
||||
line-height: 1.5;
|
||||
color: #666;
|
||||
}
|
||||
.ts-crumbs {
|
||||
|
||||
}
|
||||
.rc-menu--xs .rc-screen-reader{
|
||||
left:28%;
|
||||
|
||||
@ -12,7 +12,6 @@ ul li ol li em strong i {
|
||||
}
|
||||
.rc-main {
|
||||
position: relative;
|
||||
margin-top: 5.25rem;
|
||||
|
||||
.active{
|
||||
border: 2px solid #E2001A;
|
||||
@ -33,7 +32,6 @@ ul li ol li em strong i {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
margin-top: 20px;
|
||||
.ts-scrollable-container{
|
||||
h2{
|
||||
font-weight: bold;
|
||||
@ -384,7 +382,6 @@ border-radius: 100px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
margin-top: 40px;
|
||||
.ts-scrollable-container{
|
||||
h2{
|
||||
font-weight: bold;
|
||||
@ -441,7 +438,6 @@ cursor: pointer;
|
||||
|
||||
}
|
||||
.rc-main {
|
||||
margin-top: 7.25rem;
|
||||
|
||||
}
|
||||
.ts-scrollable-container{
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<div class="crumbs" v-if="showTab">
|
||||
<div class="ts-crumbs rc-max-width--xl rc-padding-y--md" v-if="showTab" :style="crumbStyle">
|
||||
<el-breadcrumb separator-class="el-icon-arrow-right">
|
||||
<el-breadcrumb-item to="/" >{{ this.homepageName }}</el-breadcrumb-item>
|
||||
|
||||
<el-breadcrumb-item :to=item.path v-for="(item, index) in crumbs"
|
||||
<el-breadcrumb-item :to=item.path v-for="(item, index) in displayData"
|
||||
:key="index">{{ item.title }}</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
@ -11,171 +11,68 @@
|
||||
|
||||
<script>
|
||||
import { mapState, mapMutations } from "vuex";
|
||||
|
||||
import tabs from "~/components/tabs.vue";
|
||||
export default {
|
||||
props:["crumbs"],
|
||||
props:["crumbs","crumbStyle"],
|
||||
name:"crumbs",
|
||||
data() {
|
||||
return {
|
||||
homepageName:'首页'
|
||||
displayData:[],
|
||||
homepageName:'定制营养方案',
|
||||
nameMapping:{
|
||||
'/productdetails/productlist':'产品分类',
|
||||
'/usersearch/search':'产品搜索',
|
||||
'/personal/mypersonal':'个人中心',
|
||||
'/personal/usermember/':'会员权益',
|
||||
'/personal/integral/':'积分明细'
|
||||
},
|
||||
};
|
||||
},
|
||||
created(){
|
||||
if(this.showTab != false)
|
||||
this.showTab=true;
|
||||
this.build();
|
||||
},
|
||||
watch: {
|
||||
crumbs(val) {
|
||||
this.crumbs = val;
|
||||
this.build();
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
|
||||
methods: {
|
||||
...mapMutations(["changemessage",'selectMenu'])
|
||||
...mapMutations(["changemessage",'selectMenu']),
|
||||
build() {
|
||||
let _self = this;
|
||||
this.displayData=[];
|
||||
this.crumbs.forEach(function(ele,index){
|
||||
let displayObj= {path:'',title:''};
|
||||
if(ele.path) {
|
||||
displayObj.path = ele.path;
|
||||
for(let path in _self.nameMapping) {
|
||||
if(ele.path.indexOf(path)>-1) {
|
||||
displayObj.path = path;
|
||||
displayObj.title = _self.nameMapping[path];
|
||||
}
|
||||
}
|
||||
}
|
||||
if(ele.title) {
|
||||
displayObj.title = ele.title;
|
||||
}
|
||||
_self.displayData.push(displayObj);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.crumbs{
|
||||
width: 93%;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
align-items: center;
|
||||
margin-top: 70px;
|
||||
/deep/.el-breadcrumb__inner.is-link:hover {
|
||||
color:#E2001A;
|
||||
}
|
||||
.tags-scroll-content {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: 43px;
|
||||
z-index: 0;
|
||||
overflow: hidden;
|
||||
// padding: 0 66px 0 21px;
|
||||
}
|
||||
.tabs {
|
||||
user-select: none;
|
||||
z-index: 20;
|
||||
width: 100%;
|
||||
|
||||
height: 43px;
|
||||
top: 60px;
|
||||
height: 42px;
|
||||
background: white;
|
||||
.tag {
|
||||
display: inline-block;
|
||||
height: 43px;
|
||||
// position: absolute;
|
||||
padding-right: 40px;
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.tags-scroll-content > i {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
background: white;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
font-size: 16px;
|
||||
}
|
||||
.el-icon-arrow-left {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 21px;
|
||||
box-shadow: 0px 1px 8px 0px rgba(70, 70, 70, 0.32);
|
||||
}
|
||||
.el-icon-arrow-right {
|
||||
position: absolute;
|
||||
right: 40px;
|
||||
width: 21px;
|
||||
}
|
||||
.close {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
color: black;
|
||||
background: white;
|
||||
height: 40px;
|
||||
padding-left: 15px;
|
||||
line-height: 40px;
|
||||
width: 40px;
|
||||
border-left: 1px solid #f1f1f1 !important;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.el-tag--dark {
|
||||
background: white;
|
||||
em {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 5px;
|
||||
margin-right: 7px;
|
||||
width: 5px;
|
||||
border-radius: 50%;
|
||||
background-color: #85ef47 !important;
|
||||
box-shadow: 0 0 7px #b7eb8f;
|
||||
}
|
||||
}
|
||||
.el-tag--dark {
|
||||
color: #323233 !important;
|
||||
.el-icon-close {
|
||||
color: black !important;
|
||||
}
|
||||
}
|
||||
.el-tag {
|
||||
.el-icon-close {
|
||||
font-size: 16px;
|
||||
&:hover {
|
||||
color: red !important;
|
||||
background: white !important;
|
||||
}
|
||||
display: inline-block;
|
||||
|
||||
}
|
||||
// width: 140px;
|
||||
em {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
height: 5px;
|
||||
margin-right: 7px;
|
||||
width: 5px;
|
||||
border-radius: 50%;
|
||||
background-color: white;
|
||||
}
|
||||
cursor: pointer;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
color: #969799;
|
||||
font-size: 13px;
|
||||
float: left;
|
||||
border-radius: 0;
|
||||
border: 0;
|
||||
> span {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
i {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
top: 0px;
|
||||
|
||||
}
|
||||
.el-tag__close {
|
||||
right: 0px;
|
||||
color: #777777;
|
||||
&:hover {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
.el-xie{
|
||||
list-style: none;
|
||||
font-style: normal;
|
||||
margin: 0 8px;
|
||||
}
|
||||
}
|
||||
.ts-crumbs{
|
||||
padding-left:1.25rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,7 +1,5 @@
|
||||
|
||||
export default ({store, route, redirect}) => {
|
||||
route.matched.forEach((item, index) => {
|
||||
item.meta.title = route.meta[index].title || '';
|
||||
item.meta.redirect = route.meta[index].redirect || '';//设置重定向
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -2,6 +2,7 @@
|
||||
<div>
|
||||
<Myheader></Myheader>
|
||||
<div class="rc-top"></div>
|
||||
<tabs :crumbs="crumbs"></tabs>
|
||||
<div class="rc-max-width--xl rc-padding-y--md">
|
||||
<ul>
|
||||
<li v-for="(item,index) in userrecord" :key="index">
|
||||
@ -36,6 +37,14 @@ import Myheader from '~/components/header.vue'
|
||||
export default {
|
||||
data(){
|
||||
return{
|
||||
crumbs:[
|
||||
{
|
||||
path:'/personal/mypersonal',
|
||||
},
|
||||
{
|
||||
path:'/personal/integral/',
|
||||
}
|
||||
],
|
||||
userrecord:[
|
||||
{
|
||||
title:'日期',
|
||||
|
||||
@ -3,6 +3,7 @@
|
||||
<Myheader></Myheader>
|
||||
<!-- <tabs></tabs> -->
|
||||
<div class="rc-top"></div>
|
||||
<tabs :crumbs="crumbs" :crumbStyle="`padding-left:0;`"></tabs>
|
||||
<div class="rc-layout-container rc-one-column rc-full-width ts-mypersonal">
|
||||
<div class="rc-column">
|
||||
<!-- <div class="rc-title">
|
||||
@ -152,16 +153,21 @@ export default {
|
||||
meta: {title: '个人中心'},
|
||||
data() {
|
||||
return {
|
||||
userlog:false,
|
||||
islogin:false,
|
||||
dialogInfo1:false,
|
||||
userid:null,
|
||||
usertitle:'',
|
||||
rcvalue:5000,
|
||||
usermessage:'关注皇家爱宠荟，修改个人资料',
|
||||
userimage:require("../../assets/image/rc-new.png"),
|
||||
userlogin:'登录注册',
|
||||
userorder: "新手铲屎官",
|
||||
crumbs:[
|
||||
{
|
||||
path:'/personal/mypersonal',
|
||||
}
|
||||
],
|
||||
userlog:false,
|
||||
islogin:false,
|
||||
dialogInfo1:false,
|
||||
userid:null,
|
||||
usertitle:'',
|
||||
rcvalue:5000,
|
||||
usermessage:'关注皇家爱宠荟，修改个人资料',
|
||||
userimage:require("../../assets/image/rc-new.png"),
|
||||
userlogin:'登录注册',
|
||||
userorder: "新手铲屎官",
|
||||
prefecture: [
|
||||
{
|
||||
title: "待付款",
|
||||
|
||||
@ -344,7 +344,7 @@ export default {
|
||||
postData[0].orderAddress.addressUserName +
|
||||
" " +
|
||||
postData[0].orderAddress.addressPhoneNumber,
|
||||
wxPay: "weixin://wxpay/bizpayurl?pr=4RJbokxzz",
|
||||
wxPay: res.msg,
|
||||
};
|
||||
this.$router.push({
|
||||
path: "/personal/userpay",
|
||||
|
||||
@ -2,7 +2,8 @@
|
||||
<div>
|
||||
<Myheader></Myheader>
|
||||
<div class="rc-top"></div>
|
||||
<div class="rc-full-width rc-max-width--xl rc-padding-y--lg">
|
||||
<tabs :crumbs="crumbs"></tabs>
|
||||
<div class="rc-full-width rc-max-width--xl rc-padding-bottom--lg">
|
||||
<div class="rc-main">
|
||||
|
||||
<div class="rc-center" >
|
||||
@ -53,15 +54,24 @@
|
||||
<script>
|
||||
import Myheader from '~/components/header.vue'
|
||||
import Myfooter from '~/components/rc-footer.vue'
|
||||
import tabs from "~/components/tabs.vue";
|
||||
export default {
|
||||
data(){
|
||||
|
||||
return{
|
||||
banners:[
|
||||
{src:require("../../assets/image/rc-new.png"),link:""},
|
||||
{src:require("../../assets/image/rc-new1.png"),link:""},
|
||||
{src:require("../../assets/image/rc-new2.png"),link:""},
|
||||
],
|
||||
crumbs:[
|
||||
{
|
||||
path:'/personal/mypersonal',
|
||||
},
|
||||
{
|
||||
path:'/personal/usermember/',
|
||||
}
|
||||
],
|
||||
banners:[
|
||||
{src:require("../../assets/image/rc-new.png"),link:""},
|
||||
{src:require("../../assets/image/rc-new1.png"),link:""},
|
||||
{src:require("../../assets/image/rc-new2.png"),link:""},
|
||||
],
|
||||
userid:null,
|
||||
userimage:require("../../assets/image/rc-new.png"),
|
||||
userorder:'新手铲屎官',
|
||||
@ -251,7 +261,8 @@ methods:{
|
||||
},
|
||||
components:{
|
||||
Myheader,
|
||||
Myfooter
|
||||
Myfooter,
|
||||
tabs
|
||||
},
|
||||
mounted(){
|
||||
console.log(this.$refs.userblock);
|
||||
|
||||
@ -104,7 +104,7 @@ export default {
|
||||
payimage: require("../../assets/pay/zfb.png"),
|
||||
},
|
||||
],
|
||||
dialogSuccess: true,
|
||||
dialogSuccess: false,
|
||||
dialogFail: false,
|
||||
userPayData: {},
|
||||
qrtext:'',
|
||||
@ -114,6 +114,7 @@ export default {
|
||||
mounted() {
|
||||
this.userPayData = JSON.parse(this.$route.query.userPayData);
|
||||
this.qrtext=this.userPayData.wxPay
|
||||
this.updateOrderWX();
|
||||
},
|
||||
methods: {
|
||||
closeDialogSuccess() {
|
||||
|
||||
@ -2,8 +2,8 @@
|
||||
<div>
|
||||
<div class="user">
|
||||
<Myheader></Myheader>
|
||||
<unlogin></unlogin>
|
||||
<tabs></tabs>
|
||||
<div class="rc-top"></div>
|
||||
<tabs :crumbs="crumbs"></tabs>
|
||||
<div class="online" id="fixed-catbar-seperator"></div>
|
||||
<div class="rc-top"></div>
|
||||
<div
|
||||
@ -324,7 +324,17 @@ export default {
|
||||
productAttachmentList = newlist[0].productAttachmentList;
|
||||
userbuy = true;
|
||||
}
|
||||
|
||||
let crumbs = [
|
||||
{
|
||||
path:'/productdetails/productlist/',
|
||||
},
|
||||
{
|
||||
title: curItem.productName,
|
||||
}
|
||||
];
|
||||
return {
|
||||
crumbs,
|
||||
activeIndexa,
|
||||
curItem,
|
||||
newlist,
|
||||
@ -629,6 +639,8 @@ export default {
|
||||
this.activeIndexa = index;
|
||||
this.curItem = item;
|
||||
this.productAttachmentList = item.productAttachmentList;
|
||||
this.crumbs.pop();
|
||||
this.crumbs.push({title: item.productName});
|
||||
},
|
||||
},
|
||||
|
||||
@ -637,6 +649,5 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
@import url("../../assets/css/global.less");
|
||||
@import url("../../assets/css/producted.less");
|
||||
</style>
|
||||
@ -325,7 +325,6 @@ export default {
|
||||
crumbs:[
|
||||
{
|
||||
path:'/productdetails/productlist/',
|
||||
title:'产品列表',
|
||||
}
|
||||
],
|
||||
value: "",
|
||||
|
||||
@ -1,11 +1,8 @@
|
||||
<template>
|
||||
<div>
|
||||
<transition name="fade">
|
||||
<div class="userloding" v-show="isLoading"></div>
|
||||
</transition>
|
||||
|
||||
<Myheader></Myheader>
|
||||
<div class="rc-top"></div>
|
||||
<tabs :crumbs="crumbs"></tabs>
|
||||
<div class="rc-max-width--xl rc-main">
|
||||
<div class="usersearch">
|
||||
<div class="form-search">
|
||||
@ -329,13 +326,18 @@
|
||||
import Myheader from "~/components/header.vue";
|
||||
import MyFooter from '~/components/rc-footer.vue'
|
||||
import FixRight from "~/components/fixed-right.vue";
|
||||
import tabs from "~/components/tabs.vue";
|
||||
import { biaome, userstype, searchchanpin, userquery } from "../../ajax/getData";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
value: "",
|
||||
crumbs:[
|
||||
{
|
||||
path:'/usersearch/search/',
|
||||
}
|
||||
],
|
||||
isLoading: true,
|
||||
|
||||
userserachlist: [
|
||||
{
|
||||
categoryName: [], //专区
|
||||
@ -516,7 +518,8 @@ export default {
|
||||
components: {
|
||||
Myheader,
|
||||
MyFooter,
|
||||
FixRight
|
||||
FixRight,
|
||||
tabs
|
||||
},
|
||||
mounted() {
|
||||
this.usetmessage();
|
||||
|
||||
Loading…
Reference in New Issue
Block a user