index.vue 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111
  1. <template>
  2. <view class="content">
  3. <view class="head">
  4. <text>登录</text>
  5. </view>
  6. <view class="login-wrap">
  7. <view class="username item">
  8. <text>账号:</text>
  9. <uni-easyinput :inputBorder="false" class="login_input" type="text" v-model="username" placeholder="请输入账号" />
  10. </view>
  11. <view class="password item">
  12. <text>密码:</text>
  13. <uni-easyinput :inputBorder="false" class="login_input" type="password" v-model="password" placeholder="请输入密码">
  14. </uni-easyinput>
  15. </view>
  16. <!-- <getPhone showByPlatform /> -->
  17. <button type="primary" @click="loginSubmit" class="submit-BT">登录</button>
  18. </view>
  19. </view>
  20. </template>
  21. <script>
  22. import { login} from '@/api/user';
  23. import { setToken } from '@/libs/auth';
  24. import getPhone from '@/components/getPhone.vue'
  25. export default {
  26. data() {
  27. return {
  28. username: "",
  29. password: "",
  30. }
  31. },
  32. onLoad({username,password}) {
  33. if(username){
  34. this.username=username;
  35. this.password=password;
  36. }
  37. },
  38. methods: {
  39. loginSubmit() {
  40. let username = (this.username).trim();
  41. let password = (this.password).trim();
  42. if (username.length < 1) {
  43. uni.showToast({
  44. title: '请填写账号',
  45. icon: "error"
  46. })
  47. return;
  48. }
  49. login({
  50. accountName:username,
  51. pwd:password
  52. }).then((res) => {
  53. let token = res.data.token;
  54. uni.setStorageSync('phone',username)
  55. uni.setStorageSync('accountId',res.data.id)
  56. setToken(token);
  57. uni.switchTab({
  58. url: '/pages/index/index'
  59. })
  60. }).catch((res)=>{
  61. console.log(res)
  62. })
  63. }
  64. }
  65. }
  66. </script>
  67. <style lang="scss" scoped>
  68. .content {
  69. .head {
  70. font-size: 50upx;
  71. text-align: center;
  72. padding: 40upx 0;
  73. letter-spacing: 2upx;
  74. }
  75. .login-wrap {
  76. width: 90%;
  77. margin: 50upx auto 0;
  78. box-sizing: border-box;
  79. padding: 20upx;
  80. border-radius: 8upx;
  81. .item {
  82. display: flex;
  83. justify-content: flex-start;
  84. align-items: center;
  85. height: 100upx;
  86. font-size: 32upx;
  87. line-height: 100upx;
  88. input {
  89. font-size: 32upx;
  90. height: 100upx;
  91. border: 0;
  92. }
  93. }
  94. .tip {
  95. text-align: right;
  96. padding: 18upx 0;
  97. font-size: 28upx;
  98. }
  99. .submit-BT {
  100. border-radius: 16upx;
  101. margin-top: 50upx;
  102. background-color: #409eff;
  103. border-color: #409eff;
  104. }
  105. }
  106. }
  107. </style>