车间能级提升-智能设备管理系统
zhuguifei
2025-04-18 7db4e38c6d967d511f0c1248bf22ceaf6a6f55d3
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<route lang="json5">
{
  layout: 'default',
  style: {
    navigationBarTitleText: '登录',
  },
}
</route>
 
<template>
  <wd-img class="w-full h-[260rpx]" src="/static/images/pic2.jpg" />
  <wd-form ref="form" :model="model" class="mt-2">
    <wd-cell-group border>
      <wd-input
        label="用户名"
        label-width="200rpx"
        prop="username"
        clearable
        v-model="model.username"
        placeholder="请输入用户名"
        :rules="[{ required: true, message: '请填写用户名' }]"
      />
      <wd-input
        label="密码"
        label-width="200rpx"
        prop="password"
        show-password
        clearable
        v-model="model.password"
        placeholder="请输入密码"
        :rules="[{ required: true, message: '请填写密码' }]"
      />
    </wd-cell-group>
    <view class="footer">
      <view class="w-full text-end">
        <wd-checkbox v-model="rember" shape="square" @change="handleChange">
          记住密码
        </wd-checkbox>
      </view>
      <wd-button class="mt-6" type="primary" size="large" @click="handleSubmit" block>
        提交
      </wd-button>
    </view>
  </wd-form>
</template>
 
<script setup lang="ts">
import { currRoute } from '@/utils'
import { useUserStore, useAccessStore, useSystemConfigStore } from '@/store'
import { useToast } from 'wot-design-uni'
import { login, getUserInfo } from '@/service/login'
import type { UserInfo } from '@/service/login.d'
import { TestEnum } from '@/typings'
const userStore = useUserStore()
const accessStore = useAccessStore()
const configStore = useSystemConfigStore()
const { success: showSuccess } = useToast()
 
const model = reactive<{
  username: string
  password: string
}>({
  username: '',
  password: '',
})
const rember = ref<boolean>(false)
 
function handleChange({ value }) {
  console.log(value)
}
 
const form = ref()
function handleSubmit() {
  form.value
    .validate()
    .then(({ valid, errors }) => {
      if (valid) {
        toLogin()
      }
    })
    .catch((error) => {
      console.log(error, 'error')
    })
}
 
onLoad(() => {
  const { remberPassword, username, password } = configStore.systemConfigInfo
  if (remberPassword) {
    rember.value = true
    model.username = username
    model.password = password
  }
})
 
const toLogin = async () => {
  // 记住密码
  if (rember.value) {
    configStore.setConfigInfo({ ...model, ...{ remberPassword: true } })
  }
 
  const res = await login(model)
  accessStore.setAccessInfo(res as any)
  const backUserInfo: any = await getUserInfo()
  /**
   * 登录超时的情况
   */
  if (!backUserInfo) {
    throw new Error('获取用户信息失败.')
  }
  const { permissions = [], roles = [], user } = backUserInfo
  /**
   * 从后台user -> vben user转换
   */
  const userInfo: UserInfo = {
    avatar: user.avatar ?? '',
    permissions,
    realName: user.nickName,
    roles,
    userId: user.userId,
    deptId: user.deptId,
    username: user.userName,
  }
  userStore.setUserInfo(userInfo)
  const { query } = currRoute()
  uni.switchTab({ url: query.redirect })
}
</script>
 
<style scoped lang="scss">
.footer {
  padding: 12px;
}
</style>