@xilonglab/vue-main 1.6.5 → 1.6.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/page/app.vue +86 -86
- package/dist/page/login.vue +185 -185
- package/dist/page/setting.vue +71 -71
- package/dist/style/reset.css +40 -40
- package/package.json +16 -16
- package/packages/button/XlButton.vue +230 -230
- package/packages/else/XlBreadcrumb.vue +4 -4
- package/packages/main/XlLoadingView.vue +0 -1
- package/packages/main/XlTabsNav.vue +147 -146
package/dist/page/setting.vue
CHANGED
|
@@ -1,72 +1,72 @@
|
|
|
1
|
-
<script setup>
|
|
2
|
-
import User from '#/user'
|
|
3
|
-
import { ref, reactive, inject } from 'vue'
|
|
4
|
-
|
|
5
|
-
const store = inject('store')
|
|
6
|
-
const refs = { form: ref(null) }
|
|
7
|
-
const data = reactive({ oldPassword: '', newPassword: '', repeatPassword: '' })
|
|
8
|
-
const error = reactive({ oldPassword: '', newPassword: '', repeatPassword: '' })
|
|
9
|
-
|
|
10
|
-
const rules = {
|
|
11
|
-
oldPassword: [{ required: true, message: "请输入原密码", trigger: "blur" }],
|
|
12
|
-
newPassword: [{ required: true, message: "请输入新密码", trigger: "blur" }],
|
|
13
|
-
repeatPassword: [{ required: true, message: "请再确认密码", trigger: "blur" }],
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
const confirm = async () => {
|
|
17
|
-
const isValid = await refs.form.value.validate()
|
|
18
|
-
if (!isValid) return
|
|
19
|
-
|
|
20
|
-
if (data.newPassword !== data.repeatPassword) {
|
|
21
|
-
error.repeatPassword = '两次输入不一致'
|
|
22
|
-
} else {
|
|
23
|
-
const { oldPassword, newPassword } = data
|
|
24
|
-
const rsp = await User.Password.resource.put({
|
|
25
|
-
userId: store.state.userData.id,
|
|
26
|
-
oldPassword,
|
|
27
|
-
newPassword
|
|
28
|
-
})
|
|
29
|
-
if (rsp?.code === 500 && rsp.msg === '原密码错误') {
|
|
30
|
-
error.oldPassword = '原密码错误'
|
|
31
|
-
} else {
|
|
32
|
-
Object.keys(data).forEach(key => data[key] = '')
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
</script>
|
|
37
|
-
|
|
38
|
-
<template>
|
|
39
|
-
<div class="setting">
|
|
40
|
-
<div class="wrapper">
|
|
41
|
-
<el-form class="form" :ref="refs.form" :model="data" :rules="rules">
|
|
42
|
-
<el-form-item label="原密码" prop="oldPassword" :error="error.oldPassword">
|
|
43
|
-
<xl-input type="password" v-model="data.oldPassword" placeholder="" style="width:100%"/>
|
|
44
|
-
</el-form-item>
|
|
45
|
-
<el-form-item label="新密码" prop="newPassword" :error="error.newPassword">
|
|
46
|
-
<xl-input type="password" v-model="data.newPassword" placeholder="" style="width:100%"/>
|
|
47
|
-
</el-form-item>
|
|
48
|
-
<el-form-item label="请确认" prop="repeatPassword" :error="error.repeatPassword">
|
|
49
|
-
<xl-input type="password" v-model="data.repeatPassword" placeholder="" style="width:100%"/>
|
|
50
|
-
</el-form-item>
|
|
51
|
-
<xl-button type="primary" @click="confirm"
|
|
52
|
-
</el-form>
|
|
53
|
-
</div>
|
|
54
|
-
</div>
|
|
55
|
-
</template>
|
|
56
|
-
|
|
57
|
-
<style lang="less">
|
|
58
|
-
.setting {
|
|
59
|
-
background: #fff;
|
|
60
|
-
.wrapper {
|
|
61
|
-
height: 100%;
|
|
62
|
-
display: flex;
|
|
63
|
-
align-items: center;
|
|
64
|
-
justify-content: center;
|
|
65
|
-
.form {
|
|
66
|
-
width: 360px;
|
|
67
|
-
height: 300px;
|
|
68
|
-
text-align: center;
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
}
|
|
1
|
+
<script setup>
|
|
2
|
+
import User from '#/user'
|
|
3
|
+
import { ref, reactive, inject } from 'vue'
|
|
4
|
+
|
|
5
|
+
const store = inject('store')
|
|
6
|
+
const refs = { form: ref(null) }
|
|
7
|
+
const data = reactive({ oldPassword: '', newPassword: '', repeatPassword: '' })
|
|
8
|
+
const error = reactive({ oldPassword: '', newPassword: '', repeatPassword: '' })
|
|
9
|
+
|
|
10
|
+
const rules = {
|
|
11
|
+
oldPassword: [{ required: true, message: "请输入原密码", trigger: "blur" }],
|
|
12
|
+
newPassword: [{ required: true, message: "请输入新密码", trigger: "blur" }],
|
|
13
|
+
repeatPassword: [{ required: true, message: "请再确认密码", trigger: "blur" }],
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
const confirm = async () => {
|
|
17
|
+
const isValid = await refs.form.value.validate()
|
|
18
|
+
if (!isValid) return
|
|
19
|
+
|
|
20
|
+
if (data.newPassword !== data.repeatPassword) {
|
|
21
|
+
error.repeatPassword = '两次输入不一致'
|
|
22
|
+
} else {
|
|
23
|
+
const { oldPassword, newPassword } = data
|
|
24
|
+
const rsp = await User.Password.resource.put({
|
|
25
|
+
userId: store.state.userData.id,
|
|
26
|
+
oldPassword,
|
|
27
|
+
newPassword
|
|
28
|
+
})
|
|
29
|
+
if (rsp?.code === 500 && rsp.msg === '原密码错误') {
|
|
30
|
+
error.oldPassword = '原密码错误'
|
|
31
|
+
} else {
|
|
32
|
+
Object.keys(data).forEach(key => data[key] = '')
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
</script>
|
|
37
|
+
|
|
38
|
+
<template>
|
|
39
|
+
<div class="setting">
|
|
40
|
+
<div class="wrapper">
|
|
41
|
+
<el-form class="form" :ref="refs.form" :model="data" :rules="rules">
|
|
42
|
+
<el-form-item label="原密码" prop="oldPassword" :error="error.oldPassword">
|
|
43
|
+
<xl-input type="password" v-model="data.oldPassword" placeholder="" style="width:100%"/>
|
|
44
|
+
</el-form-item>
|
|
45
|
+
<el-form-item label="新密码" prop="newPassword" :error="error.newPassword">
|
|
46
|
+
<xl-input type="password" v-model="data.newPassword" placeholder="" style="width:100%"/>
|
|
47
|
+
</el-form-item>
|
|
48
|
+
<el-form-item label="请确认" prop="repeatPassword" :error="error.repeatPassword">
|
|
49
|
+
<xl-input type="password" v-model="data.repeatPassword" placeholder="" style="width:100%"/>
|
|
50
|
+
</el-form-item>
|
|
51
|
+
<xl-button l="确定" type="primary" @click="confirm"/>
|
|
52
|
+
</el-form>
|
|
53
|
+
</div>
|
|
54
|
+
</div>
|
|
55
|
+
</template>
|
|
56
|
+
|
|
57
|
+
<style lang="less">
|
|
58
|
+
.setting {
|
|
59
|
+
background: #fff;
|
|
60
|
+
.wrapper {
|
|
61
|
+
height: 100%;
|
|
62
|
+
display: flex;
|
|
63
|
+
align-items: center;
|
|
64
|
+
justify-content: center;
|
|
65
|
+
.form {
|
|
66
|
+
width: 360px;
|
|
67
|
+
height: 300px;
|
|
68
|
+
text-align: center;
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
72
|
</style>
|
package/dist/style/reset.css
CHANGED
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
-
line-height: 1.5;
|
|
4
|
-
font-weight: 400;
|
|
5
|
-
|
|
6
|
-
color-scheme: light dark;
|
|
7
|
-
color: rgba(255, 255, 255, 0.87);
|
|
8
|
-
background-color: #242424;
|
|
9
|
-
|
|
10
|
-
font-synthesis: none;
|
|
11
|
-
text-rendering: optimizeLegibility;
|
|
12
|
-
-webkit-font-smoothing: antialiased;
|
|
13
|
-
-moz-osx-font-smoothing: grayscale;
|
|
14
|
-
-webkit-text-size-adjust: 100%;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
html,
|
|
18
|
-
body,
|
|
19
|
-
#app {
|
|
20
|
-
height: 100%;
|
|
21
|
-
width: 100%;
|
|
22
|
-
margin: 0;
|
|
23
|
-
padding: 0;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
input[type=number]::-webkit-inner-spin-button,
|
|
27
|
-
input[type=number]::-webkit-outer-spin-button {
|
|
28
|
-
-webkit-appearance: none;
|
|
29
|
-
appearance: none;
|
|
30
|
-
margin: 0;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
::-webkit-scrollbar {
|
|
34
|
-
width: 10px;
|
|
35
|
-
height: 10px;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
::-webkit-scrollbar-thumb {
|
|
39
|
-
background-color: #e7ebf5;
|
|
40
|
-
border-radius: 10px;
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
line-height: 1.5;
|
|
4
|
+
font-weight: 400;
|
|
5
|
+
|
|
6
|
+
color-scheme: light dark;
|
|
7
|
+
color: rgba(255, 255, 255, 0.87);
|
|
8
|
+
background-color: #242424;
|
|
9
|
+
|
|
10
|
+
font-synthesis: none;
|
|
11
|
+
text-rendering: optimizeLegibility;
|
|
12
|
+
-webkit-font-smoothing: antialiased;
|
|
13
|
+
-moz-osx-font-smoothing: grayscale;
|
|
14
|
+
-webkit-text-size-adjust: 100%;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
html,
|
|
18
|
+
body,
|
|
19
|
+
#app {
|
|
20
|
+
height: 100%;
|
|
21
|
+
width: 100%;
|
|
22
|
+
margin: 0;
|
|
23
|
+
padding: 0;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
input[type=number]::-webkit-inner-spin-button,
|
|
27
|
+
input[type=number]::-webkit-outer-spin-button {
|
|
28
|
+
-webkit-appearance: none;
|
|
29
|
+
appearance: none;
|
|
30
|
+
margin: 0;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
::-webkit-scrollbar {
|
|
34
|
+
width: 10px;
|
|
35
|
+
height: 10px;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
::-webkit-scrollbar-thumb {
|
|
39
|
+
background-color: #e7ebf5;
|
|
40
|
+
border-radius: 10px;
|
|
41
41
|
}
|
package/package.json
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@xilonglab/vue-main",
|
|
3
|
-
"version": "1.6.
|
|
4
|
-
"description": "xilong vue main",
|
|
5
|
-
"main": "packages/index.js",
|
|
6
|
-
"scripts": {
|
|
7
|
-
"test": "echo \"Error: no test specified\" && exit 1"
|
|
8
|
-
},
|
|
9
|
-
"author": "xilonglab",
|
|
10
|
-
"license": "ISC",
|
|
11
|
-
"dependencies": {
|
|
12
|
-
"@imengyu/vue3-context-menu": "^1.3.3",
|
|
13
|
-
"element-plus": "2.3.6",
|
|
14
|
-
"image-conversion": "^2.1.1",
|
|
15
|
-
"vue-router": "^4.2.2"
|
|
16
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@xilonglab/vue-main",
|
|
3
|
+
"version": "1.6.7",
|
|
4
|
+
"description": "xilong vue main",
|
|
5
|
+
"main": "packages/index.js",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"test": "echo \"Error: no test specified\" && exit 1"
|
|
8
|
+
},
|
|
9
|
+
"author": "xilonglab",
|
|
10
|
+
"license": "ISC",
|
|
11
|
+
"dependencies": {
|
|
12
|
+
"@imengyu/vue3-context-menu": "^1.3.3",
|
|
13
|
+
"element-plus": "2.3.6",
|
|
14
|
+
"image-conversion": "^2.1.1",
|
|
15
|
+
"vue-router": "^4.2.2"
|
|
16
|
+
}
|
|
17
17
|
}
|