ytj

package.json

@@ -23,6 +23,7 @@
     "exif-js": "^2.3.0",
     "html2canvas": "^1.0.0-alpha.12",
     "jQuery": "^1.7.4",
+    "jsbarcode": "^3.11.0",
     "less": "^3.0.4",
     "less-loader": "^4.1.0",
     "node-sass": "^4.9.3",

src/pages/bodyCheck/app.js

@@ -1,7 +1,7 @@
 import Vue from 'vue'
 import App from './App.vue'
 import Vant from 'vant'
-import 'vant/lib/vant-css/index.css'
+import 'vant/lib/index.css'
 import router from './router'
 import store from '../../store/index'
 import Vuex from 'vuex'

src/pages/sales/app.js

@@ -1,7 +1,7 @@
 import Vue from 'vue'
 import App from './App.vue'
 import Vant from 'vant'
-import 'vant/lib/vant-css/index.css'
+import 'vant/lib/index.css'
 import router from './router'
 import store from '../../store/index'
 import Vuex from 'vuex'

src/pages/user/App.vue

@@ -12,7 +12,7 @@ export default {
   name: 'app',
   data () {
     return {
-      showPage: false 
+      showPage: true 
     }
   },
   components: {},
@@ -23,14 +23,14 @@ export default {
     })
   },
   created () {
-    if (location.search && this.toolClass.UrlSearch(location.search).code) {
-      this.code = this.toolClass.UrlSearch(location.search).code
-    } else {
-      this.code = null
-    }
-    this.getUserInfo({ org: this.org, code: this.code }).then(() => {
-      this.showPage = true
-    })
+    // if (location.search && this.toolClass.UrlSearch(location.search).code) {
+    //   this.code = this.toolClass.UrlSearch(location.search).code
+    // } else {
+    //   this.code = null
+    // }
+    // this.getUserInfo({ org: this.org, code: this.code }).then(() => {
+    //   this.showPage = true
+    // })
   },
   methods: {
     ...actions(['getUserInfo'])

src/pages/user/app.js

@@ -1,7 +1,7 @@
 import Vue from 'vue'
 import App from './App.vue'
 import Vant from 'vant'
-import 'vant/lib/vant-css/index.css'
+import 'vant/lib/index.css'
 import router from './router'
 import store from '../../store/index'
 import Vuex from 'vuex'

src/pages/user/mainPage/userCenter/index.vue

@@ -1,10 +1,29 @@
 <template>
   <div class="mainPage">
     <div>
-      <div class="userTop_view">
+      <div class="userTop_view" :class="{'short':!user.Phone,'long':user.Phone}">
         <div class="gradient_bg"></div>
         <div class="zIndex_bg"></div>
-        <div class="userAvatar_Border">
+        <div class="user-card">
+          <div>
+            <img :src="headimgurl" alt width="100%" height="100%">
+            <div>
+              <div class="user-name">{{user.Name}}2333</div>
+              <div v-if="user.Phone">{{user.Phone}}3333</div>
+              <div v-else>未绑定</div>
+            </div>
+            <div></div>
+          </div>
+          <div v-if="user.Phone" class="code">
+            <div>卡号：2334546456456</div>
+            <svg style="width:100%" id="barcode"></svg>
+          </div>
+          <div v-else class="bind">
+            <span>请绑定手机号后查看会员条形码</span>
+            <span>立即绑定</span>
+          </div>
+        </div>
+        <!-- <div class="userAvatar_Border">
           <div class="userAvatar">
             <img :src="headimgurl" alt width="100%" height="100%">
           </div>
@@ -13,7 +32,7 @@
           <div class="user-name">{{user.Name}}</div>
           <div class="mobile" v-if="user.Phone">{{user.Phone}}</div>
           <div class="mobile" v-else @click="bindMobile">绑定手机号</div>
-        </div>
+        </div> -->
       </div>
       <div class="vip-privilege flex-h">
         <div class="flex-item privilege-item" @click="toCoupons">
@@ -70,6 +89,7 @@
 </template>
 
 <script>
+import JsBarcode from 'JsBarcode'
 import { mapState, createNamespacedHelpers } from 'vuex'
 const { mapActions: actions } = createNamespacedHelpers('userCenter')
 export default {
@@ -90,14 +110,19 @@ export default {
 
   },
   mounted () {
-    this.getUserInfo({ org: this.org }).then(() => {
-      this.user = this.userInfo.customer
-      if (this.user.AccountInfo) {
-        this.AccountInfo = JSON.parse(this.user.AccountInfo)
-      }
-      this.headimgurl = this.user.Headimgurl
+    // this.getUserInfo({ org: this.org }).then(() => {
+    //   this.user = this.userInfo.customer
+    //   if (this.user.AccountInfo) {
+    //     this.AccountInfo = JSON.parse(this.user.AccountInfo)
+    //   }
+    //   this.headimgurl = this.user.Headimgurl
+    // })
+    // this.getNum()
+    JsBarcode("#barcode", "2334546456456", {
+      lineColor: '#000000',
+      height: 60,
+      displayValue: false
     })
-    this.getNum()
   },
   methods: {
     ...actions(['getUserInfo', 'getNum']),

src/pages/user/mainPage/userCenter/page.scss

@@ -11,10 +11,67 @@
   align-items: center;
 }
 
+.short{
+  margin-bottom: 0.6rem;
+}
+.long{
+  margin-bottom: 1.3rem;
+
+}
+.user-card{
+  width: 3.35rem;
+  background:rgba(255,255,255,1);
+  box-shadow: 0px 0px .1rem 0px rgba(0,0,0,.1);
+  border-radius: 8px;
+  position: absolute;
+  top: 1rem;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 3;
+  padding: .2rem .2rem .05rem .2rem;
+  box-sizing: border-box;
+  >div:nth-of-type(1){
+    display: flex;
+    margin-bottom: .1rem;
+    img{
+      width: .56rem;
+      height: .56rem;
+      margin-right: .1rem;
+    }
+    div{
+      color: #7D7D7D;
+      font-size: .14rem;
+    }
+    .user-name{
+      font-size: .18rem;
+    }
+  }
+  .code{
+    text-align: center;
+    div{
+      color: #999999;
+      text-align: left;
+    }
+  }
+  .bind{
+    margin: .1rem;
+    span:nth-of-type(1){
+      color: #7D7D7D;
+      font-size: .14rem;
+    }
+    span:nth-of-type(2){
+      border:1px solid #FC6243;
+      padding: .02rem .1rem .03rem;
+      border-radius: .2rem;
+      color: #FC6243;
+      margin-left: .1rem;
+    }
+  }
+}
+
 .userTop_view {
   position: relative;
   height: 1.7rem;
-  margin-bottom: 1.3rem;
   .gradient_bg {
     position: absolute;
     width: 100%;
@@ -71,7 +128,7 @@
     .mobile{
       color:rgba(125,125,125,1);
       font-size: .2rem;
-      padding-top: 10px;
+      padding-top: .1rem;
       text-align: center;
     }
   }
@@ -81,7 +138,6 @@
   height: 1.2rem;
   margin: 0 .25rem;
   background:rgba(255,255,255,1);
-  box-shadow:0px 2px 12px 0px rgba(219,219,219,0.5);
   border-radius:8px;
   box-sizing: border-box;
   .privilege-item {
@@ -113,7 +169,7 @@
 }
 
 .userCenter-menu{
-  padding: 0.2rem 0.25rem;;
+  padding: 0 0.25rem 0.2rem;
   box-sizing: border-box;
   .menu-item{
     justify-content: space-between;