sfms3.0
/
sfms3.0-uniapp
3
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

登录页面和消息提示组件

pull/1/head
张立 9 months ago
parent
18a518be06
commit
3e278ce6e2
4 changed files with 482 additions and 545 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/main.ts
  2. 719
      src/mycomponents/common/comMessage.vue
  3. 8
      src/pages.json
  4. 294
      src/pages/login/index.vue

2
src/main.ts
View File

@ -3,6 +3,7 @@ import * as Pinia from 'pinia'
// @ts-ignore
import uView from 'vk-uview-ui'
import App from './App.vue'
import comMessage from '@/mycomponents/common/comMessage.vue'
@ -30,6 +31,7 @@ export function createApp() {
app.config.globalProperties.$modal = modal
// 时间对象
app.config.globalProperties.$time = time
app.component('com-message', comMessage)

719
src/mycomponents/common/comMessage.vue
View File

@ -11,7 +11,7 @@
</rich-text>
</slot>
<view class='split_line'></view>
<view class='split_line'></view>
<slot name="button">
<view class="uni-flex uni-row u-col-center space-between" style="width: 100%;height: 48px;">
<view v-if="showCancelButton" class="cance_button" @tap="cancelClose">
@ -29,395 +29,386 @@
</view>
</template>
<script>
<script setup lang="ts">
/**
* modal 模态框
* @description 弹出模态框，常用于消息提示、消息确认、在当前页面内完成特定的交互操作
* */
export default {
data() {
return {
timer: null,
show: false, // 是否显示
iconType: '消息',
icon: '../../static/icons/error-circle.svg',
title: '', // 提示标题
content: '', // 提示内容
cancelText: '取消', // 取消按钮的文字
confirmText: '确定', // 确认按钮文字
showCancel: true, // 是否显示取消按钮，默认为 true
confirmColor: '#007aff', // 确定按钮颜色
cancelColor: null, // 取消按钮颜色
showConfirmButton: true, // 是否显示确认按钮
showConfirmCountdown: true, // 是否显示确定倒计时
showCancelButton: true, // 是否显示取消按钮
showClose: false,
confirm: false, //为 true 时，表示用户点击了确定按钮
cancel: false, //为 true 时，表示用户点击了取消
isDisabled: true, //为 true 时，表示用户可以点击，反之则不可以
seconds: 0,
success: () => {} // 回调方法
}
},
methods: {
open() {
this.show = true;
this.isDisabled = true;
},
close() {
this.$.refs.modal.popupClose();
this.isDisabled = false;
},
confirmClose() {
if (!this.isDisabled) return
this.isDisabled = false
// console.log('确定点击')
if (this.show) {
this.show = false;
clearInterval(this.timer) //清空timer
this.$.refs.modal.popupClose();
this.success({
// cancel: false,
confirm: true,
});
}
},
cancelClose() {
if (!this.isDisabled) return
this.isDisabled = false
clearInterval(this.timer) //清空timer
this.$.refs.modal.popupClose();
this.success({
// cancel: true,
confirm: false,
});
},
// 打开消息弹框(确定+倒计时)
showMessage(mContent, callback) {
this.showConfirmCountdownModal("消息", mContent, callback);
},
// 打开成功弹框(确定+倒计时)
showSuccessMessage(mContent, callback) {
this.showConfirmCountdownModal("成功", mContent, callback);
},
// 打开失败弹框(确定）
showErrorMessage(mContent, callback) {
this.showConfirmModal("失败", mContent, callback);
},
// 显示崩溃消息(无确定）
showBreakMessage(mContent, callback) {
this.showNoButtonModal("失败", mContent, callback);
},
// 打开疑问弹框(取消+确定）
showQuestionMessage(mContent, callback) {
this.showSelectModal("疑问", mContent, callback);
},
// 打开警告弹框(确定+倒计时)
showWarningMessage(mContent, callback) {
this.showConfirmCountdownModal("警告", mContent, callback);
},
// 打开失败弹框(确定+倒计时)
showConfirmCountdownFailModal(mContent, callback) {
this.showConfirmCountdownModal("失败", mContent, callback);
},
// 打开消息弹框(确定）
showConfirmMessageModal(mContent, callback) {
this.showConfirmModal("消息", mContent, callback);
},
// 打开成功弹框(确定）
showConfirmSuccessModal(mContent, callback) {
this.showConfirmModal("成功", mContent, callback);
},
// 打开警告弹框(确定）
showConfirmWarningModal(mContent, callback) {
this.showConfirmModal("警告", mContent, callback);
},
// 打开疑问弹框(确定）
showConfirmQuestionModal(mContent, callback) {
this.showConfirmModal("疑问", mContent, callback);
},
// 初始化弹框并打开(确定）
showNoButtonModal(mIconType, mContent, callback) {
this.showModal({
iconType: mIconType,
content: mContent,
showConfirmButton:false,
showCancelButton: false,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
} else {
callback(false);
}
}
import {
ref,
getCurrentInstance
} from 'vue'
const timer = ref(null)
const show = ref(false) // 是否显示
const iconType = ref('消息')
const icon = ref('../../static/icons/error-circle.svg')
const title = ref('')
const content = ref('') // 提示内容
const cancelText = ref('取消') // 取消按钮的文字
const confirmText = ref('确定') // 确认按钮文字
const showCancel = ref(true) // 是否显示取消按钮，默认为 true
const confirmColor = ref('#007aff') // 确定按钮颜色
const cancelColor = ref(null) // 取消按钮颜色
const showConfirmButton = ref(true) // 是否显示确认按钮
const showConfirmCountdown = ref(true) // 是否显示确定倒计时
const showCancelButton = ref(true) // 是否显示取消按钮
const showClose = ref(false)
const confirm = ref(false) //为 true 时，表示用户点击了确定按钮
const cancel = ref(false) //为 true 时，表示用户点击了取消
const isDisabled = ref(true) //为 true 时，表示用户可以点击，反之则不可以
const seconds = ref(0)
const success = () => {
}
});
},
// 初始化弹框并打开(确定）
showConfirmModal(mIconType, mContent, callback) {
this.showModal({
iconType: mIconType,
content: mContent,
showCancelButton: false,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
} else {
callback(false);
}
}
}
const open = () => {
show.value = true;
isDisabled.value = true;
}
const close = () => {
show.value = false
isDisabled.value = false;
}
const confirmClose = () => {
if (!isDisabled.value) return
isDisabled.value = false
// console.log('确定点击')
if (show.value) {
show.value = false;
clearInterval(timer.value) //清空timer
success({
// cancel: false,
confirm: true,
});
}
}
const cancelClose = () => {
if (!isDisabled.value) return
isDisabled.value = false
clearInterval(timer.value) //清空timer
show.value = false
success({
// cancel: true,
confirm: false,
});
}
// 打开消息弹框(确定+倒计时)
const showMessage = (mContent, callback) => {
showConfirmCountdownModal("消息", mContent, callback);
}
// 打开成功弹框(确定+倒计时)
const showSuccessMessage = (mContent, callback) => {
showConfirmCountdownModal("成功", mContent, callback);
}
// 打开失败弹框(确定）
const showErrorMessage = (mContent, callback) => {
}
});
},
// 打开消息弹框(取消+确定）
showSelectMessageModal(mContent, callback) {
this.showSelectModal("消息", mContent, callback);
},
// 打开成功弹框(取消+确定）
showSelectSuccessModal(mContent, callback) {
this.showSelectModal("成功", mContent, callback);
},
// 打开失败弹框(取消+确定）
showSelectFailModal(mContent, callback) {
this.showSelectModal("失败", mContent, callback);
},
// 打开警告弹框(取消+确定）
showSelectWarningModal(mContent, callback) {
this.showSelectModal("警告", mContent, callback);
},
// 初始化弹框并打开(取消+确定）
showSelectModal(mIconType, mContent, callback) {
this.showModal({
iconType: mIconType,
content: mContent,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
console.log('用户点击确定')
} else {
callback(false);
console.log('用户点击取消')
}
}
console.log(333)
showConfirmModal("失败", mContent, callback);
}
// 显示崩溃消息(无确定）
const showBreakMessage = (mContent, callback) => {
showNoButtonModal("失败", mContent, callback);
}
// 打开疑问弹框(取消+确定）
const showQuestionMessage = (mContent, callback) => {
showSelectModal("疑问", mContent, callback);
}
// 打开警告弹框(确定+倒计时)
const showWarningMessage = (mContent, callback) => {
showConfirmCountdownModal("警告", mContent, callback);
}
// 打开失败弹框(确定+倒计时)
const showConfirmCountdownFailModal = (mContent, callback) => {
showConfirmCountdownModal("失败", mContent, callback);
}
// 打开消息弹框(确定）
const showConfirmMessageModal = (mContent, callback) => {
showConfirmModal("消息", mContent, callback);
}
// 打开成功弹框(确定）
const showConfirmSuccessModall = (mContent, callback) => {
showConfirmModal("成功", mContent, callback);
}
// 打开警告弹框(确定）
const showConfirmWarningModal = (mContent, callback) => {
showConfirmModal("警告", mContent, callback);
}
// 打开疑问弹框(确定）
const showConfirmQuestionModal = (mContent, callback) => {
showConfirmModal("疑问", mContent, callback);
}
// 初始化弹框并打开(确定）
const showNoButtonModal = (mIconType, mContent, callback) => {
showModal({
iconType: mIconType,
content: mContent,
showConfirmButton: false,
showCancelButton: false,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
} else {
callback(false);
}
});
},
// 打开疑问弹框(确定+倒计时)
showConfirmCountdownQuestionModal(mContent, callback) {
this.showConfirmCountdownModal("疑问", mContent, callback);
},
// 初始化弹框并打开(确定+倒计时)
showConfirmCountdownModal(mIconType, mContent, callback) {
this.showModal({
iconType: mIconType,
content: mContent,
showCancelButton: false,
showConfirmCountdown: true,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
} else {
callback(false);
}
}
}
});
},
// 打开消息弹框(取消+确定+倒计时)
showSelectCountdownMessageModal(mContent, callback) {
this.showSelectCountdownModal("消息", mContent, callback);
},
// 打开成功弹框(取消+确定+倒计时)
showSelectCountdownSuccessModal(mContent, callback) {
this.showSelectCountdownModal("成功", mContent, callback);
},
// 打开失败弹框(取消+确定+倒计时)
showSelectCountdownFailModal(mContent, callback) {
this.showSelectCountdownModal("失败", mContent, callback);
},
// 打开警告弹框(取消+确定+倒计时)
showSelectCountdownWarningModal(mContent, callback) {
this.showSelectCountdownModal("警告", mContent, callback);
},
// 打开疑问弹框(取消+确定+倒计时)
showSelectCountdownQuestionModal(mContent, callback) {
this.showSelectCountdownModal("疑问", mContent, callback);
},
// 初始化弹框并打开(取消+确定+倒计时)
showSelectCountdownModal(mIconType, mContent, callback) {
this.showModal({
iconType: mIconType,
content: mContent,
showConfirmCountdown: true,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
console.log('用户点击确定')
} else {
callback(false);
console.log('用户点击取消')
}
}
}
});
},
// 初始化弹框并打开
showModal(data) {
if (data.iconType) {
this.iconType = data.iconType
switch (data.iconType) {
case '消息':
this.icon = '/static/icons/error-circle.svg';
break;
case '成功':
this.icon = '/static/icons/checkmark-circle.svg';
break;
case '失败':
this.icon = '/static/icons/close-circle.svg';
break;
case '警告':
this.icon = '/static/icons/warning.svg';
break;
case '疑问':
this.icon = '/static/icons/question-circle.svg';
break;
default:
break;
}
}
// image
if (data.title) {
this.title = data.title
}
if (data.content) {
this.content = data.content
} else {
this.content = ''
}
if (data.cancelText) {
this.cancelText = data.cancelText
} else {
this.cancelText = '取消'
}
if (data.confirmText) {
this.confirmText = data.confirmText
} else {
this.confirmText = '确定'
}
if (data.showCancel === false || data.showCancel === true) {
this.showCancel = data.showCancel
} else {
this.showCancel = true
}
});
}
// 初始化弹框并打开(确定）
const showConfirmModal = (mIconType, mContent, callback) => {
console.log(222)
showModal({
iconType: mIconType,
content: mContent,
showCancelButton: false,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
} else {
callback(false);
}
}
if (data.confirmColor) {
this.confirmColor = data.confirmColor
} else {
this.confirmColor = '#007aff'
}
}
});
}
if (data.cancelColor) {
this.cancelColor = data.cancelColor
} else {
this.cancelColor = '#666F83'
}
// 打开消息弹框(取消+确定）
const showSelectMessageModal = (mContent, callback) => {
showSelectModal("消息", mContent, callback);
}
if (data.showConfirmButton === false || data.showConfirmButton === true) {
this.showConfirmButton = data.showConfirmButton
} else {
this.showConfirmButton = true
}
// 打开成功弹框(取消+确定）
const showSelectSuccessModal = (mContent, callback) => {
showSelectModal("成功", mContent, callback);
}
if (data.showConfirmCountdown === false || data.showConfirmCountdown === true) {
this.showConfirmCountdown = data.showConfirmCountdown
} else {
this.showConfirmCountdown = false
}
// 打开失败弹框(取消+确定）
const showSelectFailModal = (mContent, callback) => {
showSelectModal("失败", mContent, callback);
}
if (data.showCancelButton === false || data.showCancelButton === true) {
this.showCancelButton = data.showCancelButton
} else {
this.showCancelButton = true
}
// 打开警告弹框(取消+确定）
const showSelectWarningModal = (mContent, callback) => {
showSelectModal("警告", mContent, callback);
}
if (data.success) {
this.success = data.success
} else {
this.success = () => {}
}
setTimeout(res => {
this.open();
}, 500)
if (this.showConfirmCountdown) {
this.startTimer();
// 初始化弹框并打开(取消+确定）
const showSelectModal = (mIconType, mContent, callback) => {
showModal({
iconType: mIconType,
content: mContent,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
console.log('用户点击确定')
} else {
callback(false);
console.log('用户点击取消')
}
}
},
startTimer() {
this.seconds = 3;
clearInterval(this.timer)
this.timer = setInterval(() => {
this.seconds--
// console.log("倒计时时间", this.seconds);
if (this.seconds <= 0) {
this.timeUp()
return
}
});
}
// 打开疑问弹框(确定+倒计时)
const showConfirmCountdownQuestionModal = (mContent, callback) => {
showConfirmCountdownModal("疑问", mContent, callback);
}
// 初始化弹框并打开(确定+倒计时)
const showConfirmCountdownModal = (mIconType, mContent, callback) => {
showModal({
iconType: mIconType,
content: mContent,
showCancelButton: false,
showConfirmCountdown: true,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
} else {
callback(false);
}
}, 1000)
},
}
}
});
}
timeUp() {
// clearInterval(this.timer)
console.log('时间到')
this.confirmClose();
},
// 打开消息弹框(取消+确定+倒计时)
const showSelectCountdownMessageModal = (mContent, callback) => {
showSelectCountdownModal("消息", mContent, callback);
}
},
// 打开成功弹框(取消+确定+倒计时)
const showSelectCountdownSuccessModal = (mContent, callback) => {
showSelectCountdownModal("成功", mContent, callback);
}
// 打开失败弹框(取消+确定+倒计时)
const showSelectCountdownFailModal = (mContent, callback) => {
showSelectCountdownModal("失败", mContent, callback);
}
// 打开警告弹框(取消+确定+倒计时)
const showSelectCountdownWarningModal = (mContent, callback) => {
showSelectCountdownModal("警告", mContent, callback);
}
// 打开疑问弹框(取消+确定+倒计时)
const showSelectCountdownQuestionModal = (mContent, callback) => {
showSelectCountdownModal("疑问", mContent, callback);
}
// 初始化弹框并打开(取消+确定+倒计时)
const showSelectCountdownModal = (mIconType, mContent, callback) => {
showModal({
iconType: mIconType,
content: mContent,
showConfirmCountdown: true,
success: function(res) {
if (callback != undefined) {
if (res.confirm == true) {
callback(true);
console.log('用户点击确定')
} else {
callback(false);
console.log('用户点击取消')
}
}
}
});
}
// 初始化弹框并打开
const showModal = (data) => {
if (data.iconType) {
iconType.value = data.iconType
switch (data.iconType) {
case '消息':
icon.value = '/static/icons/error-circle.svg';
break;
case '成功':
icon.value = '/static/icons/checkmark-circle.svg';
break;
case '失败':
icon.value = '/static/icons/close-circle.svg';
break;
case '警告':
icon.value = '/static/icons/warning.svg';
break;
case '疑问':
icon.value = '/static/icons/question-circle.svg';
break;
default:
break;
}
}
// image
if (data.title) {
title.value = data.title
}
if (data.content) {
content.value = data.content
} else {
content.value = ''
}
if (data.cancelText) {
cancelText.value = data.cancelText
} else {
cancelText.value = '取消'
}
if (data.confirmText) {
confirmText.value = data.confirmText
} else {
confirmText.value = '确定'
}
if (data.showCancel === false || data.showCancel === true) {
showCancel.value = data.showCancel
} else {
showCancel.value = true
}
if (data.confirmColor) {
confirmColor.value = data.confirmColor
} else {
confirmColor.value = '#007aff'
}
if (data.cancelColor) {
cancelColor.value = data.cancelColor
} else {
cancelColor.value = '#666F83'
}
if (data.showConfirmButton === false || data.showConfirmButton === true) {
showConfirmButton.value = data.showConfirmButton
} else {
showConfirmButton.value = true
}
if (data.showConfirmCountdown === false || data.showConfirmCountdown === true) {
showConfirmCountdown.value = data.showConfirmCountdown
} else {
showConfirmCountdown.value = false
}
if (data.showCancelButton === false || data.showCancelButton === true) {
showCancelButton.value = data.showCancelButton
} else {
showCancelButton.value = true
}
if (data.success) {
success = data.success
} else {
success = () => {}
}
setTimeout(res => {
open();
}, 500)
if (showConfirmCountdown.value) {
startTimer();
}
}
const startTimer = () => {
seconds.value = 3;
clearInterval(timer.value)
timer.value = setInterval(() => {
seconds.value--
// console.log("倒计时时间", this.seconds);
if (seconds.value <= 0) {
timeUp()
return
}
}, 1000)
}
const timeUp = () => {
// clearInterval(this.timer)
console.log('时间到')
confirmClose();
}
defineExpose({ showErrorMessage }) // 提供 open 方法，用于打开弹窗
</script>
<style lang="scss" scoped>
.slot-content {

8
src/pages.json
View File

@ -49,7 +49,13 @@
{
"path": "pages/login/index",
"style": {
"navigationBarTitleText": "登录"
"navigationBarTitleText": "登录",
"navigationBarBackgroundColor": "#476df5",
"h5": {
"maxWidth": 1190,
"navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#476df5 !important"
}
}
},

294
src/pages/login/index.vue
View File

@ -1,6 +1,5 @@
<template>
<view class="content">
<!-- <image mode="widthFix" class="loginimg" src="../../static/login.png"></image> -->
<image mode="widthFix" class="loginimg" src="../../static/icons_ui/login_bg.png"></image>
<view class="login_title">
<text>您好，欢迎使用</text><br>
@ -10,16 +9,8 @@
<view class="loginbox">
<form>
<view class="mytab">
<!-- <view class="mytabline" :class="tapstyle == 1?'active':''" @click="tapchenge(1)">扫码登录</view> -->
<view class="mytabline" :class="tapstyle == 2?'active_in':''" @click="tapchenge(2)">密码登录</view>
</view>
<!-- <view class="mybox" v-if="tapstyle == 1">
<view class="conone">
<uni-easyinput prefixIcon="scan" class="uni-input" type="password" v-model="smloginmsg"
name="nickname" placeholder="扫码登录"></uni-easyinput>
</view>
</view> -->
<view class="mybox" v-if="tapstyle == 2">
<view class="conone">
<view class="title uni-flex">
@ -36,7 +27,8 @@
用户名
</view>
<view>
<input class="uni-input" style="padding:25rpx" placeholder="请输入用户名" v-model="username" />
<input class="uni-input" style="padding:25rpx" placeholder="请输入用户名"
v-model="username" />
</view>
</view>
<view class="conone">
@ -44,28 +36,16 @@
<image class="icon_normal" src="../../static/icons_ui/icon_login_password.svg"></image>
密码
</view>
<view class="uni-input-wrapper" >
<input class="uni-input" style="padding:25rpx" placeholder="请输入密码" :password="showPassword"
v-model="password" />
<view class="uni-input-wrapper">
<input class="uni-input" style="padding:25rpx" placeholder="请输入密码"
:password="showPassword" v-model="password" />
<text class="uni-icon" :class="[!showPassword ? 'uni-eye-active' : '']"
@click="changePassword">&#xe568;</text>
</view>
<!-- <view class="uni-input-wrapper">
<input class="uni-input" type="password" name="password"
:password="showPassword"
placeholder="请输入密码" v-model="password"></input>
<text class="uni-icon" :class="[!showPassword ? 'uni-eye-active' : '']" @click="changePassword">&#xe568;</text>
</view> -->
</view>
</view>
<view style="display: flex;flex-direction: row;">
<!-- <view class="uni-input">
<input class="" placeholder="请输入验证码"
v-model="code"
style="background-color: lightgray;padding-top: 40rpx;padding-bottom: 40rpx;margin-right: 20rpx;" />
</view> -->
<view class="uni-input-wrapper">
<input class="" style="height: 80rpx; background-color: #F7F9FF;margin-right: 20rpx;"
placeholder="请输入验证码" type="number" v-model="code" />
@ -84,176 +64,134 @@
</form>
</view>
</view>
<comMessage ref="comMessage"></comMessage>
<com-message ref="comMessageRef" />
</view>
</template>
<script>
<script setup lang="ts">
import {
onLoad,
onShow,
onNavigationBarButtonTap,
onReady
} from '@dcloudio/uni-app'
import {
ref,
getCurrentInstance
} from 'vue'
import {
getCaptchaImage
} from '@/api/request2.js';
import {
mapState,
mapMutations
} from 'vuex'
import {
useCountStore
} from '@/store'
useCountStore
} from '@/store'
// 获取自定义的store
const store = useCountStore()
export default {
components: {},
data() {
return {
smloginmsg: "",
tenantName: "闻荫源码",
const { proxy } = getCurrentInstance()
const smloginmsg = ref('')
const tenantName = ref('闻荫源码')
const username = ref('')
const password = ref('')
const tapstyle = ref(2)
const loading = ref(false)
const showPassword = ref(true)
const imageSrc = ref('')
const code = ref('')
const uuid = ref('')
const comMessageRef = ref('')
// 返回首页
onNavigationBarButtonTap((e) => {
if (e.index === 0) {
uni.navigateTo({
url: "/pages/config/config"
})
}
})
onReady(() => {
console.log()
})
onLoad(() => {
uni.clearStorageSync()
uni.clearStorage(); //清除缓存
if (import.meta.env.VITE_USER_NODE_ENV === 'development') {
username.value = "admin"
password.value = "123456";
}
uni.setNavigationBarColor({
frontColor: '#ffffff',
backgroundColor: "#476DF5 !important"
})
// #ifdef APP-PLUS
uni.setNavigationBarColor({
frontColor: "#ffffff",
backgroundColor: "#476DF5"
})
// #endif
getCode()
})
const handelerlogin = () => {
if (username.value === '') {
proxy.$modal.showToast('用户名不能为空')
} else if (password.value === '') {
proxy.$modal.showToast('密码不能为空')
} else if (code.value === '') {
proxy.$modal.showToast('验证码不能为空')
} else {
// console.log("用户名：", this.username, "密码：", this.password, this.tapstyle, this.smloginmsg)
let logininfo = {
username: "",
password: "",
tapstyle: 2,
loading: false,
showPassword: true,
imageSrc: "",
code: "",
uuid: ""
}
},
// computed: mapState(['forcedLogin', 'hasLogin']),
mounted() {
uni.clearStorageSync()
uni.clearStorage(); //清除缓存
if (process.env.NODE_ENV === 'development') {
this.username = "admin"
this.password = "123456";
}
uni.setNavigationBarColor({
frontColor: '#ffffff',
backgroundColor: "#476DF5 !important"
})
// #ifdef APP-PLUS
uni.setNavigationBarColor({
frontColor: "#ffffff",
backgroundColor: "#476DF5"
})
// #endif
},
//返回首页
onNavigationBarButtonTap(e) {
if (e.index === 0) {
uni.navigateTo({
url: "/pages/config/config"
})
}
},
onLoad() {
getCaptchaImage().then(res => {
if (res) {
var code = res.data.img;
let base64 = 'data:image/jpeg;base64,' + code
// console.log("图标", base64)
this.imageSrc = base64.replace(/[\r\n]/g, "")
this.uuid = res.data.uuid
}
}).catch(error => {
this.showErrorMessage(error);
})
},
methods: {
// ...mapMutations(['login']),
handelerlogin() {
if (this.username === '') {
uni.showToast({
title: '用户名不能为空',
icon: 'none',
mask: true
})
} else if (this.password === '') {
uni.showToast({
title: '密码不能为空',
icon: 'none',
mask: true
})
} else if (this.code === '') {
uni.showToast({
title: '验证码不能为空',
icon: 'none',
mask: true
})
} else {
// console.log("用户名：", this.username, "密码：", this.password, this.tapstyle, this.smloginmsg)
let logininfo = {
username: "",
password: "",
code: "",
uuid: ""
}
if (this.tapstyle == 2) //密码登录
{
logininfo.username = this.username;
logininfo.password = this.password
logininfo.code = this.code;
logininfo.uuid = this.uuid;
} else if (this.tapstyle == 1) {
// let arr = Base64.decode(this.smloginmsg).split(':')
// logininfo.username = arr[0];
// logininfo.password = arr[1]
}
let params = JSON.stringify(logininfo);
console.log('params', params);
this.newLogin(logininfo)
}
},
async newLogin(logininfo) {
uni.showLoading({
title: "正在登录",
mask: true
})
await store.Login(logininfo)
// await this.$store.dispatch('Login', logininfo);
// await this.$store.dispatch('GetTenantIdInfo', this.tenantName)
uni.hideLoading()
uni.setStorageSync('hasLogin', true)
uni.switchTab({
url: '/pages/index/index'
});
uni.setStorageSync('username', this.username);
},
tapchenge(e) {
this.tapstyle = e
},
onchange(e) {
const value = e.detail.value
},
changePassword: function() {
this.showPassword = !this.showPassword;
},
showErrorMessage(message) {
this.$refs.comMessage.showErrorMessage(message, res => {
if (res) {
}
});
},
getCode() {
getCaptchaImage().then(res => {
if (res) {
var code = res.data.img;
let base64 = 'data:image/jpeg;base64,' + code
this.imageSrc = base64.replace(/[\r\n]/g, "")
this.uuid = res.data.uuid
}
})
//密码登录
if (tapstyle.value == 2) {
logininfo.username = username.value;
logininfo.password = password.value
logininfo.code = code.value;
logininfo.uuid = uuid.value;
} else if (tapstyle.value == 1) {
}
let params = JSON.stringify(logininfo);
newLogin(logininfo)
}
}
const newLogin = async (logininfo) => {
proxy.$modal.loading('正在登录')
await store.Login(logininfo)
proxy.$modal.closeLoading()
uni.setStorageSync('hasLogin', true)
uni.switchTab({
url: '/pages/index/index'
});
uni.setStorageSync('username', username.value);
}
const tapchenge = (e) => {
tapstyle.value = e
}
const onchange = (e) => {
const value = e.detail.value
}
const changePassword = () => {
showPassword.vlaue = !showPassword.vlaue;
}
const showErrorMessage = (message) => {
console.log(comMessag1e.value)
comMessageRef.value.showErrorMessage(message, res => { });
}
const getCode = () => {
getCaptchaImage().then(res => {
if (res) {
var code = res.data.img;
let base64 = 'data:image/jpeg;base64,' + code
imageSrc.value = base64.replace(/[\r\n]/g, "")
uuid.value = res.data.uuid
}
}).catch(error => {
showErrorMessage(error)
})
}
</script>
<style>

Write Preview
Loading…
Cancel
Save