HS_MZAP/src/views/login/login.vue

<template>	
	<div class="d1" >
		<img class="logo" src="../../../public/loginbg/logo.png"/>
	</div>
	
	<van-form style="margintop:20px ;">
	  <van-cell-group>
	    <van-field v-if="type==1"
	      v-model="userName"
	      label="用户名"
	      placeholder="用户名"
	      :rules="[{ required: true, message: '请填写用户名' }]"
	    />
	    <van-field v-if="type==1"
	      v-model="userPwd"
	      type="password"
	      label="密码"
	      placeholder="密码"
	      :rules="[{ required: true, message: '请填写密码' }]"
	    />
		<van-field v-if="type==2"
		  v-model="phone"
		  label="手机号码"
		  placeholder="手机号码"
		  :rules="[{ required: true, message: '请填写手机号码' }]"
		/>
		<van-field v-if="type==2"
		    v-model="sms"
		    center
		    clearable
		    label="短信验证码"
		    placeholder="请输入短信验证码"
		  >
		    <template #button>
		      <van-button size="small" type="primary">发送验证码</van-button>
		    </template>
		</van-field>
	  </van-cell-group>
	  <div class="changetype" @click="changetbt"> {{changet}} </div>
	  <div style="margin: 16px;">
	    <van-button round block type="primary" native-type="submit" @click="save" >
	      登录
	    </van-button>
	  </div>
	</van-form>
</template>

<script>
	import { useStore } from 'vuex';

	export default {
		
		data () {
		  return {
				userName:"",				
				userPwd:"",
				phone:"",
				sms:"",
			    onSubmit:"",
				type:1,
				changet: '用户名密码登录',
				t1:'用户名',
				t2:'密码',
				
			}
		},
		methods: {
			save(){				
				
				const inputForm ={
					'username': this.userName,
					'password': this.userPwd,
					'code': '',
					'uuid': ''
				  }

				 //store.commit('setUser',"asdsdasd");

				// login(inputForm).then(({data}) => {
				// 	this.$store.commit('setUser',data);
			   	// })

				// login(inputForm).then(res => {
				// 	this.$store.commit('setUser',res.data);
			   	// })

				this.$router.push({name:'tabAll',query: {id:'123456'}})
			},
			changetbt(){
				if(this.type==1){
					this.type=2;
					this.changet='手机验证码登录';
					this.t1="手机号码";
				}else{
					this.type=1;
					this.changet='用户名密码登录';
					this.t1="用户名";
				}
			},
		}
	};
</script>

<style>
</style>