xinyin025/smart-admin
1
0
Fork 0
mirror of https://gitee.com/lab1024/smart-admin.git synced 2025-10-02 02:06:38 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

!253 lin

Browse Source 
Merge pull request !253 from Admin/sit-Carl-lin-dev
This commit is contained in:
Admin 2022-03-23 10:13:38 +00:00 committed by Gitee
commit 281d5b7c14
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
29 changed files with 5615 additions and 5612 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
rc-busness/assets/css/openaddress.less
View File

@ -130,10 +130,10 @@ margin:0 auto;
justify-content: space-between justify-content: space-between
} }
.usercontshow{ .usercontshow{
min-height: 20vh; // min-height: 20vh;
margin-bottom: 2rem; margin-bottom: 2rem;
padding-left:.5rem; // padding-left:.5rem;
padding-right:.5rem; // padding-right:.5rem;
} }
.rc-button{ .rc-button{
@ -268,7 +268,7 @@ display: none;
border: 1px solid #D7D7D7; border: 1px solid #D7D7D7;
border-radius: 3px; border-radius: 3px;
position: relative; position: relative;
margin-left: 20px; // margin-left: 20px;
} }
.alledit{ .alledit{

9
rc-busness/components/address.vue
View File

@ -42,6 +42,7 @@
<script> <script>
import addressInput from "~/components/addressInput.vue"; import addressInput from "~/components/addressInput.vue";
import { memberAddress } from "../ajax/getData"; import { memberAddress } from "../ajax/getData";
import { mapState } from 'vuex';
export default { export default {
data() { data() {
return { return {
@ -168,6 +169,9 @@ export default {
return ""; return "";
} }
}, },
...mapState({
userInfo : state => state.user.userInfo,
})
}, },
created() { created() {
this.title = this.title =
@ -195,8 +199,9 @@ export default {
]; ];
}, },
mounted() { mounted() {
this.usermessage = JSON.parse(localStorage.getItem("userInfo")); // this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
this.userid = this.usermessage.data.id; this.usermessage = this.userInfo;
this.userid = this.usermessage.id;
this.id = this.editAddressData.id; this.id = this.editAddressData.id;
}, },
}; };

71
rc-busness/components/fixed-right.vue
View File

@ -1,33 +1,35 @@
<template> <template>
<div class="rc-fixright-container"> <div class="rc-fixright-container">
<div class="rc-fixright"> <div class="rc-fixright">
<ul> <ul>
<li v-for="(userfixed,index) in fixedlist" :key="index" @click="lianxi(userfixed,index)"> <li v-for="(userfixed, index) in fixedlist" :key="index" @click="lianxi(userfixed, index)">
<img :src="userfixed.catimage" alt=""> <img :src="userfixed.catimage" alt="" />
<span> {{userfixed.title}}</span> <span>{{ userfixed.title }}</span>
</li> </li>
</ul> </ul>
<div class="tuntop" @click="toTop" v-show="gotop"> <div class="tuntop" @click="toTop" v-show="gotop">
<img src="../assets/image/turntop.png" alt=""> <img src="../assets/image/turntop.png" alt="" />
<span>回到顶部</span> <span>回到顶部</span>
</div> </div>
</div> </div>
<el-dialog :visible.sync="customerServerStop" :close-on-click-modal="false"> <el-dialog :visible.sync="customerServerStop" :close-on-click-modal="false">
<div class="ts-warning-popup"> <div class="ts-warning-popup">
<div class="title rc-full-width"> <div class="title rc-full-width"><img src="../assets/error.png" alt="" /></div>
<img src="../assets/error.png" alt="" /> <div class="content rc-full-width rc-text--center rc-margin-y--md">
</div> <h3>温馨提示</h3>
<div class="content rc-full-width rc-text--center rc-margin-y--md"> <span class="">
<h3>温馨提示</h3> 客服因法定春节假期暂停服务，
<span class="">客服因法定春节假期暂停服务，<br/>预计2月10日恢复正常服务</span> <br />
</div> 预计2月10日恢复正常服务
</div> </span>
</div>
</div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { mapMutations } from "vuex"; import { mapMutations,mapState } from "vuex";
export default { export default {
data(){ data(){
return{ return{
@ -38,17 +40,17 @@ export default {
{ {
title: "购物车", title: "购物车",
catimage: require("../assets/buy.png"), catimage: require("../assets/buy.png"),
}, },
{ {
title: "在线客服", title: "在线客服",
catimage: require("../assets/service.png"), catimage: require("../assets/service.png"),
}, },
{ {
title: "营养专家", title: "营养专家",
catimage: require("../assets/consult.png"), catimage: require("../assets/consult.png"),
} }
] ]
} }
@ -56,9 +58,9 @@ export default {
methods:{ methods:{
...mapMutations(["checkIsLogin"]), ...mapMutations(["checkIsLogin"]),
lianxi(item,index) { lianxi(item,index) {
this.checkIsLogin(); // this.checkIsLogin();
let user = this.$store.state.userInfo; let user = this.userInfo;
let curMemberId = (user?user.data.id:''); let curMemberId = (user?user.id:'');
if(item.title=='在线客服'){ if(item.title=='在线客服'){
//this.customerServerStop = true; //this.customerServerStop = true;
/* Stop until 2022-2-10 */ /* Stop until 2022-2-10 */
@ -75,7 +77,7 @@ export default {
"member_id": curMemberId, "member_id": curMemberId,
} }
]) ])
} }
if(item.title=='购物车'){ if(item.title=='购物车'){
if(this.loginornot){ if(this.loginornot){
@ -108,7 +110,7 @@ export default {
}, },
toTop() { toTop() {
let top = document.documentElement.scrollTop || document.body.scrollTop; let top = document.documentElement.scrollTop || document.body.scrollTop;
// 实现滚动效果 // 实现滚动效果
const timeTop = setInterval(() => { const timeTop = setInterval(() => {
document.body.scrollTop = document.documentElement.scrollTop = top -= 400; document.body.scrollTop = document.documentElement.scrollTop = top -= 400;
if (top <= 0) { if (top <= 0) {
@ -128,13 +130,25 @@ export default {
} }
} }
}, },
created(){ computed:{
...mapState({
userInfo : state => state.user.userInfo,
loginState : state => state.login.loginState,
})
},
watch: {
userInfo(newVal){
if(newVal && this.loginState){
this.loginornot = false;
}else{
this.loginornot = true;
}
}
}, },
mounted(){ mounted(){
//Check login //Check login
this.checkIsLogin(); this.checkIsLogin();
let usernot = this.$store.state.userInfo; let usernot = this.userInfo;
//console.log(usernot); //console.log(usernot);
if(usernot==null ||usernot==undefined){ if(usernot==null ||usernot==undefined){
this.loginornot=true this.loginornot=true
@ -148,5 +162,4 @@ export default {
} }
</script> </script>
<style lang="less" scoped > <style lang="less" scoped></style>
</style>

766
rc-busness/components/header.vue
View File

@ -1,157 +1,145 @@
<template> <template>
<div> <div>
<header class="rc-header" data-js-header-scroll="" data-activated="true"> <header class="rc-header" data-js-header-scroll="" data-activated="true">
<nav class="rc-header__nav rc-header__nav--primary"> <nav class="rc-header__nav rc-header__nav--primary">
<ul class="rc-list rc-list--blank rc-list--inline rc-list--align" role="menubar"> <ul class="rc-list rc-list--blank rc-list--inline rc-list--align" role="menubar">
<li class="rc-list__item rc-xl-down"> <li class="rc-list__item rc-xl-down">
<button class="rc-btn rc-btn--icon-label rc-icon rc-menu--xs rc-iconography rc-md-up" data-modal-trigger="main-nav-modal" aria-label="Menu" role="menuitem"> <button class="rc-btn rc-btn--icon-label rc-icon rc-menu--xs rc-iconography rc-md-up" data-modal-trigger="main-nav-modal" aria-label="Menu" role="menuitem">
菜单 菜单
<em class="rc-screen-reader" v-show="loginornot"></em> <em class="rc-screen-reader" v-show="loginornot"></em>
</button> </button>
<button class="rc-btn rc-btn--icon rc-icon rc-menu--xs rc-iconography rc-md-down" data-js-trigger="mobile-push-nav" aria-label="Menu" role="menuitem"> <button class="rc-btn rc-btn--icon rc-icon rc-menu--xs rc-iconography rc-md-down" data-js-trigger="mobile-push-nav" aria-label="Menu" role="menuitem">
<span class="rc-screen-reader-text"> <span class="rc-screen-reader-text">translations.feature.headerbar.menu</span>
translations.feature.headerbar.menu </button>
</span> </li>
</button> </ul>
</li> <a href="/" class="rc-header__brand">
</ul> <h1>
<a href="/" class="rc-header__brand"> <span class="rc-screen-reader-text">translations.feature.headerbar.alternatelogotext</span>
<h1> <svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 223 83.75" class="rc-header__logo">
<span class="rc-screen-reader-text">translations.feature.headerbar.alternatelogotext</span> <title>Royal Canin logo - animated</title>
<svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 223 83.75" class="rc-header__logo"> <path
<title>Royal Canin logo - animated</title> class="cls-1 rc-header__logo-text"
<path class="cls-1 rc-header__logo-text" d="M98,74.8h-6l0,0c-0.2,0-0.3-0.2-0.3-0.3V56.4c0.1-0.3,0.1-0.7,0-1c-0.3-1.7-1.9-2.8-3.6-2.6 c-1.7,0.3-2.8,1.9-2.6,3.6v22.6c0,0.9,0.7,1.7,1.7,1.8H98c0.1,0,0.2,0,0.3,0c1.6-0.1,2.8-1.5,2.7-3.1C101,75.8,99.7,74.7,98,74.8z M76.3,54.3l-16,21.6c-0.4,0.5-0.6,1.1-0.6,1.8c0,0.9,0.4,1.9,1.3,2.4c1.4,0.9,3.1,0.6,4.1-0.6l3.1-4.2h7.5v2.4 c0.1,1.7,1.5,3,3.1,2.9l0,0c1.7,0,2.9-1.4,2.9-2.9V56.3c0-0.9-0.4-1.8-1-2.3C79.4,52.8,77.4,52.9,76.3,54.3z M75.6,69.2h-2.8 c-0.1,0-0.2-0.1-0.2-0.2V69l3-4.1C75.6,64.8,75.6,69.2,75.6,69.2z M67.5,56.4c0-1.6-1.3-2.9-2.8-2.9c-0.8,0-1.6,0.3-2.1,0.8 l-6.8,7.1c-0.1,0.1-0.2,0.1-0.3,0.1s-0.2,0-0.2-0.1l-6.8-7.1c-0.5-0.5-1.3-0.9-2.1-0.9c-1.6,0-2.8,1.3-2.8,2.8c0,0.7,0.3,1.5,0.7,2 l8.3,9.5l0.1,10c0,1.6,1.3,2.9,2.9,2.9c1.6,0,2.9-1.3,2.9-2.9l0.2-9.9l8.1-9.5C67.3,57.7,67.5,57,67.5,56.4z M32.4,53.4 c-7.5,0-13.6,6.1-13.6,13.6s6.1,13.6,13.6,13.6S46,74.4,46,66.9C46,59.6,39.9,53.5,32.4,53.4z M32.4,74.2c-4.1,0-7.3-3.2-7.3-7.3 s3.2-7.3,7.3-7.3s7.3,3.2,7.3,7.3C39.7,71,36.5,74.2,32.4,74.2z M175.9,52.8c-1.5,0.1-2.7,1.3-2.7,2.7v12.7c0,0.1-0.1,0.2-0.2,0.2 c-0.1,0-0.1,0-0.1-0.1l-7.4-13.1c-1.1-2-3.7-2.6-5.6-1.4c-1.1,0.7-1.9,2-2,3.3v20.8c0.1,1.7,1.6,2.9,3.1,2.8s2.7-1.3,2.8-2.8V65.2 c0-0.1,0.1-0.2,0.2-0.2s0.1,0,0.1,0.1l7.6,13.4c1,1.9,3.4,2.5,5.3,1.5c1.3-0.7,2-2,2-3.3V55.6C178.9,54,177.6,52.7,175.9,52.8z M14,69.5c2.4-1.5,4-4.1,3.9-6.9c0,0,0,0,0-0.1c0.1-4.9-3.9-9-8.8-9.1c-2.4-0.2-4.9,0.6-6.6,2.3C0.6,57.6,0,60,0,62.6l0.4,15.1 c0,1.6,1.3,2.9,2.9,2.9s2.9-1.3,2.9-2.9l0.1-7.2l0,0c0-0.2,0.1-0.3,0.3-0.3c0,0,0.1,0,0.2,0l7.1,9.7c0.5,0.5,1.1,0.7,1.9,0.7 c1.6,0,2.8-1.3,2.9-2.8c0-0.4-0.1-0.8-0.3-1.3L14,69.5z M8.9,65.3c-0.2,0-0.3,0-0.5,0c-1.7-0.1-2.8-1.6-2.7-3.1 c0.1-1.7,1.6-2.8,3.1-2.7c0.2,0,0.3,0,0.5,0c1.7,0.1,2.8,1.6,2.7,3.1C11.9,64.2,10.4,65.7,8.9,65.3z M129.8,71.5 c-0.4,0-0.9,0.1-1.4,0.3l-2.4,1.6c-1.1,0.7-2.5,1.1-3.9,1.1c-4.2-0.2-7.3-3.8-7.1-7.8c0.2-3.9,3.2-6.9,7.1-7.1 c1.4,0,2.7,0.4,3.9,1.1l2.3,1.6c0.4,0.2,0.8,0.3,1.4,0.3c1.6,0,2.9-1.3,2.9-2.9l0,0c0-0.6-0.2-1.4-0.7-1.9c-2.3-2.7-5.7-4.3-9.4-4.3 c-7.5,0-13.6,6.1-13.6,13.6l0,0c0,7.2,5.6,13.2,12.8,13.6c3.9,0,7.5-1.6,10.2-4.4c0.4-0.5,0.7-1.1,0.6-1.9 C132.8,72.8,131.4,71.5,129.8,71.5z M185.4,52.7c-1.8,0-3.1,1.5-3.1,3.1v21.9c0,1.8,1.5,3.1,3.1,3.1c1.8,0,3.1-1.5,3.1-3.1V55.8 C188.5,54.1,187.2,52.7,185.4,52.7z M139.9,54.2c-0.6-0.6-1.5-1-2.4-1c-1.8,0-3.1,0.8-3.1,2.6v21.9l0,0c0,1.7,1.4,2.9,3,2.9 s3-1.3,3.1-2.9v-2.4h7.5l3.1,4.2c0.5,0.7,1.5,1.1,2.4,1.1c1.7,0,2.9-1.4,2.9-2.9c0-0.6-0.2-1.3-0.6-1.8L139.9,54.2z M143.5,69 c0,0.1-0.1,0.2-0.2,0.2h-2.8v-4.5l3,4.2C143.6,68.9,143.6,68.9,143.5,69z M209.9,52.8c-1.5,0.1-2.7,1.3-2.7,2.7v12.7 c0,0.1-0.1,0.2-0.2,0.2c-0.1,0-0.1,0-0.2-0.1l-7.3-13.1c-1.1-2-3.7-2.6-5.6-1.4c-1.1,0.7-1.9,2-2,3.3v20.8c0,1.7,1.4,3,3,3 s3-1.4,3-3V65.2c0-0.1,0.1-0.2,0.2-0.2s0.1,0,0.1,0.1l7.6,13.4c1,1.9,3.4,2.5,5.3,1.5c1.3-0.7,2-2,2-3.3V55.6 C212.9,54,211.5,52.7,209.9,52.8z M220.7,55.3c0-0.1,0-0.1,0-0.2c0-0.8-0.6-1-1.3-1h-0.9c-0.3,0-0.4,0.2-0.4,0.3v2.7 c0,0.3,0.1,0.4,0.4,0.4s0.4-0.2,0.4-0.4v-1h0.2l0.5,1c0.1,0.2,0.2,0.4,0.5,0.4s0.4-0.1,0.4-0.3c0-0.1,0-0.1,0-0.2l-0.6-0.9 C220.3,56.2,220.7,55.7,220.7,55.3z M219.5,55.5h-0.6v-0.8h0.6c0.3,0,0.5,0.1,0.5,0.4S219.8,55.5,219.5,55.5z M219.4,52.6 L219.4,52.6c-1.8,0-3.2,1.5-3.2,3.2s1.5,3.2,3.2,3.2s3.2-1.5,3.2-3.2C222.5,54.1,221.1,52.6,219.4,52.6z M219.4,58.2L219.4,58.2 c-1.4,0-2.4-1-2.4-2.4s1-2.4,2.4-2.4s2.4,1,2.4,2.4C221.8,57.1,220.7,58.2,219.4,58.2z" style="fill:#e2001a"></path> d="M98,74.8h-6l0,0c-0.2,0-0.3-0.2-0.3-0.3V56.4c0.1-0.3,0.1-0.7,0-1c-0.3-1.7-1.9-2.8-3.6-2.6 c-1.7,0.3-2.8,1.9-2.6,3.6v22.6c0,0.9,0.7,1.7,1.7,1.8H98c0.1,0,0.2,0,0.3,0c1.6-0.1,2.8-1.5,2.7-3.1C101,75.8,99.7,74.7,98,74.8z M76.3,54.3l-16,21.6c-0.4,0.5-0.6,1.1-0.6,1.8c0,0.9,0.4,1.9,1.3,2.4c1.4,0.9,3.1,0.6,4.1-0.6l3.1-4.2h7.5v2.4 c0.1,1.7,1.5,3,3.1,2.9l0,0c1.7,0,2.9-1.4,2.9-2.9V56.3c0-0.9-0.4-1.8-1-2.3C79.4,52.8,77.4,52.9,76.3,54.3z M75.6,69.2h-2.8 c-0.1,0-0.2-0.1-0.2-0.2V69l3-4.1C75.6,64.8,75.6,69.2,75.6,69.2z M67.5,56.4c0-1.6-1.3-2.9-2.8-2.9c-0.8,0-1.6,0.3-2.1,0.8 l-6.8,7.1c-0.1,0.1-0.2,0.1-0.3,0.1s-0.2,0-0.2-0.1l-6.8-7.1c-0.5-0.5-1.3-0.9-2.1-0.9c-1.6,0-2.8,1.3-2.8,2.8c0,0.7,0.3,1.5,0.7,2 l8.3,9.5l0.1,10c0,1.6,1.3,2.9,2.9,2.9c1.6,0,2.9-1.3,2.9-2.9l0.2-9.9l8.1-9.5C67.3,57.7,67.5,57,67.5,56.4z M32.4,53.4 c-7.5,0-13.6,6.1-13.6,13.6s6.1,13.6,13.6,13.6S46,74.4,46,66.9C46,59.6,39.9,53.5,32.4,53.4z M32.4,74.2c-4.1,0-7.3-3.2-7.3-7.3 s3.2-7.3,7.3-7.3s7.3,3.2,7.3,7.3C39.7,71,36.5,74.2,32.4,74.2z M175.9,52.8c-1.5,0.1-2.7,1.3-2.7,2.7v12.7c0,0.1-0.1,0.2-0.2,0.2 c-0.1,0-0.1,0-0.1-0.1l-7.4-13.1c-1.1-2-3.7-2.6-5.6-1.4c-1.1,0.7-1.9,2-2,3.3v20.8c0.1,1.7,1.6,2.9,3.1,2.8s2.7-1.3,2.8-2.8V65.2 c0-0.1,0.1-0.2,0.2-0.2s0.1,0,0.1,0.1l7.6,13.4c1,1.9,3.4,2.5,5.3,1.5c1.3-0.7,2-2,2-3.3V55.6C178.9,54,177.6,52.7,175.9,52.8z M14,69.5c2.4-1.5,4-4.1,3.9-6.9c0,0,0,0,0-0.1c0.1-4.9-3.9-9-8.8-9.1c-2.4-0.2-4.9,0.6-6.6,2.3C0.6,57.6,0,60,0,62.6l0.4,15.1 c0,1.6,1.3,2.9,2.9,2.9s2.9-1.3,2.9-2.9l0.1-7.2l0,0c0-0.2,0.1-0.3,0.3-0.3c0,0,0.1,0,0.2,0l7.1,9.7c0.5,0.5,1.1,0.7,1.9,0.7 c1.6,0,2.8-1.3,2.9-2.8c0-0.4-0.1-0.8-0.3-1.3L14,69.5z M8.9,65.3c-0.2,0-0.3,0-0.5,0c-1.7-0.1-2.8-1.6-2.7-3.1 c0.1-1.7,1.6-2.8,3.1-2.7c0.2,0,0.3,0,0.5,0c1.7,0.1,2.8,1.6,2.7,3.1C11.9,64.2,10.4,65.7,8.9,65.3z M129.8,71.5 c-0.4,0-0.9,0.1-1.4,0.3l-2.4,1.6c-1.1,0.7-2.5,1.1-3.9,1.1c-4.2-0.2-7.3-3.8-7.1-7.8c0.2-3.9,3.2-6.9,7.1-7.1 c1.4,0,2.7,0.4,3.9,1.1l2.3,1.6c0.4,0.2,0.8,0.3,1.4,0.3c1.6,0,2.9-1.3,2.9-2.9l0,0c0-0.6-0.2-1.4-0.7-1.9c-2.3-2.7-5.7-4.3-9.4-4.3 c-7.5,0-13.6,6.1-13.6,13.6l0,0c0,7.2,5.6,13.2,12.8,13.6c3.9,0,7.5-1.6,10.2-4.4c0.4-0.5,0.7-1.1,0.6-1.9 C132.8,72.8,131.4,71.5,129.8,71.5z M185.4,52.7c-1.8,0-3.1,1.5-3.1,3.1v21.9c0,1.8,1.5,3.1,3.1,3.1c1.8,0,3.1-1.5,3.1-3.1V55.8 C188.5,54.1,187.2,52.7,185.4,52.7z M139.9,54.2c-0.6-0.6-1.5-1-2.4-1c-1.8,0-3.1,0.8-3.1,2.6v21.9l0,0c0,1.7,1.4,2.9,3,2.9 s3-1.3,3.1-2.9v-2.4h7.5l3.1,4.2c0.5,0.7,1.5,1.1,2.4,1.1c1.7,0,2.9-1.4,2.9-2.9c0-0.6-0.2-1.3-0.6-1.8L139.9,54.2z M143.5,69 c0,0.1-0.1,0.2-0.2,0.2h-2.8v-4.5l3,4.2C143.6,68.9,143.6,68.9,143.5,69z M209.9,52.8c-1.5,0.1-2.7,1.3-2.7,2.7v12.7 c0,0.1-0.1,0.2-0.2,0.2c-0.1,0-0.1,0-0.2-0.1l-7.3-13.1c-1.1-2-3.7-2.6-5.6-1.4c-1.1,0.7-1.9,2-2,3.3v20.8c0,1.7,1.4,3,3,3 s3-1.4,3-3V65.2c0-0.1,0.1-0.2,0.2-0.2s0.1,0,0.1,0.1l7.6,13.4c1,1.9,3.4,2.5,5.3,1.5c1.3-0.7,2-2,2-3.3V55.6 C212.9,54,211.5,52.7,209.9,52.8z M220.7,55.3c0-0.1,0-0.1,0-0.2c0-0.8-0.6-1-1.3-1h-0.9c-0.3,0-0.4,0.2-0.4,0.3v2.7 c0,0.3,0.1,0.4,0.4,0.4s0.4-0.2,0.4-0.4v-1h0.2l0.5,1c0.1,0.2,0.2,0.4,0.5,0.4s0.4-0.1,0.4-0.3c0-0.1,0-0.1,0-0.2l-0.6-0.9 C220.3,56.2,220.7,55.7,220.7,55.3z M219.5,55.5h-0.6v-0.8h0.6c0.3,0,0.5,0.1,0.5,0.4S219.8,55.5,219.5,55.5z M219.4,52.6 L219.4,52.6c-1.8,0-3.2,1.5-3.2,3.2s1.5,3.2,3.2,3.2s3.2-1.5,3.2-3.2C222.5,54.1,221.1,52.6,219.4,52.6z M219.4,58.2L219.4,58.2 c-1.4,0-2.4-1-2.4-2.4s1-2.4,2.4-2.4s2.4,1,2.4,2.4C221.8,57.1,220.7,58.2,219.4,58.2z"
<path class="cls-1 rc-header__logo-crown" d="M132.7,38.8c-6.4-4.7-16-7.5-25.9-7.5s-19.6,2.8-25.9,7.5c-0.6,0.4-0.9,1.1-0.9,1.9c0,1.4,1,2.4,2.4,2.4l0,0 c0.5,0,1-0.2,1.5-0.5C88.2,39.4,96.5,36,107,36s18.7,3.4,23,6.6l0.1,0.1c1,0.7,2.6,0.5,3.3-0.6C134,41,133.8,39.5,132.7,38.8z M106.8,37c-9.2,0-17.9,2.7-23.3,7.2c0,0,0,0-0.1,0c-0.6,0.6-0.7,1.6-0.2,2.3c0.3,0.4,0.7,0.6,1.3,0.6c0.4,0,0.7-0.1,1-0.4 c4.8-4,12.8-6.5,21.2-6.5s16.3,2.4,21.2,6.5c0.7,0.6,1.8,0.5,2.3-0.2c0.6-0.7,0.5-1.8-0.2-2.3C124.6,39.8,115.9,37,106.8,37z M71.8,12.8L71.8,12.8L71.8,12.8L71.8,12.8z M77,19.7c0.7-2.9-1-5.8-4-6.7c-0.4-0.1-0.9-0.2-1.4-0.2c-3,0-5.4,2.4-5.4,5.4 s2.4,5.4,5.4,5.4C74.3,23.8,76.4,22.1,77,19.7z M106.8,28.1c3,0,5.4-2.4,5.4-5.4s-2.4-5.4-5.4-5.4s-5.4,2.4-5.4,5.4 S103.7,28.1,106.8,28.1z M106.8,14.3c3,0,5.4-2.4,5.4-5.4s-2.4-5.5-5.4-5.5s-5.4,2.4-5.4,5.4C101.3,11.9,103.7,14.3,106.8,14.3z M90.8,19.2C87.9,20,86.2,23.1,87,26c0.6,2.3,2.8,3.9,5.2,4h0.1c0.4,0,0.9-0.1,1.4-0.2c2.9-0.8,4.6-3.8,3.9-6.7 C97,20.7,94.8,19,92.3,19C91.7,19,91.3,19.1,90.8,19.2z M84,31.5c0.7-2.9-1-6-4-6.7c-0.4-0.1-0.9-0.2-1.4-0.2l0,0 c-0.9,0-1.9,0.3-2.8,0.7c-1.3,0.7-2.2,2-2.5,3.3c-0.4,1.5-0.2,2.9,0.6,4.2c0.9,1.7,2.7,2.6,4.7,2.7c0.9,0,2-0.2,2.8-0.7 C82.7,34.1,83.7,32.9,84,31.5z M119.9,29.7c0.5,0.1,0.9,0.2,1.5,0.2c3,0,5.4-2.5,5.4-5.4c0-2.5-1.7-4.6-4-5.2 c-0.5-0.1-0.9-0.2-1.5-0.2c-3,0-5.4,2.5-5.4,5.5C115.8,26.9,117.5,29.1,119.9,29.7z M123.5,16.5c0.4,0.1,0.9,0.2,1.5,0.2 c3,0,5.4-2.5,5.4-5.4c0-2.5-1.7-4.6-4-5.2c-0.5-0.1-0.9-0.2-1.5-0.2c-3,0-5.4,2.5-5.4,5.5C119.5,13.6,121.2,15.8,123.5,16.5z M137.7,25.4c-0.8-0.5-1.8-0.7-2.7-0.7c-3,0-5.4,2.4-5.4,5.4c0,0.4,0.1,0.9,0.2,1.4c0.3,1.4,1.3,2.6,2.5,3.3c2.6,1.6,6,0.6,7.5-2 c0.7-1.3,0.9-2.7,0.6-4.2C139.8,27.4,138.9,26.2,137.7,25.4z M147.2,17c-0.3-1.4-1.3-2.6-2.5-3.3c-2.6-1.6-6-0.6-7.5,2 c-0.7,1.3-0.9,2.7-0.6,4.2c0.3,1.4,1.3,2.6,2.5,3.3c2.6,1.6,6,0.7,7.5-1.9C147.4,19.9,147.6,18.2,147.2,17z M88.7,16.7L88.7,16.7 c0.5,0,1-0.1,1.5-0.2c2.9-0.8,4.6-3.9,3.9-6.7c-0.6-2.4-2.8-4-5.2-4c-0.5,0-0.9,0.1-1.5,0.2c-2.9,0.8-4.6,3.9-3.9,6.7 C84.1,15,86.2,16.7,88.7,16.7z" style="fill:#e2001a"></path> style="fill:#e2001a"
</svg> ></path>
</h1> <path
</a> class="cls-1 rc-header__logo-crown"
<ul class="rc-list rc-list--blank rc-list--inline rc-list--align rc-header__right" role="menubar"> d="M132.7,38.8c-6.4-4.7-16-7.5-25.9-7.5s-19.6,2.8-25.9,7.5c-0.6,0.4-0.9,1.1-0.9,1.9c0,1.4,1,2.4,2.4,2.4l0,0 c0.5,0,1-0.2,1.5-0.5C88.2,39.4,96.5,36,107,36s18.7,3.4,23,6.6l0.1,0.1c1,0.7,2.6,0.5,3.3-0.6C134,41,133.8,39.5,132.7,38.8z M106.8,37c-9.2,0-17.9,2.7-23.3,7.2c0,0,0,0-0.1,0c-0.6,0.6-0.7,1.6-0.2,2.3c0.3,0.4,0.7,0.6,1.3,0.6c0.4,0,0.7-0.1,1-0.4 c4.8-4,12.8-6.5,21.2-6.5s16.3,2.4,21.2,6.5c0.7,0.6,1.8,0.5,2.3-0.2c0.6-0.7,0.5-1.8-0.2-2.3C124.6,39.8,115.9,37,106.8,37z M71.8,12.8L71.8,12.8L71.8,12.8L71.8,12.8z M77,19.7c0.7-2.9-1-5.8-4-6.7c-0.4-0.1-0.9-0.2-1.4-0.2c-3,0-5.4,2.4-5.4,5.4 s2.4,5.4,5.4,5.4C74.3,23.8,76.4,22.1,77,19.7z M106.8,28.1c3,0,5.4-2.4,5.4-5.4s-2.4-5.4-5.4-5.4s-5.4,2.4-5.4,5.4 S103.7,28.1,106.8,28.1z M106.8,14.3c3,0,5.4-2.4,5.4-5.4s-2.4-5.5-5.4-5.5s-5.4,2.4-5.4,5.4C101.3,11.9,103.7,14.3,106.8,14.3z M90.8,19.2C87.9,20,86.2,23.1,87,26c0.6,2.3,2.8,3.9,5.2,4h0.1c0.4,0,0.9-0.1,1.4-0.2c2.9-0.8,4.6-3.8,3.9-6.7 C97,20.7,94.8,19,92.3,19C91.7,19,91.3,19.1,90.8,19.2z M84,31.5c0.7-2.9-1-6-4-6.7c-0.4-0.1-0.9-0.2-1.4-0.2l0,0 c-0.9,0-1.9,0.3-2.8,0.7c-1.3,0.7-2.2,2-2.5,3.3c-0.4,1.5-0.2,2.9,0.6,4.2c0.9,1.7,2.7,2.6,4.7,2.7c0.9,0,2-0.2,2.8-0.7 C82.7,34.1,83.7,32.9,84,31.5z M119.9,29.7c0.5,0.1,0.9,0.2,1.5,0.2c3,0,5.4-2.5,5.4-5.4c0-2.5-1.7-4.6-4-5.2 c-0.5-0.1-0.9-0.2-1.5-0.2c-3,0-5.4,2.5-5.4,5.5C115.8,26.9,117.5,29.1,119.9,29.7z M123.5,16.5c0.4,0.1,0.9,0.2,1.5,0.2 c3,0,5.4-2.5,5.4-5.4c0-2.5-1.7-4.6-4-5.2c-0.5-0.1-0.9-0.2-1.5-0.2c-3,0-5.4,2.5-5.4,5.5C119.5,13.6,121.2,15.8,123.5,16.5z M137.7,25.4c-0.8-0.5-1.8-0.7-2.7-0.7c-3,0-5.4,2.4-5.4,5.4c0,0.4,0.1,0.9,0.2,1.4c0.3,1.4,1.3,2.6,2.5,3.3c2.6,1.6,6,0.6,7.5-2 c0.7-1.3,0.9-2.7,0.6-4.2C139.8,27.4,138.9,26.2,137.7,25.4z M147.2,17c-0.3-1.4-1.3-2.6-2.5-3.3c-2.6-1.6-6-0.6-7.5,2 c-0.7,1.3-0.9,2.7-0.6,4.2c0.3,1.4,1.3,2.6,2.5,3.3c2.6,1.6,6,0.7,7.5-1.9C147.4,19.9,147.6,18.2,147.2,17z M88.7,16.7L88.7,16.7 c0.5,0,1-0.1,1.5-0.2c2.9-0.8,4.6-3.9,3.9-6.7c-0.6-2.4-2.8-4-5.2-4c-0.5,0-0.9,0.1-1.5,0.2c-2.9,0.8-4.6,3.9-3.9,6.7 C84.1,15,86.2,16.7,88.7,16.7z"
<li class="rc-list__item rc-inline-flex" role="menubar"> style="fill:#e2001a"
<a href="https://weibo.com/chinaroyalcanin?topnav=1&wvr=6&topsug=1&is_all=1" target='_blank' class="rc-lg-up rc-btn rc-btn--icon rc-icon ts-weibo--xs rc-iconography rc-interactive" aria-label="weibo"> ></path>
<span class="rc-screen-reader-text"> </svg>
微博 </h1>
</span> </a>
</a> <ul class="rc-list rc-list--blank rc-list--inline rc-list--align rc-header__right" role="menubar">
<a href="javascript:;" onmouseenter='bindTracking(this)' evt-name='页内弹窗' evt-cat='headerBtnClick' evt-val='微信扫一扫' class="rc-lg-up rc-btn rc-btn--icon rc-icon ts-wechat--xs rc-iconography rc-interactive" aria-label="wechat"> <li class="rc-list__item rc-inline-flex" role="menubar">
<span class="rc-screen-reader-text"> <a
微信 href="https://weibo.com/chinaroyalcanin?topnav=1&wvr=6&topsug=1&is_all=1"
</span> target="_blank"
<div class="ts-hover-show"> class="rc-lg-up rc-btn rc-btn--icon rc-icon ts-weibo--xs rc-iconography rc-interactive"
<span class="rc-text--center">微信扫一扫</span> aria-label="weibo"
<img src="../assets/showimage/royalcanincn-qrcode.jpg"> >
</div> <span class="rc-screen-reader-text">微博</span>
</a> </a>
<a
<a class="rc-xl-up rc-btn rc-btn--icon rc-icon ts-login--xs rc-iconography rc-interactive" aria-label="login" @click="turnlogin"> href="javascript:;"
<span class="rc-screen-reader-text"> onmouseenter="bindTracking(this)"
个人中心 evt-name="页内弹窗"
</span> evt-cat="headerBtnClick"
<em class="rc-screen-reader" v-show="loginornot"></em> evt-val="微信扫一扫"
</a> class="rc-lg-up rc-btn rc-btn--icon rc-icon ts-wechat--xs rc-iconography rc-interactive"
aria-label="wechat"
<!-- >
<span class="rc-screen-reader-text">微信</span>
<div class="ts-hover-show">
<span class="rc-text--center">微信扫一扫</span>
<img src="../assets/showimage/royalcanincn-qrcode.jpg" />
</div>
</a>
<a class="rc-xl-up rc-btn rc-btn--icon rc-icon ts-login--xs rc-iconography rc-interactive" aria-label="login" @click="turnlogin">
<span class="rc-screen-reader-text">个人中心</span>
<em class="rc-screen-reader" v-show="loginornot"></em>
</a>
<!--
<button href="#" onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='headerBtnClick' evt-val='地理位置选择' class="rc-btn rc-btn--icon rc-icon rc-language--xs rc-iconography rc-interactive rc-md-up" aria-label="language" data-modal-trigger="country-lang-selector" role="menuitem"> <button href="#" onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='headerBtnClick' evt-val='地理位置选择' class="rc-btn rc-btn--icon rc-icon rc-language--xs rc-iconography rc-interactive rc-md-up" aria-label="language" data-modal-trigger="country-lang-selector" role="menuitem">
<span class="rc-screen-reader-text"> <span class="rc-screen-reader-text">
Language Language
</span> </span>
</button> </button>
--> -->
<button
<button data-js-trigger="search-bar" @click='searchturn' evt-name='页内弹窗' evt-cat='headerBtnClick' evt-val='全文搜索' class="rc-btn rc-btn--icon rc-icon rc-search--xs rc-iconography rc-interactive" aria-label="Search" role="menuitem" data-click-modifier=".rc-hidden"> data-js-trigger="search-bar"
<span class="rc-screen-reader-text">translations.feature.headerbar.search</span> @click="searchturn"
</button> evt-name="页内弹窗"
</li> evt-cat="headerBtnClick"
</ul> evt-val="全文搜索"
class="rc-btn rc-btn--icon rc-icon rc-search--xs rc-iconography rc-interactive"
</nav> aria-label="Search"
<nav class="rc-header__nav rc-header__nav--secondary rc-md-up" data-component="nav-track" data-nav-name="Header navigation"> role="menuitem"
<!-- Menu section--> data-click-modifier=".rc-hidden"
<div class="rc-container"> >
<ul class="rc-list rc-list--blank rc-list--inline rc-list--align rc-header__center"> <span class="rc-screen-reader-text">translations.feature.headerbar.search</span>
<li class="rc-list__item"> </button>
<a href="https://royalcanin.com.cn/cats" class="rc-list__header" data-ref="nav-link" role="menuitem" title="猫">猫</a> </li>
</li> </ul>
<li class="rc-list__item"> </nav>
<a href="https://royalcanin.com.cn/dogs" class="rc-list__header" data-ref="nav-link" role="menuitem" title="犬">犬</a> <nav class="rc-header__nav rc-header__nav--secondary rc-md-up" data-component="nav-track" data-nav-name="Header navigation">
</li> <!-- Menu section-->
<li class="rc-list__item"> <div class="rc-container">
<a href="/productdetails/productlist/" class="rc-list__header" data-ref="nav-link" role="menuitem" title="官方商城">官方商城</a> <ul class="rc-list rc-list--blank rc-list--inline rc-list--align rc-header__center">
</li> <li class="rc-list__item"><a href="https://royalcanin.com.cn/cats" class="rc-list__header" data-ref="nav-link" role="menuitem" title="猫">猫</a></li>
<li class="rc-list__item"> <li class="rc-list__item"><a href="https://royalcanin.com.cn/dogs" class="rc-list__header" data-ref="nav-link" role="menuitem" title="犬">犬</a></li>
<a href="https://royalcanin.com.cn/about" class="rc-list__header" data-ref="nav-link" role="menuitem" title="关于我们">关于我们</a> <li class="rc-list__item">
</li> <a href="/productdetails/productlist/" class="rc-list__header" data-ref="nav-link" role="menuitem" title="官方商城">官方商城</a>
</ul> </li>
<div class="submenu rc-layout-container rc-one-column rc-margin--none rc-xl-up"> <li class="rc-list__item">
<!-- Sub menu --> <a href="https://royalcanin.com.cn/about" class="rc-list__header" data-ref="nav-link" role="menuitem" title="关于我们">关于我们</a>
<div class="rc-full-width rc-max-width--xl rc-padding--sm"> </li>
<ul class="rc-list rc-list--blank rc-list--align ts-list--four-column" role="menubar"> </ul>
<li class="rc-list__item rc-list__item--group"> <div class="submenu rc-layout-container rc-one-column rc-margin--none rc-xl-up">
<!-- Sub menu -->
<img src="../assets/showimage/sub-nav-1.jpg" class="ts-head-img rc-margin-bottom--xs"> <div class="rc-full-width rc-max-width--xl rc-padding--sm">
<a href="https://royalcanin.com.cn/cats" class="rc-list__header rc-margin--none" role="menuitem">猫</a> <ul class="rc-list rc-list--blank rc-list--align ts-list--four-column" role="menubar">
<ul class="rc-list rc-list--blank rc-list--align test" role="menu"> <li class="rc-list__item rc-list__item--group">
<li class="rc-list__item"> <img src="../assets/showimage/sub-nav-1.jpg" class="ts-head-img rc-margin-bottom--xs" />
<a href="/productdetails/productlist/?stype=0" class="rc-list__link" role="menuitem">产品</a> <a href="https://royalcanin.com.cn/cats" class="rc-list__header rc-margin--none" role="menuitem">猫</a>
</li> <ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item"> <li class="rc-list__item"><a href="/productdetails/productlist/?stype=0" class="rc-list__link" role="menuitem">产品</a></li>
<a href="https://royalcanin.com.cn/cats/breeds" class="rc-list__link" role="menuitem">品种</a> <li class="rc-list__item"><a href="https://royalcanin.com.cn/cats/breeds" class="rc-list__link" role="menuitem">品种</a></li>
</li> <li class="rc-list__item"><a href="https://royalcanin.com.cn/cats/getting-a-kitten" class="rc-list__link" role="menuitem">想养猫吗</a></li>
<li class="rc-list__item"> <li class="rc-list__item"><a href="https://royalcanin.com.cn/cats/kitten" class="rc-list__link" role="menuitem">幼猫</a></li>
<a href="https://royalcanin.com.cn/cats/getting-a-kitten" class="rc-list__link" role="menuitem">想养猫吗</a> <li class="rc-list__item"><a href="https://royalcanin.com.cn/cats/kitten/health" class="rc-list__link" role="menuitem">健康和心情</a></li>
</li> </ul>
<li class="rc-list__item"> </li>
<a href="https://royalcanin.com.cn/cats/kitten" class="rc-list__link" role="menuitem">幼猫</a> <li class="rc-list__item rc-list__item--group">
</li> <img src="../assets/showimage/sub-nav-2.jpg" class="ts-head-img rc-margin-bottom--xs" />
<li class="rc-list__item"> <a href="https://royalcanin.com.cn/dogs" class="rc-list__header rc-margin--none" role="menuitem">犬</a>
<a href="https://royalcanin.com.cn/cats/kitten/health" class="rc-list__link" role="menuitem">健康和心情</a> <ul class="rc-list rc-list--blank rc-list--align test" role="menu">
</li> <li class="rc-list__item"><a href="/productdetails/productlist/?stype=1" class="rc-list__link" role="menuitem">产品</a></li>
</ul> <li class="rc-list__item"><a href="https://royalcanin.com.cn/dogs/breeds" class="rc-list__link" role="menuitem">品种</a></li>
</li> <li class="rc-list__item"><a href="https://royalcanin.com.cn/dogs/getting-a-puppy" class="rc-list__link" role="menuitem">想养只狗</a></li>
<li class="rc-list__item rc-list__item--group"> <li class="rc-list__item"><a href="https://royalcanin.com.cn/dogs/puppy" class="rc-list__link" role="menuitem">幼犬</a></li>
<img src="../assets/showimage/sub-nav-2.jpg" class="ts-head-img rc-margin-bottom--xs"> <li class="rc-list__item"><a href="https://royalcanin.com.cn/dogs/puppy/health" class="rc-list__link" role="menuitem">健康和心情</a></li>
<a href="https://royalcanin.com.cn/dogs" class="rc-list__header rc-margin--none" role="menuitem">犬</a> </ul>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu"> </li>
<li class="rc-list__item"> <li class="rc-list__item rc-list__item--group">
<a href="/productdetails/productlist/?stype=1" class="rc-list__link" role="menuitem">产品</a> <img src="../assets/showimage/sub-nav-3.jpg" class="ts-head-img rc-margin-bottom--xs" />
</li> <a href="/productdetails/productlist/" class="rc-list__header rc-margin--none" role="menuitem">官方商城</a>
<li class="rc-list__item"> <ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<a href="https://royalcanin.com.cn/dogs/breeds" class="rc-list__link" role="menuitem">品种</a> <li class="rc-list__item"><a href="/productdetails/productlist/?stype=0" class="rc-list__link" role="menuitem">猫系列</a></li>
</li> <li class="rc-list__item"><a href="/productdetails/productlist/?stype=1" class="rc-list__link" role="menuitem">狗系列</a></li>
<li class="rc-list__item"> </ul>
<a href="https://royalcanin.com.cn/dogs/getting-a-puppy" class="rc-list__link" role="menuitem">想养只狗</a> </li>
</li> <li class="rc-list__item rc-list__item--group">
<li class="rc-list__item"> <img src="../assets/showimage/sub-nav-4.jpg" class="ts-head-img rc-margin-bottom--xs" />
<a href="https://royalcanin.com.cn/dogs/puppy" class="rc-list__link" role="menuitem">幼犬</a> <a href="https://royalcanin.com.cn/about" class="rc-list__header rc-margin--none" role="menuitem">关于我们</a>
</li> <ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item"> <li class="rc-list__item"><a href="https://royalcanin.com.cn/about#growth-phase1" class="rc-list__link" role="menuitem">我们的历史</a></li>
<a href="https://royalcanin.com.cn/dogs/puppy/health" class="rc-list__link" role="menuitem">健康和心情</a> <li class="rc-list__item"><a href="https://royalcanin.com.cn/about" class="rc-list__link" role="menuitem">我们的价值观</a></li>
</li> <!--
</ul>
</li>
<li class="rc-list__item rc-list__item--group">
<img src="../assets/showimage/sub-nav-3.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="/productdetails/productlist/" class="rc-list__header rc-margin--none" role="menuitem">官方商城</a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item">
<a href="/productdetails/productlist/?stype=0" class="rc-list__link" role="menuitem">猫系列</a>
</li>
<li class="rc-list__item">
<a href="/productdetails/productlist/?stype=1" class="rc-list__link" role="menuitem">狗系列</a>
</li>
</ul>
</li>
<li class="rc-list__item rc-list__item--group">
<img src="../assets/showimage/sub-nav-4.jpg" class="ts-head-img rc-margin-bottom--xs">
<a href="https://royalcanin.com.cn/about" class="rc-list__header rc-margin--none" role="menuitem">关于我们</a>
<ul class="rc-list rc-list--blank rc-list--align test" role="menu">
<li class="rc-list__item">
<a href="https://royalcanin.com.cn/about#growth-phase1" class="rc-list__link" role="menuitem">我们的历史</a>
</li>
<li class="rc-list__item">
<a href="https://royalcanin.com.cn/about" class="rc-list__link" role="menuitem">我们的价值观</a>
</li>
<!--
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#about/future" class="rc-list__link" role="menuitem">可持续发展</a> <a href="#about/future" class="rc-list__link" role="menuitem">可持续发展</a>
</li> </li>
@ -165,123 +153,126 @@
<a href="#about/frequently-asked-questions" class="rc-list__link" role="menuitem">常见问题解答</a> <a href="#about/frequently-asked-questions" class="rc-list__link" role="menuitem">常见问题解答</a>
</li> </li>
--> -->
</ul> </ul>
</li> </li>
</ul> </ul>
</div> </div>
<!-- Sub menu end --> <!-- Sub menu end -->
</div> </div>
</div> </div>
<!-- Menu section end--> <!-- Menu section end-->
</nav> </nav>
</header>
</header>
<!-- Popup menu -->
<!-- Popup menu --> <div data-js-modal-menu>
<div data-js-modal-menu> <header class="rc-modal__header rc-md-up">
<header class="rc-modal__header rc-md-up"> <button class="rc-modal__close rc-btn rc-btn--icon-label rc-icon rc-close--xs rc-iconography" data-modal-trigger="main-nav-modal">关闭</button>
<button class="rc-modal__close rc-btn rc-btn--icon-label rc-icon rc-close--xs rc-iconography" data-modal-trigger="main-nav-modal">关闭</button> <a href="/">
<a href="/"> <span class="rc-screen-reader-text">Royal Canin Logo</span>
<span class="rc-screen-reader-text">Royal Canin Logo</span> <object id="main-logo" data="/images/logo--crown.svg?v=8-11-2" type="image/svg+xml" class="rc-modal__logo" data-js-import-interactive-svg>
<object id="main-logo" data="/images/logo--crown.svg?v=8-11-2" type="image/svg+xml" class="rc-modal__logo" data-js-import-interactive-svg> <img src="/images/1x1.gif" style="background-image: url(/images/logo--crown.png?v=8-11-2)" width="150" height="100" alt="Royal Canin logo" />
<img src="/images/1x1.gif" style="background-image: url(/images/logo--crown.png?v=8-11-2)" width="150" height="100" alt="Royal Canin logo" /> </object>
</object> </a>
</a> </header>
</header> <section class="rc-max-width--xl">
<section class="rc-max-width--xl"> <div class="rc-column rc-lg-up rc-padding--lg">
<div class="rc-column rc-lg-up rc-padding--lg"> <h1 class="rc-gamma rc-padding-x--md">帮助猫狗过最健康的生活。</h1>
<h1 class="rc-gamma rc-padding-x--md">帮助猫狗过最健康的生活。</h1> <img class="rc-padding--sm" src="/images/yorkshire-terrier-sacred-birman-b-w-brand-emblematic-tailored-nutrition-hero.jpg" alt="Royal Canin China" />
<img class="rc-padding--sm" src="/images/yorkshire-terrier-sacred-birman-b-w-brand-emblematic-tailored-nutrition-hero.jpg" alt="Royal Canin China" /> </div>
</div> <nav class="rc-nav rc-hidden" data-toggle-group="mobile" data-toggle-effect="rc-expand--horizontal" data-js-target="mobile-push-nav">
<nav class="rc-nav rc-hidden" data-toggle-group="mobile" data-toggle-effect="rc-expand--horizontal" data-js-target="mobile-push-nav"> <div class="rc-layout-container rc-three-column">
<div class="rc-layout-container rc-three-column"> <div class="rc-column rc-double-width rc-padding-x--none--mobile rc-padding-right--none">
<div class="rc-column rc-double-width rc-padding-x--none--mobile rc-padding-right--none"> <ul class="rc-list rc-list--blank rc-list--align rc-list--two-column" role="menubar">
<ul class="rc-list rc-list--blank rc-list--align rc-list--two-column" role="menubar"> <li class="rc-list__item rc-list__item--group">
<li class="rc-list__item rc-list__item--group"> <a href="https://royalcanin.com.cn/cats" class="rc-list__header" id="mega-nav-header-1" data-toggle="nav-list-1" role="menuitem">猫</a>
<a href="https://royalcanin.com.cn/cats" class="rc-list__header" id="mega-nav-header-1" data-toggle="nav-list-1" role="menuitem">猫</a> <ul class="rc-list rc-list--blank rc-list--align" id="nav-list-1" aria-labelledby="mega-nav-menu-1" role="menu">
<ul class="rc-list rc-list--blank rc-list--align" id="nav-list-1" aria-labelledby="mega-nav-menu-1" role="menu"> <li class="rc-list__item rc-md-down">
<li class="rc-list__item rc-md-down"> <button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-1" role="button">返回</button>
<button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-1" role="button">返回</button> </li>
</li> <li class="rc-list__item rc-md-down">
<li class="rc-list__item rc-md-down"> <a href="https://royalcanin.com.cn/cats" class="rc-list__header" title="Cat" role="menuitem">猫</a>
<a href="https://royalcanin.com.cn/cats" class="rc-list__header" title="Cat" role="menuitem">猫</a> </li>
</li> <li class="rc-list__item">
<li class="rc-list__item"> <a href="/productdetails/productlist/?stype=0" class="rc-list__link ca" role="menuitem" title="Products">产品</a>
<a href="/productdetails/productlist/?stype=0" class="rc-list__link ca" role="menuitem" title="Products">产品</a> </li>
</li> <li class="rc-list__item">
<li class="rc-list__item"> <a href="https://royalcanin.com.cn/cats/breeds" class="rc-list__link ca" role="menuitem" title="Breeds">品种</a>
<a href="https://royalcanin.com.cn/cats/breeds" class="rc-list__link ca" role="menuitem" title="Breeds">品种</a> </li>
</li> <li class="rc-list__item">
<li class="rc-list__item"> <a href="https://royalcanin.com.cn/cats/getting-a-kitten" class="rc-list__link ca" role="menuitem" title="Thinking of getting a cat">
<a href="https://royalcanin.com.cn/cats/getting-a-kitten" class="rc-list__link ca" role="menuitem" title="Thinking of getting a cat">想养只猫</a> 想养只猫
</li> </a>
<li class="rc-list__item"> </li>
<a href="https://royalcanin.com.cn/cats/kitten" class="rc-list__link ca" role="menuitem" title="Kitten">幼猫</a> <li class="rc-list__item">
</li> <a href="https://royalcanin.com.cn/cats/kitten" class="rc-list__link ca" role="menuitem" title="Kitten">幼猫</a>
<li class="rc-list__item"> </li>
<a href="https://royalcanin.com.cn/cats/kitten/health" class="rc-list__link ca" role="menuitem" title="Health and wellbeing">健康和心情</a> <li class="rc-list__item">
</li> <a href="https://royalcanin.com.cn/cats/kitten/health" class="rc-list__link ca" role="menuitem" title="Health and wellbeing">
</ul> 健康和心情
</li> </a>
</li>
<li class="rc-list__item rc-list__item--group"> </ul>
<a href="https://royalcanin.com.cn/dogs" class="rc-list__header" role="menuitem" id="mega-nav-header-2" data-toggle="nav-list-2">犬</a> </li>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-list-2" aria-labelledby="mega-nav-menu-2" role="menu">
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-list__item--group">
<button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-2" role="button">返回</button> <a href="https://royalcanin.com.cn/dogs" class="rc-list__header" role="menuitem" id="mega-nav-header-2" data-toggle="nav-list-2">犬</a>
</li> <ul class="rc-list rc-list--blank rc-list--align" id="nav-list-2" aria-labelledby="mega-nav-menu-2" role="menu">
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<a href="https://royalcanin.com.cn/dogs" class="rc-list__header" title="Dog" role="menuitem">犬</a> <button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-2" role="button">返回</button>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item rc-md-down">
<a href="/productdetails/productlist/?stype=1" class="rc-list__link ca" role="menuitem" title="Products">产品</a> <a href="https://royalcanin.com.cn/dogs" class="rc-list__header" title="Dog" role="menuitem">犬</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="https://royalcanin.com.cn/dogs/breeds" class="rc-list__link ca" role="menuitem" title="Breeds">品种</a> <a href="/productdetails/productlist/?stype=1" class="rc-list__link ca" role="menuitem" title="Products">产品</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="https://royalcanin.com.cn/dogs/getting-a-puppy" class="rc-list__link ca" role="menuitem" title="Thinking of getting a dog">想养只犬</a> <a href="https://royalcanin.com.cn/dogs/breeds" class="rc-list__link ca" role="menuitem" title="Breeds">品种</a>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item">
<a href="https://royalcanin.com.cn/dogs/puppy" class="rc-list__link ca" role="menuitem" title="Puppy">幼犬</a> <a href="https://royalcanin.com.cn/dogs/getting-a-puppy" class="rc-list__link ca" role="menuitem" title="Thinking of getting a dog">
</li> 想养只犬
<li class="rc-list__item"> </a>
<a href="https://royalcanin.com.cn/dogs/puppy/health" class="rc-list__link ca" role="menuitem" title="Health and wellbeing">健康和心情</a> </li>
</li> <li class="rc-list__item">
</ul> <a href="https://royalcanin.com.cn/dogs/puppy" class="rc-list__link ca" role="menuitem" title="Puppy">幼犬</a>
</li> </li>
<li class="rc-list__item">
<li class="rc-list__item rc-list__item--group"> <a href="https://royalcanin.com.cn/dogs/puppy/health" class="rc-list__link ca" role="menuitem" title="Health and wellbeing">
<a href="/productdetails/productlist/" class="rc-list__header" role="menuitem" id="mega-nav-header-3" data-toggle="nav-list-3">官方商城</a> 健康和心情
<ul class="rc-list rc-list--blank rc-list--align" id="nav-list-3" aria-labelledby="mega-nav-menu-3" role="menu"> </a>
<li class="rc-list__item rc-md-down"> </li>
<button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-3" role="button">返回</button> </ul>
</li> </li>
<li class="rc-list__item rc-md-down">
<a href="/productdetails/productlist/" class="rc-list__header" title="Nutrition" role="menuitem">官方商城</a> <li class="rc-list__item rc-list__item--group">
</li> <a href="/productdetails/productlist/" class="rc-list__header" role="menuitem" id="mega-nav-header-3" data-toggle="nav-list-3">官方商城</a>
<li class="rc-list__item"> <ul class="rc-list rc-list--blank rc-list--align" id="nav-list-3" aria-labelledby="mega-nav-menu-3" role="menu">
<a href="/productdetails/productlist/?stype=0" class="rc-list__link ca" role="menuitem">猫系列</a> <li class="rc-list__item rc-md-down">
</li> <button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-3" role="button">返回</button>
<li class="rc-list__item"> </li>
<a href="/productdetails/productlist/?stype=1" class="rc-list__link ca" role="menuitem">狗系列</a> <li class="rc-list__item rc-md-down">
</li> <a href="/productdetails/productlist/" class="rc-list__header" title="Nutrition" role="menuitem">官方商城</a>
</ul> </li>
</li> <li class="rc-list__item"><a href="/productdetails/productlist/?stype=0" class="rc-list__link ca" role="menuitem">猫系列</a></li>
<li class="rc-list__item"><a href="/productdetails/productlist/?stype=1" class="rc-list__link ca" role="menuitem">狗系列</a></li>
<li class="rc-list__item rc-list__item--group"> </ul>
<a href="https://royalcanin.com.cn/about" class="rc-list__header" role="menuitem" id="mega-nav-header-4" data-toggle="nav-list-4">关于我们</a> </li>
<ul class="rc-list rc-list--blank rc-list--align" id="nav-list-4" aria-labelledby="mega-nav-menu-4" role="menu">
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-list__item--group">
<button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-4" role="button">返回</button> <a href="https://royalcanin.com.cn/about" class="rc-list__header" role="menuitem" id="mega-nav-header-4" data-toggle="nav-list-4">关于我们</a>
</li> <ul class="rc-list rc-list--blank rc-list--align" id="nav-list-4" aria-labelledby="mega-nav-menu-4" role="menu">
<li class="rc-list__item rc-md-down"> <li class="rc-list__item rc-md-down">
<a href="https://royalcanin.com.cn/about" class="rc-list__header" title="About" role="menuitem">关于我们</a> <button class="rc-list__link rc-icon rc-left--xs rc-iconography" data-toggle="nav-list-4" role="button">返回</button>
</li> </li>
<li class="rc-list__item"> <li class="rc-list__item rc-md-down">
<a href="https://royalcanin.com.cn/about#growth-phase1" class="rc-list__link ca" role="menuitem" title="Our history">我们的历史</a> <a href="https://royalcanin.com.cn/about" class="rc-list__header" title="About" role="menuitem">关于我们</a>
</li> </li>
<!-- <li class="rc-list__item">
<a href="https://royalcanin.com.cn/about#growth-phase1" class="rc-list__link ca" role="menuitem" title="Our history">我们的历史</a>
</li>
<!--
<li class="rc-list__item"> <li class="rc-list__item">
<a href="#about" class="rc-list__link ca" role="menuitem" title="Our values">我们的价值观</a> <a href="#about" class="rc-list__link ca" role="menuitem" title="Our values">我们的价值观</a>
</li> </li>
@ -298,131 +289,164 @@
<a href="#about/frequently-asked-questions" class="rc-list__link ca" role="menuitem" title="FAQs">常见问题解答</a> <a href="#about/frequently-asked-questions" class="rc-list__link ca" role="menuitem" title="FAQs">常见问题解答</a>
</li> </li>
--> -->
</ul> </ul>
</li> </li>
</ul> </ul>
</div>
<div class="rc-column rc-padding-x--none">
<ul class="rc-list rc-list--blank rc-list--align rc-btn-offset--top" role="menu">
<li class="rc-list__item">
<a class="rc-list__link rc-icon ts-login--xs rc-iconography--xs" role="menuitem" @click="turnlogin">
个人中心
<em class="rc-screen-reader" v-show="loginornot"></em>
</a>
</li>
<li class="rc-list__item">
<a class="rc-list__link rc-icon rc-email--xs rc-iconography--xs" role="menuitem" href="https://royalcanin.com.cn/about/contact">
与我们联系
</a>
</li>
<li class="rc-list__item">
<a class="rc-list__link rc-icon rc-language--xs ts-weibo--xs" role="menuitem" target='_blank' href="https://weibo.com/chinaroyalcanin?topnav=1&wvr=6&topsug=1&is_all=1">
微博
</a>
</li>
<li class="rc-list__item">
<a onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='mobNavBtnClick' evt-val='微信扫一扫' class="rc-list__link rc-icon ts-wechat--xs rc-iconography--xs" role="menuitem" href="#">
微信公众号
<div class="ts-hover-show">
<span class="rc-text--center">微信长按识别</span>
<img src="../assets/showimage/royalcanincn-qrcode.jpg">
</div> </div>
</a>
</li> <div class="rc-column rc-padding-x--none">
<!-- <ul class="rc-list rc-list--blank rc-list--align rc-btn-offset--top" role="menu">
<li class="rc-list__item">
<a class="rc-list__link rc-icon ts-login--xs rc-iconography--xs" role="menuitem" @click="turnlogin">
个人中心
<em class="rc-screen-reader" v-show="loginornot"></em>
</a>
</li>
<li class="rc-list__item">
<a class="rc-list__link rc-icon rc-email--xs rc-iconography--xs" role="menuitem" href="https://royalcanin.com.cn/about/contact">与我们联系</a>
</li>
<li class="rc-list__item">
<a
class="rc-list__link rc-icon rc-language--xs ts-weibo--xs"
role="menuitem"
target="_blank"
href="https://weibo.com/chinaroyalcanin?topnav=1&wvr=6&topsug=1&is_all=1"
>
微博
</a>
</li>
<li class="rc-list__item">
<a
onclick="bindTracking(this)"
evt-name="页内弹窗"
evt-cat="mobNavBtnClick"
evt-val="微信扫一扫"
class="rc-list__link rc-icon ts-wechat--xs rc-iconography--xs"
role="menuitem"
href="#"
>
微信公众号
<div class="ts-hover-show">
<span class="rc-text--center">微信长按识别</span>
<img src="../assets/showimage/royalcanincn-qrcode.jpg" />
</div>
</a>
</li>
<!--
<li class="rc-list__item"> <li class="rc-list__item">
<a onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='mobNavBtnClick' evt-val='地理位置选择' class="rc-list__link rc-icon rc-language--xs rc-iconography--xs" role="menuitem" aria-label="language" data-modal-trigger="country-lang-selector" href="#"> <a onclick='bindTracking(this)' evt-name='页内弹窗' evt-cat='mobNavBtnClick' evt-val='地理位置选择' class="rc-list__link rc-icon rc-language--xs rc-iconography--xs" role="menuitem" aria-label="language" data-modal-trigger="country-lang-selector" href="#">
Language Language
</a> </a>
</li> </li>
--> -->
</ul> </ul>
</div> </div>
</div>
</div> </nav>
</nav> </section>
</section> </div>
<!-- Popup menu end-->
</div> </div>
<!-- Popup menu end-->
</div>
</template> </template>
<script> <script>
import { mapMutations } from "vuex"; import { mapMutations, mapState } from 'vuex';
export default { export default {
data() { data() {
return { return {
headerScroll:false, headerScroll: false,
loginornot:false,//用户是否登录提示点 loginornot: false, //用户是否登录提示点
usermessage:null,//存储用户信息 usermessage: null, //存储用户信息
}; };
},
created(){
},
mounted() {
this.checkIsLogin();
let usernot=this.$store.state.userInfo;
//console.log(usernot);
if(usernot){
window._hmt.push(['_setUserId', usernot.data.mobile]);
this.loginornot=false
}else{
this.loginornot=true
this.usermessage=usernot;
}
if(isInitialized)
location.reload();
if(!isInitialized)
isInitialized=true;
},
methods: {
...mapMutations(["checkIsLogin"]),
refreshDesktopNav:function(){
RCDL.navigation.currentState=null;
RCDL.navigation.rebuild();
}, },
refreshMobileNav:function(){ computed: {
let itemGroupList=document.querySelectorAll("nav[data-toggle-group=mobile] .rc-list--align[role=menu]"); ...mapState({
itemGroupList.forEach(function(ele,i){ loginState: state => state.login.loginState,
if(ele.className.indexOf("rc-expand--horizontal")<0 && ele.className.indexOf("rc-btn-offset--top")<0) userInfo: state => state.user.userInfo
{
if(ele.id.indexOf("nav-list")>=0)
ele.classList.add("rc-expand--horizontal");
else if(ele.id.indexOf("nav-footer")>=0)
ele.classList.add("rc-expand--vertical");
}
}) })
}, },
bindTracking: function(){ created() {},
//console.log('bindTracking'); watch: {
userInfo(newVal) {
/* 判断是否登录 */
if (newVal && this.loginState) {
this.loginornot = false;
window._hmt.push(['_setUserId', newVal.mobile]);
} else {
this.loginornot = true;
this.usermessage = newVal;
}
}
},
mounted() {
/* 判断是否登录 */
this.$store.dispatch('checkLoginState', this);
if (this.userInfo && this.loginState) {
this.loginornot = false;
window._hmt.push(['_setUserId', this.userInfo.mobile]);
} else {
this.loginornot = true;
this.usermessage = this.userInfo;
}
console.log('22222show');
// this.refreshMobileNav();
/* 全局刷新 */
if (isInitialized) location.reload();
if (!isInitialized) isInitialized = true;
return false;
/* 用户信息存储旧版 测试完成可删除 开始 */
// this.checkIsLogin();
// let usernot=this.$store.state.userInfo;
// if(usernot){
// window._hmt.push(['_setUserId', usernot.data.mobile]);
// this.loginornot=false
// }else{
// this.loginornot=true
// this.usermessage=usernot;
// }
/* 用户信息存储旧版 测试完成可删除 结束 */
}, },
// methods: {
//跳转搜索 ...mapMutations(['checkIsLogin']),
searchturn(){ refreshDesktopNav: function() {
this.$router.push({ name: "usersearch-search",}) RCDL.navigation.currentState = null;
}, RCDL.navigation.rebuild();
//判断有无登录跳转不同页面 },
turnlogin(){ refreshMobileNav: function() {
let userInfo = this.$store.state.userInfo; let itemGroupList = document.querySelectorAll('nav[data-toggle-group=mobile] .rc-list--align[role=menu]');
if(!userInfo){ itemGroupList.forEach(function(ele, i) {
this.$router.push({ if (ele.className.indexOf('rc-expand--horizontal') < 0 && ele.className.indexOf('rc-btn-offset--top') < 0) {
name: "userlogin-login", if (ele.id.indexOf('nav-list') >= 0) ele.classList.add('rc-expand--horizontal');
params:{} else if (ele.id.indexOf('nav-footer') >= 0) ele.classList.add('rc-expand--vertical');
}) }
}else{ });
this.$router.push({ },
name: "personal-mypersonal", bindTracking: function() {
}) //console.log('bindTracking');
},
//
//跳转搜索
searchturn() {
this.$router.push({ name: 'usersearch-search' });
},
//判断有无登录跳转不同页面
turnlogin() {
// let userInfo = this.$store.state.userInfo; //以前的用户判断
let userInfo = this.userInfo;
if (!userInfo) {
this.$router.push({
name: 'userlogin-login',
params: {}
});
} else {
this.$router.push({
name: 'personal-mypersonal'
});
}
} }
} }
},
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped></style>
</style>

159
rc-busness/components/unlogin.vue
View File

@ -1,86 +1,99 @@
<template> <template>
<div class="rc-login"> <div class="rc-login">
<div class="userunlogin" v-show="userunlogin" @click="userlogin"> <div class="userunlogin" v-show="userunlogin" @click="userlogin">
<div class="user-left"> <div class="user-left">
<img src="../assets/image/rc-people.png" alt=""> <img src="../assets/image/rc-people.png" alt="" />
<span> <span>登录/注册</span>
登录/注册
</span>
</div>
<div class="user-right">
<img src="../assets/image/rc-left.png" alt="">
</div> </div>
<div class="user-right"><img src="../assets/image/rc-left.png" alt="" /></div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { mapState } from 'vuex';
export default { export default {
data(){ data() {
return{ return {
userunlogin:false, userunlogin: false
};
} },
}, methods: {
methods:{ //用户登录
//用户登录 userlogin() {
userlogin(){ this.$router.push({
this.$router.push({ path: '/userlogin/login',
path: "/userlogin/login", query: {
query: { stype: 1
stype: 1, }
}, });
}); },
}, /* 初始化数据 */
}, initData(){
mounted(){ //获取缓存是否登录
//获取缓存是否登录 let islogin = this.userInfo;
let islogin=JSON.parse(localStorage.getItem("userInfo")); // // console.log(islogin);
console.log(islogin); // if (islogin == null) {
if(islogin==null){ // this.userunlogin = true;
this.userunlogin=true; // console.log(this.userunlogin);
console.log(this.userunlogin); // }
} if (islogin == null || islogin == undefined) {
if(islogin==null ||islogin==undefined){ this.userunlogin = true;
this.userunlogin=true }else{
} this.userunlogin = false;
} }
} }
},
mounted() {
this.initData();
},
computed:{
...mapState({
userInfo : state => state.user.userInfo,
})
},
watch: {
userInfo(newVal){
if(newVal){
this.initData();
}
}
}
};
</script> </script>
<style lang="less" scoped > <style lang="less" scoped>
.rc-login{ .rc-login {
width: 92%; width: 92%;
margin: 0 auto; margin: 0 auto;
margin-top: 0.70rem; margin-top: 0.7rem;
.userunlogin{ .userunlogin {
width: 100%; width: 100%;
height: 0.60rem; height: 0.6rem;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
.user-left{ .user-left {
display: flex; display: flex;
align-items: center; align-items: center;
img{ img {
width: 0.16rem; width: 0.16rem;
height: 0.16rem; height: 0.16rem;
display: block; display: block;
} }
span{ span {
color: #444444; color: #444444;
font-size: 0.16rem; font-size: 0.16rem;
margin-left: 0.06rem; margin-left: 0.06rem;
} }
} }
.user-right{ .user-right {
img{ img {
width: 0.08rem; width: 0.08rem;
height: 0.16rem; height: 0.16rem;
display: block; display: block;
} }
} }
}
}
} }
</style> </style>

19
rc-busness/config/async/fetch.js
View File

@ -1,6 +1,7 @@
import { import {
baseUrl baseUrl
} from './env' } from './env';
export default async(url = '', data = {}, type = 'GET', method = 'fetch') => { export default async(url = '', data = {}, type = 'GET', method = 'fetch') => {
type = type.toUpperCase() type = type.toUpperCase()
@ -18,16 +19,18 @@ export default async(url = '', data = {}, type = 'GET', method = 'fetch') => {
url = url + '?' + dataStr url = url + '?' + dataStr
} }
} }
if (fetch && method === 'fetch') { if (fetch && method === 'fetch') {
let token=''; let token='';
if(process.client) { if(process.client) {
let tokenStr = localStorage.getItem("userInfo"); token = localStorage.getItem("token");
if(tokenStr){ // let tokenStr = localStorage.getItem("userInfo");
tokenStr = JSON.parse(tokenStr); // if(tokenStr){
if(tokenStr && tokenStr.xaccessToken) // tokenStr = JSON.parse(tokenStr);
token=tokenStr.xaccessToken; // if(tokenStr && tokenStr.xaccessToken)
} // token=tokenStr.xaccessToken;
// }
} }
let requestConfig = { let requestConfig = {
method: type, method: type,

4
rc-busness/nuxt.config.js
View File

@ -57,7 +57,7 @@ export default {
'@/plugins/swiper', '@/plugins/swiper',
'@/plugins/ElementUI', '@/plugins/ElementUI',
{ src: '@/plugins/localStorage', ssr: false }, { src: '@/plugins/localStorage', ssr: false },
'@/plugins/until/common',
], ],
@ -73,7 +73,7 @@ export default {
modules: [ modules: [
'@nuxtjs/axios', '@nuxtjs/axios',
['nuxt-tailvue', {toast: true}], ['nuxt-tailvue', {toast: true}],
'cookie-universal-nuxt',
], ],
styleResources: { styleResources: {

1
rc-busness/package.json
View File

@ -17,6 +17,7 @@
"dependencies": { "dependencies": {
"@nuxtjs/axios": "^5.13.6", "@nuxtjs/axios": "^5.13.6",
"amfe-flexible": "^2.2.1", "amfe-flexible": "^2.2.1",
"cookie-universal-nuxt": "^2.1.5",
"core-js": "^3.15.1", "core-js": "^3.15.1",
"element-ui": "^2.15.6", "element-ui": "^2.15.6",
"ip": "^1.1.5", "ip": "^1.1.5",

15
rc-busness/pages/index.vue
View File

@ -1043,7 +1043,7 @@ import Myheader from "~/components/header.vue";
import FixRight from "~/components/fixed-right.vue"; import FixRight from "~/components/fixed-right.vue";
import Myfooter from "~/components/rc-footer.vue"; import Myfooter from "~/components/rc-footer.vue";
import unlogin from "~/components/unlogin.vue"; import unlogin from "~/components/unlogin.vue";
import { mapMutations } from "vuex"; import { mapMutations,mapState } from "vuex";
import envData from "~/config/env-data.js"; import envData from "~/config/env-data.js";
import { import {
userquery, userquery,
@ -1354,11 +1354,22 @@ export default {
FixRight, FixRight,
// userswiper // userswiper
}, },
created() { computed: {
...mapState({
loginState : state => state.login.loginState,
userInfo : state => state.user.userInfo,
})
},
async created() {
vm = this; vm = this;
let curEnv = process.env.NODE_ENV; let curEnv = process.env.NODE_ENV;
this.catlistvideo = envData[curEnv].catlistvideo; this.catlistvideo = envData[curEnv].catlistvideo;
this.doglistvideo = envData[curEnv].doglistvideo; this.doglistvideo = envData[curEnv].doglistvideo;
/* 判断是否登录 */
await this.$store.dispatch('checkLoginState',this);
if(this.loginState && !this.userInfo){
this.$store.dispatch('getUserInfo',this);
}
}, },
watch: {}, watch: {},
mounted() { mounted() {

1558
rc-busness/pages/myorder/userrecord.vue
View File

File diff suppressed because it is too large Load Diff

815
rc-busness/pages/myorder/usertion.vue
View File

@ -1,444 +1,429 @@
<template> <template>
<div class="user-main"> <div class="user-main">
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="rc-top"></div>
<div class="rc-main" v-for="(item, index) in goldmedal" :key="item.id"> <div class="rc-main" v-for="(item, index) in goldmedal" :key="item.id">
<div class="online bold"> <div class="online bold"></div>
</div> <div class="rc-receiving useruantity">
<div class="rc-receiving useruantity"> <em>{{ item.status == '0' ? '待付款' : item.status == '1' ? '待收货' : item.status == '2' ? '已完成' : item.status == '3' ? '已取消' : '异常订单' }}</em>
<em>{{ <span>{{ orderstatus }}</span>
item.status == "0" </div>
? "待付款" <div class="online bold"></div>
: item.status == "1" <div class="delivery useruantity" v-if="isshow">
? "待收货" <div class="to-delivery">
: item.status == "2" <img src="../../static/images/delivery.png" alt="" />
? "已完成" <span>{{ trackingstates }}</span>
: item.status == "3" <!-- <i>2021-1-21</i> -->
? "已取消" </div>
: "异常订单" <div class="bo-delivery">
}}</em> <!-- <span> 广州天河—刘某某【15124617917】正在派送中</span> -->
<span>{{ orderstatus }}</span> <!-- {{ logisticsCompany }} -->
</div> </div>
<div class="online bold"></div> <div class="viewdetails">
<div class="delivery useruantity" v-if="isshow"> <span>查看详情</span>
<div class="to-delivery"> <img :src="leftico" alt="" />
<img src="../../static/images/delivery.png" alt=""> </div>
<span>{{ trackingstates }}</span> </div>
<!-- <i>2021-1-21</i> --> <div class="online bold" v-if="isshow"></div>
</div> <div class="mypersonal useruantity">
<div class="bo-delivery"> <div class="my-delivery">
<!-- <span> 广州天河—刘某某【15124617917】正在派送中</span> --> <span>{{ item.addressUserName }}</span>
<!-- {{ logisticsCompany }} --> <i>{{ item.addressPhoneNumber }}</i>
</div> </div>
<div class="viewdetails"> <div class="per-delivery">
<span>查看详情</span> <span>{{ item.addressProvinceName }}{{ item.addressCityName }}{{ item.addressCountyName }}</span>
<img :src="leftico" alt="" /> </div>
</div> </div>
</div> <div class="online bold"></div>
<div class="online bold" v-if="isshow"> <div>
</div> <div class="rc-center">
<div class="mypersonal useruantity"> <div class="rc-usermain useruantity" v-for="(userlist, index) in item.orderDetailList" :key="index">
<div class="my-delivery"> <div class="rc-image"><img :src="userlist.picFile" alt="" /></div>
<span>{{ item.addressUserName }}</span> <div class="rc-right">
<i>{{ item.addressPhoneNumber }}</i> <div class="rc-usercenter">
</div> <em>{{ userlist.productName }}</em>
<div class="per-delivery"> <div class="rc-userright">
<span <span>规格:{{ userlist.specifications }}</span>
>{{ item.addressProvinceName }}{{ item.addressCityName </div>
}}{{ item.addressCountyName }}</span </div>
> <div class="rc-userbottom">
</div> <span>数量:{{ userlist.pcs }}件</span>
</div> <i>￥{{ userlist.ecPrice }}</i>
<div class="online bold"></div> </div>
<div> <!-- <div class="rc-userbottomm">
<div class="rc-center">
<div
class="rc-usermain useruantity"
v-for="(userlist, index) in item.orderDetailList"
:key="index"
>
<div class="rc-image">
<img :src="userlist.picFile" alt="" />
</div>
<div class="rc-right">
<div class="rc-usercenter">
<em>{{ userlist.productName }}</em>
<div class="rc-userright">
<span>规格:{{ userlist.specifications }}</span>
</div>
</div>
<div class="rc-userbottom">
<span>数量:{{ userlist.pcs }}件</span>
<i>￥{{ userlist.ecPrice }}</i>
</div>
<!-- <div class="rc-userbottomm">
<i>￥{{ item.userprice }}</i> <i>￥{{ item.userprice }}</i>
<span>{{ item.orderstype }}</span> <span>{{ item.orderstype }}</span>
<i>￥{{ item.userprice }}</i> <i>￥{{ item.userprice }}</i>
</div> --> </div> -->
</div> </div>
</div> </div>
<div class="online bold"></div> <div class="online bold"></div>
</div> </div>
<div class="rc-merchandise "> <div class="rc-merchandise ">
<div class="rc-merchandise "> <div class="rc-merchandise ">
<ul> <ul>
<li> <li>
<span>商品总价:</span> <span>商品总价:</span>
<i>￥{{ item.salesAmount }}</i> <i>￥{{ item.salesAmount }}</i>
</li> </li>
<li> <li>
<span>配送费用:</span> <span>配送费用:</span>
<i>{{ shopprice.distribution }}</i> <i>{{ shopprice.distribution }}</i>
</li> </li>
<li> <li>
<span>活动促销:</span> <span>活动促销:</span>
<i>{{ shopprice.promotion }}</i> <i>{{ shopprice.promotion }}</i>
</li> </li>
<li> <li>
<span>实际付款:</span> <span>实际付款:</span>
<i>{{ shopprice.payment }}</i> <i>{{ shopprice.payment }}</i>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
<div class="rc-payment"> <div class="rc-payment">
<div class="rc-payment"> <div class="rc-payment">
<ul> <ul>
<li> <li>
<span>订单编号:</span> <span>订单编号:</span>
<i>{{ item.orderNumber }}</i> <i>{{ item.orderNumber }}</i>
</li> </li>
<li> <li>
<span>下单时间:</span> <span>下单时间:</span>
<i>{{ logisticsDate }}</i> <i>{{ logisticsDate }}</i>
</li> </li>
<li> <li>
<span>付款方式:</span> <span>付款方式:</span>
<i>{{ information.paytypeText }}</i> <i>{{ information.paytypeText }}</i>
</li> </li>
<li> <li>
<span>配送方式:</span> <span>配送方式:</span>
<i>{{ information.distribution }}</i> <i>{{ information.distribution }}</i>
</li> </li>
<li> <li>
<span>快递单号:</span> <span>快递单号:</span>
<div class="u-trackingnumber"> <div class="u-trackingnumber">
<i>{{ logisticsNumber }} </i> <i>{{ logisticsNumber }}</i>
<!-- <img :src="information.catimage" alt=""> --> <!-- <img :src="information.catimage" alt=""> -->
</div> </div>
</li> </li>
</ul> </ul>
</div> </div>
<div class="rc-foot"> <div class="rc-foot">
<div class="rc-foo"> <div class="rc-foo">
<div style=""> <div style="">
<i>合计金额:</i> <i>合计金额:</i>
<em>￥{{ usersalesAmount }}</em> <em>￥{{ usersalesAmount }}</em>
</div> </div>
<div class="rc-md-up ts-button-container rc-padding-y--md"> <div class="rc-md-up ts-button-container rc-padding-y--md">
<span class="ts-standard-btn ts-standard-btn--two" @click="userpay(item)">{{ customer }}</span> <span class="ts-standard-btn ts-standard-btn--two" @click="userpay(item)">{{ customer }}</span>
<span class="ts-standard-btn" @click="onceagain(item)"> {{ payorsucess }}</span> <span class="ts-standard-btn" @click="onceagain(item)">{{ payorsucess }}</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="rc-full-width rc-md-down ts-button-container rc-padding-y--md rc-margin-top--md"> <div class="rc-full-width rc-md-down ts-button-container rc-padding-y--md rc-margin-top--md">
<span class="ts-standard-btn ts-standard-btn--two" @click="userpay(item)">{{ customer }}</span> <span class="ts-standard-btn ts-standard-btn--two" @click="userpay(item)">{{ customer }}</span>
<i <i class="ts-standard-btn" @click="onceagain()">{{ payorsucess }}</i>
class="ts-standard-btn" </div>
@click="onceagain()"
> <el-dialog :visible.sync="showPaytypeWarning" :close-on-click-modal="false">
{{ payorsucess }} <div class="ts-warning-popup">
</i> <div class="title rc-full-width"><img src="../../assets/error.png" alt="" /></div>
</div> <div class="content rc-full-width rc-text--center rc-margin-y--md">
<h3>温馨提示</h3>
<el-dialog :visible.sync="showPaytypeWarning" :close-on-click-modal="false"> <span class="">{{ paytypeWarning.message }}</span>
<div class="ts-warning-popup"> </div>
<div class="title rc-full-width"> </div>
<img src="../../assets/error.png" alt="" /> </el-dialog>
</div> <MyFooter></MyFooter>
<div class="content rc-full-width rc-text--center rc-margin-y--md"> </div>
<h3>温馨提示</h3>
<span class="">{{ paytypeWarning.message}}</span>
</div>
</div>
</el-dialog>
<MyFooter></MyFooter>
</div>
</template> </template>
<script> <script>
import Myheader from "~/components/header.vue"; import Myheader from '~/components/header.vue';
import { mapMutations } from "vuex"; import { mapMutations, mapState } from 'vuex';
import MyFooter from "~/components/rc-footer.vue"; import MyFooter from '~/components/rc-footer.vue';
import Vue from "vue"; import Vue from 'vue';
let vm = new Vue(); let vm = new Vue();
import formatConversion from "../../static/js/date"; import formatConversion from '../../static/js/date';
import { import { userin, selectaddress, canceldanhao, generateOrderWX, repayOrde } from '../../ajax/getData';
userin,
selectaddress,
canceldanhao,
generateOrderWX,
repayOrde
} from "../../ajax/getData";
import util from "@/ajax/util"; import util from '@/ajax/util';
export default { export default {
data() { data() {
return { return {
util, util,
paytypeWarning:{result:true,message:''}, paytypeWarning: { result: true, message: '' },
showPaytypeWarning:false, showPaytypeWarning: false,
goldmedal: [], goldmedal: [],
userproductId: "", userproductId: '',
logisticsDate: "", logisticsDate: '',
addressPhoneNumber: "", addressPhoneNumber: '',
userphone: "",
logisticsNumber: "", logisticsNumber: '',
customer: "", //联系客服或者取消订单 customer: '', //联系客服或者取消订单
payorsucess: "", //立即支付或者再次购买， payorsucess: '', //立即支付或者再次购买，
addressUserName: "", addressUserName: '',
logisticsCompany: "", //物流公司 logisticsCompany: '', //物流公司
orderstatus: "", orderstatus: '',
goldastates: "", goldastates: '',
userisdelivery: "待收货", userisdelivery: '待收货',
userdelivery: "派送中", userdelivery: '派送中',
isshow: true, isshow: true,
usersalesAmount: "", usersalesAmount: '',
leftico: require("../../assets/image/rc-left.png"), leftico: require('../../assets/image/rc-left.png'),
orderNumber: "", orderNumber: '',
userdata: "", // userdata: '',
usermessage: null, // usermessage: null,
userid: null, // userid: null,
trackingstates: "", //运输状态 // userphone: '',
useralllist: [], trackingstates: '', //运输状态
delivery: [], useralllist: [],
delivery: [],
useraddress: [], useraddress: [],
shopprice: {}, shopprice: {},
information: { information: {
paytypeText: "", paytypeText: '',
distribution: "快递", distribution: '快递',
catimage: require("../../assets/image/rc-left.png"), catimage: require('../../assets/image/rc-left.png')
}, }
}; };
}, },
methods: { methods: {
...mapMutations(["checkIsLogin"]), ...mapMutations(['checkIsLogin']),
refreshDesktopNav: function () { refreshDesktopNav: function() {
RCDL.navigation.currentState = null; RCDL.navigation.currentState = null;
RCDL.navigation.rebuild(); RCDL.navigation.rebuild();
}, },
//取消订单 //取消订单
async canceldanhao(orderNumber) { async canceldanhao(orderNumber) {
let data = await canceldanhao(this.userphone, this.orderNumber); let data = await canceldanhao(this.userphone, this.orderNumber);
if (data) { if (data) {
this.$message({ this.$message({
type: "warning", type: 'warning',
message: "取消订单成功", message: '取消订单成功'
}); });
setTimeout(() => { setTimeout(() => {
this.$router.push({ this.$router.push({
path: "/personal/useraddress", path: '/personal/useraddress',
query: { query: {
stype: 1, stype: 1
}, }
}); });
}, 500); }, 500);
} }
}, },
userpay() { userpay() {
if (this.goldastates == 0) { if (this.goldastates == 0) {
if(confirm('确认要取消该订单嘛？')) { if (confirm('确认要取消该订单嘛？')) {
this.canceldanhao(); this.canceldanhao();
} }
} else if ((this.customer = "联系客服申请售后")) { } else if ((this.customer = '联系客服申请售后')) {
var option = { var option = {
customer: { customer: {
id: "", id: '',
name: "", name: '',
email: "", email: '',
mobile: "", mobile: '',
memberId: this.userdata.data.id, memberId: this.userdata.id
}, }
}; };
dis_livchat(option); dis_livchat(option);
} }
}, },
//订单支付和再次购买 //订单支付和再次购买
onceagain(item) { onceagain(item) {
this.paytypeWarning = this.util.checkPaytypeValidated(this.paytype); this.paytypeWarning = this.util.checkPaytypeValidated(this.paytype);
this.showPaytypeWarning = !this.paytypeWarning.result; this.showPaytypeWarning = !this.paytypeWarning.result;
if(this.paytypeWarning.result) { if (this.paytypeWarning.result) {
if (this.payorsucess == "立即支付") { if (this.payorsucess == '立即支付') {
this.getwei(item); this.getwei(item);
} else {
_hmt.push([
'_trackCustomEvent',
'order_repay',
{
status: 'fail'
}
]);
this.$router.push({
path: '/productdetails/producted',
query: {
stype: 1,
productCode: this.userproductId
}
});
}
}
},
async orderquantity(orderNumber) {
let data = await userin(orderNumber);
if (data) {
this.goldmedal = data;
for (let i = 0; i < this.goldmedal.length; i++) {
this.goldastates = this.goldmedal[i].status;
this.userproductId = this.goldmedal[i].orderDetailList[0].productId;
this.logisticsNumber = this.goldmedal[i].orderDetailList[0].logisticsNumber; //物流单号
this.trackingstates = this.goldmedal[i].orderDetailList[0].status; //运输状态
if (this.trackingstates == 0) {
this.trackingstates = '运输中';
} else if (this.trackingstates == 1) {
this.trackingstates = '已签收';
} else if (this.trackingstates == 2) {
this.trackingstates = '未发货';
}
this.logisticsDate = this.formatConversion(this.goldmedal[i].orderDate); //时间戳
this.logisticsCompany = this.goldmedal[i].orderDetailList[0].logisticsCompany; //物流公司
this.orderNumber = this.goldmedal[i].orderNumber;
this.usersalesAmount = this.goldmedal[i].salesAmount;
this.addressUserName = this.goldmedal[i].addressUserName;
this.addressPhoneNumber = this.goldmedal[i].addressPhoneNumber;
this.paytype = this.goldmedal[i].paytype;
this.information.paytypeText = this.util.getTextByPaytype(this.paytype);
this.updateButtonByOrderStatus(this.goldmedal[i].status);
}
}
},
//订单立即支付
async getwei(user) {
let data = await this.repayOrde(this.orderNumber);
let loginedUser = this.$store.state.userInfo;
if (data.code == 1) {
let userPayData = {
userprice: this.usersalesAmount,
orderId: this.orderNumber,
userinformation: this.addressUserName + ' ' + this.addressPhoneNumber,
wxPay: data.msg
};
_hmt.push([
'_trackCustomEvent',
'order_repay',
{
status: 'success',
member_id: loginedUser.data.id
}
]);
this.$router.push({
path: '/personal/userpay',
query: {
userData: this.orderNumber,
stype: 1,
userPayData: JSON.stringify(userPayData)
}
});
} else { } else {
_hmt.push([ _hmt.push([
"_trackCustomEvent", '_trackCustomEvent',
"order_repay", 'order_repay',
{ {
"status":"fail", status: 'fail - ' + this.orderNumber,
} member_id: loginedUser.data.id
]) }
this.$router.push({ ]);
path: "/productdetails/producted", this.$message({
query: { type: 'error',
stype: 1, message: '订单数据错误，请联系客服进行处理'
productCode: this.userproductId,
},
}); });
} }
} },
}, async repayOrde(ordernumber) {
async orderquantity(orderNumber) { let payType = this.util.pickPaytype();
let data = await userin(orderNumber); let res = await repayOrde(ordernumber, payType);
if (data) { if (res) {
this.goldmedal = data; return res;
for (let i = 0; i < this.goldmedal.length; i++) { }
this.goldastates = this.goldmedal[i].status; },
this.userproductId = this.goldmedal[i].orderDetailList[0].productId; async editaddress(user) {
this.logisticsNumber = // user.data.id=844350;
this.goldmedal[i].orderDetailList[0].logisticsNumber; //物流单号 let data = await selectaddress(this.userid);
this.trackingstates = this.goldmedal[i].orderDetailList[0].status; //运输状态 let list = [];
if (this.trackingstates == 0) { this.useraddress = data.data;
this.trackingstates = "运输中"; for (let i = 0; i < this.useraddress.length; i++) {
} else if (this.trackingstates == 1) { if (this.useraddress[i].isDefault == true) {
this.trackingstates = "已签收"; list.push(this.useraddress[i]);
} else if (this.trackingstates == 2) { }
this.trackingstates = "未发货"; }
this.useraddress = list;
console.log(this.useraddress[0].recipient);
// console.log(this.list);
},
updateButtonByOrderStatus(status) {
if (status == 2) {
this.orderstatus = '您的订单已完成';
this.isshow = false;
this.userisdelivery = '待发货';
this.customer = '联系客服申请售后';
this.payorsucess = '再次购买';
} else if (status == 0) {
this.orderstatus = '您的订单还未付款，请尽快付款！';
this.isshow = false;
this.userisdelivery = '待付款';
this.customer = '取消订单';
this.payorsucess = '立即支付';
} else if (status == 1) {
this.orderstatus = '您的订单已发出，请耐心等候。';
this.isshow = true;
this.userisdelivery = '待收货';
this.customer = '联系客服申请售后';
this.payorsucess = '再次购买';
} else if (status == 3) {
this.orderstatus = '您的订单已取消！';
this.isshow = false;
this.userisdelivery = '已取消';
this.customer = '联系客服申请售后';
this.payorsucess = '再次购买';
}
},
resetData(){
if(this.userdata && this.loginState){
this.editaddress(this.userid);
this.orderNumber = this.$route.query.orderNumber;
this.orderquantity(this.orderNumber);
} }
this.logisticsDate = this.formatConversion(
this.goldmedal[i].orderDate
); //时间戳
this.logisticsCompany = this.goldmedal[i].orderDetailList[0].logisticsCompany; //物流公司
this.orderNumber = this.goldmedal[i].orderNumber;
this.usersalesAmount = this.goldmedal[i].salesAmount;
this.addressUserName = this.goldmedal[i].addressUserName;
this.addressPhoneNumber = this.goldmedal[i].addressPhoneNumber;
this.paytype = this.goldmedal[i].paytype;
this.information.paytypeText = this.util.getTextByPaytype(this.paytype);
this.updateButtonByOrderStatus(this.goldmedal[i].status);
}
}
},
//订单立即支付
async getwei(user) {
let data = await this.repayOrde(this.orderNumber);
let loginedUser = this.$store.state.userInfo;
if(data.code==1) {
let userPayData = {
userprice: this.usersalesAmount,
orderId: this.orderNumber,
userinformation: this.addressUserName + " " + this.addressPhoneNumber,
wxPay:data.msg
};
_hmt.push([
"_trackCustomEvent",
"order_repay",
{
"status":"success",
"member_id": loginedUser.data.id
}
])
this.$router.push({
path: "/personal/userpay",
query: {
userData: this.orderNumber,
stype: 1,
userPayData: JSON.stringify(userPayData),
},
});
} else {
_hmt.push([
"_trackCustomEvent",
"order_repay",
{
"status":"fail - " + this.orderNumber,
"member_id": loginedUser.data.id
}
])
this.$message({
type: "error",
message: "订单数据错误，请联系客服进行处理",
});
}
},
async repayOrde(ordernumber) {
let payType = this.util.pickPaytype();
let res = await repayOrde(ordernumber, payType);
if (res) {
return res;
} }
}, },
async editaddress(user) { mounted() {
// user.data.id=844350; this.resetData();
let data = await selectaddress(this.userid); return false;
let list = []; // this.checkIsLogin();
this.useraddress = data.data; // this.userdata = this.$store.state.userInfo;
for (let i = 0; i < this.useraddress.length; i++) { // this.usermessage = JSON.parse(localStorage.getItem('userInfo'));
if (this.useraddress[i].isDefault == true) { // this.userid = this.usermessage.data.id;
list.push(this.useraddress[i]); // this.userphone = this.usermessage.data.mobile;
} // this.editaddress(this.userid);
} // this.orderNumber = this.$route.query.orderNumber;
this.useraddress = list; // this.orderquantity(this.orderNumber);
console.log(this.useraddress[0].recipient); },
components: {
// console.log(this.list); Myheader,
}, MyFooter
updateButtonByOrderStatus(status){ },
if (status == 2) { computed : {
this.orderstatus = "您的订单已完成"; ...mapState({
this.isshow = false; userdata : state => state.user.userInfo,
this.userisdelivery = "待发货"; usermessage : state => state.user.userInfo,
this.customer = "联系客服申请售后"; userid : state => state.user.userInfo.id,
this.payorsucess = "再次购买"; userphone : state => state.user.userInfo.mobile,
} else if (status == 0) { loginState : state => state.login.loginState,
this.orderstatus = "您的订单还未付款，请尽快付款！"; })
this.isshow = false; },
this.userisdelivery = "待付款"; watch : {
this.customer = "取消订单"; userdata(){
this.payorsucess = "立即支付"; this.resetData();
} else if (status == 1) {
this.orderstatus = "您的订单已发出，请耐心等候。";
this.isshow = true;
this.userisdelivery = "待收货";
this.customer = "联系客服申请售后";
this.payorsucess = "再次购买";
} else if (status == 3) {
this.orderstatus = "您的订单已取消！";
this.isshow = false;
this.userisdelivery = "已取消";
this.customer = "联系客服申请售后";
this.payorsucess = "再次购买";
} }
} }
},
mounted() {
this.checkIsLogin();
this.userdata = this.$store.state.userInfo;
this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
this.userid = this.usermessage.data.id;
this.userphone = this.usermessage.data.mobile;
this.editaddress(this.userid);
this.orderNumber = this.$route.query.orderNumber;
this.orderquantity(this.orderNumber);
},
components: {
Myheader,
MyFooter,
},
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@import url("../../assets/css/usertion.less"); @import url('../../assets/css/usertion.less');
</style> </style>

471
rc-busness/pages/personal/discount.vue
View File

@ -1,275 +1,264 @@
<template> <template>
<div class="allmain"> <div class="allmain">
<Myheader></Myheader>
<Myheader></Myheader> <!-- <tabs></tabs> -->
<!-- <tabs></tabs> --> <div class="rc-top"></div>
<div class="rc-top"></div> <tabs :crumbs="crumbs"></tabs>
<tabs :crumbs="crumbs"></tabs> <div class="rc-usermain">
<div class="rc-usermain"> <div class="rc rc-column">
<span v-for="(item, index) in discountlist" :key="index" @click="selectGoods(item, index)" :class="activeIndex == index ? 'active' : 'unactive'">
<div class="rc rc-column"> {{ item.title }}
<span </span>
v-for="(item, index) in discountlist" <!-- <span @click="tanchu()">弹出</span> -->
:key="index"
@click="selectGoods(item, index)"
:class="activeIndex == index ? 'active' : 'unactive'"
>
{{ item.title }}
</span>
<!-- <span @click="tanchu()">弹出</span> -->
</div>
<div class="online bold"></div>
<div class="rs-dis">
<div class="ts-no-data" v-if="!newlist.length">
暂未发现相关记录
</div> </div>
<div <div class="online bold"></div>
class="rc-discount"
v-for="(item, index) in newlist"
:key="index"
>
<img :src="userimage" alt="" />
<div class="rc-contair">
<div class="rc-left" ref="userleft" id="userleft" :style='usercolor'>
<div>
<i v-if="(item.couponTypeId!='4' && item.couponAmount>0)">
￥
</i>
<span>
{{ item.couponAmount?item.couponAmount:(parseInt(10 - item.discount*10)+'折') }}
</span>
</div>
<strong>{{ item.couponName }}</strong>
</div>
<div class="rc-right">
<i :style='usercolor'>
{{ item.couponDesc }}
</i>
<div class="rc-userfont" :style="(item.validTo?'visibility:visible':'visibility:hidden')">
<strong>有效期</strong>
<span>{{item.validFrom}}</span>
<span>至</span>
<em>{{item.validTo}}</em>
</div>
<nuxt-link :to="`/productdetails/productlist`" v-if="item.canUse">
<div class="ts-standard-btn">
立即使用
</div>
</nuxt-link>
</div>
<div class="rs-dis">
</div> <div class="ts-no-data" v-if="!newlist.length">暂未发现相关记录</div>
</div> <div class="rc-discount" v-for="(item, index) in newlist" :key="index">
</div> <img :src="userimage" alt="" />
</div> <div class="rc-contair">
</div> <div class="rc-left" ref="userleft" id="userleft" :style="usercolor">
<div>
<i v-if="item.couponTypeId != '4' && item.couponAmount > 0">￥</i>
<span>{{ item.couponAmount ? item.couponAmount : parseInt(10 - item.discount * 10) + '折' }}</span>
</div>
<strong>{{ item.couponName }}</strong>
</div>
<div class="rc-right">
<i :style="usercolor">{{ item.couponDesc }}</i>
<div class="rc-userfont" :style="item.validTo ? 'visibility:visible' : 'visibility:hidden'">
<strong>有效期</strong>
<span>{{ item.validFrom }}</span>
<span>至</span>
<em>{{ item.validTo }}</em>
</div>
<nuxt-link :to="`/productdetails/productlist`" v-if="item.canUse"><div class="ts-standard-btn">立即使用</div></nuxt-link>
</div>
</div>
</div>
</div>
</div>
</div>
</template> </template>
<script> <script>
import {allConfig,getdraw} from "../../ajax/getData"; import { allConfig, getdraw } from '../../ajax/getData';
import tabs from "@/components/tabs.vue"; import tabs from '@/components/tabs.vue';
import { mapMutations } from "vuex"; import { mapMutations, mapState } from 'vuex';
const EXPIRED = 2; const EXPIRED = 2;
const UNUSE = 0; const UNUSE = 0;
const USED = 1; const USED = 1;
export default { export default {
async asyncData (context) { async asyncData(context) {},
},
data() { data() {
return { return {
crumbs:[ crumbs: [
{ {
path:'/personal/mypersonal/', path: '/personal/mypersonal/'
}, },
{ {
path:'/personal/discount/', path: '/personal/discount/'
} }
], ],
userload: true, userload: true,
pastdue: false, pastdue: false,
unused: false, unused: false,
usercolor:{color:'#e1001a'}, usercolor: { color: '#e1001a' },
usermessage:[], usermessage: [],
userstates:0, userstates: 0,
userimage: require("../../assets/image/unused.png"), userimage: require('../../assets/image/unused.png'),
fullCouponList:[], fullCouponList: [],
newlist: [], newlist: [],
discountlist: [ discountlist: [
{ {
title: "未使用", title: '未使用'
}, },
{ {
title: "已使用", title: '已使用'
}, },
{ {
title: "已过期", title: '已过期'
}, }
], ],
preferential: [ preferential: [
{ {
price: "30", price: '30',
pricestype: "新客优惠券", pricestype: '新客优惠券',
special: "全场每满299-30", special: '全场每满299-30',
period: "有效期", period: '有效期',
starttime: "2021.11.29-2022.01.28", starttime: '2021.11.29-2022.01.28'
}, },
{ {
price: "30", price: '30',
pricestype: "新客优惠券", pricestype: '新客优惠券',
special: "全场每满299-30", special: '全场每满299-30',
period: "有效期", period: '有效期',
starttime: "2021.11.29-2022.01.28", starttime: '2021.11.29-2022.01.28'
}, },
{ {
price: "30", price: '30',
pricestype: "新客优惠券", pricestype: '新客优惠券',
special: "全场每满299-30", special: '全场每满299-30',
period: "有效期", period: '有效期',
starttime: "2021.11.29-2022.01.28", starttime: '2021.11.29-2022.01.28'
},
],
userdiscount:[],
activeIndex: 0,
};
},
methods: {
...mapMutations(["changemessage","checkIsLogin"]),
//获取用户领取的优惠券
async userdraw(mobile) {
//let curDate = new Date();
let paramsToAPI = {
mobile : mobile,
//useStartDate : curDate.getYear()+'-'+curDate.getMonth()+'-'+curDate.getDate(),
//productCodes : ''
};
let data = await getdraw(paramsToAPI);
let _self = this;
if(data){
let list = [];
data.data.forEach(function(element,index){
element.validFrom = element.validFrom.slice(0,10);
element.validTo = element.validTo.slice(0,10);
if(element.udf2 && element.udf2 == 'H5') {
list.push(element);
} }
}); ],
this.fullCouponList = list; userdiscount: [],
this.selectGoods('',UNUSE); activeIndex: 0
} };
},
selectGoods(item, index) {
this.activeIndex = index;
if (this.activeIndex == USED) {
this.userload = false;
this.pastdue = true;
this.userimage = require("../../assets/image/hasused.png");
this.userstates=1
this.usercolor={color:'white'}
//this.userdraw(this.usermessage.data.mobile,1)
}
if (this.activeIndex == UNUSE) {
this.userload = true;
this.pastdue = false;
//this.userdraw(this.usermessage.data.mobile,0)
this.usercolor={color:'#e1001a'}
this.userstates=0
this.userimage = require("../../assets/image/unused.png");
}
if (this.activeIndex == EXPIRED) {
this.userload = false;
this.pastdue = true;
//this.userdraw(this.usermessage.data.mobile,2)
this.userstates=2
this.usercolor={color:'white'}
this.userimage = require("../../assets/image/expired.png");
}
this.couponStatusFilter(this.activeIndex);
}, },
couponStatusFilter(status){ methods: {
let curTime = new Date().getTime(); ...mapMutations(['changemessage', 'checkIsLogin']),
let valDateFromTime; //获取用户领取的优惠券
let valDateToTime; async userdraw(mobile) {
this.newlist = []; //let curDate = new Date();
status = (!status || status>EXPIRED || status<UNUSE)?UNUSE:status; let paramsToAPI = {
for(let coupon of this.fullCouponList) { mobile: mobile
switch(status) { //useStartDate : curDate.getYear()+'-'+curDate.getMonth()+'-'+curDate.getDate(),
case EXPIRED: //productCodes : ''
if(coupon) { };
if(coupon.fValidTo) { let data = await getdraw(paramsToAPI);
let _self = this;
if (data) {
let list = [];
data.data.forEach(function(element, index) {
element.validFrom = element.validFrom.slice(0, 10);
element.validTo = element.validTo.slice(0, 10);
if (element.udf2 && element.udf2 == 'H5') {
list.push(element);
}
});
this.fullCouponList = list;
this.selectGoods('', UNUSE);
}
},
selectGoods(item, index) {
this.activeIndex = index;
if (this.activeIndex == USED) {
this.userload = false;
this.pastdue = true;
this.userimage = require('../../assets/image/hasused.png');
this.userstates = 1;
this.usercolor = { color: 'white' };
//this.userdraw(this.usermessage.data.mobile,1)
}
if (this.activeIndex == UNUSE) {
this.userload = true;
this.pastdue = false;
//this.userdraw(this.usermessage.data.mobile,0)
this.usercolor = { color: '#e1001a' };
this.userstates = 0;
this.userimage = require('../../assets/image/unused.png');
}
if (this.activeIndex == EXPIRED) {
this.userload = false;
this.pastdue = true;
//this.userdraw(this.usermessage.data.mobile,2)
this.userstates = 2;
this.usercolor = { color: 'white' };
this.userimage = require('../../assets/image/expired.png');
}
this.couponStatusFilter(this.activeIndex);
},
couponStatusFilter(status) {
let curTime = new Date().getTime();
let valDateFromTime;
let valDateToTime;
this.newlist = [];
status = !status || status > EXPIRED || status < UNUSE ? UNUSE : status;
for (let coupon of this.fullCouponList) {
switch (status) {
case EXPIRED:
if (coupon) {
if (coupon.fValidTo) {
valDateToTime = new Date(coupon.fValidTo).getTime();
}
if (curTime > valDateToTime && coupon.status == 0) {
coupon.canUse = false;
this.newlist.push(coupon);
}
}
break;
case UNUSE:
if (coupon.fValidFrom) {
valDateFromTime = new Date(coupon.fValidFrom).getTime();
}
if (coupon.fValidTo) {
valDateToTime = new Date(coupon.fValidTo).getTime(); valDateToTime = new Date(coupon.fValidTo).getTime();
} }
if(curTime > valDateToTime && coupon.status==0) { /*
coupon.canUse=false;
this.newlist.push(coupon);
}
}
break;
case UNUSE:
if(coupon.fValidFrom) {
valDateFromTime = new Date(coupon.fValidFrom).getTime();
}
if(coupon.fValidTo) {
valDateToTime = new Date(coupon.fValidTo).getTime();
}
/*
if(valDateFromTime && valDateToTime && curTime >= valDateFromTime && curTime <= valDateToTime && coupon.status == 0) { if(valDateFromTime && valDateToTime && curTime >= valDateFromTime && curTime <= valDateToTime && coupon.status == 0) {
coupon.canUse=true; coupon.canUse=true;
this.newlist.push(coupon); this.newlist.push(coupon);
} }
*/ */
if(valDateToTime && curTime <= valDateToTime && coupon.status == 0) { if (valDateToTime && curTime <= valDateToTime && coupon.status == 0) {
coupon.canUse=true; coupon.canUse = true;
this.newlist.push(coupon); this.newlist.push(coupon);
} }
break; break;
case USED: case USED:
if(coupon.status == 1) { if (coupon.status == 1) {
coupon.canUse=false; coupon.canUse = false;
this.newlist.push(coupon); this.newlist.push(coupon);
} }
break; break;
}
}
},
usertiao() {
this.$router.push({ name: 'productdetails-productlist' });
}
},
directives: {
color: {
bind: function(el, binding) {
el.style.color = binding.value;
},
inserted: function(el) {}
}
},
mounted() {
if (this.loginState) {
this.usermessage = this.userInfo;
this.userInfo && this.userdraw(this.userInfo.mobile);
} else {
this.$router.push({ path: '/userlogin/login' });
}
// this.checkIsLogin();
// this.usermessage = this.$store.state.userInfo;
// if (!this.usermessage) {
//
// }
// this.userdraw(this.usermessage.data.mobile);
},
watch: {
userInfo(newVal) {
if (newVal && this.loginState) {
this.usermessage = newVal;
this.userInfo && this.userdraw(this.usermessage.mobile);
} }
} }
}, },
usertiao(){ components: {
this.$router.push({ name: "productdetails-productlist",}) Myheader,
}, tabs
}, },
computed: {
directives: { ...mapState({
'color': { loginState: state => state.login.loginState,
bind: function(el, binding){ userInfo: state => state.user.userInfo
el.style.color = binding.value })
},
inserted: function(el){
}
},
},
mounted() {
this.checkIsLogin();
this.usermessage = this.$store.state.userInfo;
if(!this.usermessage){
this.$router.push({ path: "/userlogin/login"})
} }
this.userdraw(this.usermessage.data.mobile);
},
components: {
Myheader,
tabs
},
}; };
import Myheader from "~/components/header.vue"; import Myheader from '~/components/header.vue';
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
// 手机端 // 手机端
@import url("../../assets/css/discount.less"); @import url('../../assets/css/discount.less');
</style> </style>

198
rc-busness/pages/personal/integral.vue
View File

@ -1,127 +1,111 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="rc-top"></div>
<tabs :crumbs="crumbs"></tabs> <tabs :crumbs="crumbs"></tabs>
<div class="rc-max-width--xl rc-padding-bottom--md"> <div class="rc-max-width--xl rc-padding-bottom--md">
<ul> <ul>
<li v-for="(item,index) in userrecord" :key="index"> <li v-for="(item, index) in userrecord" :key="index">{{ item.title }}</li>
{{item.title}} </ul>
</li> <ol>
</ul> <li v-for="(item, index) in usermessage" :key="index">
<ol> <span>{{ item.startDate }}</span>
<em>{{ item.changeValue }}</em>
<i>{{ item.remark }}</i>
</li>
</ol>
</div>
<li v-for="(item,index) in usermessage" :key="index"> <!-- <div class="rc-button">
<span>{{item.startDate}}</span>
<em>{{item.changeValue}}</em>
<i>{{item.remark}}</i>
</li>
</ol>
</div>
<!-- <div class="rc-button">
<div class="rc-order"> <div class="rc-order">
<span>积分兑换</span> <span>积分兑换</span>
</div> </div>
</div> --> </div> -->
</div> </div>
</template> </template>
<script> <script>
import Myheader from '~/components/header.vue' import Myheader from '~/components/header.vue';
import { memberAccount } from "../../ajax/getData"; import { memberAccount,mapState } from '../../ajax/getData';
export default { export default {
data(){ data() {
return{ return {
crumbs:[ crumbs: [
{ {
path:'/personal/mypersonal', path: '/personal/mypersonal'
}, },
{ {
path:'/personal/integral/', path: '/personal/integral/'
} }
], ],
userrecord:[ userrecord: [
{ {
title:'日期', title: '日期'
},
}, {
{ title: '积分'
title:'积分', },
{
}, title: '类型'
{ }
title:'类型', ],
},
usermessage: [
], {
title: '2021-09-11',
usermessage:[ rccord: '+100',
{ buycord: '购物积分'
title:'2021-09-11', },
rccord:'+100', {
buycord:'购物积分' title: '2021-09-11',
rccord: '+100',
}, buycord: '购物积分'
{ },
title:'2021-09-11', {
rccord:'+100', title: '2021-09-11',
buycord:'购物积分' rccord: '+100',
buycord: '购物积分'
}, },
{ {
title:'2021-09-11', title: '2021-09-11',
rccord:'+100', rccord: '+100',
buycord:'购物积分' buycord: '购物积分'
},
}, {
{ title: '2021-09-11',
title:'2021-09-11', rccord: '+100',
rccord:'+100', buycord: '购物积分'
buycord:'购物积分' }
]
}, };
{ },
title:'2021-09-11', methods: {
rccord:'+100', //请求猫
buycord:'购物积分' async catmessage() {
// let user = JSON.parse(localStorage.getItem('userInfo'));
}, let data = await memberAccount(this.user.id);
if (data) {
this.usermessage = data.data;
console.log(this.usermessage.data);
] }
}
} },
}, mounted() {
methods:{ this.catmessage();
//请求猫 },
async catmessage() { components: {
let user= JSON.parse(localStorage.getItem("userInfo")); Myheader
let data = await memberAccount(user.data.id); },
if(data){ computed:{
this.usermessage=data.data; ...mapState({
console.log(this.usermessage.data); userInfo : state => state.user.userInfo
} })
}, }
}, };
mounted(){
this.catmessage();
},
components:{
Myheader,
},
}
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@import url("../../assets/css/integral.less"); @import url('../../assets/css/integral.less');
</style> </style>

757
rc-busness/pages/personal/mypersonal.vue
View File

@ -1,429 +1,416 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<!-- <tabs></tabs> --> <!-- <tabs></tabs> -->
<div class="rc-top"></div> <div class="rc-top"></div>
<tabs :crumbs="crumbs"></tabs> <tabs :crumbs="crumbs"></tabs>
<div class="rc-layout-container rc-one-column rc-full-width ts-mypersonal"> <div class="rc-layout-container rc-one-column rc-full-width ts-mypersonal">
<div class="rc-column"> <div class="rc-column">
<!-- <div class="rc-title"> <!-- <div class="rc-title">
<img src="../../assets/image/rc-cat.png" alt="" /> <img src="../../assets/image/rc-cat.png" alt="" />
<span>{{ userorder }}</span> <span>{{ userorder }}</span>
</div> --> </div> -->
<div class="rc-max-width--xl"> <div class="rc-max-width--xl">
<div class="rc-center"> <div class="rc-center"><img :src="userimage" /></div>
<img :src='userimage' />
</div>
</div>
<div class="rc-max-width--xl ts-special-padding">
<div class="rc-login">
<div class="rc-unlogin">
<div class="rc-people" @click="opendialog()">
<img src="../../assets/image/rc-people.png" alt="" />
</div> </div>
<div class="rc-userlogin"> <div class="rc-max-width--xl ts-special-padding">
<div v-if="!islogin"> <div class="rc-login">
<span>{{usertitle}}</span> <div class="rc-unlogin">
<em>{{userorder}}</em> <div class="rc-people" @click="opendialog()"><img src="../../assets/image/rc-people.png" alt="" /></div>
<div class="rc-userlogin">
<div v-if="!islogin">
<span>{{ usertitle }}</span>
<em>{{ userorder }}</em>
</div>
<nuxt-link :to="`/userlogin/login/`"><span v-if="islogin">登录/注册</span></nuxt-link>
</div>
</div>
<div class="rc-islogin">
<nuxt-link :to="`/personal/usermember/`" class="ts-right-arr"><span>会员权益</span></nuxt-link>
</div>
</div> </div>
<nuxt-link :to="`/userlogin/login/`"> </div>
<span v-if="islogin">登录/注册</span> <div class="online bold"></div>
</nuxt-link> <div class="rc-max-width--xl ts-special-padding">
<div class="usercord">
<em>当前积分:{{ rcrcord || 0 }}</em>
<span class="ts-right-arr" @click="userinter">积分明细</span>
</div>
<div class="rc-cordd">
<span>距离升级还差:</span>
<span class="lackOfPoint">{{ rcvalue }}</span>
<div class="block">
<div class="ts-point-tag rc-md-up">0</div>
<div class="r-block" ref="userblock"></div>
<!-- <el-slider v-model="value" range show-stops :max="10"> </el-slider> -->
</div>
<div class="rc-value">
<span>0</span>
<span>5000</span>
<span>10000</span>
</div>
</div>
</div>
<div class="online bold"></div>
<div class="rc-max-width--xl ts-special-padding">
<div class="rc-order">
<em>我的订单</em>
<span class="ts-right-arr" @click="findall">查看全部</span>
</div>
<div class="rc-obligation rc-max-width--lg">
<ul>
<li v-for="(item, index) in prefecture" :key="index" @click="obligation(item, index)">
<img :src="item.catimage" alt="" />
<span>{{ item.title }}</span>
</li>
</ul>
</div>
</div>
<div class="online bold"></div>
<div class="rc-max-width--xl ts-special-padding">
<div class="rc-usermain">
<h2>服务工具</h2>
<div class="rc-buymain rc-max-width--lg ts-special-padding">
<div class="rc-buy" v-for="(item, index) in personallist" :key="index" @click="openaddress(item, index)">
<div class="rc-cord">
<img :src="item.buyimage" alt="" />
<em>{{ item.title }}</em>
</div>
<div class="rc-load">
<span>{{ item.usertitle }}</span>
<img src="../../assets/image/rc-left.png" alt="" />
</div>
</div>
</div>
</div>
</div>
<div class="online bold"></div>
<div class="ts-btn" v-if="!islogin"><div class="ts-standard-btn center" @click="logout">退出登录</div></div>
</div>
</div>
<el-dialog :visible.sync="dialogInfo1" hegight="700px" :before-close="handleClose" @open="open">
<div class="rc-full-width rc-max-width--xl rc-text--center">
<div class="rc-title rc-text--center rc-margin-bottom--md"><img src="../../assets/error.png" alt="" /></div>
<div class="rc-logmain">
<h3>温馨提示</h3>
<span>{{ usermessage }}</span>
</div>
<div class="userer">
<img src="/images/qrcode-aichong.jpg" alt="" class="rc-margin-y--xs" />
<span>微信扫一扫，识别二维码</span>
</div> </div>
</div> </div>
<div class="rc-islogin"> </el-dialog>
<nuxt-link :to="`/personal/usermember/`" class="ts-right-arr">
<span>会员权益</span>
</nuxt-link>
</div>
</div>
</div>
<div class="online bold"></div>
<div class="rc-max-width--xl ts-special-padding">
<div class="usercord">
<em>当前积分:{{ rcrcord }}</em>
<span class="ts-right-arr" @click="userinter">积分明细</span>
</div>
<div class="rc-cordd"> <FixRight></FixRight>
<span>距离升级还差:</span> <span class="lackOfPoint">{{ rcvalue }}</span> <MyFooter></MyFooter>
<div class="block">
<div class="ts-point-tag rc-md-up">0</div>
<div class="r-block" ref="userblock"></div>
<!-- <el-slider v-model="value" range show-stops :max="10"> </el-slider> -->
</div>
<div class="rc-value">
<span>0</span>
<span>5000</span>
<span>10000</span>
</div>
</div>
</div> </div>
<div class="online bold"></div>
<div class="rc-max-width--xl ts-special-padding">
<div class="rc-order">
<em>我的订单</em>
<span class="ts-right-arr" @click="findall" >查看全部</span>
</div>
<div class="rc-obligation rc-max-width--lg">
<ul>
<li v-for="(item, index) in prefecture" :key="index" @click="obligation(item,index)">
<img :src="item.catimage" alt="" />
<span>{{ item.title }}</span>
</li>
</ul>
</div>
</div>
<div class="online bold"></div>
<div class="rc-max-width--xl ts-special-padding">
<div class="rc-usermain">
<h2>服务工具</h2>
<div class="rc-buymain rc-max-width--lg ts-special-padding">
<div class="rc-buy" v-for="(item, index) in personallist" :key="index" @click="openaddress(item,index)">
<div class="rc-cord">
<img :src="item.buyimage" alt="" />
<em>{{ item.title }}</em>
</div>
<div class="rc-load">
<span>{{ item.usertitle }}</span>
<img src="../../assets/image/rc-left.png" alt="" />
</div>
</div>
</div>
</div>
</div>
<div class="online bold"></div>
<div class="ts-btn" v-if="!islogin">
<div class="ts-standard-btn center" @click="logout">退出登录</div>
</div>
</div>
</div>
<el-dialog
:visible.sync="dialogInfo1"
hegight="700px"
:before-close="handleClose"
@open="open"
>
<div class="rc-full-width rc-max-width--xl rc-text--center">
<div class="rc-title rc-text--center rc-margin-bottom--md">
<img src="../../assets/error.png" alt="">
</div>
<div class="rc-logmain">
<h3>温馨提示</h3>
<span>{{usermessage}}</span>
</div>
<div class="userer">
<img src="/images/qrcode-aichong.jpg" alt="" class="rc-margin-y--xs">
<span>微信扫一扫，识别二维码</span>
</div>
</div>
</el-dialog>
<FixRight></FixRight>
<MyFooter></MyFooter>
</div>
</template> </template>
<script> <script>
import Myheader from '~/components/header.vue' import Myheader from '~/components/header.vue';
import MyFooter from '~/components/rc-footer.vue' import MyFooter from '~/components/rc-footer.vue';
import FixRight from "~/components/fixed-right.vue"; import FixRight from '~/components/fixed-right.vue';
import tabs from "@/components/tabs.vue"; import tabs from '@/components/tabs.vue';
import { mapMutations } from "vuex"; import { mapMutations, mapState } from 'vuex';
export default { export default {
middleware: 'metaTitle', middleware: 'metaTitle',
// middleware: 'metaTitle', // middleware: 'metaTitle',
meta: {title: '个人中心'}, meta: { title: '个人中心' },
data() { data() {
return { return {
crumbs:[ crumbs: [
{ {
path:'/personal/mypersonal', path: '/personal/mypersonal'
} }
], ],
userlog:false, userlog: false,
islogin:false, islogin: false,
dialogInfo1:false, dialogInfo1: false,
userid:null, userid: null,
usertitle:'', usertitle: '',
rcvalue:5000, rcvalue: 5000,
usermessage:'关注皇家爱宠荟，修改个人资料', usermessage: '关注皇家爱宠荟，修改个人资料',
userimage:require("../../assets/image/rc-new.png"), userimage: require('../../assets/image/rc-new.png'),
userlogin:'登录注册', userlogin: '登录注册',
userorder: "新手铲屎官", userorder: '新手铲屎官',
prefecture: [ prefecture: [
{ {
title: "待付款", title: '待付款',
ordernum: "2", ordernum: '2',
catimage: require("../../assets/image/rc-obligation.png"), catimage: require('../../assets/image/rc-obligation.png')
}, },
{ {
title: "待发货", title: '待发货',
ordernum: "2", ordernum: '2',
catimage: require("../../assets/image/rc-pending.png"), catimage: require('../../assets/image/rc-pending.png')
}, },
{ {
title: "待收货", title: '待收货',
ordernum: "2", ordernum: '2',
catimage: require("../../assets/image/rc-wait.png"), catimage: require('../../assets/image/rc-wait.png')
}, }
], ],
personallist: [
{
title: "积分商城",
ordernum: "0",
buyimage: require("../../assets/image/rc-integral.png"),
usertitle: "点击进入爱宠荟",
},
{
title: "优惠券",
ordernum: "1",
buyimage: require("../../assets/image/rc-discount.png"),
usertitle: "查看详情",
},
{
title: "收货地址",
ordernum: "2",
buyimage: require("../../assets/image/rc-address.png"),
usertitle: "查看详情",
},
],
rcrcord: '',
value: [4, 8],
};
}, personallist: [
{
title: '积分商城',
ordernum: '0',
buyimage: require('../../assets/image/rc-integral.png'),
usertitle: '点击进入爱宠荟'
},
{
title: '优惠券',
ordernum: '1',
buyimage: require('../../assets/image/rc-discount.png'),
usertitle: '查看详情'
},
{
title: '收货地址',
ordernum: '2',
buyimage: require('../../assets/image/rc-address.png'),
usertitle: '查看详情'
}
],
rcrcord: '',
value: [4, 8]
};
},
components: { components: {
Myheader, Myheader,
MyFooter, MyFooter,
tabs, tabs,
FixRight FixRight
}, },
computed: {
...mapState({
userInfo : state => state.user.userInfo,
loginState : state => state.login.loginState,
})
},
watch:{ watch:{
userInfo(newVal){
// console.log('22222userInfo=',newVal)
// console.log('this.loginState=',this.loginState)
this.islogin = !this.loginState;
if(newVal && this.loginState){
this.loginState && this.setUserInfoData(newVal);
}
}
}, },
methods: { methods: {
...mapMutations(["logoutSystem","checkIsLogin"]), ...mapMutations(['logoutSystem', 'checkIsLogin']),
logout() { logout() {
this.logoutSystem(); this.$store.dispatch('logout',this);
this.$router.push({ this.logoutSystem();
path: "/",
});
},
userinter(){
let user= this.$store.state.userInfo;
if(!user){
this.$message({
type: 'warning',
message: '您还未登录'
});
return
} else {
this.$router.push({ this.$router.push({
path: "/personal/integral/", path: '/'
query: {
stype: 1,
},
}); });
} },
}, userinter() {
findall(){ let user = this.$store.state.userInfo;
let user= this.$store.state.userInfo; if (!user) {
if(user==undefined||user==null||user==''){ this.$message({
this.$message({ type: 'warning',
type: 'warning', message: '您还未登录'
message: '您还未登录'
});
return
} else {
this.$router.push({
path: "/personal/useraddress/",
query: {
stype: 0,
},
});
}
},
//地址的跳转
obligation(item,index){
let user= this.$store.state.userInfo;
if(user==undefined||user==null||user==''){
this.$message({
type: 'warning',
message: '您还未登录'
});
return
}else{
if(item.title=='待付款'){
this.$router.push({
path: "/personal/useraddress",
query: {
stype: 1,
},
}); });
} else if(item.title=='待发货') { return;
} else {
this.$router.push({ this.$router.push({
path: "/personal/useraddress", path: '/personal/integral/',
query: { query: {
stype: 2, stype: 1
},
});
} else if(item.title=='待收货') {
this.$router.push({
path: "/personal/useraddress",
query: {
stype: 3,
},
});
}
}
},
handleClose(){
this.dialogInfo1=false;
console.log(this.dialogInfo1);
},
open(){
},
ifadroind(){
var sUserAgent = navigator.userAgent.toLowerCase();
var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
var bIsMidp = sUserAgent.match(/midp/i) == "midp";
var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
var bIsAndroid = sUserAgent.match(/android/i) == "android";
var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM)) {
if(this.userlog==true){
this.usermessage='关注皇家爱宠荟，修改个人资料',
this.dialogInfo1=true;
}else{
this.dialogInfo1=false;
this.usermessage='关注皇家爱宠荟，兑换更多福利';
}
return false;
} else {
this.dialogInfo1=false;
return true;
}
},
openaddress(item,index){
let user= this.$store.state.userInfo;
if(user==undefined||user==null||user==''){
this.$message({
type: 'warning',
message: '您还未登录'
});
return
} else {
if(item.title=='收货地址'){
this.$router.push({
path: `/useraddress/openaddress/`
})
}
if(index==0){
this.userlog=true
_hmt.push([
"_trackCustomEvent",
"jump_to_crmMiniApp",
{
"type":"积分商城",
} }
]) });
let isMobile = this.ifadroind();
if(isMobile)
window.location.href="weixin://dl/business/?t=BE1OA2AngRs";
} }
if(index==1){ },
findall() {
let user = this.userInfo;
if ( user && this.loginState) {
this.$router.push({ this.$router.push({
path: `/personal/discount/` path: '/personal/useraddress/',
}) query: {
stype: 0
}
});
} else {
this.$message({
type: 'warning',
message: '您还未登录'
});
return;
} }
} },
}, //地址的跳转
opendialog(){ obligation(item, index) {
this.ifadroind(); let user = this.userInfo;
} // console.log(!user , !this.loginState,'22222');
}, // return false;
mounted() { if (!user && !this.loginState) {
this.checkIsLogin(); this.$message({
let userwidth=0; type: 'warning',
this.ifadroind(); message: '您还未登录'
let user= this.$store.state.userInfo; });
if(user){ return;
this.userid=user.data; } else {
this.islogin=false; if (item.title == '待付款') {
this.usertitle=this.userid.memberName; this.$router.push({
this.rcrcord=this.userid.availiblePoint; path: '/personal/useraddress',
if(this.userid.memberLevel==1){ query: {
let userlength=this.userid.availiblePoint.toString().length; stype: 1
this.userimage=require('../../assets/image/rc-new.png'); }
this.userorder='新手铲屎官'; });
this.uservalue=5000; //新手总积分 } else if (item.title == '待发货') {
this.rcvalue=this.uservalue-this.userid.availiblePoint; //新手总积分减去本身的积分 this.$router.push({
if(userlength==1||userlength==2||userlength==3||userlength==4){ path: '/personal/useraddress',
userwidth=this.userid.availiblePoint/100 query: {
console.log(userwidth); stype: 2
}
});
} else if (item.title == '待收货') {
this.$router.push({
path: '/personal/useraddress',
query: {
stype: 3
}
});
} }
} }
else if(this.userid.memberLevel==2){ },
this.userimage=require('../../assets/image/rc-new2.png'); handleClose() {
this.userorder='资深铲屎官'; this.dialogInfo1 = false;
this.uservalue=10000; console.log(this.dialogInfo1);
this.rcvalue=this.uservalue-this.userid.availiblePoint; },
userwidth=this.userid.availiblePoint/100 open() {},
}else if( this.userid.memberLevel==3){ ifadroind() {
this.userimage=require('../../assets/image/rc-new1.png'); var sUserAgent = navigator.userAgent.toLowerCase();
this.userorder='金牌铲屎官'; var bIsIpad = sUserAgent.match(/ipad/i) == 'ipad';
this.usrnewlist=this.goldmedal; var bIsIphoneOs = sUserAgent.match(/iphone os/i) == 'iphone os';
userwidth=100 var bIsMidp = sUserAgent.match(/midp/i) == 'midp';
var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == 'rv:1.2.3.4';
var bIsUc = sUserAgent.match(/ucweb/i) == 'ucweb';
var bIsAndroid = sUserAgent.match(/android/i) == 'android';
var bIsCE = sUserAgent.match(/windows ce/i) == 'windows ce';
var bIsWM = sUserAgent.match(/windows mobile/i) == 'windows mobile';
if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM)) {
if (this.userlog == true) {
(this.usermessage = '关注皇家爱宠荟，修改个人资料'), (this.dialogInfo1 = true);
} else {
this.dialogInfo1 = false;
this.usermessage = '关注皇家爱宠荟，兑换更多福利';
}
return false;
} else {
this.dialogInfo1 = false;
return true;
} }
this.$refs.userblock.style.width=userwidth+'%'; },
let tagEle=document.querySelector('.ts-point-tag'); openaddress(item, index) {
if(tagEle){ let user = this.userInfo;
tagEle.innerText=this.userid.availiblePoint; if (user == undefined || user == null || user == '') {
let tagEleLeft=userwidth-1; this.$message({
if(tagEleLeft<=0) type: 'warning',
tagEleLeft=0; message: '您还未登录'
tagEle.style.left=tagEleLeft+"%"; });
return;
} else {
if (item.title == '收货地址') {
this.$router.push({
path: `/useraddress/openaddress/`
});
}
if (index == 0) {
this.userlog = true;
_hmt.push([
'_trackCustomEvent',
'jump_to_crmMiniApp',
{
type: '积分商城'
}
]);
let isMobile = this.ifadroind();
if (isMobile) window.location.href = 'weixin://dl/business/?t=BE1OA2AngRs';
}
if (index == 1) {
this.$router.push({
path: `/personal/discount/`
});
}
}
},
opendialog() {
this.ifadroind();
},
/* 初始化设置用户信息 */
setUserInfoData(userInfo){
// console.log(this.loginState,userInfo,'2222');
let userwidth = 0;
this.userid = userInfo;
this.islogin = false;
this.usertitle = this.userid.memberName;
this.rcrcord = this.userid.availiblePoint;
if (this.userid.memberLevel == 1) {
let userlength = this.userid.availiblePoint.toString().length;
this.userimage = require('../../assets/image/rc-new.png');
this.userorder = '新手铲屎官';
this.uservalue = 5000; //新手总积分
this.rcvalue = this.uservalue - this.userid.availiblePoint; //新手总积分减去本身的积分
if (userlength == 1 || userlength == 2 || userlength == 3 || userlength == 4) {
userwidth = this.userid.availiblePoint / 100;
console.log(userwidth);
}
} else if (this.userid.memberLevel == 2) {
this.userimage = require('../../assets/image/rc-new2.png');
this.userorder = '资深铲屎官';
this.uservalue = 10000;
this.rcvalue = this.uservalue - this.userid.availiblePoint;
userwidth = this.userid.availiblePoint / 100;
} else if (this.userid.memberLevel == 3) {
this.userimage = require('../../assets/image/rc-new1.png');
this.userorder = '金牌铲屎官';
this.usrnewlist = this.goldmedal;
userwidth = 100;
}
this.$refs.userblock.style.width = userwidth + '%';
let tagEle = document.querySelector('.ts-point-tag');
if (tagEle) {
tagEle.innerText = this.userid.availiblePoint;
let tagEleLeft = userwidth - 1;
if (tagEleLeft <= 0) tagEleLeft = 0;
tagEle.style.left = tagEleLeft + '%';
}
if (this.userid == undefined || this.userid == '' || this.userid == null) {
this.islogin = true;
} }
} else {
this.userid='';
}
if(this.userid==undefined ||this.userid==''||this.userid==null){
this.islogin=true;
} }
}, },
mounted() {
// this.checkIsLogin();
this.$store.dispatch('checkLoginState',this);
this.ifadroind();
let user = this.userInfo;
this.islogin = !this.loginState;
if (user && this.loginState) {
this.setUserInfoData(user);
} else {
this.userid = '';
}
}
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@import url("@/assets/css/global.less"); @import url('@/assets/css/global.less');
@import url("@/assets/css/mypersonal.less"); @import url('@/assets/css/mypersonal.less');
</style> </style>

1319
rc-busness/pages/personal/settlement.vue
View File

File diff suppressed because it is too large Load Diff

899
rc-busness/pages/personal/useraddress.vue
View File

@ -1,479 +1,466 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="rc-top"></div>
<tabs :crumbs="crumbs"></tabs> <tabs :crumbs="crumbs"></tabs>
<div class="online bold"></div> <div class="online bold"></div>
<div class="usercontshow rc-max-width--xl"> <div class="usercontshow rc-max-width--xl">
<div class="rc-headera"> <div class="rc-headera">
<span <span v-for="(item, index) in discountlist" :key="index" @click="selectGoods(item, index)" :class="activeIndex == index ? 'active' : 'unactive'">
v-for="(item, index) in discountlist" {{ item.title }}
:key="index" </span>
@click="selectGoods(item, index)" </div>
:class="activeIndex == index ? 'active' : 'unactive'" <div class="online bold" style="height:8px;margin-top:0"></div>
> <div class="rc-userheader">
{{ item.title }} <span v-for="(item, index) in message" :key="index">{{ item.title }}</span>
</span> </div>
</div>
<div class="online bold" style="height:8px;margin-top:0"></div> <div class="rc-center" v-for="(item, index) in useralllist" :key="index">
<div class="rc-userheader"> <div class="rc-usermaina">
<span v-for="(item, index) in message" :key="index"> <div class="rc-title">
{{ item.title }} <div>
</span> <i>订单编号:</i>
</div> <span>{{ item.orderNumber }}</span>
<div class="rc-center" v-for="(item, index) in useralllist" :key="index"> </div>
<div class="rc-usermaina"> <div class="rc-usertitle">
<div class="rc-title"> <strong>订单状态:</strong>
<div> <em>
<i>订单编号:</i><span>{{ item.orderNumber }}</span> {{ item.status == '0' ? '待付款' : item.status == '1' ? '待收货' : item.status == '2' ? '已完成' : item.status == '3' ? '已取消' : '异常订单' }}
</div> </em>
<div class="rc-usertitle"> </div>
<strong>订单状态:</strong> </div>
<em>{{ <div class="rc-usermain">
item.status == "0" <div class="rc-image"><img :src="item.picFile" alt="" /></div>
? "待付款" <div class="rc-right" @click="usertiaozhuan(item)">
: item.status == "1" <div class="rc-usercenter">
? "待收货" <em>{{ item.productName }}</em>
: item.status == "2" <div class="rc-userright">
? "已完成" <span>规格:{{ item.specifications }}</span>
: item.status == "3" </div>
? "已取消" </div>
: "异常订单" <div class="rc-userbottom">
}}</em> <span>数量:{{ item.pcs }}件</span>
</div> <i>￥{{ item.ecPrice }}</i>
</div> </div>
<div class="rc-usermain" > <div class="rc-userbottomm">
<div class="rc-image"> <i>￥{{ item.ecPrice }}</i>
<img :src= item.picFile alt="" /> <span>{{ item.pcs }}</span>
</div> <i>￥{{ item.salesAmount }}</i>
<div class="rc-right" @click="usertiaozhuan(item)"> </div>
<div class="rc-usercenter"> </div>
<em>{{ item.productName }}</em>
<div class="rc-userright">
<span>规格:{{ item.specifications }}</span>
</div>
</div>
<div class="rc-userbottom">
<span>数量:{{ item.pcs }}件</span>
<i>￥{{item.ecPrice}}</i>
</div>
<div class="rc-userbottomm">
<i>￥{{ item.ecPrice }}</i>
<span>{{ item.pcs }}</span>
<i>￥{{ item.salesAmount }}</i>
</div>
</div>
<div class="pc-bottom"> <div class="pc-bottom">
<span v-if="item.status!=1" @click="userpay(item, index)">{{ <span v-if="item.status != 1" @click="userpay(item, index)">
item.status == "0" {{
? "取消订单" item.status == '0'
: item.status == "1" ? '取消订单'
? "确认收货" : item.status == '1'
: item.status == "2" ? '确认收货'
? "再次购买" : item.status == '2'
: item.status == "3" ? '再次购买'
? "再次购买" : item.status == '3'
: "异常订单" ? '再次购买'
}}</span> : '异常订单'
<span @click="userfind(item)">{{ }}
item.status == "0" </span>
? "立即支付" <span @click="userfind(item)">
: item.status == "1" {{
? "查看订单" item.status == '0'
: item.status == "2" ? '立即支付'
? "查看订单" : item.status == '1'
: item.status == "3" ? '查看订单'
? "查看订单" : item.status == '2'
: "异常订单" ? '查看订单'
}}</span> : item.status == '3'
</div> ? '查看订单'
</div> : '异常订单'
<div class="online" style="display:none"></div> }}
<div class="rc-usermain rc-price"> </span>
<div class="rc-price priceleft"> </div>
<span>数量:</span> </div>
<em>共{{item.lengthnum}}件商品</em> <div class="online" style="display:none"></div>
</div> <div class="rc-usermain rc-price">
<div class="rc-price priceright"> <div class="rc-price priceleft">
<strong>总计:</strong> <span>数量:</span>
<i>￥{{item.salesAmount}}</i> <em>共{{ item.lengthnum }}件商品</em>
</div> </div>
</div> <div class="rc-price priceright">
<strong>总计:</strong>
<i>￥{{ item.salesAmount }}</i>
</div>
</div>
<div class="rc-bottom"> <div class="rc-bottom">
<span @click="userpay(item, index)">
{{ item.status == '0' ? '取消订单' : item.status == '1' ? '确认收货' : item.status == '2' ? '再次购买' : item.status == '3' ? '再次购买' : '异常订单' }}
</span>
<span @click="userfind(item)">
{{ item.status == '0' ? '立即支付' : item.status == '1' ? '查看订单' : item.status == '2' ? '查看订单' : item.status == '3' ? '查看订单' : '异常订单' }}
</span>
</div>
</div>
<span @click="userpay(item, index)">{{ <div class="online bold"></div>
item.status == "0" </div>
? "取消订单"
: item.status == "1" </div>
? "确认收货" <el-dialog :visible.sync="showPaytypeWarning" :close-on-click-modal="false">
: item.status == "2" <div class="ts-warning-popup">
? "再次购买" <div class="title rc-full-width"><img src="../../assets/error.png" alt="" /></div>
: item.status == "3" <div class="content rc-full-width rc-text--center rc-margin-y--md">
? "再次购买" <h3>温馨提示</h3>
: "异常订单" <span class="">{{ paytypeWarning.message }}</span>
}}</span> </div>
<span @click="userfind(item)">{{ </div>
item.status == "0" </el-dialog>
? "立即支付" <MyFooter></MyFooter>
: item.status == "1" </div>
? "查看订单"
: item.status == "2"
? "查看订单"
: item.status == "3"
? "查看订单"
: "异常订单"
}}</span>
</div>
</div>
<div class="online bold"></div>
</div>
</div>
<el-dialog :visible.sync="showPaytypeWarning" :close-on-click-modal="false">
<div class="ts-warning-popup">
<div class="title rc-full-width">
<img src="../../assets/error.png" alt="" />
</div>
<div class="content rc-full-width rc-text--center rc-margin-y--md">
<h3>温馨提示</h3>
<span class="">{{ paytypeWarning.message}}</span>
</div>
</div>
</el-dialog>
<MyFooter></MyFooter>
</div>
</template> </template>
<script> <script>
import Myheader from "~/components/header.vue"; import Myheader from '~/components/header.vue';
import MyFooter from '~/components/rc-footer.vue'; import MyFooter from '~/components/rc-footer.vue';
import tabs from "~/components/tabs.vue"; import tabs from '~/components/tabs.vue';
import util from "@/ajax/util"; import util from '@/ajax/util';
import { customerorders, userindent, canceldanhao, repayOrde } from "../../ajax/getData"; import { customerorders, userindent, canceldanhao, repayOrde } from '../../ajax/getData';
import { mapMutations } from "vuex"; import { mapMutations, mapState } from 'vuex';
export default { export default {
data() { data() {
return { return {
util, util,
paytypeWarning:{result:true,message:''}, paytypeWarning: { result: true, message: '' },
showPaytypeWarning:false, showPaytypeWarning: false,
crumbs:[ crumbs: [
{ {
path:'/personal/mypersonal/', path: '/personal/mypersonal/'
}, },
{ {
path:'/personal/useraddress/', path: '/personal/useraddress/'
}
],
activeIndex: 0,
userstype: '',
alllist: [],
obligation: [], //待付款
pending: [], //待发货
receiving: [], //待收货
allmessage: [],
useralllist: [],
usertitle: '',
useraliset: [],
// userdata: [],
buttontitle: '再次购买',
discountlist: [
{
title: '全部'
},
{
title: '待付款'
},
{
title: '待发货'
},
{
title: '待收货'
}
],
message: [
{
title: '商品'
},
{
title: '单价/元'
},
{
title: '数量'
},
{
title: '实付款/元'
},
{
title: '操作'
}
],
goldmedal: [
{
ordernumber: '',
orderstype: 1,
usereat: '',
ordernum: 0,
num: '',
specification: '',
buttontitle: '',
userprice: '',
catimage: ''
}
]
};
},
computed: {
...mapState({
userInfo: state => state.user.userInfo,
userdata: state => state.user.userInfo.mobile,
loginState: state => state.login.loginState
})
},
watch: {
userInfo(newVal) {
this.resetData();
} }
], },
activeIndex: 0, mounted() {
userstype:'', // this.checkIsLogin();
alllist:[],
obligation:[],//待付款
pending:[],//待发货
receiving :[],//待收货
allmessage:[],
useralllist: [],
usertitle:'',
useraliset:[],
userdata: [],
buttontitle: "再次购买",
discountlist: [
{
title: "全部",
},
{
title: "待付款",
},
{
title: "待发货",
},
{
title: "待收货",
},
],
message: [ this.userstype = this.$route.query.stype;
{ this.resetData();
title: "商品", // this.userdata = user.data.mobile;
}, },
{ components: {
title: "单价/元", Myheader,
}, MyFooter,
{ tabs
title: "数量", },
}, methods: {
{ ...mapMutations(['changemessage', 'checkIsLogin']),
title: "实付款/元", async indet(mobile, stype) {
}, let data = await userindent(mobile, undefined, 1, 100);
{ this.activeIndex = stype;
title: "操作", this.goldmedal = data;
}, this.alllist = [];
], this.allmessage = [];
this.useralllist = [];
goldmedal: [ this.obligation = [];
{ this.receiving = [];
ordernumber: "", this.pending = [];
orderstype: 1, for (let i = 0; i < this.goldmedal.length; i++) {
usereat: "", if (!this.goldmedal[i].orderDetailList.length) continue;
ordernum: 0, this.useralllist.push(this.goldmedal[i].orderDetailList[0]);
num: "", this.alllist.push(this.goldmedal[i].orderDetailList[0]);
specification: "", this.allmessage.push(this.goldmedal[i].orderDetailList[0]);
buttontitle: "", if (this.goldmedal[i].status == 0) {
userprice: "", this.obligation.push(this.goldmedal[i].orderDetailList[0]);
catimage: '', } else if (this.goldmedal[i].status == 1) {
} this.receiving.push(this.goldmedal[i].orderDetailList[0]);
], } else if (this.goldmedal[i].status == 2) {
}; this.pending.push(this.goldmedal[i].orderDetailList[0]);
}, }
}
mounted() { for (let y = 0; y < this.goldmedal.length; y++) {
this.checkIsLogin(); if (!this.useralllist[y]) {
let user = this.$store.state.userInfo; this.useralllist[y] = {};
this.userdata = user.data.mobile; }
let stype = this.$route.query.stype; if (!this.goldmedal[y].orderDetailList) continue;
this.userstype=this.$route.query.stype; this.useralllist[y].orderNumber = this.goldmedal[y].orderNumber;
if (user == "" || user == null) { this.useralllist[y].status = this.goldmedal[y].status;
this.$message({ this.useralllist[y].addressUserName = this.goldmedal[y].addressUserName;
type: "warning", this.useralllist[y].phoneNumber = this.goldmedal[y].addressPhoneNumber;
message: "请先去登录", this.useralllist[y].salesAmount = this.goldmedal[y].salesAmount;
}); this.useralllist[y].lengthnum = this.goldmedal[y].orderDetailList.length;
return; this.useralllist[y].paytype = this.goldmedal[y].paytype;
} else { }
this.indet(this.userdata, stype);
}
},
components: {
Myheader,
MyFooter,
tabs
},
methods: {
...mapMutations(["changemessage","checkIsLogin"]),
async indet(mobile, stype) {
let data = await userindent(mobile,undefined,1,100);
this.activeIndex = stype;
this.goldmedal = data;
this.alllist=[];
this.allmessage=[];
this.useralllist=[];
this.obligation=[];
this.receiving=[];
this.pending=[];
for (let i = 0; i < this.goldmedal.length; i++) {
if(!this.goldmedal[i].orderDetailList) if (this.userstype == 1) {
continue; this.useralllist = this.obligation;
this.useralllist.push(this.goldmedal[i].orderDetailList[0]); } else if (this.userstype == 2) {
this.alllist.push(this.goldmedal[i].orderDetailList[0]) this.useralllist = this.pending;
this.allmessage.push(this.goldmedal[i].orderDetailList[0]) } else if (this.userstype == 0) {
if(this.goldmedal[i].status==0){ this.useralllist = this.allmessage;
this.obligation.push(this.goldmedal[i].orderDetailList[0]); } else if (this.userstype == 3) {
}else if(this.goldmedal[i].status==1){ this.useralllist = this.receiving;
this.receiving.push(this.goldmedal[i].orderDetailList[0]);
} }
else if(this.goldmedal[i].status==2){ /* 过滤空的数据 */
this.pending.push(this.goldmedal[i].orderDetailList[0]); let filterArr = this.useralllist.filter(val=>{
} return val != undefined;
}
for (let y = 0; y < this.goldmedal.length; y++) {
if(!this.goldmedal[y].orderDetailList)
continue;
if(!this.useralllist[y]){
this.useralllist[y] = {};
}
this.useralllist[y].orderNumber = this.goldmedal[y].orderNumber;
this.useralllist[y].status = this.goldmedal[y].status;
this.useralllist[y].addressUserName = this.goldmedal[y].addressUserName;
this.useralllist[y].phoneNumber = this.goldmedal[y].addressPhoneNumber;
this.useralllist[y].salesAmount = this.goldmedal[y].salesAmount;
this.useralllist[y].lengthnum=this.goldmedal[y].orderDetailList.length;
this.useralllist[y].paytype=this.goldmedal[y].paytype;
}
if(this.userstype==1){
this.useralllist=this.obligation
}else if(this.userstype==2){
this.useralllist=this.pending
}
else if(this.userstype==0){
this.useralllist=this.allmessage
}
else if(this.userstype==3){
this.useralllist=this.receiving
}
},
//订单立即支付
async getwei(item) {
let payType = this.util.pickPaytype();
let data = await this.repayOrde(item.orderNumber, payType);
if(data.code==1) {
let userPayData = {
userprice: item.salesAmount,
orderId: item.orderNumber,
userinformation: item.addressUserName + " " + item.phoneNumber,
wxPay:data.msg
};
this.$router.push({
path: "/personal/userpay",
query: {
userData: item.orderNumber,
stype: 1,
userPayData: JSON.stringify(userPayData),
},
}); });
} else { this.useralllist = filterArr;
this.$message({ },
type: "error", //订单立即支付
message: "订单数据错误，请联系客服进行处理", async getwei(item) {
}); let payType = this.util.pickPaytype();
} let data = await this.repayOrde(item.orderNumber, payType);
}, if (data.code == 1) {
async repayOrde(ordernumber) { let userPayData = {
let payType = this.util.pickPaytype(); userprice: item.salesAmount,
let res = await repayOrde(ordernumber, payType); orderId: item.orderNumber,
if (res) { userinformation: item.addressUserName + ' ' + item.phoneNumber,
return res; wxPay: data.msg
} };
},
usertiaozhuan(item){
this.$router.push({
path: "/myorder/usertion",
query: {
stype: item.status,
orderNumber: item.orderNumber,
},
});
},
async canceldanhao(orderNumber) {
let data = await canceldanhao(this.userdata,orderNumber);
if (data) {
this.$message({
type: "warning",
message: "取消订单成功",
});
/* 这个在全部变量去除的时候 记得加 */
// setTimeout(() => {
// this.indet(this.userdata);
// this.activeIndex=0;
// this.useralllist=[];
// console.log('2222');
// }, 500);
}
},
userpay(item, index) {
if (item.status == 0) {
if(confirm('确认取消该订单嘛？')){
this.canceldanhao(item.orderNumber);
setTimeout(() => {
this.indet(this.userdata);
this.useralllist=[];
this.alllist=[];
this.allmessage=[];
this.obligation=[];
this.receiving=[];
this.pending=[];
}, 500);
}
} else if(item.status == 1) { //确认收货
}
if (item.buttontitle == "立即支付") {
this.$router.push({
path: "/personal/userpay",
query: {
stype: 1,
},
});
} else if (item.status == 3) {
this.$router.push({
path: "/productdetails/producted",
query: {
stype: 1,
productCode:item.productId
},
});
}
},
selectGoods(item, index) {
let list=[]
this.activeIndex = index;
if(item.title=='待付款'){
list=this.obligation
} else if(item.title=='待收货'){
list=this.receiving
} else if(item.title=='待发货'){
this.useralllist=this.pending
list=this.pending
}
else if(item.title=='全部'){
list=this.alllist
}
this.useralllist=[];
for (var i = 0; i < this.useralllist.length; i++) {
this.useralllist[i].orderNumber =this.goldmedal[i].orderNumber;
this.useralllist[i].status = this.goldmedal[i].status
this.useralllist[i].addressUserName =this.goldmedal[i].addressUserName;
this.useralllist[i].phoneNumber = this.goldmedal[i].phoneNumber;
this.useralllist[i].salesAmount = this.goldmedal[i].salesAmount;
this.useralllist[i].lengthnum=this.goldmedal[i].orderDetailList.length
}
this.useralllist=list
},
userfind(item) {
this.paytypeWarning = this.util.checkPaytypeValidated(item.paytype);
this.showPaytypeWarning = !this.paytypeWarning.result;
let user = this.$store.state.userInfo;
if(this.paytypeWarning.result) {
if(item.status==0){
_hmt.push([
"_trackCustomEvent",
"order_repay",
{
"status":"success",
"member_id": user.data.id
}
])
this.getwei(item);
}else{
this.$router.push({ this.$router.push({
path: "/myorder/usertion", path: '/personal/userpay',
query: { query: {
stype: item.status, userData: item.orderNumber,
orderNumber: item.orderNumber, stype: 1,
}, userPayData: JSON.stringify(userPayData)
}
});
} else {
this.$message({
type: 'error',
message: '订单数据错误，请联系客服进行处理'
}); });
} }
} else { },
_hmt.push([ async repayOrde(ordernumber) {
"_trackCustomEvent", let payType = this.util.pickPaytype();
"order_repay", let res = await repayOrde(ordernumber, payType);
{ if (res) {
"status":"fail", return res;
"member_id": user.data.id }
} },
]) usertiaozhuan(item) {
this.$router.push({
path: '/myorder/usertion',
query: {
stype: item.status,
orderNumber: item.orderNumber
}
});
},
async canceldanhao(orderNumber) {
let data = await canceldanhao(this.userdata, orderNumber);
if (data) {
this.$message({
type: 'warning',
message: '取消订单成功'
});
/* 这个在全部变量去除的时候 记得加 */
// setTimeout(() => {
// this.indet(this.userdata);
// this.activeIndex=0;
// this.useralllist=[];
// console.log('2222');
// }, 500);
}
},
userpay(item, index) {
if (item.status == 0) {
if (confirm('确认取消该订单嘛？')) {
this.canceldanhao(item.orderNumber);
setTimeout(() => {
this.indet(this.userdata);
this.useralllist = [];
this.alllist = [];
this.allmessage = [];
this.obligation = [];
this.receiving = [];
this.pending = [];
}, 500);
}
} else if (item.status == 1) {
//确认收货
}
if (item.buttontitle == '立即支付') {
this.$router.push({
path: '/personal/userpay',
query: {
stype: 1
}
});
} else if (item.status == 3) {
this.$router.push({
path: '/productdetails/producted',
query: {
stype: 1,
productCode: item.productId
}
});
}
},
selectGoods(item, index) {
let list = [];
this.activeIndex = index;
if (item.title == '待付款') {
list = this.obligation;
} else if (item.title == '待收货') {
list = this.receiving;
} else if (item.title == '待发货') {
this.useralllist = this.pending;
list = this.pending;
} else if (item.title == '全部') {
list = this.alllist;
}
this.useralllist = [];
for (var i = 0; i < this.useralllist.length; i++) {
this.useralllist[i].orderNumber = this.goldmedal[i].orderNumber;
this.useralllist[i].status = this.goldmedal[i].status;
this.useralllist[i].addressUserName = this.goldmedal[i].addressUserName;
this.useralllist[i].phoneNumber = this.goldmedal[i].phoneNumber;
this.useralllist[i].salesAmount = this.goldmedal[i].salesAmount;
this.useralllist[i].lengthnum = this.goldmedal[i].orderDetailList.length;
}
console.log(list);
this.useralllist = list.filter(val=>{
return val != undefined;
});;
},
userfind(item) {
this.paytypeWarning = this.util.checkPaytypeValidated(item.paytype);
this.showPaytypeWarning = !this.paytypeWarning.result;
let user = this.userInfo;
if (this.paytypeWarning.result) {
if (item.status == 0) {
_hmt.push([
'_trackCustomEvent',
'order_repay',
{
status: 'success',
member_id: user.id
}
]);
this.getwei(item);
} else {
this.$router.push({
path: '/myorder/usertion',
query: {
stype: item.status,
orderNumber: item.orderNumber
}
});
}
} else {
_hmt.push([
'_trackCustomEvent',
'order_repay',
{
status: 'fail',
member_id: user.id
}
]);
}
},
usertwo() {
this.$router.push({
path: '/myorder/userrecord',
query: {
stype: 1
}
});
},
/* 页面初始化设置数据 */
resetData() {
let stype = this.$route.query.stype;
if (this.userInfo && this.loginState) {
this.indet(this.userdata, stype);
} else {
if (!this.loginState) {
this.$message({
type: 'warning',
message: '请先去登录'
});
}
return;
}
} }
}, }
usertwo() {
this.$router.push({
path: "/myorder/userrecord",
query: {
stype: 1,
},
});
},
},
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@import url("../../assets/css/orderquantity.less"); @import url('../../assets/css/orderquantity.less');
</style> </style>

536
rc-busness/pages/personal/usermember.vue
View File

@ -1,23 +1,21 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="rc-top"></div>
<tabs :crumbs="crumbs"></tabs> <tabs :crumbs="crumbs"></tabs>
<div class="rc-full-width rc-max-width--xl rc-padding-bottom--lg"> <div class="rc-full-width rc-max-width--xl rc-padding-bottom--lg">
<div class="rc-main"> <div class="rc-main">
<div class="rc-center" > <div class="rc-center">
<van-swipe @change="onChange"> <van-swipe @change="onChange">
<van-swipe-item v-for="(banner, index) in banners" :key="index"> <van-swipe-item v-for="(banner, index) in banners" :key="index"><img :src="banner.src" class="useraimg" /></van-swipe-item>
<img :src="banner.src" class="useraimg"/>
</van-swipe-item>
</van-swipe> </van-swipe>
<!-- <img :src='userimage' /> --> <!-- <img :src='userimage' /> -->
</div> </div>
<div class="rc-order"> <div class="rc-order">
<span>当前等级：{{userorder}}</span> <span>当前等级：{{ userorder }}</span>
</div> </div>
<div class="rc-cordd"> <div class="rc-cordd">
<span>距离升级还差:{{ rcvalue }} </span> <span>距离升级还差:{{ rcvalue }}</span>
<div class="block"> <div class="block">
<div class="r-block" ref="userblock"></div> <div class="r-block" ref="userblock"></div>
<!-- <el-slider v-model="value" range show-stops :max="10"> </el-slider> --> <!-- <el-slider v-model="value" range show-stops :max="10"> </el-slider> -->
@ -29,282 +27,288 @@
</div> </div>
</div> </div>
<div class="rc-layout-container"> <div class="rc-layout-container">
<div class="usermember rc-column" v-for="(item,index) in newlist" :key="index"> <div class="usermember rc-column" v-for="(item, index) in newlist" :key="index">
<div class="rc-image"> <div class="rc-image"><img :src="item.catimage" alt="" /></div>
<img :src="item.catimage" alt="" />
</div>
<div class="rc-userorder"> <div class="rc-userorder">
<em>{{item.title}}</em> <em>{{ item.title }}</em>
<span>{{item.usereat}}</span> <span>{{ item.usereat }}</span>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<Myfooter></Myfooter>
</div>
<Myfooter></Myfooter>
</div>
</template> </template>
<script> <script>
import Myheader from '~/components/header.vue' import Myheader from '~/components/header.vue';
import Myfooter from '~/components/rc-footer.vue' import Myfooter from '~/components/rc-footer.vue';
import tabs from "~/components/tabs.vue"; import tabs from '~/components/tabs.vue';
import { mapState } from 'vuex';
export default { export default {
data(){ data() {
return {
return{ crumbs: [
crumbs:[
{ {
path:'/personal/mypersonal', path: '/personal/mypersonal'
}, },
{ {
path:'/personal/usermember/', path: '/personal/usermember/'
} }
], ],
banners:[ banners: [
{src:require("../../assets/image/rc-new.png"),link:""}, { src: require('../../assets/image/rc-new.png'), link: '' },
{src:require("../../assets/image/rc-new1.png"),link:""}, { src: require('../../assets/image/rc-new1.png'), link: '' },
{src:require("../../assets/image/rc-new2.png"),link:""}, { src: require('../../assets/image/rc-new2.png'), link: '' }
], ],
userid:null, userid: null,
userimage:require("../../assets/image/rc-new.png"), userimage: require('../../assets/image/rc-new.png'),
userorder:'新手铲屎官', userorder: '新手铲屎官',
rcvalue:5000, rcvalue: 5000,
uservalue:0, uservalue: 0,
usrnewlist:[], usrnewlist: [],
newlist:[ newlist: [
{ {
title: "产品试吃", title: '产品试吃',
usereat:'每年4次免积分产品试吃', usereat: '每年4次免积分产品试吃',
ordernum: 0, ordernum: 0,
catimage: require("../../assets/image/usereat.png"), catimage: require('../../assets/image/usereat.png')
}, },
{ {
title: "成长工具", title: '成长工具',
usereat:'365天专属养宠工具', usereat: '365天专属养宠工具',
ordernum: 1, ordernum: 1,
catimage: require("../../assets/image/rc-growth.png"), catimage: require('../../assets/image/rc-growth.png')
}, },
{ {
title: "1V1咨询", title: '1V1咨询',
usereat:'10年专业团队1v1咨询', usereat: '10年专业团队1v1咨询',
ordernum: 2, ordernum: 2,
catimage: require("../../assets/image/consult.png"), catimage: require('../../assets/image/consult.png')
}, },
{ {
title: "知识课堂", title: '知识课堂',
usereat:'行业大咖专业养宠知识', usereat: '行业大咖专业养宠知识',
ordernum: 3, ordernum: 3,
catimage: require("../../assets/image/rc-book.png"), catimage: require('../../assets/image/rc-book.png')
}, },
{ {
title: "健康服务", title: '健康服务',
usereat:'每年积分兑换1次价值288元的免费体检及100元医院绝育券', usereat: '每年积分兑换1次价值288元的免费体检及100元医院绝育券',
ordernum: 4, ordernum: 4,
catimage: require("../../assets/image/rc-health.png"), catimage: require('../../assets/image/rc-health.png')
}, }
],
newlista: [
{
title: '产品试吃',
usereat: '每年4次免积分产品试吃',
ordernum: 0,
catimage: require('../../assets/image/usereat.png')
},
{
title: '成长工具',
usereat: '365天专属养宠工具',
ordernum: 1,
catimage: require('../../assets/image/rc-growth.png')
},
{
title: '1V1咨询',
usereat: '10年专业团队1v1咨询',
ordernum: 2,
catimage: require('../../assets/image/consult.png')
},
{
title: '知识课堂',
usereat: '行业大咖专业养宠知识',
ordernum: 3,
catimage: require('../../assets/image/rc-book.png')
},
{
title: '健康服务',
usereat: '每年积分兑换1次价值288元的免费体检及100元医院绝育券',
ordernum: 4,
catimage: require('../../assets/image/rc-health.png')
}
],
senior: [
{
title: '会员奖励',
usereat: '专属升级奖励',
ordernum: 0,
catimage: require('../../assets/image/rc-win.png')
},
], {
newlista:[ title: '产品试吃',
{ usereat: '每年4次免积分产品试吃',
title: "产品试吃", ordernum: 0,
usereat:'每年4次免积分产品试吃', catimage: require('../../assets/image/usereat.png')
ordernum: 0, },
catimage: require("../../assets/image/usereat.png"), {
}, title: '成长工具',
{ usereat: '365天专属养宠工具',
title: "成长工具", ordernum: 1,
usereat:'365天专属养宠工具', catimage: require('../../assets/image/rc-growth.png')
ordernum: 1, },
catimage: require("../../assets/image/rc-growth.png"), {
}, title: '1V1咨询',
{ usereat: '10年专业团队1v1咨询',
title: "1V1咨询", ordernum: 2,
usereat:'10年专业团队1v1咨询', catimage: require('../../assets/image/consult.png')
ordernum: 2, },
catimage: require("../../assets/image/consult.png"), {
}, title: '知识课堂',
{ usereat: '行业大咖专业养宠知识',
title: "知识课堂", ordernum: 3,
usereat:'行业大咖专业养宠知识', catimage: require('../../assets/image/rc-book.png')
ordernum: 3, },
catimage: require("../../assets/image/rc-book.png"), {
}, title: '专属定制',
{ usereat: '爱宠生活定制活动高级养宠宝典',
title: "健康服务", ordernum: 3,
usereat:'每年积分兑换1次价值288元的免费体检及100元医院绝育券', catimage: require('../../assets/image/userself.png')
ordernum: 4, },
catimage: require("../../assets/image/rc-health.png"), {
}, title: '健康服务',
], usereat: '每年积分兑换1次价值288元的免费体检及100元医院绝育券',
senior:[ ordernum: 4,
{ catimage: require('../../assets/image/rc-health.png')
title: "会员奖励", }
usereat:'专属升级奖励', ],
ordernum: 0,
catimage: require("../../assets/image/rc-win.png"),
},
{ goldmedal: [
title: "产品试吃", {
usereat:'每年4次免积分产品试吃', title: '会员奖励',
ordernum: 0, usereat: '专属升级奖励',
catimage: require("../../assets/image/usereat.png"), ordernum: 0,
}, catimage: require('../../assets/image/rc-win.png')
{ },
title: "成长工具",
usereat:'365天专属养宠工具',
ordernum: 1,
catimage: require("../../assets/image/rc-growth.png"),
},
{
title: "1V1咨询",
usereat:'10年专业团队1v1咨询',
ordernum: 2,
catimage: require("../../assets/image/consult.png"),
},
{
title: "知识课堂",
usereat:'行业大咖专业养宠知识',
ordernum: 3,
catimage: require("../../assets/image/rc-book.png"),
},
{
title: "专属定制",
usereat:'爱宠生活定制活动高级养宠宝典',
ordernum: 3,
catimage: require("../../assets/image/userself.png"),
},
{
title: "健康服务",
usereat:'每年积分兑换1次价值288元的免费体检及100元医院绝育券',
ordernum: 4,
catimage: require("../../assets/image/rc-health.png"),
},
],
{
goldmedal :[ title: '产品试吃',
{ usereat: '每年4次免积分产品试吃',
title: "会员奖励", ordernum: 0,
usereat:'专属升级奖励', catimage: require('../../assets/image/usereat.png')
ordernum: 0, },
catimage: require("../../assets/image/rc-win.png"), {
}, title: '产品包邮',
usereat: '尊享订单免邮服务（指点商品）',
{ ordernum: 0,
title: "产品试吃", catimage: require('../../assets/image/usercar.png')
usereat:'每年4次免积分产品试吃', },
ordernum: 0, {
catimage: require("../../assets/image/usereat.png"), title: '成长工具',
}, usereat: '365天专属养宠工具',
{ ordernum: 1,
title: "产品包邮", catimage: require('../../assets/image/rc-growth.png')
usereat:'尊享订单免邮服务（指点商品）', },
ordernum: 0, {
catimage: require("../../assets/image/usercar.png"), title: '1V1咨询',
}, usereat: '10年专业团队1v1咨询',
{ ordernum: 2,
title: "成长工具", catimage: require('../../assets/image/consult.png')
usereat:'365天专属养宠工具', },
ordernum: 1, {
catimage: require("../../assets/image/rc-growth.png"), title: '知识课堂',
}, usereat: '行业大咖专业养宠知识',
{ ordernum: 3,
title: "1V1咨询", catimage: require('../../assets/image/rc-book.png')
usereat:'10年专业团队1v1咨询', },
ordernum: 2, {
catimage: require("../../assets/image/consult.png"), title: '专属定制',
}, usereat: '爱宠生活定制活动高级养宠宝典',
{ ordernum: 3,
title: "知识课堂", catimage: require('../../assets/image/userself.png')
usereat:'行业大咖专业养宠知识', },
ordernum: 3, {
catimage: require("../../assets/image/rc-book.png"), title: '健康服务',
}, usereat: '每年积分兑换1次价值288元的免费体检及100元医院绝育券',
{ ordernum: 4,
title: "专属定制", catimage: require('../../assets/image/rc-health.png')
usereat:'爱宠生活定制活动高级养宠宝典', }
ordernum: 3, ]
catimage: require("../../assets/image/userself.png"), };
}, },
{ methods: {
title: "健康服务", onChange(index) {
usereat:'每年积分兑换1次价值288元的免费体检及100元医院绝育券', console.log(index);
ordernum: 4, if (index == 0) {
catimage: require("../../assets/image/rc-health.png"), this.newlist = this.newlista;
}, } else if (index == 1) {
] this.newlist = this.senior;
} else if (index == 2) {
this.newlist = this.goldmedal;
} }
}, console.log(this.newlist);
methods:{ },
onChange(index){ initData(){
console.log(index); let userwidth = 0;
if(index==0){ // let user = JSON.parse(localStorage.getItem('userInfo'));
this.newlist=this.newlista; let user = this.userInfo;
}else if(index==1){ console.log('33=',user);
this.newlist=this.senior if (user !== null) {
}else if(index==2){ this.userid = user;
this.newlist=this.goldmedal let userlength = this.userid.availiblePoint.toString().length;
console.log(this.userid.availiblePoint);
if (this.userid.memberLevel == 1) {
this.userimage = require('../../assets/image/rc-new.png');
this.userorder = '新手铲屎官';
this.newlist = this.newlista;
this.uservalue = 5000; //新手总积分
this.rcvalue = this.uservalue - this.userid.availiblePoint; //新手总积分减去本身的积分
if (userlength == 1 || userlength == 2 || userlength == 3 || userlength == 4) {
userwidth = this.userid.availiblePoint / 100;
console.log(userwidth);
}
console.log(userwidth);
} else if (this.userid.memberLevel == 2) {
this.userimage = require('../../assets/image/rc-new2.png');
this.userorder = '资深铲屎官';
this.newlist = this.senior;
this.uservalue = 10000;
this.rcvalue = this.uservalue - this.userid.availiblePoint;
userwidth = this.userid.availiblePoint / 100;
console.log('---2222');
} else if (this.userid.memberLevel == 3) {
this.userimage = require('../../assets/image/rc-new1.png');
this.userorder = '金牌铲屎官';
this.newlist = this.goldmedal;
userwidth = 100;
}
this.$refs.userblock.style.width = userwidth + '%';
} else {
console.log('---');
this.userid = [];
}
}
},
components: {
Myheader,
Myfooter,
tabs
},
computed:{
...mapState({
userInfo : state => state.user.userInfo,
})
},
mounted() {
console.log(this.$refs.userblock);
this.initData();
},
watch: {
userInfo(newVal){
if(newVal){
this.initData();
}
} }
console.log(this.newlist)
} }
};
},
components:{
Myheader,
Myfooter,
tabs
},
mounted(){
console.log(this.$refs.userblock);
let userwidth=0;
let user= JSON.parse(localStorage.getItem("userInfo"));
if(user!==null){
this.userid=user.data;
let userlength=this.userid.availiblePoint.toString().length;
console.log(this.userid.availiblePoint);
if(this.userid.memberLevel==1){
this.userimage=require('../../assets/image/rc-new.png');
this.userorder='新手铲屎官';
this.newlist=this.newlista;
this.uservalue=5000; //新手总积分
this.rcvalue=this.uservalue-this.userid.availiblePoint; //新手总积分减去本身的积分
if(userlength==1||userlength==2||userlength==3||userlength==4){
userwidth=this.userid.availiblePoint/100
console.log(userwidth);
}
console.log(userwidth)
}else if( this.userid.memberLevel==2){
this.userimage=require('../../assets/image/rc-new2.png');
this.userorder='资深铲屎官';
this.newlist=this.senior
this.uservalue=10000;
this.rcvalue=this.uservalue-this.userid.availiblePoint;
userwidth=this.userid.availiblePoint/100
console.log('---2222')
}else if( this.userid.memberLevel==3){
this.userimage=require('../../assets/image/rc-new1.png');
this.userorder='金牌铲屎官';
this.newlist=this.goldmedal;
userwidth=100
}
this.$refs.userblock.style.width=userwidth+'%'
}else{
console.log('---');
this.userid=[];
}
}
}
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
@import url("../../assets/css/usermember.less"); @import url('../../assets/css/usermember.less');
</style>
</style>

769
rc-busness/pages/personal/userpay.vue
View File

@ -1,450 +1,435 @@
<template> <template>
<div class="page_modules"> <div class="page_modules">
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top rc-md-up"></div> <div class="rc-top rc-md-up"></div>
<div class="cont_modules"> <div class="cont_modules">
<el-row class="order_info"> <el-row class="order_info">
<el-col :span="6" class="ph_hidden"> <el-col :span="6" class="ph_hidden">
<ul class="li_inline"> <ul class="li_inline">
<li class="sucess_img"> <li class="sucess_img"><img src="../../assets/image/usersucess.png" alt="" /></li>
<img src="../../assets/image/usersucess.png" alt="" /> <li class="ready">
</li> <p>订单提交成功</p>
<li class="ready"> <p>等待付款</p>
<p>订单提交成功</p> </li>
<p>等待付款</p> </ul>
</li> </el-col>
</ul> <el-col :span="12" class="ph_hidden">&nbsp;</el-col>
</el-col> <el-col :span="6" class="ready_right">
<el-col :span="12" class="ph_hidden">&nbsp;</el-col> <div class="inline_right">
<el-col :span="6" class="ready_right"> <p>付款金额:</p>
<div class="inline_right"> <p class="price" v-if="userPayData.userprice">￥{{ userPayData.userprice }}</p>
<p>付款金额:</p> </div>
<p class="price" v-if="userPayData.userprice">￥{{ userPayData.userprice }}</p> <div class="inline_right">
</div> <p>收货信息:</p>
<div class="inline_right"> <p>{{ userPayData.userinformation }}</p>
<p>收货信息:</p> </div>
<p>{{ userPayData.userinformation }}</p> </el-col>
</div> </el-row>
</el-col> </div>
</el-row> <div class="rc_contline"></div>
</div> <div class="cont_modules"><div class="pay_title color_red">请选择支付方式</div></div>
<div class="rc_contline"></div> <div class="rc_contline"></div>
<div class="cont_modules"> <div class="cont_modules">
<div class="pay_title color_red">请选择支付方式</div> <div class="pay_list">
</div> <ul>
<div class="rc_contline"></div> <li
<div class="cont_modules"> class="pay_item"
<div class="pay_list"> v-for="(item, index) in userpaystype"
<ul> :key="index"
<li @click="selectGoods(item, index)"
class="pay_item" :class="activeIndex == index ? 'active' : ''"
v-for="(item, index) in userpaystype" v-if="!disableAlipay || (disableAlipay && item.type != 'alipay')"
:key="index" >
@click="selectGoods(item, index)" <div style="display:flex;">
:class="activeIndex == index ? 'active' : ''" <img :src="item.payimage" alt="" />
v-if="(!disableAlipay || (disableAlipay && item.type!='alipay'))" <span>{{ item.paytype }}支付</span>
> </div>
</li>
<div style="display:flex;"> </ul>
<img :src="item.payimage" alt="" />
<span>{{ item.paytype }}支付</span>
</div>
</li>
</ul>
</div>
</div>
<div class="payconfirm rc-padding-y--md" v-if="disableQrcode">
<span class="ts-standard-btn ts-standard-btn--two center" @click="goPayH5">
确认支付
</span>
</div>
<div class="paycord" v-if="!disableQrcode">
<div class="qrcode"><vue-qr :text="qrtext" :size="260"></vue-qr></div>
<span>{{ paytype }}扫一扫立即支付</span>
</div>
<el-dialog :visible.sync="dialogSuccess" @close="closeDialogSuccess">
<div class="tc dl_cont">
<div class="dl_img">
<img src="../../assets/image/usersucess.png" alt="" />
</div>
<h3 class="title">支付成功</h3>
<p>您的商品我们正在抓紧打包，请耐心等候！</p>
<div class="rc-md-up">
<div class="line_dashed"></div>
<div class="userer">
<div class="qrcode">
<img src="/images/qrcode-wxgroup.jpg">
</div>
<p>微信扫一扫，识别二维码</p>
<p class="tips">加入社群0元试用商品随单发放</p>
</div> </div>
</div> </div>
<div class="rc-md-down">
<p class="tips">加入社群0元试用商品随单发放</p> <div class="payconfirm rc-padding-y--md" v-if="disableQrcode"><span class="ts-standard-btn ts-standard-btn--two center" @click="goPayH5">确认支付</span></div>
<div class="ts-standard-btn center rc-margin-y--lg" @click="toMiniShop">点击加入社群</div>
<div class="paycord" v-if="!disableQrcode">
<div class="qrcode"><vue-qr :text="qrtext" :size="260"></vue-qr></div>
<span>{{ paytype }}扫一扫立即支付</span>
</div> </div>
</div>
</el-dialog> <el-dialog :visible.sync="dialogSuccess" @close="closeDialogSuccess">
<el-dialog :visible.sync="dialogFail" @close="closeDialogFail"> <div class="tc dl_cont">
<div class="tc dl_cont"> <div class="dl_img"><img src="../../assets/image/usersucess.png" alt="" /></div>
<div class="dl_img"> <h3 class="title">支付成功</h3>
<img src="../../assets/pay/fail.png" alt="" /> <p>您的商品我们正在抓紧打包，请耐心等候！</p>
</div> <div class="rc-md-up">
<h3 class="title">支付失败</h3> <div class="line_dashed"></div>
<p>请返回商品结算页面重新支付</p> <div class="userer">
</div> <div class="qrcode"><img src="/images/qrcode-wxgroup.jpg" /></div>
</el-dialog> <p>微信扫一扫，识别二维码</p>
<div style="display:none" ref="h5SubmitForm"> <p class="tips">加入社群0元试用商品随单发放</p>
</div>
</div>
<div class="rc-md-down">
<p class="tips">加入社群0元试用商品随单发放</p>
<div class="ts-standard-btn center rc-margin-y--lg" @click="toMiniShop">点击加入社群</div>
</div>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogFail" @close="closeDialogFail">
<div class="tc dl_cont">
<div class="dl_img"><img src="../../assets/pay/fail.png" alt="" /></div>
<h3 class="title">支付失败</h3>
<p>请返回商品结算页面重新支付</p>
</div>
</el-dialog>
<div style="display:none" ref="h5SubmitForm"></div>
</div> </div>
</div>
</template> </template>
<script> <script>
import Myheader from "~/components/header.vue"; import Myheader from '~/components/header.vue';
import tabs from "@/components/tabs.vue"; import tabs from '@/components/tabs.vue';
import vueQr from 'vue-qr' import vueQr from 'vue-qr';
import { mapMutations } from "vuex"; import { mapMutations } from 'vuex';
import { mapState } from 'vuex';
import { generateOrderAlipay, updateOrderWX, monitorOrderNotify,repayOrde } from "../../ajax/getData"; import { generateOrderAlipay, updateOrderWX, monitorOrderNotify, repayOrde } from '../../ajax/getData';
import util from "@/ajax/util"; import util from '@/ajax/util';
export default { export default {
data() { data() {
return { return {
util, util,
activeIndex: 0, activeIndex: 0,
paymentTimer:undefined, paymentTimer: undefined,
isSucess: false, isSucess: false,
h5PayUrl:"", h5PayUrl: '',
dialogSuccess: false, dialogSuccess: false,
paytype: "微信", paytype: '微信',
userpaystype: [ userpaystype: [
{ {
paytype: "微信", paytype: '微信',
payimage: require("../../assets/pay/wx.png"), payimage: require('../../assets/pay/wx.png'),
type:'wechat' type: 'wechat'
}, },
{
paytype: "支付宝",
payimage: require("../../assets/pay/zfb.png"),
type:'alipay'
},
{
paytype: '支付宝',
payimage: require('../../assets/pay/zfb.png'),
type: 'alipay'
}
], ],
dialogFail: false, dialogFail: false,
userPayData: {}, userPayData: {},
qrtext:'', qrtext: '',
userData:'', userData: '',
disableAlipay:true, disableAlipay: true,
disableQrcode:false, disableQrcode: false
}; };
}, },
created(){ created() {},
mounted() {
},
mounted() {
let isWx = this.util.isWX();
if(!isWx) {
//this.disableAlipay = false; //Disabled due to 0 deposit quota
}
let stype=this.$route.query.stype;
this.userPayData = JSON.parse(this.$route.query.userPayData);
this.defaultHandlePayment();
},
methods: {
...mapMutations(["checkIsLogin"]),
detectQrcodeDisplay(){
let payType = this.util.pickPaytype();
switch(payType) {
case 1:
this.disableQrcode=false;
break;
case 2:
this.disableQrcode=true;
break;
case 3:
//TODO raise WX jsapi pay
break;
}
},
defaultHandlePayment() {
let isMobile = this.util.isMobile();
let isWx = this.util.isWX(); let isWx = this.util.isWX();
let payType = this.util.pickPaytype(); if (!isWx) {
if(!this.userPayData.wxPay || this.userPayData.wxPay.length<4) //this.disableAlipay = false; //Disabled due to 0 deposit quota
throw new Error("订单信息错误，请删除商品后再次购买");
this.detectQrcodeDisplay();
//Dictionary : 1: scan qrcode, 2:redirect 3: raise local app
switch(payType) {
case 1:
this.qrtext=this.userPayData.wxPay;
this.updateOrderNotification();
break;
case 2:
this.$refs["h5SubmitForm"].innerHTML = '<form action="'+this.userPayData.wxPay+'" method="post"><form>';
break;
case 3:
//TODO raise WX jsapi pay
break;
} }
this.checkIsLogin(); let stype = this.$route.query.stype;
let user = this.$store.state.userInfo; this.userPayData = JSON.parse(this.$route.query.userPayData);
let memberId = ''; this.defaultHandlePayment();
if(user)
memberId = user.data.id;
_hmt.push([
"_trackCustomEvent",
"payment",
{
"member_id": memberId,
"payType" : payType,
"product_amount" : this.userPayData.userprice,
}
])
}, },
goPayH5() { methods: {
if(this.userPayData.wxPay) { ...mapMutations(['checkIsLogin']),
//this.$refs["h5SubmitForm"].action="http://47.96.75.242:10086/royalcanin/royalcanin/redirectUrlWXH5"; detectQrcodeDisplay() {
//this.$refs["h5SubmitForm"].action=this.userPayData.wxPay; let payType = this.util.pickPaytype();
this.$refs["h5SubmitForm"].children[0].submit() switch (payType) {
//window.location.href=this.userPayData.wxPay; case 1:
//this.disableQrcode=true; this.disableQrcode = false;
} else { break;
throw new Error("订单信息错误，请删除商品后再次购买"); case 2:
} this.disableQrcode = true;
}, break;
closeDialogSuccess() { case 3:
this.qrtext = ''; //TODO raise WX jsapi pay
this.$router.push({ break;
path: "/myorder/usertion",
query:{
stype:1,
orderNumber:this.userPayData.orderId
} }
}); },
}, defaultHandlePayment() {
closeDialogFail() { let isMobile = this.util.isMobile();
this.qrtext = ''; let isWx = this.util.isWX();
// this.$router.push({ let payType = this.util.pickPaytype();
// path: "/personal/useraddress", if (!this.userPayData.wxPay || this.userPayData.wxPay.length < 4) throw new Error('订单信息错误，请删除商品后再次购买');
// }); this.detectQrcodeDisplay();
}, //Dictionary : 1: scan qrcode, 2:redirect 3: raise local app
toMiniShop() { switch (payType) {
_hmt.push([ case 1:
"_trackCustomEvent", this.qrtext = this.userPayData.wxPay;
"jump_to_crmMiniApp", this.updateOrderNotification();
{ break;
"type": "finish_payment" case 2:
} this.$refs['h5SubmitForm'].innerHTML = '<form action="' + this.userPayData.wxPay + '" method="post"><form>';
]) break;
setTimeout(function(){ case 3:
window.location.href="https://miniapp-product.royalcanin.com.cn/rcmini2020/admin/Voucher/urlRedirect.html"; //TODO raise WX jsapi pay
},800); break;
}
this.checkIsLogin();
// let user = this.$store.state.userInfo;
let memberId = '';
if (this.userInfo){
memberId = this.userInfo.id;
}
_hmt.push([
'_trackCustomEvent',
'payment',
{
member_id: memberId,
payType: payType,
product_amount: this.userPayData.userprice
}
]);
},
goPayH5() {
if (this.userPayData.wxPay) {
//this.$refs["h5SubmitForm"].action="http://47.96.75.242:10086/royalcanin/royalcanin/redirectUrlWXH5";
//this.$refs["h5SubmitForm"].action=this.userPayData.wxPay;
this.$refs['h5SubmitForm'].children[0].submit();
//window.location.href=this.userPayData.wxPay;
//this.disableQrcode=true;
} else {
throw new Error('订单信息错误，请删除商品后再次购买');
}
},
closeDialogSuccess() {
this.qrtext = '';
this.$router.push({
path: '/myorder/usertion',
query: {
stype: 1,
orderNumber: this.userPayData.orderId
}
});
},
closeDialogFail() {
this.qrtext = '';
// this.$router.push({
// path: "/personal/useraddress",
// });
},
toMiniShop() {
_hmt.push([
'_trackCustomEvent',
'jump_to_crmMiniApp',
{
type: 'finish_payment'
}
]);
setTimeout(function() {
window.location.href = 'https://miniapp-product.royalcanin.com.cn/rcmini2020/admin/Voucher/urlRedirect.html';
}, 800);
},
async selectGoods(item, index) {
this.activeIndex = index;
this.paytype = item.paytype;
if (index == 1) {
//支付宝
let isMobile = this.util.isMobile();
isMobile = isMobile ? 2 : 1;
let res = await generateOrderAlipay(this.userPayData.orderId, isMobile);
if (res.success) {
this.disableQrcode = true;
let virtualForm = res.data;
virtualForm = virtualForm.substr(0, virtualForm.indexOf('</form>') + 7);
this.$refs['h5SubmitForm'].innerHTML = virtualForm;
}
} else {
this.userPayData = JSON.parse(this.$route.query.userPayData);
this.qrtext = this.userPayData.wxPay;
this.$refs['h5SubmitForm'].innerHTML = '<form method="get" action="' + this.userPayData.wxPay + '"></form>';
this.detectQrcodeDisplay();
}
},
//支付监听
async updateOrderNotification() {
let res = await monitorOrderNotify(this.userPayData.orderId);
if (res.success) {
this.qrtext = '成功加入群的二维码';
this.dialogSuccess = true;
// let user = this.$store.state.userInfo;
let memberId = '';
if(this.userInfo){
memberId = this.userInfo.id;
}
// if (user) memberId = user.data.id;
_hmt.push([
'_trackCustomEvent',
'payment_finished',
{
member_id: memberId,
payType: 'native',
product_amount: this.userPayData.userprice
}
]);
} else if (res.fail) {
this.dialogFail = true;
} else {
let _self = this;
this.paymentTimer = setTimeout(function() {
_self.updateOrderNotification();
}, 5000);
}
}
}, },
async selectGoods(item, index) { components: {
this.activeIndex = index; Myheader,
this.paytype = item.paytype; tabs,
if (index == 1) { vueQr
//支付宝 },
let isMobile = this.util.isMobile(); computed: {
isMobile = (isMobile?2:1); ...mapState({
let res = await generateOrderAlipay(this.userPayData.orderId, isMobile); userInfo : state => state.user.userInfo,
if (res.success) { })
this.disableQrcode = true; }
let virtualForm = res.data;
virtualForm = virtualForm.substr(0,virtualForm.indexOf("</form>")+7);
this.$refs["h5SubmitForm"].innerHTML = virtualForm;
}
} else {
this.userPayData = JSON.parse(this.$route.query.userPayData);
this.qrtext=this.userPayData.wxPay;
this.$refs["h5SubmitForm"].innerHTML = '<form method="get" action="'+this.userPayData.wxPay+'"></form>';
this.detectQrcodeDisplay();
}
},
//支付监听
async updateOrderNotification() {
let res = await monitorOrderNotify(this.userPayData.orderId);
if (res.success) {
this.qrtext = '成功加入群的二维码';
this.dialogSuccess = true;
let user = this.$store.state.userInfo;
let memberId = '';
if(user)
memberId = user.data.id;
_hmt.push([
"_trackCustomEvent",
"payment_finished",
{
"member_id" : memberId,
"payType" : 'native',
"product_amount" : this.userPayData.userprice,
}
])
} else if (res.fail) {
this.dialogFail = true;
} else {
let _self = this;
this.paymentTimer = setTimeout(function(){
_self.updateOrderNotification()
},5000);
}
}
},
components: {
Myheader,
tabs,
vueQr,
},
}; };
</script> </script>
<style lang="less" scoped > <style lang="less" scoped>
.sucess_img { .sucess_img {
width: 96px; width: 96px;
height: 96px; height: 96px;
margin-right: 10px; margin-right: 10px;
} }
.order_info { .order_info {
padding: 10px 0; padding: 10px 0;
} }
.info { .info {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.ready { .ready {
font-size: 20px; font-size: 20px;
color: #e2001a; color: #e2001a;
} }
.ready_right { .ready_right {
line-height: 200%; line-height: 200%;
padding-top: 8px; padding-top: 8px;
} }
.price { .price {
font-size: 20px; font-size: 20px;
color: #e2001a; color: #e2001a;
} }
.pay_title { .pay_title {
font-size: 26px; font-size: 26px;
padding: 26px 0; padding: 26px 0;
border-bottom: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7;
} }
.pay_list { .pay_list {
padding: 20px 0; padding: 20px 0;
.pay_item { .pay_item {
float: left; float: left;
margin-right: 20px; margin-right: 20px;
display: flex; display: flex;
justify-content: center; justify-content: center;
border: 1px solid #333333; border: 1px solid #333333;
padding: 5px 20px; padding: 5px 20px;
cursor: pointer; cursor: pointer;
&.active { &.active {
border: 1px solid #e2001a; border: 1px solid #e2001a;
color: #e2001a; color: #e2001a;
} }
img { img {
margin-right: 5px; margin-right: 5px;
width: 24px; width: 24px;
height: 24px; height: 24px;
} }
} }
&::after { &::after {
content: ""; content: '';
display: block; display: block;
clear: both; clear: both;
} }
} }
.paycord { .paycord {
padding: 10px; padding: 10px;
text-align: center; text-align: center;
.qrcode { .qrcode {
margin: 0 auto 10px; margin: 0 auto 10px;
width: 260px; width: 260px;
height: 260px; height: 260px;
} }
} }
.dl_width { .dl_width {
width: 440px; width: 440px;
} }
.dl_cont { .dl_cont {
color: #333; color: #333;
margin-top: -10px; margin-top: -10px;
.title { .title {
font-size: 26px; font-size: 26px;
font-weight: bold; font-weight: bold;
padding-bottom: 10px; padding-bottom: 10px;
} }
.line_dashed { .line_dashed {
border-bottom: 2px dashed #999999; border-bottom: 2px dashed #999999;
margin: 10px 0; margin: 10px 0;
} }
.dl_img { .dl_img {
img { img {
width: 90px; width: 90px;
height: 90px; height: 90px;
margin: 0 auto; margin: 0 auto;
} }
padding: 0px 0 20px; padding: 0px 0 20px;
} }
.userer { .userer {
img { img {
margin: 0 auto; margin: 0 auto;
} }
} }
.tips { .tips {
color: #e2001a; color: #e2001a;
margin-top: 30px; margin-top: 30px;
font-size: 18px; font-size: 18px;
} }
} }
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
.payconfirm{ .payconfirm {
position:fixed; position: fixed;
bottom:0; bottom: 0;
left:0; left: 0;
width:100%; width: 100%;
} }
.ph_hidden {
display: none;
}
.ready_right {
width: 100%;
padding: 10px;
}
.pay_title {
padding: 10px;
}
.pay_list {
padding: 0;
.pay_item {
float: none;
border: none;
border-bottom: 1px solid #d7d7d7;
height: 50px;
margin-right: 0;
align-items: center;
justify-content: left;
justify-content: left;
&.active {
border: none;
border-bottom: 4px solid #e2001a; .ph_hidden {
} display: none;
} }
} .ready_right {
.paycord { width: 100%;
//display: none; padding: 10px;
} }
.pay_title {
padding: 10px;
}
.pay_list {
padding: 0;
.pay_item {
float: none;
border: none;
border-bottom: 1px solid #d7d7d7;
height: 50px;
margin-right: 0;
align-items: center;
justify-content: left;
justify-content: left;
&.active {
border: none;
border-bottom: 4px solid #e2001a;
}
}
}
.paycord {
//display: none;
}
} }
</style> </style>

1265
rc-busness/pages/productdetails/producted.vue
View File

File diff suppressed because it is too large Load Diff

424
rc-busness/pages/useraddress/addaddress.vue
View File

@ -1,236 +1,222 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="rc-top"></div>
<div class="usercontend"> <div class="usercontend">
<div class="rc-max-width--xl"> <div class="rc-max-width--xl">
<h2>新增收货地址</h2> <h2>新增收货地址</h2>
<div class="rc-max-width--xl rc-people rc-full-width"> <div class="rc-max-width--xl rc-people rc-full-width">
<span>收货人:</span> <span>收货人:</span>
<input type="text" placeholder="请输入收货人姓名" v-model="userpeople"> <input type="text" placeholder="请输入收货人姓名" v-model="userpeople" />
</div> </div>
<div class="rc-max-width--xl rc-people rc-phone rc-full-width"> <div class="rc-max-width--xl rc-people rc-phone rc-full-width">
<span>手机号码:</span> <span>手机号码:</span>
<input type="text" placeholder="请输入11位手机号码" v-model="tel" :error-message="usertel"> <input type="text" placeholder="请输入11位手机号码" v-model="tel" :error-message="usertel" />
</div> </div>
<div class="rc-max-width--xl rc-people rc-address rc-full-width"> <div class="rc-max-width--xl rc-people rc-address rc-full-width">
<span>所在地区:</span> <span>所在地区:</span>
<!-- <input type="text" placeholder="请选择所在地区"> --> <!-- <input type="text" placeholder="请选择所在地区"> -->
<addressInput @getmenu="onGetMenu" @closeDialog = "handleClose1" :dialogInfo1="dialogInfo1"></addressInput> <addressInput @getmenu="onGetMenu" @closeDialog="handleClose1" :dialogInfo1="dialogInfo1"></addressInput>
</div> </div>
<div class="rc-max-width--xl rc-people rc-useaddress"> <div class="rc-max-width--xl rc-people rc-useaddress">
<span>详细地址:</span> <span>详细地址:</span>
<input type="text" placeholder="小区、门牌号等" class="userinput" v-model="alladdress"> <input type="text" placeholder="小区、门牌号等" class="userinput" v-model="alladdress" />
<textarea rows="10" cols="30" placeholder="请输入详细地址" v-model="alladdress"> <textarea rows="10" cols="30" placeholder="请输入详细地址" v-model="alladdress"></textarea>
</textarea> </div>
</div> </div>
</div>
</div> <div class="rc-button">
<span @click="openclose()">取消</span>
</div> <em @click="register()">确认</em>
<div class="rc-button"> </div>
<span @click="openclose()">取消</span> <!-- <div class="rc-button">
<em @click="register()">确认</em>
</div>
<!-- <div class="rc-button">
<div class="rc-footbutton" @click="onAdd()"> <div class="rc-footbutton" @click="onAdd()">
<span>新增收货地址</span> <span>新增收货地址</span>
</div> </div>
</div> --> </div> -->
<MyFooter></MyFooter>
</div>
<MyFooter></MyFooter>
</div>
</template> </template>
<script> <script>
import Myheader from '~/components/header.vue';
import Myheader from '~/components/header.vue' import addressInput from '~/components/addressInput.vue';
import addressInput from '~/components/addressInput.vue' import MyFooter from '~/components/rc-footer.vue';
import MyFooter from '~/components/rc-footer.vue' import { editaddress } from '../../ajax/getData';
import {editaddress} from "../../ajax/getData"; import { mapState } from 'vuex';
export default { export default {
data() { data() {
return { return {
chosenAddressId: "1", chosenAddressId: '1',
usermessage:null, usermessage: null,
checked: true, checked: true,
tel: "", tel: '',
alladdress:'', alladdress: '',
userid: null, // userid: null,
usermessage:null, usermessage: null,
dialogInfo1:false, dialogInfo1: false,
userpeople:'', userpeople: '',
provinceId:'', provinceId: '',
cityId:'', cityId: '',
districtId:'', districtId: '',
list: [ list: [
{ {
id: 1, id: 1,
name: "张三", name: '张三',
tel: "13000000000", tel: '13000000000',
address: "浙江省杭州市西湖区文三路 138 号", address: '浙江省杭州市西湖区文三路 138 号',
isDefault: true, isDefault: true
}, },
{ {
id: 2, id: 2,
name: "李四", name: '李四',
tel: "1310000000", tel: '1310000000',
address: "浙江省杭州市拱墅区莫干山路 50 号", address: '浙江省杭州市拱墅区莫干山路 50 号'
}, },
{ {
id: 3, id: 3,
name: "李四", name: '李四',
tel: "1310000000", tel: '1310000000',
address: "浙江省杭州市拱墅区莫干山路 50 号", address: '浙江省杭州市拱墅区莫干山路 50 号'
}, }
], ]
}; };
}, },
methods: { methods: {
onGetMenu(values){ onGetMenu(values) {
console.log(values,+'111111'); console.log(values, +'111111');
let user=values[2].id; let user = values[2].id;
user=user.split('-'); user = user.split('-');
this.provinceId=user[0]; this.provinceId = user[0];
this.cityId=user[1]; this.cityId = user[1];
this.districtId=user[2]; this.districtId = user[2];
}, },
handleClose1(){ handleClose1() {
this.dialogInfo1 = false this.dialogInfo1 = false;
}, },
register(){ register() {
if (this.alladdress==='') { if (this.alladdress === '') {
this.$message({ this.$message({
type: 'warning', type: 'warning',
message: '请输入详细地址 ' message: '请输入详细地址 '
}); });
return return;
}if(!/^[1][3,4,5,7,8][0-9]{9}$/.test(this.tel) || this.tel === ""){ }
this.$message({ if (!/^[1][3,4,5,7,8][0-9]{9}$/.test(this.tel) || this.tel === '') {
type: 'warning', this.$message({
message: '手机号码输入有误' type: 'warning',
}); message: '手机号码输入有误'
return });
} return;
else if(this.userpeople===''){ } else if (this.userpeople === '') {
this.$message({ this.$message({
type: 'warning', type: 'warning',
message: '请填写收货人' message: '请填写收货人'
}); });
return return;
} } else if (this.provinceId === '') {
else if(this.provinceId===''){ this.$message({
this.$message({ type: 'warning',
type: 'warning', message: '请选择省区'
message: '请选择省区' });
}); return;
return } else if (this.cityId === '') {
} this.$message({
else if(this.cityId===''){ type: 'warning',
this.$message({ message: '请选择市区'
type: 'warning', });
message: '请选择市区' return;
}); } else if (this.districtId === '') {
return this.$message({
} type: 'warning',
else if(this.districtId===''){ message: '请选择详细的区域'
this.$message({ });
type: 'warning', return;
message: '请选择详细的区域' } else {
}); this.editaddress();
return }
} },
openclose() {
this.$router.push({
path: '/useraddress/openaddress'
// query: {
// id: userid,
// },
});
},
else{ //添加
this.editaddress(); async editaddress(item) {
} // this.userid
}, let useradd = {
openclose(){ memberId: this.userid,
this.$router.push({ detailAddress: this.alladdress,
path: "/useraddress/openaddress", recipient: this.userpeople,
// query: { recipientPhone: this.tel,
// id: userid, provinceId: this.provinceId,
// }, cityId: this.cityId,
}); districtId: this.districtId
}, };
let data = await editaddress(useradd);
if (data) {
console.log(data);
if (data) {
this.$message({
type: 'warning',
message: '地址添加成功'
});
this.$router.push({
path: '/useraddress/openaddress'
// query: {
// id: userid,
// },
});
}
}
}
//查询人的所有地址
// async editaddress(user) {
// user.data.id=844350
// let data = await selectaddress(user.data.id);
// this.list=data.data;
// console.log(this.list);
// console.log(data);
// },
},
components: {
Myheader,
MyFooter,
addressInput
},
computed: {
usertel() {
if (this.tel === '') {
return '';
} else if (!/^[1][3,4,5,7,8][0-9]{9}$/.test(this.tel)) {
return '手机号格式错误';
} else {
return '';
}
},
...mapState({
userid : state => state.user.userInfo.id,
})
},
//添加 mounted() {
async editaddress(item) { this.usermessage = JSON.parse(localStorage.getItem('userInfo'));
// this.userid // this.editaddress(this.usermessage);
let useradd={ // this.userid = this.usermessage.data.id;
memberId:this.userid, //地址的查询
detailAddress:this.alladdress, // this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
recipient:this.userpeople, // this.editaddress(this.usermessage);
recipientPhone:this.tel, // this.userid = this.usermessage.data.id;
provinceId:this.provinceId, }
cityId:this.cityId,
districtId:this.districtId
}
let data = await editaddress(useradd);
if(data){
console.log(data);
if(data){
this.$message({
type: 'warning',
message: '地址添加成功'
});
this.$router.push({
path: "/useraddress/openaddress",
// query: {
// id: userid,
// },
});
}
}
},
//查询人的所有地址
// async editaddress(user) {
// user.data.id=844350
// let data = await selectaddress(user.data.id);
// this.list=data.data;
// console.log(this.list);
// console.log(data);
// },
},
components: {
Myheader,
MyFooter,
addressInput
},
computed:{
usertel() {
if (this.tel === "") {
return "";
} else if (!/^[1][3,4,5,7,8][0-9]{9}$/.test(this.tel)) {
return "手机号格式错误";
} else {
return "";
}
},
},
mounted() {
this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
// this.editaddress(this.usermessage);
this.userid = this.usermessage.data.id;
//地址的查询
// this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
// this.editaddress(this.usermessage);
// this.userid = this.usermessage.data.id;
},
}; };
</script> </script>
<style lang="less" scoped > <style lang="less" scoped>
@import url("../../assets/css/addaddress.less"); @import url('../../assets/css/addaddress.less');
</style> </style>

469
rc-busness/pages/useraddress/editaddress.vue
View File

@ -1,258 +1,247 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="rc-top"></div>
<div class="usercontend"> <div class="usercontend">
<div class="rc-max-width--xl"> <div class="rc-max-width--xl">
<div class="rc-max-width--xl rc-people"> <div class="rc-max-width--xl rc-people">
<span>收货人:</span> <span>收货人:</span>
<input type="text" placeholder="" v-model="recipient"> <input type="text" placeholder="" v-model="recipient" />
</div> </div>
<div class="rc-max-width--xl rc-people rc-phone"> <div class="rc-max-width--xl rc-people rc-phone">
<span>手机号码:</span> <span>手机号码:</span>
<input type="text" placeholder="" v-model="recipientPhone"> <input type="text" placeholder="" v-model="recipientPhone" />
</div> </div>
<div class="rc-max-width--xl rc-people rc-address"> <div class="rc-max-width--xl rc-people rc-address">
<span>所在地区:</span> <span>所在地区:</span>
<addressInput @getmenu="onGetMenu" @closeDialog = "handleClose1" :dialogInfo1="dialogInfo1" :defaultValues="defaultValues"></addressInput> <addressInput @getmenu="onGetMenu" @closeDialog="handleClose1" :dialogInfo1="dialogInfo1" :defaultValues="defaultValues"></addressInput>
</div> </div>
<div class="rc-max-width--xl rc-people rc-useaddress"> <div class="rc-max-width--xl rc-people rc-useaddress">
<span>详细地址:</span> <span>详细地址:</span>
<input type="text" placeholder="" v-model="detailAddress" > <input type="text" placeholder="" v-model="detailAddress" />
</div> </div>
</div>
</div> <!-- <div class="rc-button">
<!-- <div class="rc-button">
<div class="rc-footbutton" @click="onAdd()"> <div class="rc-footbutton" @click="onAdd()">
<span>新增收货地址</span> <span>新增收货地址</span>
</div> </div>
</div> --> </div> -->
</div>
<div class="rc-button">
</div> <span @click="openclose()">取消</span>
<div class="rc-button"> <em @click="register()">确认</em>
<span @click="openclose()">取消</span> </div>
<em @click="register()">确认</em> <MyFooter></MyFooter>
</div> </div>
<MyFooter></MyFooter>
</div>
</template> </template>
<script> <script>
import Myheader from '~/components/header.vue';
import Myheader from '~/components/header.vue' import MyFooter from '~/components/rc-footer.vue';
import MyFooter from '~/components/rc-footer.vue' import { editupdate } from '../../ajax/getData';
import { editupdate} from "../../ajax/getData"; import addressInput from '~/components/addressInput.vue';
import addressInput from '~/components/addressInput.vue' import { mapState } from 'vuex';
export default { export default {
data() { data() {
return { return {
chosenAddressId: "1", chosenAddressId: '1',
checked: true, checked: true,
userid: null, // userid: null,
dialogInfo1:false, dialogInfo1: false,
usermessage:null, usermessage: null,
useradrname:[], useradrname: [],
detailAddress:'', detailAddress: '',
recipientPhone:'', recipientPhone: '',
recipient:'', recipient: '',
addressid:'', addressid: '',
provinceId:'', provinceId: '',
cityId:'', cityId: '',
districtId:'', districtId: '',
defaultValues:[], defaultValues: [],
list: [ list: [
{ {
id: 1, id: 1,
name: "张三", name: '张三',
tel: "13000000000", tel: '13000000000',
address: "浙江省杭州市西湖区文三路 138 号", address: '浙江省杭州市西湖区文三路 138 号',
isDefault: true, isDefault: true
}, },
{ {
id: 2, id: 2,
name: "李四", name: '李四',
tel: "1310000000", tel: '1310000000',
address: "浙江省杭州市拱墅区莫干山路 50 号", address: '浙江省杭州市拱墅区莫干山路 50 号'
}, },
{ {
id: 3, id: 3,
name: "李四", name: '李四',
tel: "1310000000", tel: '1310000000',
address: "浙江省杭州市拱墅区莫干山路 50 号", address: '浙江省杭州市拱墅区莫干山路 50 号'
}, }
], ]
}; };
}, },
methods: { methods: {
onGetMenu(values){ onGetMenu(values) {
let user; let user;
console.log(values,+'111111'); console.log(values, +'111111');
console.log(typeof(values[2])); console.log(typeof values[2]);
const objToStr = JSON.stringify(values[2]); const objToStr = JSON.stringify(values[2]);
console.log(objToStr); console.log(objToStr);
console.log(typeof(objToStr)); console.log(typeof objToStr);
if(objToStr.includes('-')){ if (objToStr.includes('-')) {
console.log("===包含符号") console.log('===包含符号');
let user=values[2].id; let user = values[2].id;
user=user.split('-'); user = user.split('-');
this.provinceId=user[0]; this.provinceId = user[0];
this.cityId=user[1]; this.cityId = user[1];
this.districtId=user[2]; this.districtId = user[2];
}else{ } else {
this.provinceId=values[0].id; this.provinceId = values[0].id;
this.cityId=values[1].id; this.cityId = values[1].id;
this.districtId=values[2].id; this.districtId = values[2].id;
console.log("---不包含符号"); console.log('---不包含符号');
} }
// let user=values[2].id; // let user=values[2].id;
// user=user.split('-'); // user=user.split('-');
console.log(this.provinceId, this.cityId, this.districtId);
console.log(this.provinceId,this.cityId,this.districtId); },
}, openclose() {
openclose(){ this.$router.push({
this.$router.push({ path: '/useraddress/openaddress'
path: "/useraddress/openaddress", });
}); },
}, handleClose1() {
handleClose1(){ this.dialogInfo1 = false;
this.dialogInfo1 = false },
},
register(){
console.log(this.tel)
if (!/^[1][3,4,5,7,8][0-9]{9}$/.test(this.recipientPhone) || this.recipientPhone === "") {
this.$message({
type: 'warning',
message: '手机号码输入有误'
});
return
}else if(this.alladdress===''){
this.$message({
type: 'warning',
message: '请输入详细地址'
});
return
}
else if(this.userpeople===''){
this.$message({
type: 'warning',
message: '请输入姓名'
});
return
}
else if(this.provinceId===''){
this.$message({
type: 'warning',
message: '请填写省区'
});
return
}
else if(this.userpeople===''){
this.$message({
type: 'warning',
message: '请填写市区'
});
return
}
else if(this.userpeople===''){
this.$message({
type: '请填写街道',
message: '请输入姓名'
});
return
}
else{
this.edupdate();
}
},
//更改 register() {
async edupdate(item) { console.log(this.tel);
let useradd={ if (!/^[1][3,4,5,7,8][0-9]{9}$/.test(this.recipientPhone) || this.recipientPhone === '') {
memberId:this.userid, this.$message({
id:this.id, type: 'warning',
provinceId:this.provinceId,//省份id, message: '手机号码输入有误'
cityId:this.cityId,//城市id, });
districtId:this.districtId,//区域id, return;
detailAddress:this.detailAddress, //详细地址 } else if (this.alladdress === '') {
recipient:this.recipient, //收件人姓名 this.$message({
recipientPhone:this.recipientPhone, //收件人电话 type: 'warning',
} message: '请输入详细地址'
let data = await editupdate(useradd); });
if(data){ return;
this.$message({ } else if (this.userpeople === '') {
type: 'warning', this.$message({
message: '地址修改成功' type: 'warning',
}); message: '请输入姓名'
this.$router.push({ });
path: "/useraddress/openaddress", return;
}); } else if (this.provinceId === '') {
this.$message({
type: 'warning',
message: '请填写省区'
});
return;
} else if (this.userpeople === '') {
this.$message({
type: 'warning',
message: '请填写市区'
});
return;
} else if (this.userpeople === '') {
this.$message({
type: '请填写街道',
message: '请输入姓名'
});
return;
} else {
this.edupdate();
}
},
} //更改
async edupdate(item) {
let useradd = {
memberId: this.userid,
id: this.id,
provinceId: this.provinceId, //省份id,
cityId: this.cityId, //城市id,
districtId: this.districtId, //区域id,
detailAddress: this.detailAddress, //详细地址
recipient: this.recipient, //收件人姓名
recipientPhone: this.recipientPhone //收件人电话
};
let data = await editupdate(useradd);
if (data) {
this.$message({
type: 'warning',
message: '地址修改成功'
});
this.$router.push({
path: '/useraddress/openaddress'
});
}
}
}, //删除地址
// async userdelete(item) {
// console.log(item.memberId);
// let data = await editdelete(this.userid, item.id);
// this.editaddress(this.usermessage);
// console.log(data);
// },
//查询人的所有地址
// async editaddress(user) {
// user.data.id=844350
//删除地址 // let data = await selectaddress(user.data.id);
// async userdelete(item) { // this.list=data.data;
// console.log(item.memberId); // console.log(this.list);
// let data = await editdelete(this.userid, item.id); // console.log(data);
// this.editaddress(this.usermessage); // },
// console.log(data); },
// }, components: {
Myheader,
//查询人的所有地址 MyFooter,
// async editaddress(user) { addressInput
// user.data.id=844350 },
// let data = await selectaddress(user.data.id); created() {
// this.list=data.data; let provinceName = this.$route.query.provinceName;
// console.log(this.list); let districtName = this.$route.query.districtName;
// console.log(data); let cityName = this.$route.query.cityName;
// }, this.provinceId = this.$route.query.provinceId;
}, this.districtId = this.$route.query.districtId;
components: { this.cityId = this.$route.query.cityId;
Myheader, this.defaultValues = [
MyFooter, {
addressInput id: this.provinceId,
}, name: provinceName
created(){ },
let provinceName=this.$route.query.provinceName; {
let districtName=this.$route.query.districtName; id: this.cityId,
let cityName=this.$route.query.cityName name: cityName
this.provinceId=this.$route.query.provinceId; },
this.districtId=this.$route.query.districtId; {
this.cityId=this.$route.query.cityId; id: this.districtId,
this.defaultValues=[ name: districtName
{ }
id:this.provinceId, ];
name:provinceName },
}, mounted() {
{ // this.userid = JSON.parse(localStorage.getItem('userInfo')).data.id;
id:this.cityId, this.recipient = this.$route.query.recipient;
name:cityName this.recipientPhone = this.$route.query.recipientPhone;
}, this.detailAddress = this.$route.query.detailAddress;
{ this.id = this.$route.query.id;
id:this.districtId, },
name:districtName computed:{
} ...mapState({
]; userid : state => state.user.userInfo.id,
})
}, }
mounted() {
this.userid = JSON.parse(localStorage.getItem("userInfo")).data.id;
this.recipient=this.$route.query.recipient
this.recipientPhone=this.$route.query.recipientPhone
this.detailAddress=this.$route.query.detailAddress
this.id=this.$route.query.id;
},
}; };
</script> </script>
<style lang="less" scoped > <style lang="less" scoped>
@import url("../../assets/css/addaddress.less"); @import url('../../assets/css/addaddress.less');
</style> </style>

367
rc-busness/pages/useraddress/openaddress.vue
View File

@ -1,206 +1,203 @@
<template> <template>
<div> <div>
<Myheader></Myheader> <Myheader></Myheader>
<div class="rc-top"></div> <div class="rc-top"></div>
<tabs :crumbs="crumbs"></tabs> <tabs :crumbs="crumbs"></tabs>
<div class="online bold"></div> <div class="online bold"></div>
<div class="usercontshow rc-max-width--xl"> <div class="usercontshow rc-max-width--xl">
<div class="usercontend" v-for="(item, index) in list" :key="index"> <div class="usercontend" v-for="(item, index) in list" :key="index">
<div class="usercontshow usermain" > <div class="usercontshow usermain">
<div class="rc-cat" > <div class="rc-cat">
<div class="rc-center"> <div class="rc-center">
<div class=" rc-title"> <div class=" rc-title">
<em> <em>{{ item.recipient }}</em>
{{ item.recipient }} <span>{{ item.recipientPhone }}</span>
</em> </div>
<span> <div class="rc-address">
{{ item.recipientPhone }} <span>{{ item.provinceName }}{{ item.districtName }}{{ item.detailAddress }}</span>
</span> </div>
</div> <div class="rc-footer">
<div class="rc-address"> <div class="rc-foot">
<span> <img
{{item.provinceName}}{{ item.districtName }}{{item.detailAddress}} :src="item.isDefault ? require('../../assets/image/userred.png') : require('../../assets/image/userselect.png')"
</span> @click="changeadddress(item, index)"
</div> />
<div class="rc-footer"> <span>设置为默认收货地址</span>
<div class="rc-foot"> </div>
<img :src="item.isDefault?require('../../assets/image/userred.png'):require('../../assets/image/userselect.png')" @click="changeadddress(item,index)"/> <div class="rc-right">
<span>设置为默认收货地址</span> <span @click="onEdit(item, index)">编辑</span>
<span @click="userdelete(item, index)">删除</span>
</div> </div>
<div class="rc-right"> </div>
<span @click="onEdit(item, index)">编辑</span> </div>
<span @click="userdelete(item, index)">删除</span> </div>
</div> </div>
</div> <div class="online bold rc-md-down"></div>
</div> <!-- <div class="usercontend useradd">
</div>
</div>
<div class="online bold rc-md-down"></div>
<!-- <div class="usercontend useradd">
<img src="../../assets/image/userselect.png" alt=""> <img src="../../assets/image/userselect.png" alt="">
<span>添加收货地址</span> <span>添加收货地址</span>
</div> --> </div> -->
</div>
</div>
<div class="userdit" ref="marinaddress">
<div class="alledit" @click="onAdd()">
<img src="../../static/images/adddress.png" alt="">
<span>添加收货地址</span>
</div>
</div>
<div class="userdit" ref="marinaddress">
</div> <div class="alledit" @click="onAdd()">
<div class="rc-button"> <img src="../../static/images/adddress.png" alt="" />
<div class="rc-footbutton" @click="onAdd()"> <span>添加收货地址</span>
<span>新增收货地址</span> </div>
</div> </div>
</div> </div>
<MyFooter></MyFooter> <div class="rc-button">
</div> <div class="rc-footbutton" @click="onAdd()"><span>新增收货地址</span></div>
</div>
<MyFooter></MyFooter>
</div>
</template> </template>
<script> <script>
import Myheader from '~/components/header.vue' import Myheader from '~/components/header.vue';
import MyFooter from '~/components/rc-footer.vue' import MyFooter from '~/components/rc-footer.vue';
import tabs from "~/components/tabs.vue"; import tabs from '~/components/tabs.vue';
import { selectaddress,editupdate,editdelete} from "../../ajax/getData"; import { selectaddress, editupdate, editdelete } from '../../ajax/getData';
import { mapState } from 'vuex';
export default { export default {
data() { data() {
return { return {
crumbs:[ crumbs: [
{ {
path:'/personal/mypersonal/', path: '/personal/mypersonal/'
}, },
{ {
path:'/useraddress/openaddress/', path: '/useraddress/openaddress/'
} }
], ],
chosenAddressId: "1", chosenAddressId: '1',
checked: true, checked: true,
userid: null, userid: null,
userlist:[], userlist: [],
usermessage:null, usermessage: null,
list: [ list: []
};
], },
}; methods: {
}, changeadddress(item, index) {
methods: { console.log(item, index);
changeadddress(item,index){ console.log(item.isDefault);
console.log(item,index); if (item.isDefault == false) {
console.log(item.isDefault) item.isDefault = true;
if(item.isDefault==false){ } else {
item.isDefault=true item.isDefault = false;
}else{ }
item.isDefault=false;
}
this.editupdate(this.userid,item.id,item.isDefault)
setTimeout(() => {
this.editaddress();
}, 200);
//
}, this.editupdate(this.userid, item.id, item.isDefault);
onEdit(item, index) { setTimeout(() => {
// let userid = item.id; this.editaddress();
console.log(item); }, 200);
// debugger //
this.$router.push({ },
path: "/useraddress/editaddress", onEdit(item, index) {
query: { // let userid = item.id;
recipient: item.recipient, console.log(item);
recipientPhone:item.recipientPhone, // debugger
detailAddress:item.detailAddress, this.$router.push({
id:item.id, path: '/useraddress/editaddress',
provinceName:item.provinceName, query: {
districtName:item.cityName, recipient: item.recipient,
cityName:item.districtName, recipientPhone: item.recipientPhone,
provinceId:item.provinceId, detailAddress: item.detailAddress,
districtId:item.districtId, id: item.id,
cityId:item.cityId, provinceName: item.provinceName,
districtName: item.cityName,
cityName: item.districtName,
provinceId: item.provinceId,
districtId: item.districtId,
cityId: item.cityId
}
});
},
onAdd(item, index) {
// let userid = item.id;
// console.log(item);
this.$router.push({
path: '/useraddress/addaddress'
// query: {
// id: userid,
// },
});
},
}, //更改地址
}); async editupdate(userid, addressid, isDefault) {
}, let useradd = {
onAdd(item, index) { memberId: userid,
// let userid = item.id; id: addressid,
// console.log(item); isDefault: isDefault
this.$router.push({ };
path: "/useraddress/addaddress",
// query: {
// id: userid,
// },
});
},
//更改地址 let data = await editupdate(useradd);
async editupdate(userid,addressid,isDefault) { if (data) {
let useradd={ this.$message({
memberId:userid, type: 'warning',
id:addressid, message: '更改成功'
isDefault:isDefault, });
} }
// if(data){
let data = await editupdate(useradd); // this.editaddress();
if(data){ // }
this.$message({ },
type: 'warning',
message: '更改成功'
});
}
// if(data){
// this.editaddress();
// }
},
//删除地址 //删除地址
async userdelete(item) { async userdelete(item) {
console.log(item.memberId); console.log(item.memberId);
let data = await editdelete(this.userid, item.id); let data = await editdelete(this.userid, item.id);
if(data){ if (data) {
this.$message({ this.$message({
type: 'warning', type: 'warning',
message: '地址删除成功' message: '地址删除成功'
}); });
} }
this.editaddress(); this.editaddress();
console.log(data); console.log(data);
}, },
//查询人的所有地址 //查询人的所有地址
async editaddress(user) { async editaddress(user) {
// user.data.id=844350; let data = await selectaddress(this.userid);
let data = await selectaddress(this.userid); this.list = data.data;
console.log(data); // console.log(this.list);
this.list=data.data; },
// console.log(this.list); /* 初始化数据 */
console.log(data); async resetData(){
}, this.usermessage = this.userInfo;
}, this.userid = this.userInfo.id;
components: { this.editaddress(this.userid);
Myheader, }
MyFooter, },
tabs components: {
}, Myheader,
MyFooter,
tabs
},
mounted() {
//地址的查询 computed:{
this.usermessage = JSON.parse(localStorage.getItem("userInfo")); ...mapState({
this.userid = this.usermessage.data.id; userInfo : state => state.user.userInfo,
console.log(this.userid); })
this.editaddress(this.userid); },
watch:{
}, userInfo(newVal){
this.resetData(newVal);
}
},
mounted() {
//地址的查询
// this.usermessage = JSON.parse(localStorage.getItem('userInfo'));
if(this.userInfo){
this.resetData();
}
},
}; };
</script> </script>
<style lang="less" scoped > <style lang="less" scoped>
@import url("../../assets/css/openaddress.less"); @import url('../../assets/css/openaddress.less');
</style> </style>

25
rc-busness/pages/userlogin/login.vue
View File

@ -152,7 +152,8 @@ export default {
envData, envData,
phone: "", phone: "",
layerMSg: "手机格式不对", layerMSg: "手机格式不对",
tel: "", tel: "", // 15766132405 18825059708
sms: "", //去除记得把验证码打开 1234
password: "", password: "",
userdata:{}, userdata:{},
allcheck:false, allcheck:false,
@ -165,7 +166,6 @@ export default {
], ],
hash:'', hash:'',
text: "", text: "",
sms: "",
buttonmsg: "获取验证码", buttonmsg: "获取验证码",
flag: false, flag: false,
adminCode: "", adminCode: "",
@ -220,13 +220,14 @@ export default {
}, },
...mapState({ ...mapState({
userInfo : state => state.user.userInfo, userInfo : state => state.user.userInfo,
loginState : state => state.login.loginState,
}) })
}, },
mounted() { mounted() {
//console.log(this.$route.params); //console.log(this.$route.params);
this.checkIsLogin(); // this.checkIsLogin();
let user = this.$store.state.userInfo; // let user = this.$store.state.userInfo;
if(user) { if(this.loginState && this.userInfo) {
this.$router.push({ this.$router.push({
path: "/personal/mypersonal", path: "/personal/mypersonal",
}); });
@ -401,13 +402,21 @@ export default {
} }
} }
else{ else{
let data=await this.vadmsg(); /* 暂时关闭短信验证 */
let data = await this.vadmsg();
// let data = {
// code : 1,
// }
if(data.code=="1") if(data.code=="1")
{ {
data = await userregOrLogin(this.tel); data = await userregOrLogin(this.tel);
let token=JSON.stringify(data); let token=JSON.stringify(data);
this.changeClod({ cloud: token }); this.$store.dispatch('setUserInfo',{
this.checkIsLogin(); data : data,
app : this,
});
// this.changeClod({ cloud: token });
// this.checkIsLogin();
let returnMessage=''; let returnMessage='';
if(data.type==1) { if(data.type==1) {
if(data.data.memberName===undefined){ if(data.data.memberName===undefined){

8
rc-busness/pages/usersearch/search.vue
View File

@ -571,12 +571,19 @@ export default {
tabs tabs
}, },
mounted() { mounted() {
const { query } = this.$route;
this.activeIndex1 = query.type || 0;
this.activeIndex = query.type || 0;
this.value = query.content || '';
this.usetmessage(); this.usetmessage();
this.userst(); this.userst();
//Handling RxGoods filter //Handling RxGoods filter
let curEnv = process.env.NODE_ENV; let curEnv = process.env.NODE_ENV;
this.rxFilters = envData[curEnv].rxGoodsFilter; this.rxFilters = envData[curEnv].rxGoodsFilter;
//Handling RxGoods filter end //Handling RxGoods filter end
console.log();
}, },
methods: { methods: {
//换一批 //换一批
@ -723,6 +730,7 @@ export default {
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.userstandard[0].style.margin = 0 + "px"; this.$refs.userstandard[0].style.margin = 0 + "px";
}); });
console.log(this.activeIndex1, this.value,'this.activeIndex1, this.value');
let data = await biaome(this.activeIndex1, this.value, 1, 10); let data = await biaome(this.activeIndex1, this.value, 1, 10);
if (data) { if (data) {
this.rccontair = data; this.rccontair = data;

24
rc-busness/plugins/until/common.js Normal file
View File

@ -0,0 +1,24 @@
/**
* 这个是一些全局函数方法
*/
import { Message } from 'element-ui';
export default ({ app }, inject) => {
/**
* 消息提示框
* msg 提示语
* type 提示框状态 success/warning/info/error
* duration 默认3秒
*/
inject('messageToast',(msg,type='success',duration=3000)=>{
Message({
type : type || 'success',
message : msg,
duration
})
})
inject('myInjectedFunction', string => Message('That was easy!', string));
}

6
rc-busness/plugins/until/until.js
View File

@ -3,7 +3,7 @@
*/ */
/** /**
* 设置cookie的值 * 设置cookie的值(获取的是前端的 nuxt框架不可用 用cookie-universal-nuxt获取存放的token)
* @param {String} key cookie的键 * @param {String} key cookie的键
* @param {String} val cookie的值 * @param {String} val cookie的值
* @param {String} exdays 过期时间默认的话是7天 * @param {String} exdays 过期时间默认的话是7天
@ -16,7 +16,7 @@ const setCookie = (key,val,exdays = 7)=>{
} }
/** /**
* 获取cookie的值 * 获取cookie的值(获取的是前端的 nuxt框架不可用 用cookie-universal-nuxt获取存放的token)
* @param {String} key cookie的键 * @param {String} key cookie的键
*/ */
const getCookie = (key)=>{ const getCookie = (key)=>{
@ -30,8 +30,6 @@ const getCookie = (key)=>{
} }
export { export {
setCookie, setCookie,
getCookie, getCookie,

142
rc-busness/store/index.js
View File

@ -1,74 +1,88 @@
import user from './modules/user.js'; import user from './modules/user.js';
import login from './modules/login.js';
const state = () => ({ const state = () => ({
// 这里是全局数据保存的地方 // 这里是全局数据保存的地方
tabsList: [ tabsList: [{
{ path: '/',
path: '/', name: 'index',
name: 'index', meta: {
meta:{ title: '首页',
title: '首页',
}
},
]
}) }
}, ],
userInfo : null, //以前遗留的问题 用户数据后台统一用modal里面的userInfo
userKey : 'user_mobile', //存储用户的KEY值
tokenKey : 'token', //存储用户token的key
const mutations = { })
// changeLogin(state, val) {
// console.log(state,val);
// let list=[];
// list.push(val);
// JSON.parse(list); const mutations = {
// console.log(list); // changeLogin(state, val) {
// localStorage.setItem("cardata", list); // console.log(state,val);
// }, // let list=[];
changeClod(state, val) { // list.push(val);
localStorage.setItem('userInfo', val.cloud);
},
logoutSystem(state) {
localStorage.removeItem('userInfo')
},
checkIsLogin(state) {
let rawUserInfoStr = localStorage.getItem('userInfo');
let rawUserInfo = JSON.parse(rawUserInfoStr);
if(rawUserInfo && rawUserInfo.hasOwnProperty('xaccessToken') && rawUserInfo['xaccessToken'].length>36)
state.userInfo = rawUserInfo;
else
state.userInfo = undefined;
},
changemessage(state, val) {
localStorage.setItem('message', val.data);
},
selectMenu(state, val) {
let result = state.tabsList.findIndex(item => item.name === val.data.name)
result === -1 ? state.tabsList.push(val.data) : ''
},
// changeMenu(state, user){ // JSON.parse(list);
// // console.log("vuex存储的变化",JSON.parse(user)) // console.log(list);
// // console.log("vuex存储的变化",user) // localStorage.setItem("cardata", list);
// state.menuList = user; // },
// localStorage.setItem('menuList', user); changeClod(state, val) {
// } localStorage.setItem('userInfo', val.cloud);
} },
logoutSystem(state) {
localStorage.removeItem('userInfo')
},
checkIsLogin(state) {
let rawUserInfoStr = localStorage.getItem('userInfo');
let rawUserInfo = JSON.parse(rawUserInfoStr);
if (rawUserInfo && rawUserInfo.hasOwnProperty('xaccessToken') && rawUserInfo['xaccessToken'].length > 36)
state.userInfo = rawUserInfo;
else
state.userInfo = undefined;
},
changemessage(state, val) {
localStorage.setItem('message', val.data);
},
selectMenu(state, val) {
let result = state.tabsList.findIndex(item => item.name === val.data.name)
result === -1 ? state.tabsList.push(val.data) : ''
},
SET_INDEX_USER_INFO(state,data){
state.userInfo = data;
}
const actions = { // changeMenu(state, user){
setPosition: ({ // // console.log("vuex存储的变化",JSON.parse(user))
commit // // console.log("vuex存储的变化",user)
}, position) => { // state.menuList = user;
commit('setPosition', position) // localStorage.setItem('menuList', user);
} // }
} }
/* 功能模块 */ const actions = {
const modules = { setPosition: ({
user, commit
} }, position) => {
commit('setPosition', position)
}
}
/* 功能模块 */
const modules = {
user,
login
}
export default {namespaced: true, state, mutations, actions,modules} export default {
namespaced: true,
state,
mutations,
actions,
modules
}

60
rc-busness/store/modules/login.js
View File

@ -1,17 +1,57 @@
// import { getCookie } from "../../plugins/until/until.js";
export default { export default {
state : { state: {
des : '这个存储用户登录逻辑操作', des: '这个存储用户登录逻辑操作',
loginState : false, //登录状态 loginState: false, //登录状态
}, },
/* 存储修改状态的静态方法 */ /* 存储修改状态的静态方法 */
mutations : { mutations: {
/* 设置登录状态 */ /* 设置登录状态 */
SET_LOGIN_STATE(state){ SET_LOGIN_STATE(state, value) {
console.log(state); state.loginState = value
} },
}, },
/* 存储修改数据的动态方法 */ /* 存储修改数据的动态方法 */
actions : { actions: {
/**
* 判断是否登录
* context
* app vue 实例
*/
checkLoginState(context, app) {
let key = context.rootState.userKey;
let mobile = app.$cookies.get(key);
let isHasToken = false;
if (mobile == undefined || !mobile || mobile == 'mobile') {
isHasToken = false;
} else {
isHasToken = true;
/* 更新用户数据 */
if (!context.rootState.user.userInfo) {
context.dispatch('getUserInfo', app, {
root: true
});
}
}
context.commit('SET_LOGIN_STATE', isHasToken);
},
/**
* 退出登录
* @param {Object} context 上下文
* @param {Object} app vue 实例
*/
logout(context, app){
let userKey = context.rootState.userKey;
let tokenKey = context.rootState.tokenKey;
app.$cookies.remove(userKey);
app.$cookies.remove(tokenKey);
context.commit('SET_USER_INFO', null, {
root: true
});
context.commit('SET_INDEX_USER_INFO', null, {
root: true
});
localStorage.removeItem(tokenKey)
}
} }
} }

63
rc-busness/store/modules/user.js
View File

@ -1,18 +1,61 @@
import Vue from "vue";
import { userregOrLogin } from '../../ajax/getData.js';
export default { export default {
state : { state: {
des : '这个存储用户数据的模块列表', des: '这个存储用户数据的模块列表',
userInfo : {}, //用户信息 userInfo: null, //用户信息
loginState : false, //登录状态 loginState: false, //登录状态
}, },
/* 存储修改状态的静态方法 */ /* 存储修改状态的静态方法 */
mutations : { mutations: {
/* 设置用户信息 */ /* 设置用户信息 */
SET_USER_INFO(state){ SET_USER_INFO(state, userInfo) {
console.log(state); state.userInfo = userInfo;
} }
}, },
/* 存储修改数据的动态方法 */ /* 存储修改数据的动态方法 */
actions : { actions: {
/**
* 设置会员信息
* @param {Object} context 上下文
* @param {Object} {
data : 后台返回的用户数据
app : vue实例this
}
*/
setUserInfo(context, {
data,
app
}) {
const userKey = context.rootState.userKey;
const tokenKey = context.rootState.tokenKey;
const userInfo = data.data;
const {
mobile
} = userInfo;
/* 存储数据 变更登录状态 */
app.$cookies.set(userKey, mobile);
app.$cookies.set(tokenKey, data.xaccessToken);
localStorage.setItem(tokenKey,data.xaccessToken);
context.commit('SET_USER_INFO', userInfo);
context.commit('SET_LOGIN_STATE', true, {
root: true
});
context.commit('SET_INDEX_USER_INFO', data, {
root: true
});
},
/* 获取用户数据 */
async getUserInfo(context,app){
let key = context.rootState.userKey;
let mobile = app.$cookies.get(key);
const data = await userregOrLogin(app.$cookies.get(key));
context.dispatch('setUserInfo',{
data,
app,
})
}
} }
} }