xytSk-App/pages/login/login.vue

<template>
  <view class="container">
    <div class="img">
      <image
        style="width: 100%; height: 100%"
        src="../../static/images/u8.png"
        mode="scaleToFill"
      ></image>
    </div>
    <uni-forms :modelValue="formData" class="form">
      <uni-forms-item>
        <uni-easyinput
          type="text"
          v-model="formData.username"
          placeholder="请输入用户名"
        />
      </uni-forms-item>
      <uni-forms-item>
        <uni-easyinput
          type="password"
          v-model="formData.password"
          placeholder="请输入密码"
        />
      </uni-forms-item>
      <uni-forms-item>
        <checkbox :checked="formData.checked" @click="handleChange(formData)" /><text
          >记住用户名和密码</text
        >
      </uni-forms-item>
      <!-- <button type="primary" class="button" @click="xian">县</button> -->
      <!-- <button type="primary" class="button" @click="xiang">乡</button> -->
      <button type="primary" class="button" @click="login(formData)">
        登录
      </button>
    </uni-forms>
  </view>
</template>

<script>
import CryptoJS from 'crypto-js'
import { onMounted } from "vue"
let checked = false

export default {
  data () {
    return {
      formData: {
        username: '',
        password: '',
        checked: false
      }
    }
  },
  mounted(){
    console.log(uni.getStorageSync('loginChecked'));
    
    if (uni.getStorageSync('loginChecked')===true){
      this.formData = {
        username: uni.getStorageSync('loginName'),
        password: uni.getStorageSync('password'),
        checked: true,
      }
    }
  },
  methods: {
    handleChange (formData) {
      checked = !checked
      formData.checked = !formData.checked
    },
    xian () {
      this.formData = {
        username: 'cwz',
        password: '12345678a',
        checked: false
      }
    },
    xiang () {
      this.formData = {
        username: 'glszfz',
        password: '12345678a',
        checked: false
      }
    },
    login (formData) {
      //loading
      uni.showLoading({title:'努力登录中...', mask:true});

      //MD5加密
      const encryptData = data => {
        const encryptedData = CryptoJS.MD5(data).toString()
        return encryptedData
      }

      //创建提交表单
      let postForm = {
        username: formData.username,
        password: formData.password
      }

      //记住密码功能
      if (formData.checked === true) {
        uni.setStorageSync('loginChecked', true)
        uni.setStorageSync('loginName', postForm.loginName)
        uni.setStorageSync('password',formData.password)
        uni.setStorageSync('secretKey', postForm.secretKey)
      } else {
        uni.setStorageSync('loginChecked', false)
        uni.removeStorageSync('loginName')
        uni.removeStorageSync('secretKey')
        uni.removeStorageSync('password')
        this.formData.username = ''
        this.formData.password = ''
      }

      //提交表单
	console.log(postForm,'---===');
      uni.$http.post('/gunshiApp/xyt/login', postForm).then(res => {
        uni.showLoading({ title: '努力登录中...', mask: true })
		console.log(res,'---===');
        if (res.data.code === 200) {
          //localStorage保存token
		  
          if (res.data.token) {
            uni.setStorageSync('Gs-Token', res.data.token)
            uni.$http.get('/gunshiApp/xyt/getInfo').then(res => {
              // console.log('sss', res.data.data)
              uni.setStorageSync('value', res.data.user)
			  setTimeout(function () {
			    uni.hideLoading()
			    uni.reLaunch({
			      url: '/pages/homeIndex/index'
			    })
			  }, 1000)
			  clearTimeout()
              // console.log('-----value------', res.data.data)
            })

            //获取userId并获取头像
            uni.$http
              .get('/gunshiApp/xfflood/my/info/getByUserId')
              .then(res => {
                console.log('-----avatar1------', res.data)
                if (res.data.data) {
                  let url =
                    '/gunshiApp/xfflood/bzProjectManipulationRecord/file/get/'
                  url = url + res.data.data.fileId
                  uni.$http.get(url).then(res => {
                    uni.setStorageSync(
                      'avatar',
                      'http://223.75.53.141:9102/test.by-lyf.tmp' +
                        res.data.data.filePath
                    )
                    console.log(
                      '-----avatar------',
                      uni.getStorageSync('avatar')
                    )
                  })
                } else {
                  uni.setStorageSync('avatar', '../../static/tabs/touxiang.png')
                }
				
				
				
				// uni.showLoading({title:'努力登录中...', mask:true});
				//登录成功后跳转界
				
              })
          }
        } else if (res.data.code === 400) {
          //登录失败后弹出信息
          setTimeout(function () {
            uni.hideLoading()
            uni.showToast({
              title: res.data.description,
              icon: 'none',
              duration: 2000
            })
          }, 1000)
          clearTimeout()
        }
      })
    }
  }
}
</script>

<style>
.container {
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 100vw;
  height: 100vh;
  align-items: center;
  background-color: #f3f5f8;
}
.img {
  width: 100vw;
  height: 50vh;
  margin-top: 5vh;
  /* background-color: red; */
}
.form {
  margin-top: 4vh;
  width: 80%;
  height: 8vh;
  align-items: center;
  justify-content: center;
}
.button {
}
</style>