{"version":3,"sources":["webpack:///./src/assets/images/qrcode.jpg","webpack:///./src/views/login/index.vue","webpack:///./src/views/login/components/login-form.vue","webpack:///./src/views/login/components/login-form.vue?0f22","webpack:///./src/views/login/index.vue?8023","webpack:///./src/views/login/components/login-form.vue?df26","webpack:///./src/views/login/index.vue?456b"],"names":["module","exports","class","src","alt","href","activeName","style","isMsgLogin","ref","validation-schema","schema","autocomplete","errors","mobile","form","name","type","placeholder","code","send","time","account","password","as","isAgree","login","qqUrl","components","Form","Field","setup","mySchema","formCom","value","resetForm","store","router","route","validate","valid","data","user","result","id","avatar","nickname","token","commit","dispatch","then","push","query","redirectUrl","Message","text","response","message","pause","resume","catch","e","setFieldError","appId","qqBack","encodeURIComponent","render","__scopeId","LoginHeader","LoginFooter","LoginForm"],"mappings":"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","file":"js/chunk-1293bbf8.9eb7aeb0.js","sourcesContent":["module.exports = __webpack_public_path__ + \"img/qrcode.5372a064.jpg\";","<template>\n  <LoginHeader>欢迎登录</LoginHeader>\n  <section class=\"login-section\">\n    <div class=\"wrapper\">\n      <nav>\n        <a @click=\"activeName='account'\" :class=\"{active:activeName==='account'}\" href=\"javascript:;\">账户登录</a>\n        <a @click=\"activeName='qrcode'\" :class=\"{active:activeName==='qrcode'}\" href=\"javascript:;\">扫码登录</a>\n      </nav>\n      <!-- 帐号登录&扫码登录 -->\n      <LoginForm v-if=\"activeName==='account'\">表单</LoginForm>\n      <div v-if=\"activeName==='qrcode'\" class=\"qrcode-box\">\n        <img src=\"@/assets/images/qrcode.jpg\" alt=\"\">\n        <p>打开 <a href=\"javascript:;\">小兔鲜App</a> 扫码登录</p>\n      </div>\n    </div>\n  </section>\n  <LoginFooter />\n</template>\n<script>\nimport LoginHeader from './components/login-header'\nimport LoginFooter from './components/login-footer'\nimport LoginForm from './components/login-form'\nimport { ref } from 'vue'\nimport { useStore } from 'vuex'\nimport { useRoute } from 'vue-router'\nexport default {\n  name: 'PageLogin',\n  components: { LoginHeader, LoginFooter, LoginForm },\n  setup () {\n    const activeName = ref('account')\n\n    // 存储回跳地址\n    const store = useStore()\n    const route = useRoute()\n    store.commit('user/setRedirectUrl', route.query.redirectUrl || '/')\n\n    return { activeName }\n  }\n}\n</script>\n<style scoped lang=\"less\">\n.login-section {\n  background: url(../../assets/images/login-bg.png) no-repeat center / cover;\n  height: 488px;\n  position: relative;\n  .wrapper {\n    width: 380px;\n    background: #fff;\n    min-height: 400px;\n    position: absolute;\n    left: 50%;\n    top: 54px;\n    transform: translate3d(100px,0,0);\n    box-shadow: 0 0 10px rgba(0,0,0,.15);\n    nav {\n      height: 55px;\n      border-bottom: 1px solid #f5f5f5;\n      display: flex;\n      padding: 0 40px;\n      text-align: right;\n      align-items: center;\n      a {\n        flex: 1;\n        line-height: 1;\n        display: inline-block;\n        font-size: 18px;\n        position: relative;\n        &:first-child {\n          border-right: 1px solid #f5f5f5;\n          text-align: left;\n        }\n        &.active{\n          color: @xtxColor;\n          font-weight: bold;\n        }\n      }\n    }\n  }\n}\n// 二维码容器\n.qrcode-box {\n  text-align: center;\n  padding-top: 40px;\n  p {\n    margin-top: 20px;\n    a {\n      color: @xtxColor;\n      font-size: 16px;\n    }\n  }\n}\n</style>\n","<template>\n  <div class=\"account-box\">\n    <div class=\"toggle\">\n      <a @click=\"isMsgLogin=false\" href=\"javascript:;\" v-if=\"isMsgLogin\">\n        <i class=\"iconfont icon-user\"></i> 使用账号登录\n      </a>\n      <a @click=\"isMsgLogin=true\" href=\"javascript:;\" v-else>\n        <i class=\"iconfont icon-msg\"></i> 使用短信登录\n      </a>\n    </div>\n    <Form ref=\"formCom\" class=\"form\" :validation-schema=\"schema\" v-slot=\"{errors}\" autocomplete=\"off\">\n      <template v-if=\"!isMsgLogin\">\n        <div class=\"form-item\">\n          <div class=\"input\">\n            <i class=\"iconfont icon-user\"></i>\n            <Field :class=\"{error:errors.account}\" v-model=\"form.account\" name=\"account\" type=\"text\" placeholder=\"请输入用户名\" />\n          </div>\n          <div class=\"error\" v-if=\"errors.account\">\n            <i class=\"iconfont icon-warning\" />\n            {{errors.account}}\n          </div>\n        </div>\n        <div class=\"form-item\">\n          <div class=\"input\">\n            <i class=\"iconfont icon-lock\"></i>\n            <Field :class=\"{error:errors.password}\" v-model=\"form.password\" name=\"password\" type=\"password\" placeholder=\"请输入密码\" />\n          </div>\n          <div class=\"error\" v-if=\"errors.password\">\n            <i class=\"iconfont icon-warning\" />\n            {{errors.password}}\n          </div>\n          <div class=\"form-item\" style=\"color: red\">\n            应相关部门要求，演示账号密码调整到黑马程序员公众号申请，回复“PIP项目库”获取账号密码信息 \n          </div>\n        </div>\n      </template>\n      <template v-else>\n        <div class=\"form-item\">\n          <div class=\"input\">\n            <i class=\"iconfont icon-user\"></i>\n            <Field :class=\"{error:errors.mobile}\" v-model=\"form.mobile\" name=\"mobile\" type=\"text\" placeholder=\"请输入手机号\" />\n          </div>\n          <div class=\"error\" v-if=\"errors.mobile\">\n            <i class=\"iconfont icon-warning\" />\n            {{errors.mobile}}\n          </div>\n        </div>\n        <div class=\"form-item\">\n          <div class=\"input\">\n            <i class=\"iconfont icon-code\"></i>\n            <Field :class=\"{error:errors.code}\" v-model=\"form.code\" name=\"code\" type=\"text\" placeholder=\"请输入验证码\" />\n            <span @click=\"send()\" class=\"code\">\n              {{time===0?'发送验证码':`${time}秒后发送`}}\n            </span>\n          </div>\n          <div class=\"error\" v-if=\"errors.code\">\n            <i class=\"iconfont icon-warning\" />\n            {{errors.code}}\n          </div>\n        </div>\n      </template>\n      <div class=\"form-item\">\n        <div class=\"agree\">\n          <Field as=\"XtxCheckbox\" name=\"isAgree\" v-model=\"form.isAgree\" />\n          <span>我已同意</span>\n          <a href=\"javascript:;\">《隐私条款》</a>\n          <span>和</span>\n          <a href=\"javascript:;\">《服务条款》</a>\n        </div>\n        <div class=\"error\" v-if=\"errors.isAgree\">\n          <i class=\"iconfont icon-warning\" />\n          {{errors.isAgree}}\n        </div>\n      </div>\n      <a @click=\"login()\" href=\"javascript:;\" class=\"btn\">登录</a>\n    </Form>\n    <div class=\"action\">\n      <a :href=\"qqUrl\">\n        <img src=\"https://qzonestyle.gtimg.cn/qzone/vas/opensns/res/img/Connect_logo_7.png\" alt=\"\">\n      </a>\n      <div class=\"url\">\n        <a href=\"javascript:;\">忘记密码</a>\n        <a href=\"javascript:;\">免费注册</a>\n      </div>\n    </div>\n  </div>\n</template>\n<script>\nimport { onUnmounted, reactive, ref, watch } from 'vue'\nimport { Form, Field } from 'vee-validate'\nimport schema from '@/utils/vee-validate-schema'\nimport Message from '@/components/library/Message'\nimport { userAccountLogin, userMobileLogin, userMobileLoginMsg } from '@/api/user'\nimport { useStore } from 'vuex'\nimport { useRoute, useRouter } from 'vue-router'\nimport { useIntervalFn } from '@vueuse/core'\nexport default {\n  name: 'LoginForm',\n  components: { Form, Field },\n  setup () {\n    // 切换短信登录\n    const isMsgLogin = ref(false)\n    // 表单数据对象\n    const form = reactive({\n      isAgree: true,\n      account: '',\n      password: '',\n      mobile: null,\n      code: null\n    })\n\n    // vee-validate 校验基本步骤\n    // 1. 导入 Form Field 组件 将 form 和 input 进行替换，需要加上name用来指定将来的校验规则函数的\n    // 2. Field 需要进行数据绑定，字段名称最好和后台接口需要的一致\n    // 3. 定义Field的name属性指定的校验规则函数，Form的validation-schema接受定义好的校验规则是对象\n    // 4. 自定义组件需要校验必须先支持v-model 然后Field使用as指定为组件名称\n    const mySchema = {\n      // 校验函数规则：返回true就是校验成功，返回一个字符串就是失败，字符串就是错误提示\n      account: schema.account,\n      password: schema.password,\n      mobile: schema.mobile,\n      code: schema.code,\n      isAgree: schema.isAgree\n    }\n\n    // 监听isMsgLogin重置表单（数据+清除校验结果）\n    const formCom = ref(null)\n    watch(isMsgLogin, () => {\n      // 重置数据\n      form.isAgree = true\n      form.account = null\n      form.password = null\n      form.mobile = null\n      form.code = null\n      // 如果是没有销毁Field组件，之前的校验结果是不会清除  例如：v-show切换的\n      // Form组件提供了一个 resetForm 函数清除校验结果\n      formCom.value.resetForm()\n    })\n\n    // setup中获取组件实例 proxy\n    // const { proxy } = getCurrentInstance()\n    // proxy.$message({ text: '111' })\n\n    // 需要在点击登录的时候对整体表单进行校验\n    const store = useStore()\n    const router = useRouter()\n    const route = useRoute()\n    const login = async () => {\n      // Form组件提供了一个 validate 函数作为整体表单校验，当是返回的是一个promise\n      const valid = await formCom.value.validate()\n      if (valid) {\n        try {\n          let data = null\n          if (isMsgLogin.value) {\n            // **手机号登录\n            // 2.1. 准备一个API做手机号登录\n            // 2.2. 调用API函数\n            // 2.3. 成功：存储用户信息 + 跳转至来源页或者首页 + 消息提示\n            // 2.4. 失败：消息提示\n            const { mobile, code } = form\n            data = await userMobileLogin({ mobile, code })\n          } else {\n            // **帐号登录\n            // 1. 准备一个API做帐号登录\n            // 2. 调用API函数\n            // 3. 成功：存储用户信息 + 跳转至来源页或者首页 + 消息提示\n            // 4. 失败：消息提示\n            const { account, password } = form\n            data = await userAccountLogin({ account, password })\n          }\n          // 存储用户信息\n          const { id, account, avatar, mobile, nickname, token } = data.result\n          store.commit('user/setUser', { id, account, avatar, mobile, nickname, token })\n          store.dispatch('cart/mergeCart').then(() => {\n            // 进行跳转\n            router.push(route.query.redirectUrl || '/')\n            // 成功消息提示\n            Message({ type: 'success', text: '登录成功' })\n          })\n        } catch (e) {\n          // 失败提示\n          if (e.response.data) {\n            Message({ type: 'error', text: e.response.data.message || '登录失败' })\n          }\n        }\n      }\n    }\n\n    // pause 暂停 resume 开始\n    // useIntervalFn(回调函数,执行间隔,是否立即开启)\n    const time = ref(0)\n    const { pause, resume } = useIntervalFn(() => {\n      time.value--\n      if (time.value <= 0) {\n        pause()\n      }\n    }, 1000, false)\n    onUnmounted(() => {\n      pause()\n    })\n\n    // 1. 发送验证码\n    // 1.1 绑定发送验证码按钮点击事件\n    // 1.2 校验手机号，如果成功才去发送短信（定义API），请求成功开启60s的倒计时，不能再次点击，倒计时结束恢复\n    // 1.3 如果失败，失败的校验样式显示出来\n    const send = async () => {\n      const valid = mySchema.mobile(form.mobile)\n      if (valid === true) {\n        // 通过\n        if (time.value === 0) {\n        // 没有倒计时才可以发送\n          userMobileLoginMsg(form.mobile).then(() => {\n            Message({ type: 'success', text: '发送成功' })\n            time.value = 60\n            resume()\n          }).catch(e => {\n            Message({ type: 'error', text: e.response.data?.message || '发送失败' })\n          })\n        }\n      } else {\n        // 失败，使用vee的错误函数显示错误信息 setFieldError(字段,错误信息)\n        formCom.value.setFieldError('mobile', valid)\n      }\n    }\n\n    // 初始化QQ登录按钮 （官方）\n    // 1. 准备span有id = qqLoginBtn\n    // 2. QC.Login({btnId:\"qqLoginBtn\"})\n    // onMounted(() => {\n    //   QC.Login({ btnId: 'qqLoginBtn' })\n    // })\n    const appId = process.env.VUE_APP_QQAPPID\n    const qqBack = encodeURIComponent(process.env.VUE_APP_QQBACK)\n    const qqUrl = `https://graph.qq.com/oauth2.0/authorize?client_id=${appId}&response_type=token&scope=all&redirect_uri=${qqBack}`\n\n    return { isMsgLogin, form, schema: mySchema, formCom, login, send, time, qqUrl }\n  }\n}\n</script>\n<style scoped lang=\"less\">\n// 账号容器\n.account-box {\n  .toggle {\n    padding: 15px 40px;\n    text-align: right;\n    a {\n      color: @xtxColor;\n      i {\n        font-size: 14px;\n      }\n    }\n  }\n  .form {\n    padding: 0 40px;\n    &-item {\n      margin-bottom: 28px;\n      .input {\n        position: relative;\n        height: 36px;\n        > i {\n          width: 34px;\n          height: 34px;\n          background: #cfcdcd;\n          color: #fff;\n          position: absolute;\n          left: 1px;\n          top: 1px;\n          text-align: center;\n          line-height: 34px;\n          font-size: 18px;\n        }\n        input {\n          padding-left: 44px;\n          border: 1px solid #cfcdcd;\n          height: 36px;\n          line-height: 36px;\n          width: 100%;\n          &.error {\n            border-color: @priceColor;\n          }\n          &.active,&:focus {\n            border-color: @xtxColor;\n          }\n        }\n        .code {\n          position: absolute;\n          right: 1px;\n          top: 1px;\n          text-align: center;\n          line-height: 34px;\n          font-size: 14px;\n          background: #f5f5f5;\n          color: #666;\n          width: 90px;\n          height: 34px;\n          cursor: pointer;\n        }\n      }\n      > .error {\n        position: absolute;\n        font-size: 12px;\n        line-height: 28px;\n        color: @priceColor;\n        i {\n          font-size: 14px;\n          margin-right: 2px;\n        }\n      }\n    }\n    .agree {\n      a {\n        color: #069;\n      }\n    }\n    .btn {\n      display: block;\n      width: 100%;\n      height: 40px;\n      color: #fff;\n      text-align: center;\n      line-height: 40px;\n      background: @xtxColor;\n      &.disabled {\n        background: #cfcdcd;\n      }\n    }\n  }\n  .action {\n    padding: 20px 40px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    .url {\n      a {\n        color: #999;\n        margin-left: 10px;\n      }\n    }\n  }\n}\n</style>\n","import { render } from \"./login-form.vue?vue&type=template&id=32a63c1c&scoped=true\"\nimport script from \"./login-form.vue?vue&type=script&lang=js\"\nexport * from \"./login-form.vue?vue&type=script&lang=js\"\n\nimport \"./login-form.vue?vue&type=style&index=0&id=32a63c1c&scoped=true&lang=less\"\nscript.render = render\nscript.__scopeId = \"data-v-32a63c1c\"\n\nexport default script","import { render } from \"./index.vue?vue&type=template&id=78257f91&scoped=true\"\nimport script from \"./index.vue?vue&type=script&lang=js\"\nexport * from \"./index.vue?vue&type=script&lang=js\"\n\nimport \"./index.vue?vue&type=style&index=0&id=78257f91&scoped=true&lang=less\"\nscript.render = render\nscript.__scopeId = \"data-v-78257f91\"\n\nexport default script","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--11-oneOf-1-1!../../../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--11-oneOf-1-2!../../../../node_modules/less-loader/dist/cjs.js??ref--11-oneOf-1-3!../../../../node_modules/style-resources-loader/lib/index.js??ref--11-oneOf-1-4!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader-v16/dist/index.js??ref--1-1!./login-form.vue?vue&type=style&index=0&id=32a63c1c&scoped=true&lang=less\"","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--11-oneOf-1-1!../../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--11-oneOf-1-2!../../../node_modules/less-loader/dist/cjs.js??ref--11-oneOf-1-3!../../../node_modules/style-resources-loader/lib/index.js??ref--11-oneOf-1-4!../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../node_modules/vue-loader-v16/dist/index.js??ref--1-1!./index.vue?vue&type=style&index=0&id=78257f91&scoped=true&lang=less\""],"sourceRoot":""}