-
- 去看看
-
- ),
- }}
- actions={
- setLoginType(activeKey as LoginType)}>
-
- {loginType === 'account' && (
- <>
-
-
- )
-})
diff --git a/src/views/User/Login/index.less b/src/views/User/Login/index.less
new file mode 100644
index 0000000..284cbf9
--- /dev/null
+++ b/src/views/User/Login/index.less
@@ -0,0 +1,154 @@
+
+.container {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+ height: 100vh;
+ width: 100vw;
+ overflow: auto;
+}
+
+.login_content {
+ // margin-top: 40px;
+ // position: relative;
+ width: 782px;
+ background-color: rgb(255, 255, 255);
+ // height: 100%;
+ overflow: hidden;
+ box-shadow: rgb(0 0 0 / 15%) 0px 2px 15px;
+ //float: right;
+ //height: 538px;
+ position: relative;
+ padding: 30px 0 30px 0;
+
+}
+
+.go_to_register {
+ cursor: pointer;
+ height: 70px;
+ width: 70px;
+ background-image: url('@/assets/icons/corner_markers.svg');
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ text-align: right;
+}
+
+.go_to_register span {
+ font-size: 14px;
+ color: rgb(255, 255, 255);
+ font-weight: 500;
+ position: relative;
+ top: 10px;
+ right: 7px;
+}
+
+.lang {
+ width: 100%;
+ height: 40px;
+ line-height: 44px;
+ text-align: right;
+
+ :global(.ant-dropdown-trigger) {
+ margin-right: 24px;
+ }
+}
+
+.content {
+ //flex: 1;
+ //padding: 32px 0;
+
+ //box-sizing: border-box;
+ //margin: 60px auto;
+ //display: flex;
+ //align-items: center;
+ //justify-content: center;
+ //flex-direction: column;
+ //height: 100vh;
+ //overflow: auto;
+
+
+}
+
+@media (min-width: 768px) {
+ .container {
+ background-image: url('@/assets/images/background.png');
+ background-size: cover;
+ }
+
+ .content {
+ padding: 32px 0 24px;
+ }
+
+ .content img {
+ text-align: center;
+ }
+}
+
+.icon {
+ margin-left: 8px;
+ color: rgba(0, 0, 0, 0.2);
+ font-size: 24px;
+ vertical-align: middle;
+ cursor: pointer;
+ transition: color 0.3s;
+
+ &:hover {
+ color: aquamarine;
+ }
+}
+
+.mp_code {
+ padding: 0px 60px;
+ width: 361px;
+ height: 490px;
+ background-color: rgb(255, 255, 255);
+ border-right: 0.5px solid rgb(196, 203, 215);
+}
+
+.mp_code_title {
+ margin-top: 50px;
+ font-weight: 500;
+ font-size: 24px;
+ color: rgb(24, 24, 24)
+}
+
+.mp_code_img {
+ margin-top: 10px;
+}
+
+.alert {
+ margin-top: 25px;
+ width: 250px;
+ padding: 5px;
+ text-align: left;
+ vertical-align: middle;
+}
+
+.login_form {
+ // height: 100%;
+ // float: left;
+ margin: 0;
+ padding: 0 32px;
+}
+
+.mp_tips {
+ font-weight: bold;
+ color: rgb(7, 221, 7);
+}
+
+.logo span {
+ position: relative;
+ top: 2px;
+ color: rgba(0, 0, 0, .85);
+ font-weight: 600;
+ font-size: 33px;
+}
+
+.subTitle {
+ margin-top: 12px;
+ margin-bottom: 10px;
+ color: rgba(0, 0, 0, .45);
+ font-size: 14px;
+}
diff --git a/src/views/User/Login/index.tsx b/src/views/User/Login/index.tsx
new file mode 100644
index 0000000..a5004fb
--- /dev/null
+++ b/src/views/User/Login/index.tsx
@@ -0,0 +1,377 @@
+import {
+ BarcodeOutlined,
+ GithubOutlined,
+ GitlabOutlined,
+ LockOutlined,
+ MobileOutlined,
+ QqOutlined,
+ UserOutlined,
+ WechatOutlined,
+} from '@ant-design/icons'
+import { ProFormCaptcha, ProFormCheckbox, ProFormText } from '@ant-design/pro-components'
+import { Divider, Space, Tabs, message, Image, Alert, Form, Button } from 'antd'
+import { CSSProperties } from 'react'
+import { useState } from 'react'
+import logo from '@/assets/icons/schisandra.svg'
+import qrCode from '@/assets/images/login_qrcode-landaiqing.jpg'
+import './index.less'
+import { observer } from 'mobx-react'
+// import useStore from '@/utils/store/useStore.tsx'
+type LoginType = 'account' | 'phone'
+
+const iconStyles: CSSProperties = {
+ color: 'rgba(0, 0, 0, 0.2)',
+ fontSize: '18px',
+ verticalAlign: 'middle',
+ cursor: 'pointer',
+}
+
+export default observer(() => {
+ const [generateMpRegCodeData, setGenerateMpRegCodeData] = useState
-
-
- 其他登录方式
-
-
-
-
-
- }>
-
-
-
-
-
-
-
-
-
-
- 自动登录
-
- 忘记密码
-
-
+
+ )
+})
diff --git a/src/views/User/Register/index.less b/src/views/User/Register/index.less
new file mode 100644
index 0000000..284cbf9
--- /dev/null
+++ b/src/views/User/Register/index.less
@@ -0,0 +1,154 @@
+
+.container {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+ height: 100vh;
+ width: 100vw;
+ overflow: auto;
+}
+
+.login_content {
+ // margin-top: 40px;
+ // position: relative;
+ width: 782px;
+ background-color: rgb(255, 255, 255);
+ // height: 100%;
+ overflow: hidden;
+ box-shadow: rgb(0 0 0 / 15%) 0px 2px 15px;
+ //float: right;
+ //height: 538px;
+ position: relative;
+ padding: 30px 0 30px 0;
+
+}
+
+.go_to_register {
+ cursor: pointer;
+ height: 70px;
+ width: 70px;
+ background-image: url('@/assets/icons/corner_markers.svg');
+ position: absolute;
+ top: 0px;
+ right: 0px;
+ text-align: right;
+}
+
+.go_to_register span {
+ font-size: 14px;
+ color: rgb(255, 255, 255);
+ font-weight: 500;
+ position: relative;
+ top: 10px;
+ right: 7px;
+}
+
+.lang {
+ width: 100%;
+ height: 40px;
+ line-height: 44px;
+ text-align: right;
+
+ :global(.ant-dropdown-trigger) {
+ margin-right: 24px;
+ }
+}
+
+.content {
+ //flex: 1;
+ //padding: 32px 0;
+
+ //box-sizing: border-box;
+ //margin: 60px auto;
+ //display: flex;
+ //align-items: center;
+ //justify-content: center;
+ //flex-direction: column;
+ //height: 100vh;
+ //overflow: auto;
+
+
+}
+
+@media (min-width: 768px) {
+ .container {
+ background-image: url('@/assets/images/background.png');
+ background-size: cover;
+ }
+
+ .content {
+ padding: 32px 0 24px;
+ }
+
+ .content img {
+ text-align: center;
+ }
+}
+
+.icon {
+ margin-left: 8px;
+ color: rgba(0, 0, 0, 0.2);
+ font-size: 24px;
+ vertical-align: middle;
+ cursor: pointer;
+ transition: color 0.3s;
+
+ &:hover {
+ color: aquamarine;
+ }
+}
+
+.mp_code {
+ padding: 0px 60px;
+ width: 361px;
+ height: 490px;
+ background-color: rgb(255, 255, 255);
+ border-right: 0.5px solid rgb(196, 203, 215);
+}
+
+.mp_code_title {
+ margin-top: 50px;
+ font-weight: 500;
+ font-size: 24px;
+ color: rgb(24, 24, 24)
+}
+
+.mp_code_img {
+ margin-top: 10px;
+}
+
+.alert {
+ margin-top: 25px;
+ width: 250px;
+ padding: 5px;
+ text-align: left;
+ vertical-align: middle;
+}
+
+.login_form {
+ // height: 100%;
+ // float: left;
+ margin: 0;
+ padding: 0 32px;
+}
+
+.mp_tips {
+ font-weight: bold;
+ color: rgb(7, 221, 7);
+}
+
+.logo span {
+ position: relative;
+ top: 2px;
+ color: rgba(0, 0, 0, .85);
+ font-weight: 600;
+ font-size: 33px;
+}
+
+.subTitle {
+ margin-top: 12px;
+ margin-bottom: 10px;
+ color: rgba(0, 0, 0, .45);
+ font-size: 14px;
+}
diff --git a/src/views/User/Register/index.tsx b/src/views/User/Register/index.tsx
new file mode 100644
index 0000000..72f658b
--- /dev/null
+++ b/src/views/User/Register/index.tsx
@@ -0,0 +1,256 @@
+import { BarcodeOutlined, LockOutlined, MobileOutlined, WechatOutlined } from '@ant-design/icons'
+import { ProFormCaptcha, ProFormText } from '@ant-design/pro-components'
+import { Space, Tabs, message, Image, Alert, Form, Button } from 'antd'
+import { useState } from 'react'
+import logo from '@/assets/icons/schisandra.svg'
+// import background from '@/assets/images/background.png'
+import qrCode from '@/assets/images/login_qrcode-landaiqing.jpg'
+import './index.less'
+import { observer } from 'mobx-react'
+// import useStore from '@/utils/store/useStore.tsx'
+type LoginType = 'phone'
+
+export default observer(() => {
+ const [generateMpRegCodeData, setGenerateMpRegCodeData] = useState
+
+
+
+
+ 微信扫码登录
+ 微信扫码关注公众号)}
+ description={
+
+
+
+
+ 注册
+
+
+
+
+
+
+ 微信扫码
+ 关注公众号
+
+
+ 登录更快更安全 +
+ }
+ // type="success"
+ showIcon={true}
+ className={'alert'}
+ icon={+ 登录更快更安全 +
+
+ )
+})
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
index 4dafaa8..7985ae1 100644
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -15,6 +15,10 @@ declare module '*.svg' {
const content: any
export default content
}
+declare module '.*' {
+ const value: any
+ export default value
+}
declare module '*.tsx'
declare module '*.svg'
declare module '*.png'
+
+
+
+
+ 微信扫码登录
+ 微信扫码关注公众号)}
+ description={
+
+
+
+
+ 登录
+
+
+
+
+
+
+ 微信扫码
+ 关注公众号
+
+
+ 登录更快更安全 +
+ }
+ // type="success"
+ showIcon={true}
+ className={'alert'}
+ icon={+ 登录更快更安全 +