{"remainingRequest":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/vue-loader/lib/index.js??vue-loader-options!/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/src/views/profile/Profile.vue?vue&type=style&index=0&id=9bf7be42&scoped=true&lang=css&","dependencies":[{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/src/views/profile/Profile.vue","mtime":1618727064887},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/css-loader/dist/cjs.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/vue-loader/lib/loaders/stylePostLoader.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/postcss-loader/src/index.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/Users/linhuakun/Downloads/coderlhk/big bar/bigbar-start/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:CgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKLmZvb3RlciBkaXYgewogIG1hcmdpbi10b3A6IDlweDsKICBoZWlnaHQ6IDUwcHg7CiAgd2lkdGg6IDEwMCU7CiAgYmFja2dyb3VuZC1jb2xvcjogI2Y1ZjVmNTsKICB0ZXh0LWFsaWduOiBjZW50ZXI7CiAgbGluZS1oZWlnaHQ6IDUwcHg7CiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoMCwgLTUwJSk7Cn0KCi5mb290ZXIgewogIG1hcmdpbi10b3A6IDQwcHg7CiAgaGVpZ2h0OiAxNTBweDsKICB3aWR0aDogMTAwJTsKfQoKLmFjY291bnQgewogIG1hcmdpbi10b3A6IDIwcHg7CiAgd2lkdGg6IDEwMCU7CiAgaGVpZ2h0OiAxMDBweDsKICBkaXNwbGF5OiBmbGV4OwogIGp1c3RpZnktY29udGVudDogc3BhY2UtYXJvdW5kOwp9CgouYWNjb3VudCAuaXRlbSB7CiAgd2lkdGg6IDMyJTsKICBoZWlnaHQ6IDEwMHB4OwogIGJhY2tncm91bmQtY29sb3I6ICNmNWY1ZjU7CiAgYm9yZGVyLXJhZGl1czogMTBweDsKICBib3gtc2hhZG93OiAycHggMnB4IDJweCAycHggcmdiYSgyNDEsIDIzNSwgMjM1LCAwLjIpOwp9CgouYWNjb3VudCAuaXRlbSBpbWcgewogIG1hcmdpbi10b3A6IDVweDsKICBwb3NpdGlvbjogcmVsYXRpdmU7CiAgbGVmdDogNTAlOwogIHRyYW5zZm9ybTogdHJhbnNsYXRlKC01MCUsIDApOwp9CgouYWNjb3VudCAuaXRlbSBzcGFuIHsKICBwb3NpdGlvbjogcmVsYXRpdmU7CiAgbWFyZ2luLXRvcDogNXB4OwogIGRpc3BsYXk6IGJsb2NrOwogIHRleHQtYWxpZ246IGNlbnRlcjsKfQoKLnVzZXItbmlja25hbWUgewogIG1hcmdpbi10b3A6IDEycHg7Cn0KCi51c2VyLWluZm8gewogIHdpZHRoOiAxMDAlOwogIGhlaWdodDogMTAwcHg7CiAgYmFja2dyb3VuZC1jb2xvcjogI2Y1ZjVmNTsKfQoKLmluZm8tc2lnbiB7CiAgbWFyZ2luLXRvcDogOHB4OwogIGZvbnQtc2l6ZTogMTJweDsKfQoKLmluZm8tc2lnbiBzcGFuIHsKICB3aGl0ZS1zcGFjZTogbm93cmFwOwogIG92ZXJmbG93OiBoaWRkZW47CiAgdGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7Cn0KCi51c2VyLWljb24gewogIHBvc2l0aW9uOiByZWxhdGl2ZTsKICB0b3A6IDUwJTsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgwLCAtNTAlKTsKICBib3JkZXItcmFkaXVzOiA1MCU7CiAgaGVpZ2h0OiA2MHB4OwogIHdpZHRoOiA2MHB4OwogIGJhY2tncm91bmQtY29sb3I6ICNmZmY7CiAgZmxvYXQ6IGxlZnQ7Cn0KCi51c2VyLWljb24gaW1nIHsKICBwb3NpdGlvbjogcmVsYXRpdmU7CiAgYm9yZGVyLXJhZGl1czogNTAlOwogIGhlaWdodDogNjBweDsKICB3aWR0aDogNjBweDsKfQoKLnVzZXItaWNvbiAudXBsb2FkaW5nIHsKICBsZWZ0OiAwOwogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICBib3JkZXItcmFkaXVzOiA1MCU7CiAgb3BhY2l0eTogMDsKfQoKLm5hdi1iYXIgewogIGJhY2tncm91bmQtY29sb3I6ICNkZjM4MzI7CiAgY29sb3I6ICNmZmY7Cn0K"},{"version":3,"sources":["Profile.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6LA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;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\" v-if=\"this.isallrefresh\">\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\">{{ name }}</div>\n        <div v-else>\n          <a @click=\"infoLogin\">登陆</a><a>/</a\n          ><a @click=\"infoRegister\">注册</a>\n        </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\">\n        <img src=\"~assets/img/profile/order.svg\" alt=\"\" /><span>我的订单</span>\n      </div>\n      <div class=\"item imte3\">\n        <img\n          src=\"~assets/img/profile/cart.svg\"\n          alt=\"\"\n          @click=\"successOrder\"\n        /><span>送货中</span>\n      </div>\n      <div class=\"item imte4\">\n        <img src=\"~assets/img/profile/success.svg\" alt=\"\" @click=\"overOrder\" />\n        <span>已完成</span>\n      </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,getname } 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      isrefresh: true,\n      isallrefresh: true\n    };\n  },\n  async mounted() {\n    this.token = window.localStorage.getItem(\"token\");\n    if (this.token) {\n      this.getAvatar();\n\n      const res = await getSign();\n      this.sign = res.data;\n\n      const ores=await getname()\n      this.name=ores.data\n    }\n    this.$bus.$on(\"isrefreshinfo\", this.isrefreshinfo);\n    this.$bus.$on(\"isallrefreshInfo\", this.isallrefreshInfo);\n  },\n  methods: {\n    isallrefreshInfo() {\n      this.isallrefresh = false;\n      var oallself = this;\n      setTimeout(async function() {\n        const res = await getSign();\n        oallself.sign = res.data;\n        const ores=await getname()\n        oallself.name=ores.data\n        oallself.getAvatar();\n        oallself.isallrefresh = true;\n      }, 300);\n    },\n    isrefreshinfo() {\n      this.isrefresh = false;\n      var oself = this;\n      setTimeout(async function() {\n        const ores=await getname()\n        oself.name=ores.data\n\n        const res = await getSign();\n        oself.sign = res.data;\n        oself.isrefresh = true;\n      }, 300);\n    },\n    overOrder() {\n      this.$router.push(\"/overorder\");\n    },\n    successOrder() {\n      this.$router.push(\"/successorder\");\n    },\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      this.token = window.localStorage.getItem(\"token\");\n      if (this.token) {\n        window.localStorage.clear();\n        this.$router.push(\"/login\");\n        this.$message(\"退出成功\");\n        this.avatarexit=false;\n        this.name=false;\n        this.sign=''\n      } else {\n        this.$router.push(\"/login\");\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      this.token = window.localStorage.getItem(\"token\");\n      if (!this.token) this.$router.push(\"/login\");\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    async getAvatar() {\n      try {\n        this.id = window.localStorage.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    pullingDown() {\n      this.$refs.scroll.finishPullDown();\n    }\n  },\n  created() {}\n};\n</script>\n\n<style scoped>\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.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.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: #df3832;\n  color: #fff;\n}\n</style>\n"]}]}