{"version":3,"sources":["webpack:///./src/components/header/modules/userCard.vue","webpack:///./src/components/header/modules/userCard.vue?755e","webpack:///./src/components/header/modules/userCard.vue?15b5","webpack:///./node_modules/core-js/modules/es.function.name.js"],"names":["class","src","userInfo","avatar","alt","width","height","nickname","exp","integral","linkList","item","index","key","to","url","target","icon","title","latest","name","section","handleLogoutClick","setup","store","getters","dispatch","render","__scopeId","DESCRIPTORS","defineProperty","f","FunctionPrototype","Function","prototype","FunctionPrototypeToString","toString","nameRE","NAME","configurable","get","call","this","match","error"],"mappings":"oPACOA,MAAM,Q,GAEJA,MAAM,Y,GAEJA,MAAM,iB,GACNA,MAAM,0B,GACNA,MAAM,wB,GAQTA,MAAM,c,GAaLA,MAAM,gB,GACJA,MAAM,qB,EACT,yBAAqC,KAAlCA,MAAM,yBAAuB,S,GAC5BA,MAAM,S,GACPA,MAAM,W,EACT,yBAA2B,QAArBA,MAAM,OAAM,MAAE,G,4IAhC1B,yBAsCM,MAtCN,EAsCM,CApCJ,yBASM,MATN,EASM,CARJ,yBAA4D,OAAtDC,IAAK,EAAAC,SAASC,OAAQC,IAAI,KAAKC,MAAM,KAAKC,OAAO,M,gBACvD,yBAMM,MANN,EAMM,CALJ,yBAA2D,IAA3D,EAA2D,6BAAvB,EAAAJ,SAASK,UAAQ,GACrD,yBAGI,IAHJ,EAGI,CAFF,yBAA+B,YAAzB,KAAE,6BAAE,EAAAL,SAASM,KAAG,GACtB,yBAAoC,YAA9B,KAAE,6BAAE,EAAAN,SAASO,UAAQ,SAMjC,yBAUK,KAVL,EAUK,E,2BATH,yBAQK,2CAPqB,EAAAC,UAAQ,SAAxBC,EAAMC,G,gCADhB,yBAQK,MANFC,IAAKD,EACNZ,MAAM,mB,CACN,yBAGc,GAHAc,GAAIH,EAAKI,IAAKC,OAAO,U,YACjC,iBAAwC,CAAxC,yBAAwC,KAApChB,MAAK,YAAeW,EAAKM,O,QAC7B,yBAA2B,yCAAnBN,EAAKO,OAAK,O,+BAMxB,yBAOM,MAPN,EAOM,CANJ,yBAKM,MALN,EAKM,CAJJ,EACA,yBAA+C,KAA/C,EAA+C,6BAA3B,EAAAhB,SAASiB,OAAOC,MAAI,GACxC,yBAAkD,IAAlD,EAAkD,6BAA7B,EAAAlB,SAASiB,OAAOE,SAAO,GAC5C,MAKJ,yBAAwD,KAArDrB,MAAM,YAAa,QAAK,8BAAE,EAAAsB,mBAAA,EAAAA,kBAAA,sBAAmB,a,YAM9CZ,EAAW,CACf,CAAEO,KAAM,cAAeC,MAAO,OAAQH,IAAK,WAC3C,CAAEE,KAAM,aAAcC,MAAO,OAAQH,IAAK,UAC1C,CAAEE,KAAM,gBAAiBC,MAAO,OAAQH,IAAK,aAC7C,CAAEE,KAAM,eAAgBC,MAAO,OAAQH,IAAK,UAE/B,+BAAgB,CAC7BK,KAAM,WACNG,MAF6B,WAG3B,IAAMC,EAAQ,iBACRtB,EAAW,uBAAS,WACxB,OAAOsB,EAAMC,QAAQvB,YAEjBoB,EAAoB,kBAAME,EAAME,SAAS,gBAC/C,MAAO,CAAExB,WAAUQ,WAAUY,wB,UCrDjC,EAAOK,OAASA,EAChB,EAAOC,UAAY,kBAEJ,gB,oCCRf,W,4CCAA,IAAIC,EAAc,EAAQ,QACtBC,EAAiB,EAAQ,QAAuCC,EAEhEC,EAAoBC,SAASC,UAC7BC,EAA4BH,EAAkBI,SAC9CC,EAAS,wBACTC,EAAO,OAIPT,KAAiBS,KAAQN,IAC3BF,EAAeE,EAAmBM,EAAM,CACtCC,cAAc,EACdC,IAAK,WACH,IACE,OAAOL,EAA0BM,KAAKC,MAAMC,MAAMN,GAAQ,GAC1D,MAAOO,GACP,MAAO","file":"js/chunk-0c39ad0c.b10b928e.js","sourcesContent":["<template>\r\n  <div class=\"card\">\r\n    <!-- information -->\r\n    <div class=\"card-top\">\r\n      <img :src=\"userInfo.avatar\" alt=\"图像\" width=\"72\" height=\"72\">\r\n      <div class=\"card-top-info\">\r\n        <p class=\"card-top-info-nickname\">{{userInfo.nickname}}</p>\r\n        <p class=\"card-top-info-number\">\r\n          <span>经验{{userInfo.exp}}</span>\r\n          <span>积分{{userInfo.integral}}</span>\r\n        </p>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- link -->\r\n    <ul class=\"card-links\">\r\n      <li\r\n        v-for=\"(item, index) in linkList\"\r\n        :key=\"index\"\r\n        class=\"card-links-item\">\r\n        <router-link :to=\"item.url\" target=\"_blank\">\r\n          <i :class=\"['iconfont', item.icon]\"></i>\r\n          <span>{{item.title}}</span>\r\n        </router-link>\r\n      </li>\r\n    </ul>\r\n\r\n    <!-- history -->\r\n    <div class=\"card-history\">\r\n      <div class=\"card-history-item\">\r\n        <i class=\"iconfont icon-history\"></i>\r\n        <h3 class=\"title\">{{userInfo.latest.name}}</h3>\r\n        <p class=\"section\">{{userInfo.latest.section}}</p>\r\n        <span class=\"btn\">继续</span>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- exit -->\r\n    <p class=\"card-exit\" @click=\"handleLogoutClick\">安全退出</p>\r\n  </div>\r\n</template>\r\n<script>\r\nimport { defineComponent, computed } from 'vue'\r\nimport { useStore } from 'vuex'\r\nconst linkList = [\r\n  { icon: 'icon-lesson', title: '我的课程', url: '/lesson' },\r\n  { icon: 'icon-order', title: '订单中心', url: '/order' },\r\n  { icon: 'icon-integral', title: '积分商场', url: '/integral' },\r\n  { icon: 'icon-setting', title: '个人设置', url: '/user' }\r\n]\r\nexport default defineComponent({\r\n  name: 'UserCard',\r\n  setup () {\r\n    const store = useStore()\r\n    const userInfo = computed(() => {\r\n      return store.getters.userInfo\r\n    })\r\n    const handleLogoutClick = () => store.dispatch('user/logout')\r\n    return { userInfo, linkList, handleLogoutClick }\r\n  }\r\n})\r\n</script>\r\n<style lang=\"scss\" scoped>\r\n  @import '~@/assets/styles/variables.scss';\r\n  @import '~@/assets/styles/mixin.scss';\r\n  .card {\r\n    display: none;\r\n    z-index: 120;\r\n    position: absolute;\r\n    right: 0;\r\n    top: 100%;\r\n    width: 306px;\r\n    min-height: 300px;\r\n    padding: 24px;\r\n    box-sizing: border-box;\r\n    background-color: #fff;\r\n    box-shadow: 0 8px 16px 0 rgba(7,17,27,0.1);\r\n    border-bottom-left-radius: $border-radius-normal;\r\n    border-bottom-right-radius: $border-radius-normal;\r\n    line-height: 1;\r\n    text-align: left;\r\n    cursor: default;\r\n    &-top {\r\n      display: flex;\r\n      justify-content: center;\r\n      align-items: center;\r\n      & > img {\r\n        display: inline-block;\r\n        margin-right: 16px;\r\n        width: 72px;\r\n        height: 72px;\r\n        border-radius: 50%;\r\n      }\r\n      &-info {\r\n        flex: 1;\r\n        &-nickname {\r\n          font-size: $font-medium;\r\n          line-height: 28px;\r\n          color: $primary-text;\r\n        }\r\n        &-number {\r\n          margin-top: 4px;\r\n          font-size: $font-normal;\r\n          color: $regular-text;\r\n          span {\r\n            display: inline-block;\r\n            vertical-align: middle;\r\n            font-size: $font-small;\r\n            & + span {\r\n              margin-left: 10px;\r\n            }\r\n          }\r\n        }\r\n      }\r\n    }\r\n    &-links {\r\n      margin: 16px 0;\r\n      display: flex;\r\n      justify-content: center;\r\n      align-items: center;\r\n      flex-flow: wrap;\r\n      &-item {\r\n        flex-basis: 128px;\r\n        margin-right: 2px;\r\n        margin-bottom: 2px;\r\n        height: 36px;\r\n        line-height: 36px;\r\n        background-color: rgba($placeholder-text, 0.3);\r\n        border-radius: $border-radius-mini;\r\n        text-align: center;\r\n        &:hover {\r\n          background-color: rgba($placeholder-text, 0.7);\r\n        }\r\n        &:nth-child(2n) {\r\n          margin-right: 0;\r\n        }\r\n        a {\r\n          font-size: $font-normal;\r\n          color: $primary-text;\r\n        }\r\n        i, span {\r\n          display: inline-block;\r\n          vertical-align: middle;\r\n        }\r\n        .iconfont {\r\n          margin-right: 8px;\r\n        }\r\n      }\r\n    }\r\n    &-history {\r\n      &-item {\r\n        position: relative;\r\n        padding-left: 24px;\r\n        padding-bottom: 16px;\r\n        border-bottom: 1px solid rgba($placeholder-text, 0.5);\r\n        color: $regular-text;\r\n        font-size: $font-normal;\r\n        .iconfont {\r\n          position: absolute;\r\n          left: 0;\r\n          top: 2px;\r\n          font-weight: bold;\r\n        }\r\n        .title {\r\n          margin-bottom: 8px;\r\n          color: $regular-text;\r\n          font-size: inherit;\r\n          line-height: 20px;\r\n          @include ellipsis;\r\n        }\r\n        .section {\r\n          padding-right: 40px;\r\n          line-height: 20px;\r\n          color: $secondary-text;\r\n          @include ellipsis;\r\n        }\r\n        .btn {\r\n          position: absolute;\r\n          right: 0;\r\n          top: 30px;\r\n          color: $theme-green;\r\n          font-size: $font-normal;\r\n          cursor: pointer;\r\n        }\r\n      }\r\n    }\r\n    &-exit {\r\n      margin-top: 8px;\r\n      font-size: $font-small;\r\n      line-height: 18px;\r\n      text-align: left;\r\n      color: $secondary-text;\r\n      cursor: pointer;\r\n      &:hover {\r\n        color: $primary-text\r\n      }\r\n    }\r\n  }\r\n</style>\r\n","import { render } from \"./userCard.vue?vue&type=template&id=1c60c458&scoped=true\"\nimport script from \"./userCard.vue?vue&type=script&lang=js\"\nexport * from \"./userCard.vue?vue&type=script&lang=js\"\n\nimport \"./userCard.vue?vue&type=style&index=0&id=1c60c458&lang=scss&scoped=true\"\nscript.render = render\nscript.__scopeId = \"data-v-1c60c458\"\n\nexport default script","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../../node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/@vue/cli-service/node_modules/vue-loader-v16/dist/index.js??ref--0-1!./userCard.vue?vue&type=style&index=0&id=1c60c458&lang=scss&scoped=true\"","var DESCRIPTORS = require('../internals/descriptors');\nvar defineProperty = require('../internals/object-define-property').f;\n\nvar FunctionPrototype = Function.prototype;\nvar FunctionPrototypeToString = FunctionPrototype.toString;\nvar nameRE = /^\\s*function ([^ (]*)/;\nvar NAME = 'name';\n\n// Function instances `.name` property\n// https://tc39.github.io/ecma262/#sec-function-instances-name\nif (DESCRIPTORS && !(NAME in FunctionPrototype)) {\n  defineProperty(FunctionPrototype, NAME, {\n    configurable: true,\n    get: function () {\n      try {\n        return FunctionPrototypeToString.call(this).match(nameRE)[1];\n      } catch (error) {\n        return '';\n      }\n    }\n  });\n}\n"],"sourceRoot":""}