!1 修改合并

Merge pull request !1 from emSui/master
2023-10-15 15:32:16 +00:00 · 2023-10-15 15:32:16 +00:00 · e78100eb41
commit e78100eb41
parent 31af4e3cc4 0215123b37
9 changed files with 220 additions and 35 deletions
--- a/.umirc.ts
+++ b/.umirc.ts
@ -11,7 +11,7 @@ export default defineConfig({
  routes: [
    {
      path: '/',
-      redirect: '/home',
+      redirect: '/login',
    },
    {
      name: '首页',
@ -20,7 +20,7 @@ export default defineConfig({
      icon: 'HomeOutlined',
    },
    {
-      name: ' 基础图层',
+      name: '基础图层',
      path: '/baseMap',
      component: './BaseMap',
      icon: 'BlockOutlined',
@ -31,12 +31,12 @@ export default defineConfig({
    //   component: './Access',
    // },
    {
-        name: ' CRUD 示例',
+        name: 'CRUD 示例',
        path: '/table',
        component: './Table',
    },
    {
-      name: ' 登录',
+      name: '登录',
      path: '/login',
      component: './Login',
      // 不展示菜单
@ -45,7 +45,16 @@ export default defineConfig({
      hideInMenu: true,
    },
    {
-      name: ' 关于我们',
+      name: '注册',
+      path: '/register',
+      component: './Register',
+      // 不展示菜单
+      menuRender: false,
+      // 不展示在菜单栏里
+      hideInMenu: true,
+    },
+    {
+      name: '关于我们',
      path: '/about',
      component: './About',
    },
@ -66,7 +75,7 @@ export default defineConfig({
  ],
  proxy: {
    '/api': {
-      'target': 'http://101.42.40.202:8081',//8.142.119.212:8083
+      'target': 'http://localhost:8081',//101.42.40.202:8081
      'changeOrigin': true,
      // 'pathRewrite': { '^/api' : '' },
    },
--- a/README.md
+++ b/README.md
@ -17,8 +17,8 @@ Gitee 是 OSCHINA 推出的基于 Git 的代码托管平台（同时支持 SVN

 #### 使用说明

-1.  xxxx
-2.  xxxx
+1.  yarn install
+2.  yarn add
 3.  xxxx

 #### 参与贡献
--- a/src/api/index.js
+++ b/src/api/index.js
@ -1,10 +1,18 @@
 import { request } from '@umijs/max';

 // 密码登录
-export function passwordLogin( params ) {
+export function passwordLogin( data ) {
  return request('/api/user/login', {
+    method: 'POST',
+    data: data
+  });
+}
+
+// 发送注册验证短信
+export function registerSms( params ) {
+  return request('/api/user/registerSms', {
    method: 'GET',
-    params: params,
+    params: params
  });
 }

@ -20,6 +28,6 @@ export function queryUserMenu() {
 export function getLayerPoints( params ) {
  return request('/api/basicMap/getLayerPoints', {
    method: 'GET',
-    params: params,
+    params: params
  });
 }
--- a/src/index.less
+++ b/src/index.less
@ -20,7 +20,7 @@ body {
 #login_page .ant-tabs {
    transform: translateY(-50%);
    position: fixed;
-    top: 50%;
+    top: 45%;
    right: 0px;
    width: 38%;
 }
@ -56,13 +56,12 @@ body {
  height: 42px;
 }
 #login_page input {
-  font-size: 22px;
+  font-size: 18px !important;
  box-shadow: none;
 }
-#login_page .ant-form-item-required, #login_page input{
-  color: #A7B0BC;
-
-}
+// #login_page .ant-form-item-required, #login_page input{
+//   color: #A7B0BC;
+// }
 #login_page .ant-form-item-required, #login_page input, #login_page .ant-btn{
  font-size: 22px;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
@ -70,7 +69,7 @@ body {
  line-height: 32px;
 }
 #login_page .ant-form-item-required {
-  margin-bottom: 8px;
+  margin-bottom: 20px;
 }
 #login_page .ant-form-item-required::before {
  display: none;
@ -81,6 +80,9 @@ body {
  margin-top: 18px;
  font-size: 18px;
 }
+#login_page .form-item {
+  margin-bottom: 45px;
+}
 // 左侧导航栏
 :where(.css-dev-only-do-not-override-9ntgx0).ant-layout .ant-layout-sider-light {
    background-image: url(./assets/images/nav-bg.png) !important;
--- a/src/pages/BaseMap/index.js
+++ b/src/pages/BaseMap/index.js
@ -89,7 +89,7 @@ class BaseMap extends React.Component{
    }

    // 获取图层明细点位数据/热力图数据
-    getLayerPoints = (layerId, selected, nodeType) => {debugger
+    getLayerPoints = (layerId, selected, nodeType) => {
        if (selected) {
            return axios.get('/api/basicMap/getLayerPoints', {
                params: {
@ -138,7 +138,8 @@ class BaseMap extends React.Component{
        let self = this;
        let map = this.state.map;
        let LabelsData = data || [];
-        
+        let logoImage = data.length > 0 && data[0].logoImage;
+        map.addImage = (layerId, logoImage);
        const pointLayer = new PointLayer({name: layerId})
            .source(LabelsData, {
                parser: {
@ -147,8 +148,8 @@ class BaseMap extends React.Component{
                    y: 'lat',
                }
            })
-            .shape('simple')
-            .size(15)
+            .shape(layerId)
+            .size(30)
            .color('mag', mag => {
                return mag > 4.5 ? '#5B8FF9' : '#5CCEA1';
            })
@ -555,7 +556,7 @@ class BaseMap extends React.Component{
                <LayerData ref="getLayerDataFun" getLayerPoints = {this.getLayerPoints} getLayerShapes = {this.getLayerShapes}/>
                {/* 地图 */}
                <div className={styles.mapWrap}>
-                    <div style={{width: '100%', height: 880}} id="container" />
+                    <div style={{width: '100%', height: '100vh'}} id="container" />
                </div>
            </div>
        )
--- a/src/pages/Login/index.js
+++ b/src/pages/Login/index.js
@ -1,3 +1,4 @@
+import { useState } from 'react';
 import { Tabs } from 'antd';
 import PasswordLogin from './passwordLogin';
 import VerificationCodeLogin from './verificationCodeLogin';
@ -11,9 +12,6 @@ function Login (e) {
          <Tabs.TabPane tab="密码登录" key="1">
            <PasswordLogin></PasswordLogin>
          </Tabs.TabPane>
-          <Tabs.TabPane tab="验证码登陆" key="2">
-            <VerificationCodeLogin></VerificationCodeLogin>
-          </Tabs.TabPane>
        </Tabs>
      </div>
    </div>
--- a/src/pages/Login/passwordLogin.js
+++ b/src/pages/Login/passwordLogin.js
@ -18,9 +18,9 @@ function Login (e) {
    // }
    passwordLogin({username: values.username, password: values.password}).then((e) => {
        if (!e.success) {
-            message.error('登录失败');
+            message.error(e.message);
          } else {
-            navigate('/Home');
+            navigate('/home');
            // cookie.save('username', 'wyd');
          }
    })
@ -60,6 +60,7 @@ function Login (e) {
            message: '账户名称不能为空!',
        },
        ]}
+        style={{marginBottom: '45px'}}
    >
        <Input placeholder='请输入账户'/>
    </Form.Item>
@ -78,17 +79,18 @@ function Login (e) {
        <Input.Password placeholder='请输入密码' bordered={false}/>
    </Form.Item>

-    <Form.Item
+    {/* <Form.Item
        name="remember"
        valuePropName="checked"
+        style={{marginTop: '38px'}}
    >
      <Checkbox style={{fontSize: '18px'}}>同意<a>服务条款</a></Checkbox>
      <a style={{float: 'right', fontSize: '18px'}}>忘记密码？</a>
-    </Form.Item>
+    </Form.Item> */}

-    <Form.Item >
-        <Button type="primary" htmlType="submit" style={{height: '46px'}} block>密码登录</Button>
-        <a className='new-user'>新用户注册</a>
+    <Form.Item style={{marginTop: '68px'}}>
+        <Button type="primary" htmlType="submit" style={{height: '72px'}} block>密码登录</Button>
+        <a className='new-user' href='/register'>新用户注册</a>
    </Form.Item>
    </Form>
  );
--- a/src/pages/Login/verificationCodeLogin.js
+++ b/src/pages/Login/verificationCodeLogin.js
@ -29,7 +29,7 @@ function VerificationCodeLogin (e) {
 	}

    let onFinish = (values) => {
-        passwordLogin({username: values.username, password: values.password}).then((e) => {
+        passwordLogin({values}).then((e) => {
            if (!e.success) {
                message.error('登录失败');
              } else {
@ -74,6 +74,7 @@ function VerificationCodeLogin (e) {
            message: '账户名称不能为空!',
            },
        ]}
+        style={{marginBottom: '45px'}}
        >
            <Input placeholder='请输入账户'/>
        </Form.Item>
@ -102,6 +103,7 @@ function VerificationCodeLogin (e) {
            offset: 4,
            span: 16,
        }}
+        style={{marginTop: '38px'}}
        >
            <Checkbox style={{fontSize: '18px'}}>同意<a>服务条款</a></Checkbox>
        
@ -112,8 +114,9 @@ function VerificationCodeLogin (e) {
            offset: 4,
            span: 16,
        }}
+        style={{marginTop: '68px'}}
        >
-            <Button type="primary" htmlType="submit" style={{height: '46px'}} block>
+            <Button type="primary" htmlType="submit" style={{height: '72px'}} block>
                验证码登录
            </Button>
            <a className='new-user'>新用户注册</a>
--- a/src/pages/Register/index.js
+++ b/src/pages/Register/index.js
@ -0,0 +1,162 @@
+import { useState } from 'react';
+import { Form, Input, Button, Checkbox, message, Col, Row, Tag, Tabs } from 'antd';
+import '../../index.less';
+import { useNavigate } from 'react-router-dom';
+import { registerSms } from '../../api';
+
+function Register(e) {
+
+  let navigate = useNavigate();
+  let [code, setCode] = useState('获取验证码');
+  let [coding, setCoding] = useState(false);
+  let [mobile, setMobile] = useState('');
+  const [form] = Form.useForm();
+  let onMobileChange = (e) => {
+    let val = e.target.value;
+    setMobile(val)
+  }
+  // 点击获取验证码
+  let getCheckCode = (values) => {debugger
+    // e.preventDefault();
+    // 请求发送验证码接口，请求成功开始倒计时
+    registerSms({'phone': mobile}).then((e) => {
+      if (!e.success) {
+        message.error(e.message);
+      } else {
+        countDown(60);
+      }
+    })
+  }
+  // 倒计时
+  let countDown = (code) => {
+    let count = parseFloat(code);
+    if (code === 1) {
+      setCode('获取验证码');
+      setCoding(false);
+    } else {
+      count = count - 1;
+      setCoding(true);
+      setCode(`${count}s后重新发送`)
+      setTimeout(countDown, 1000, count);
+    }
+  }
+  let onFinish = async (values) => {
+    register({
+      username: values.username,
+      password: values.password
+    }).then((e) => {
+      if (!e.success) {
+        message.error(e.message);
+      } else {
+        message.success("注册成功");
+        navigate('/login');
+      }
+    })
+  };
+  let onFinishFailed = (errorInfo) => {
+    console.log('Failed:', errorInfo);
+  };
+
+  return (
+    <div id='login_page'>
+      <div className='login_right'>
+        <Tabs defaultActiveKey="1" centered>
+          <Tabs.TabPane tab="账号注册" key="1">
+            <Form
+              form={form}
+              name="basic"
+              labelCol={{
+                span: 16,
+                offset: 4,
+              }}
+              wrapperCol={{
+                span: 16,
+                offset: 4,
+              }}
+              layout='vertical'
+              initialValues={{
+                remember: true,
+              }}
+              onFinish={onFinish}
+              onFinishFailed={onFinishFailed}
+              autoComplete="off"
+            >
+              <Form.Item
+                label="手机号"
+                name="mobile"
+                className='formItemStyle'
+                rules={[
+                  {
+                    required: true,
+                    message: '手机号码不能为空!',
+                  },
+                ]}
+                style={{ marginBottom: '45px' }}
+              >
+                <Input placeholder='请输入手机号码' value={mobile} onChange={onMobileChange}/>
+              </Form.Item>
+              <Form.Item
+                label="验证码"
+                name="verificationCode"
+                className='formItemStyle'
+                rules={[
+                  {
+                    required: true,
+                    message: '验证码不能为空!',
+                  },
+                ]}
+              >
+                <Row>
+                  <Col span={16}><Input placeholder='请输入验证码' /></Col>
+                  <Col span={8}><Button disabled={coding} type="link" onClick={getCheckCode}>{code}</Button></Col>
+                </Row>
+              </Form.Item>
+              <Form.Item
+                label="用户名"
+                name="username"
+                className='formItemStyle'
+                rules={[
+                  {
+                    required: true,
+                    message: '用户名不能为空!',
+                  },
+                ]}
+              >
+                <Input.Password placeholder='请输入用户名' bordered={false} />
+              </Form.Item>
+              <Form.Item
+                label="密码"
+                name="password"
+                className='formItemStyle'
+                rules={[
+                  {
+                    required: true,
+                    message: '密码不能为空!',
+                  },
+                ]}
+              >
+                <Input.Password placeholder='请输入密码' bordered={false} />
+              </Form.Item>
+
+              <Form.Item
+                name="remember"
+                valuePropName="checked"
+                style={{ marginTop: '38px' }}
+              >
+                <Checkbox style={{ fontSize: '18px' }}>同意<a>服务条款</a></Checkbox>
+              </Form.Item>
+
+              <Form.Item style={{ marginTop: '68px' }}>
+                <Button type="primary" htmlType="submit" style={{ height: '72px' }} block>立即注册</Button>
+                <a className='new-user'>前往登录</a>
+              </Form.Item>
+            </Form>
+          </Tabs.TabPane>
+        </Tabs>
+      </div>
+    </div>
+  );
+}
+
+
+export default Register;