{"version":3,"sources":["webpack:///./src/components/ButtonTwoTone.vue?42d3","webpack:///./node_modules/core-js/internals/same-value.js","webpack:///./src/views/loginUsername.vue?f0f5","webpack:///./src/components/ButtonTwoTone.vue?9500","webpack:///src/components/ButtonTwoTone.vue","webpack:///./src/components/ButtonTwoTone.vue?3552","webpack:///./src/components/ButtonTwoTone.vue","webpack:///./node_modules/core-js/modules/es.string.search.js","webpack:///./src/views/loginUsername.vue?a15d","webpack:///src/views/loginUsername.vue","webpack:///./src/views/loginUsername.vue?5f39","webpack:///./src/views/loginUsername.vue"],"names":["module","exports","Object","is","x","y","render","_vm","this","_h","$createElement","_c","_self","class","color","style","iconClass","marginRight","iconButton","attrs","_e","_t","staticRenderFns","name","props","type","String","default","Boolean","horizontalPadding","Number","backgroundColor","textColor","shape","computed","buttonStyle","borderRadius","padding","width","styles","component","fixRegExpWellKnownSymbolLogic","anObject","requireObjectCoercible","sameValue","regExpExec","SEARCH","nativeSearch","maybeCallNative","regexp","O","searcher","undefined","call","RegExp","res","done","value","rx","S","previousLastIndex","lastIndex","result","index","staticClass","_v","_s","$t","directives","rawName","expression","domProps","on","$event","indexOf","_k","keyCode","key","throttleSearch","target","composing","keyword","activeUser","nickname","_l","user","id","active","_f","avatarUrl","nativeOn","confirm","components","ButtonTwoTone","data","created","methods","search","updateData","uid","userId","limit","playlist"],"mappings":"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","file":"js/chunk-5647e7d7.dbe593fa.js","sourcesContent":["export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--7-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ButtonTwoTone.vue?vue&type=style&index=0&id=18f7e8ba&lang=scss&scoped=true&\"","// `SameValue` abstract operation\n// https://tc39.es/ecma262/#sec-samevalue\nmodule.exports = Object.is || function is(x, y) {\n  // eslint-disable-next-line no-self-compare -- NaN check\n  return x === y ? x !== 0 || 1 / x === 1 / y : x != x && y != y;\n};\n","export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../node_modules/sass-loader/dist/cjs.js??ref--7-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./loginUsername.vue?vue&type=style&index=0&id=5bc0429c&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('button',{class:_vm.color,style:(_vm.buttonStyle)},[(_vm.iconClass !== null)?_c('svg-icon',{style:({ marginRight: _vm.iconButton ? '0px' : '8px' }),attrs:{\"iconClass\":_vm.iconClass}}):_vm._e(),_vm._t(\"default\")],2)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <button :style=\"buttonStyle\" :class=\"color\">\n    <svg-icon\n      v-if=\"iconClass !== null\"\n      :iconClass=\"iconClass\"\n      :style=\"{ marginRight: iconButton ? '0px' : '8px' }\"\n    />\n    <slot></slot>\n  </button>\n</template>\n\n<script>\nexport default {\n  name: \"ButtonTwoTone\",\n  props: {\n    iconClass: {\n      type: String,\n      default: null,\n    },\n    iconButton: {\n      type: Boolean,\n      default: false,\n    },\n    horizontalPadding: {\n      type: Number,\n      default: 16,\n    },\n    color: {\n      type: String,\n      default: \"blue\",\n    },\n    backgroundColor: {\n      type: String,\n      default: \"\",\n    },\n    textColor: {\n      type: String,\n      default: \"\",\n    },\n    shape: {\n      type: String,\n      default: \"square\",\n    },\n  },\n  computed: {\n    buttonStyle() {\n      let styles = {\n        borderRadius: this.shape === \"round\" ? \"50%\" : \"8px\",\n        padding: `8px ${this.horizontalPadding}px`,\n        // height: \"38px\",\n        width: this.shape === \"round\" ? \"38px\" : \"auto\",\n      };\n      if (this.backgroundColor !== \"\")\n        styles.backgroundColor = this.backgroundColor;\n      if (this.textColor !== \"\") styles.color = this.textColor;\n      return styles;\n    },\n  },\n};\n</script>\n\n<style lang=\"scss\" scoped>\nbutton {\n  height: 40px;\n  min-width: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 18px;\n  line-height: 18px;\n  font-weight: 600;\n  background-color: var(--color-primary-bg);\n  color: var(--color-primary);\n  margin-right: 12px;\n  transition: 0.2s;\n  .svg-icon {\n    width: 16px;\n    height: 16px;\n  }\n  &:hover {\n    transform: scale(1.06);\n  }\n  &:active {\n    transform: scale(0.94);\n  }\n}\nbutton.grey {\n  background-color: var(--color-secondary-bg);\n  color: var(--color-text);\n  opacity: 0.78;\n}\nbutton.transparent {\n  background-color: transparent;\n}\n</style>\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--11-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ButtonTwoTone.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--11-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ButtonTwoTone.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./ButtonTwoTone.vue?vue&type=template&id=18f7e8ba&scoped=true&\"\nimport script from \"./ButtonTwoTone.vue?vue&type=script&lang=js&\"\nexport * from \"./ButtonTwoTone.vue?vue&type=script&lang=js&\"\nimport style0 from \"./ButtonTwoTone.vue?vue&type=style&index=0&id=18f7e8ba&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"18f7e8ba\",\n  null\n  \n)\n\nexport default component.exports","'use strict';\nvar fixRegExpWellKnownSymbolLogic = require('../internals/fix-regexp-well-known-symbol-logic');\nvar anObject = require('../internals/an-object');\nvar requireObjectCoercible = require('../internals/require-object-coercible');\nvar sameValue = require('../internals/same-value');\nvar regExpExec = require('../internals/regexp-exec-abstract');\n\n// @@search logic\nfixRegExpWellKnownSymbolLogic('search', 1, function (SEARCH, nativeSearch, maybeCallNative) {\n  return [\n    // `String.prototype.search` method\n    // https://tc39.es/ecma262/#sec-string.prototype.search\n    function search(regexp) {\n      var O = requireObjectCoercible(this);\n      var searcher = regexp == undefined ? undefined : regexp[SEARCH];\n      return searcher !== undefined ? searcher.call(regexp, O) : new RegExp(regexp)[SEARCH](String(O));\n    },\n    // `RegExp.prototype[@@search]` method\n    // https://tc39.es/ecma262/#sec-regexp.prototype-@@search\n    function (regexp) {\n      var res = maybeCallNative(nativeSearch, regexp, this);\n      if (res.done) return res.value;\n\n      var rx = anObject(regexp);\n      var S = String(this);\n\n      var previousLastIndex = rx.lastIndex;\n      if (!sameValue(previousLastIndex, 0)) rx.lastIndex = 0;\n      var result = regExpExec(rx, S);\n      if (!sameValue(rx.lastIndex, previousLastIndex)) rx.lastIndex = previousLastIndex;\n      return result === null ? -1 : result.index;\n    }\n  ];\n});\n","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"login\"},[_c('div',[_c('div',{staticClass:\"title\"},[_vm._v(_vm._s(_vm.$t(\"login.usernameLogin\")))]),_c('div',{staticClass:\"sestion\"},[_c('div',{staticClass:\"search-box\"},[_c('div',{staticClass:\"container\"},[_c('svg-icon',{attrs:{\"icon-class\":\"search\"}}),_c('div',{staticClass:\"input\"},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.keyword),expression:\"keyword\"}],attrs:{\"placeholder\":_vm.$t('login.searchHolder')},domProps:{\"value\":(_vm.keyword)},on:{\"keydown\":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,\"enter\",13,$event.key,\"Enter\")){ return null; }return _vm.throttleSearch($event)},\"input\":function($event){if($event.target.composing){ return; }_vm.keyword=$event.target.value}}})])],1)])]),_c('div',{staticClass:\"sestion\"},[_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.activeUser.nickname === undefined),expression:\"activeUser.nickname === undefined\"}],staticClass:\"name\"},[_vm._v(\" \"+_vm._s(_vm.$t(\"login.enterTip\"))+\" \")]),_c('div',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.activeUser.nickname !== undefined),expression:\"activeUser.nickname !== undefined\"}],staticClass:\"name\"},[_vm._v(\" \"+_vm._s(_vm.$t(\"login.choose\"))+\" \")]),_c('div',{staticClass:\"user-list\"},_vm._l((_vm.result),function(user){return _c('div',{key:user.id,staticClass:\"user\",class:{ active: user.nickname === _vm.activeUser.nickname },on:{\"click\":function($event){_vm.activeUser = user}}},[_c('img',{staticClass:\"head\",attrs:{\"src\":_vm._f(\"resizeImage\")(user.avatarUrl)}}),_c('div',{staticClass:\"nickname\"},[_vm._v(\" \"+_vm._s(user.nickname)+\" \")])])}),0)]),_c('ButtonTwoTone',{directives:[{name:\"show\",rawName:\"v-show\",value:(_vm.activeUser.nickname !== undefined),expression:\"activeUser.nickname !== undefined\"}],nativeOn:{\"click\":function($event){return _vm.confirm($event)}}},[_vm._v(\" \"+_vm._s(_vm.$t(\"login.confirm\"))+\" \")])],1)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"login\">\n    <div>\n      <div class=\"title\">{{ $t(\"login.usernameLogin\") }}</div>\n      <div class=\"sestion\">\n        <div class=\"search-box\">\n          <div class=\"container\">\n            <svg-icon icon-class=\"search\" />\n            <div class=\"input\">\n              <input\n                :placeholder=\"$t('login.searchHolder')\"\n                v-model=\"keyword\"\n                @keydown.enter=\"throttleSearch\"\n              />\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"sestion\">\n        <div class=\"name\" v-show=\"activeUser.nickname === undefined\">\n          {{ $t(\"login.enterTip\") }}\n        </div>\n        <div class=\"name\" v-show=\"activeUser.nickname !== undefined\">\n          {{ $t(\"login.choose\") }}\n        </div>\n        <div class=\"user-list\">\n          <div\n            class=\"user\"\n            v-for=\"user in result\"\n            :key=\"user.id\"\n            :class=\"{ active: user.nickname === activeUser.nickname }\"\n            @click=\"activeUser = user\"\n          >\n            <img class=\"head\" :src=\"user.avatarUrl | resizeImage\" />\n            <div class=\"nickname\">\n              {{ user.nickname }}\n            </div>\n          </div>\n        </div>\n      </div>\n      <ButtonTwoTone\n        @click.native=\"confirm\"\n        v-show=\"activeUser.nickname !== undefined\"\n      >\n        {{ $t(\"login.confirm\") }}\n      </ButtonTwoTone>\n    </div>\n  </div>\n</template>\n\n<script>\nimport { mapMutations } from \"vuex\";\nimport NProgress from \"nprogress\";\nimport { search } from \"@/api/others\";\nimport { userPlaylist } from \"@/api/user\";\nimport { throttle } from \"@/utils/common\";\n\nimport ButtonTwoTone from \"@/components/ButtonTwoTone.vue\";\n\nexport default {\n  name: \"loginUsername\",\n  components: {\n    ButtonTwoTone,\n  },\n  data() {\n    return {\n      keyword: \"\",\n      result: [],\n      activeUser: {},\n    };\n  },\n  created() {\n    NProgress.done();\n  },\n  methods: {\n    ...mapMutations([\"updateData\"]),\n    search() {\n      if (!this.keyword) return;\n      search({ keywords: this.keyword, limit: 9, type: 1002 }).then((data) => {\n        this.result = data.result.userprofiles;\n        this.activeUser = this.result[0];\n      });\n    },\n    confirm() {\n      this.updateData({ key: \"user\", value: this.activeUser });\n      this.updateData({ key: \"loginMode\", value: \"username\" });\n      userPlaylist({\n        uid: this.activeUser.userId,\n        limit: 1,\n      }).then((data) => {\n        this.updateData({\n          key: \"likedSongPlaylistID\",\n          value: data.playlist[0].id,\n        });\n        this.$router.push({ path: \"/library\" });\n      });\n    },\n    throttleSearch: throttle(function () {\n      this.search();\n    }, 500),\n  },\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.login {\n  display: flex;\n  color: var(--color-text);\n}\n\n.title {\n  font-size: 42px;\n  font-weight: 700;\n  margin-bottom: 48px;\n}\n\n.sestion {\n  margin-top: 18px;\n  .name {\n    font-size: 14px;\n    font-weight: 500;\n    margin-bottom: 8px;\n    opacity: 0.78;\n  }\n}\n\n.search-box {\n  .container {\n    display: flex;\n    align-items: center;\n    height: 48px;\n    border-radius: 11px;\n    width: 326px;\n    background: var(--color-primary-bg);\n  }\n\n  .svg-icon {\n    height: 22px;\n    width: 22px;\n    color: var(--color-primary);\n    margin: {\n      left: 12px;\n      right: 8px;\n    }\n  }\n\n  input {\n    flex: 1;\n    font-size: 22px;\n    border: none;\n    background: transparent;\n    width: 115%;\n    font-weight: 600;\n    margin-top: -1px;\n    color: var(--color-primary);\n    &::placeholder {\n      color: var(--color-primary);\n      opacity: 0.78;\n    }\n  }\n}\n\n.user-list {\n  display: flex;\n  flex-wrap: wrap;\n  margin-top: 24px;\n  margin-bottom: 24px;\n}\n\n.user {\n  margin-right: 16px;\n  margin-bottom: 16px;\n  display: flex;\n  align-items: center;\n  padding: 12px 12px 12px 16px;\n  border-radius: 8px;\n  width: 256px;\n  transition: 0.2s;\n  user-select: none;\n  .head {\n    border-radius: 50%;\n    height: 44px;\n    width: 44px;\n  }\n  .nickname {\n    font-size: 18px;\n    margin-left: 12px;\n  }\n  &:hover {\n    background: var(--color-secondary-bg);\n  }\n}\n\n.user.active {\n  transition: 0.2s;\n  background: var(--color-primary-bg);\n  .nickname {\n    color: var(--color-primary);\n  }\n}\n</style>\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--11-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./loginUsername.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--11-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./loginUsername.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./loginUsername.vue?vue&type=template&id=5bc0429c&scoped=true&\"\nimport script from \"./loginUsername.vue?vue&type=script&lang=js&\"\nexport * from \"./loginUsername.vue?vue&type=script&lang=js&\"\nimport style0 from \"./loginUsername.vue?vue&type=style&index=0&id=5bc0429c&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"5bc0429c\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}