{"remainingRequest":"/Users/linhuakun/Downloads/coderlhk/codewhy/node_modules/vue-loader/lib/index.js??vue-loader-options!/Users/linhuakun/Downloads/coderlhk/codewhy/src/views/profile/Profile.vue?vue&type=script&lang=js&","dependencies":[{"path":"/Users/linhuakun/Downloads/coderlhk/codewhy/src/views/profile/Profile.vue","mtime":1616776946014},{"path":"/Users/linhuakun/Downloads/coderlhk/codewhy/node_modules/babel-loader/lib/index.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/codewhy/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/codewhy/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:Ly8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KLy8KCmltcG9ydCBOYXZCYXIgZnJvbSAiQC9jb21wb25lbnRzL2NvbW1vbi9uYXZiYXIvTmF2QmFyIjsKaW1wb3J0IFNjcm9sbCBmcm9tICJAL2NvbXBvbmVudHMvY29tbW9uL1Njcm9sbC9TY3JvbGwiOwppbXBvcnQgVXNlckluZm8gZnJvbSAiQC92aWV3cy9wcm9maWxlL2NoaWxkQ29tcHMvVXNlckluZm8iOwppbXBvcnQge2dldFNpZ259IGZyb20gIkAvbmV0d29yay9wcm9maWxlLmpzIgoKZXhwb3J0IGRlZmF1bHQgewogIG5hbWU6ICJQcm9maWxlIiwKICBjb21wb25lbnRzOiB7CiAgICBOYXZCYXIsCiAgICBTY3JvbGwsCiAgICBVc2VySW5mbwogIH0sCiAgZGF0YSgpIHsKICAgIHJldHVybiB7CiAgICAgIG5hbWU6ICIiLAogICAgICBpc0xvZ2luOiAiIiwKICAgICAgaWQ6JycsCiAgICAgIHVybDonJywKICAgICAgYXZhdGFyOicnLAogICAgICBhdmF0YXJleGl0OmZhbHNlLAogICAgICBpc3Nob3c6dHJ1ZSwKICAgICAgc2lnbjoiIiwKICAgICAgdG9rZW46IiIKICAgIH07CiAgfSwKIGFzeW5jIG1vdW50ZWQoKXsKICAgIHRoaXMudG9rZW4gPSB3aW5kb3cuc2Vzc2lvblN0b3JhZ2UuZ2V0SXRlbSgidG9rZW4iKTsKICAgIGlmKHRoaXMudG9rZW4pewogICAgICAgICAgdGhpcy51c2VyTG9naW4oKTsKICAgICAgICAgIHRoaXMuZ2V0QXZhdGFyKCk7CiAgICAgICAgIGNvbnN0IHJlcz1hd2FpdCBnZXRTaWduKCk7CiAgICAgICAgICB0aGlzLnNpZ249cmVzLmRhdGE7CiAgICB9CiAgfQogICwKICBtZXRob2RzOiB7CiAgICBtaW5lT3JkZXIoKXsKICAgICAgdGhpcy4kcm91dGVyLnB1c2goJy9taW5lb3JkZXInKQogICAgfSwKICAgIEFib3V0SW5mbygpewogICAgICAgICAgICB0aGlzLiRyb3V0ZXIucHVzaCgnL2Fib3V0JykKICAgIH0sCiAgICBtZXNzYWdlaW5mbygpewogICAgICB0aGlzLiRyb3V0ZXIucHVzaCgnL21lc3NhZ2UnKQogICAgfSwKICAgIGxvZ291dCgpewogICAgICAgaWYodGhpcy50b2tlbil7CiAgICAgICAgd2luZG93LnNlc3Npb25TdG9yYWdlLmNsZWFyKCk7CiAgICAgICAgdGhpcy4kcm91dGVyLnB1c2goIi9sb2dpbiIpCiAgICAgICAgdGhpcy4kbWVzc2FnZSgn6YCA5Ye65oiQ5YqfJykKICAgICAgIH1lbHNlewogICAgICAgICB0aGlzLiRyb3V0ZXIucHVzaCgiL2xvZ2luIikKICAgICAgIH0KICAgIH0sCiAgICB1c2VyTG9naW4oKSB7CiAgICAgIHRoaXMubmFtZSA9IHdpbmRvdy5zZXNzaW9uU3RvcmFnZS5nZXRJdGVtKCJuYW1lIik7CiAgICAgIGlmICh0aGlzLm5hbWUpIHsKICAgICAgICB0aGlzLmlzTG9naW4gPXRoaXMubmFtZTsKICAgICAgfQogICAgfSwKICAgIERlZmF1bHQoKXsKICAgICAgcmV0dXJuICJ+YXNzZXRzL2ltZy9wcm9maWxlL2F2YXRhci5zdmciOwogICAgfSwKICAgIGluZm9Mb2dpbigpIHsKICAgICAgdGhpcy4kcm91dGVyLnB1c2goIi9sb2dpbiIpOwogICAgfSwKICAgIGluZm9SZWdpc3RlcigpIHsKICAgICAgdGhpcy4kcm91dGVyLnB1c2goIi9yZWdpc3RlciIpOwogICAgfSwKICAgIGFzeW5jIGFmdGVyUmVhZChmaWxlKSB7CiAgICAgICAgICAKICAgICAgdGhpcy51cmw9Jy91cGxvYWQvJyt0aGlzLmlkKycvYXZhdGFyJwogICAgICAvLyDmraTml7blj6/ku6Xoh6rooYzlsIbmlofku7bkuIrkvKDoh7PmnI3liqHlmagKICAgICAgY29uc3QgZm9ybWRhdGE9bmV3IEZvcm1EYXRhKCk7CiAgICAgIGZvcm1kYXRhLmFwcGVuZCgnYXZhdGFyJyxmaWxlLmZpbGUpCiAgICAgIGF3YWl0IHRoaXMuJGh0dHAucG9zdCh0aGlzLnVybCxmb3JtZGF0YSkKICAgICAgdGhpcy5nZXRBdmF0YXIoKQogICAgICB0aGlzLmF2YXRhcmV4aXQ9ZmFsc2UKICAgICAgdGhpcy4kbmV4dFRpY2soKCkgPT4gewogICAgICAgICB0aGlzLmF2YXRhcmV4aXQ9dHJ1ZQogICAgICB9LCAzMDAwKTsKICAgICAgIAogICAgIH0sCiAgICAgICBhc3luYyBnZXRBdmF0YXIoKXsKICAgICAgICB0cnl7CiAgICAgICAgICB0aGlzLmlkPXdpbmRvdy5zZXNzaW9uU3RvcmFnZS5nZXRJdGVtKCd1c2VySWQnKQogICAgICAgICAgY29uc3QgcmVzPSBhd2FpdCB0aGlzLiRodHRwLmdldCgnL3VzZXJzLycrdGhpcy5pZCsnL2F2YXRhcicpCiAgICAgICAgICB0aGlzLmF2YXRhcj1yZXMuY29uZmlnLnVybAogICAgICAgICAgdGhpcy5hdmF0YXJleGl0PXRydWUKICAgICAgICB9Y2F0Y2goZXJyKXsKICAgICAgICAgIHRoaXMuYXZhdGFyZXhpdD1mYWxzZQogICAgICAgIH0KICAgICAgfQogICAgLAogICAgICAgcHVsbGluZ0Rvd24oKSB7CiAgICAgICAgdGhpcy4kcmVmcy5zY3JvbGwuZmluaXNoUHVsbERvd24oKTsKICAgICAgIH0KICB9LAogIGNyZWF0ZWQoKSB7CiAgfSwKfTsK"},{"version":3,"sources":["Profile.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"Profile.vue","sourceRoot":"src/views/profile","sourcesContent":["<template>\n    <div class=\"profile\">\n      <nav-bar class=\"nav-bar\"><div slot=\"center\">个人中心</div></nav-bar>\n\n      <!--1.单独封装一个组件: 利用slot-->\n      <user-info class=\"user-info\">\n        <div slot=\"user-icon\" class=\"user-icon\" >\n          <img  alt=\"上传成功\" :src=\"this.avatar\"  v-if=\"this.avatarexit\"/>\n          <img  alt=\"未上传\" src=\"~assets/img/profile/avatar.svg\" v-else/>\n          <van-uploader\n           class=\"uploading\"\n           :after-read=\"afterRead\"\n           preview-size=\"60px\"\n           accept=\"image/png,image/jpeg,image/jpg,image/svg,image/gif\"\n           />\n        </div>\n        <div slot=\"user-nickname\" class=\"user-nickname\" >\n          <div v-if=\"this.name\">{{ isLogin }}</div>\n          <div v-else><a @click=\"infoLogin\">登陆</a><a>/</a><a @click=\"infoRegister\">注册</a></div>\n        </div>\n        <div slot=\"sign\" class=\"info-sign\">\n          个性签名: <span>{{sign}}</span>\n        </div>\n      </user-info>\n         <!--2.没有单独封装: 不同的地方太多, 需要传过多的参数-->\n    <section class=\"account\">\n      <div class=\"item imte2\" @click=\"mineOrder\"><img src=\"~assets/img/profile/order.svg\" alt=\"\"><span>我的订单</span></div>\n      <div class=\"item imte3\"><img src=\"~assets/img/profile/cart.svg\" alt=\"\"><span>送货中</span></div>\n      <div class=\"item imte4\"><img src=\"~assets/img/profile/success.svg\" alt=\"\"> <span>送货中</span></div>\n    </section>\n    <section class=\"footer\">\n      <div @click=\"messageinfo\">设置</div>\n      <div @click=\"AboutInfo\">关于我们</div>\n      <div @click=\"logout()\">退出</div>\n    </section>\n  </div>\n</template>\n\n<script>\nimport NavBar from \"@/components/common/navbar/NavBar\";\nimport Scroll from \"@/components/common/Scroll/Scroll\";\nimport UserInfo from \"@/views/profile/childComps/UserInfo\";\nimport {getSign} from \"@/network/profile.js\"\n\nexport default {\n  name: \"Profile\",\n  components: {\n    NavBar,\n    Scroll,\n    UserInfo\n  },\n  data() {\n    return {\n      name: \"\",\n      isLogin: \"\",\n      id:'',\n      url:'',\n      avatar:'',\n      avatarexit:false,\n      isshow:true,\n      sign:\"\",\n      token:\"\"\n    };\n  },\n async mounted(){\n    this.token = window.sessionStorage.getItem(\"token\");\n    if(this.token){\n          this.userLogin();\n          this.getAvatar();\n         const res=await getSign();\n          this.sign=res.data;\n    }\n  }\n  ,\n  methods: {\n    mineOrder(){\n      this.$router.push('/mineorder')\n    },\n    AboutInfo(){\n            this.$router.push('/about')\n    },\n    messageinfo(){\n      this.$router.push('/message')\n    },\n    logout(){\n       if(this.token){\n        window.sessionStorage.clear();\n        this.$router.push(\"/login\")\n        this.$message('退出成功')\n       }else{\n         this.$router.push(\"/login\")\n       }\n    },\n    userLogin() {\n      this.name = window.sessionStorage.getItem(\"name\");\n      if (this.name) {\n        this.isLogin =this.name;\n      }\n    },\n    Default(){\n      return \"~assets/img/profile/avatar.svg\";\n    },\n    infoLogin() {\n      this.$router.push(\"/login\");\n    },\n    infoRegister() {\n      this.$router.push(\"/register\");\n    },\n    async afterRead(file) {\n          \n      this.url='/upload/'+this.id+'/avatar'\n      // 此时可以自行将文件上传至服务器\n      const formdata=new FormData();\n      formdata.append('avatar',file.file)\n      await this.$http.post(this.url,formdata)\n      this.getAvatar()\n      this.avatarexit=false\n      this.$nextTick(() => {\n         this.avatarexit=true\n      }, 3000);\n       \n     },\n       async getAvatar(){\n        try{\n          this.id=window.sessionStorage.getItem('userId')\n          const res= await this.$http.get('/users/'+this.id+'/avatar')\n          this.avatar=res.config.url\n          this.avatarexit=true\n        }catch(err){\n          this.avatarexit=false\n        }\n      }\n    ,\n       pullingDown() {\n        this.$refs.scroll.finishPullDown();\n       }\n  },\n  created() {\n  },\n};\n</script>\n\n<style scoped>\n\n\n.footer div{\n  margin-top:9px;\n  height: 50px;\n  width: 100%;\n  background-color: #f5f5f5;\n  text-align: center;\n  line-height: 50px;\n  transform: translate(0,-50%);\n}\n\n.footer{\n  margin-top: 40px;\n  height: 150px;\n  width: 100%;\n}\n\n.account{\n  margin-top: 20px;\n  width: 100%;\n  height: 100px;\n  display: flex;\n  justify-content: space-around;\n}\n\n.account .item{\n  width: 32%;\n  height: 100px;\n  background-color: #f5f5f5;\n  border-radius: 10px;\n  box-shadow: 2px 2px 2px 2px rgba(241, 235, 235, 0.2);\n}\n\n.account .item img{\n   margin-top: 5px;\n  position:relative;\n  left:50%;\n  transform: translate(-50%,0);\n}\n\n.account .item span{\n  position: relative;\n  margin-top: 5px;\n  display: block;\n  text-align: center;\n}\n\n.user-nickname{\n  margin-top:12px ;\n}\n      \n\n.user-info{\n  width: 100%;\n  height:100px;\n  background-color: #f5f5f5;\n}\n\n.info-sign{\n  margin-top:8px;\n  font-size: 12px;\n}\n\n.info-sign span{\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n\n.user-icon{\n  position: relative;\n  top:50%;\n  transform: translate(0,-50%);\n  border-radius:50%;\n  height: 60px;\n  width: 60px;\n  background-color: #fff;\n  float: left;\n}\n\n.user-icon img{\n  position: relative;\n  border-radius:50%;\n  height: 60px;\n  width: 60px;\n}\n\n.user-icon .uploading{\n  left: 0;\n  position: absolute;\n  border-radius:50%;\n  opacity: 0;\n}\n\n.nav-bar{\n  background-color:#f53b57;\n  color: #fff;\n}\n\n</style>\n"]}]}