feats

package.json

@@ -35,24 +35,25 @@
   ],
   "author": "",
   "dependencies": {
+    "@antmjs/vantui": "^2.3.5",
     "@babel/runtime": "^7.7.7",
     "@tarojs/components": "3.5.7",
     "@tarojs/helper": "3.5.7",
-    "@tarojs/plugin-platform-weapp": "3.5.7",
+    "@tarojs/plugin-framework-react": "3.5.7",
     "@tarojs/plugin-platform-alipay": "3.5.7",
-    "@tarojs/plugin-platform-tt": "3.5.7",
-    "@tarojs/plugin-platform-swan": "3.5.7",
     "@tarojs/plugin-platform-jd": "3.5.7",
     "@tarojs/plugin-platform-qq": "3.5.7",
+    "@tarojs/plugin-platform-swan": "3.5.7",
+    "@tarojs/plugin-platform-tt": "3.5.7",
+    "@tarojs/plugin-platform-weapp": "3.5.7",
+    "@tarojs/react": "3.5.7",
     "@tarojs/router": "3.5.7",
     "@tarojs/runtime": "3.5.7",
     "@tarojs/shared": "3.5.7",
     "@tarojs/taro": "3.5.7",
     "@tarojs/taro-h5": "3.5.7",
-    "@tarojs/plugin-framework-react": "3.5.7",
-    "@tarojs/react": "3.5.7",
-    "react-dom": "^18.0.0",
-    "react": "^18.0.0"
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
   },
   "devDependencies": {
     "@babel/core": "^7.8.0",

src/pages/index/index.jsx

@@ -1,24 +1,43 @@
 import { Component } from 'react'
-import { View, Text } from '@tarojs/components'
+import { View, Text, Input, Image } from '@tarojs/components'
+import { Form, FormItem, Button } from '@antmjs/vantui'
+import logo from '../../assets/image/logo.png';
+import user from '../../assets/image/user.png';
+import password from '../../assets/image/password.png';
 import './index.less'
 
-export default class Index extends Component {
-
-  componentWillMount () { }
-
-  componentDidMount () { }
-
-  componentWillUnmount () { }
-
-  componentDidShow () { }
-
-  componentDidHide () { }
-
-  render () {
-    return (
-      <View className='index'>
-        <Text>Hello world!</Text>
+export default (props) => {
+  return (
+    <View className='index'>
+      <View className='index-2'>
+        <Image className='img-1'
+          src={logo}
+        />
       </View>
-    )
-  }
+
+      <Text className='txt-1'>欢迎登录霍山文明创建</Text>
+      <Form className='form'>
+        <View className='index-3'>
+          <Image src={user} className='img-2' />账号<Input className='input-1' placeholder='请输入您的登录账号' />
+        </View>
+        <View className='index-3'>
+          <Image src={password} className='img-2' />密码<Input className='input-1' placeholder='请输入您的登录密码' />
+        </View>
+        {/* <FormItem label='账号' className='item'>
+            <Input className='input-1' placeholder='请输入您的登录账号' />
+          </FormItem>
+          <FormItem label='证件'>
+            <Input placeholder='请输入您的登录密码' />
+          </FormItem> */}
+        <Button
+          type='primary'
+          className='btn'
+        >
+          登录
+        </Button>
+      </Form>
+      <Text className='txt-2'>——其他登录方式——</Text>
+      <Text className='txt-3'>微信登录</Text>
+    </View>
+  )
 }

src/pages/index/index.less

@@ -0,0 +1,55 @@
+.index {
+  .index-2 {
+    width: 235px;
+    height: 235px;
+    margin: 0 auto;
+  }
+  .img-1 {
+    width: 235px;
+    height: 235px;
+  }
+  .txt-1 {
+    display: block;
+    width: 320px;
+    margin: 10px auto;
+    margin-bottom: 80px;
+  }
+  .form {
+    width: 620px;
+    .index-3 {
+      display: flex;
+      margin-bottom: 26px;
+      .img-2 {
+        margin-left: 100px;
+        margin-right: 30px;
+        width: 42px;
+        height: 44px;
+      }
+      .input-1 {
+        margin-left: 15px;
+        flex-direction: column;
+        border-left: 1px solid black;
+      }
+    }
+    .btn {
+      width: 600px;
+      margin: 80px auto;
+      background-color: rgb(26, 117, 100);
+      color: #fff;
+    }
+  }
+  .txt-2 {
+    font-size: 30px;
+    color: rgb(174, 174, 174);
+    display: block;
+    width: 330px;
+    margin: 10px auto;
+  }
+  .txt-3 {
+    font-size: 25px;
+    color: rgb(174, 174, 174);
+    display: block;
+    width: 100px;
+    margin: 10px auto;
+  }
+}

src/routes.js

@@ -0,0 +1,53 @@
+
+const routes = [
+
+  /**********************************
+   *  Tab 页面
+   *********************************/
+  {
+    name: '首页',
+    page: 'pages/index/index',
+    pkg: 'main',
+    isTab: true,
+    type: 'main',
+    shortcut: {
+      chat: false,
+      consultant: true,
+    },
+    // auth: ['phone', 'avatar']
+  },
+]
+
+/**
+ * 获取 app pages 列表
+ */
+function getPages () {
+  const grp = routes.reduce((g, r) => {
+    const { pkg, page } = r
+    const pg = g[pkg] || []
+
+    return Object.assign(g, {
+      [`${pkg}`]: pg.concat(page),
+    })
+  }, {});
+
+  const pages = grp.main;
+  const subPackages = Object.keys(grp).filter(x => x !== 'main').reduce(((pkg, key) => {
+    return pkg.concat({
+      root: key,
+      pages: grp[key],
+    })
+  }), [])
+
+
+  return {
+    pages,
+    subPackages,
+  }
+}
+
+// eslint-disable-next-line import/no-commonjs
+module.exports = {
+  routes,
+  getPages,
+};