HW hace 3 años
padre
commit
54599900f9

+ 1 - 1
config/dev.js

@@ -1,6 +1,6 @@
 module.exports = {
   env: {
-    NODE_ENV: '"development"'
+    NODE_ENV: '"production"'
   },
   defineConstants: {
   },

+ 8 - 7
src/app.config.js

@@ -1,24 +1,25 @@
 export default {
   pages: [
-    'pages/applyDepart/index',//申请外出
     'pages/examine/index',//审核
+    'pages/applyDepart/index',//申请外出
     'pages/punchClock/index',//打卡
     'pages/login/index',//登录
     // 'pages/staffDistribution/index',//员工分布
     // 'pages/outdoorActivities/index'//出差申报
   ],
   tabBar: {
-    list: [{
+    list: [
+      {
+        iconPath: './image/examineUnSelect.png',
+        selectedIconPath: './image/examineSelect.png',
+        pagePath: 'pages/examine/index',
+        text: '审核'
+      },{
       iconPath: './image/punchClockUnSelect.png',
       selectedIconPath: './image/punchClockSelect.png',
       pagePath: 'pages/punchClock/index',
       text: '打卡'
     }, {
-      iconPath: './image/examineUnSelect.png',
-      selectedIconPath: './image/examineSelect.png',
-      pagePath: 'pages/examine/index',
-      text: '审核'
-    }, {
       iconPath: './image/egressUnSelect.png',
       selectedIconPath: './image/egressSelect.png',
       pagePath: 'pages/applyDepart/index',

+ 286 - 0
src/components/common/NavBar/index.js

@@ -0,0 +1,286 @@
+import _isFunction from 'lodash/isFunction';
+import { Component } from 'react';
+import Taro from '@tarojs/taro';
+import { View } from '@tarojs/components';
+import './index.less';
+
+function getSystemInfo() {
+  if (Taro.globalSystemInfo && !Taro.globalSystemInfo.ios) {
+    return Taro.globalSystemInfo;
+  } else {
+    // h5环境下忽略navbar
+    if (!_isFunction(Taro.getSystemInfoSync)) {
+      return null;
+    }
+    let systemInfo = Taro.getSystemInfoSync() || {
+      model: '',
+      system: ''
+    };
+    let ios = !!(systemInfo.system.toLowerCase().search('ios') + 1);
+    let rect;
+    try {
+      rect = Taro.getMenuButtonBoundingClientRect ? Taro.getMenuButtonBoundingClientRect() : null;
+      if (rect === null) {
+        throw 'getMenuButtonBoundingClientRect error';
+      }
+      //取值为0的情况  有可能width不为0 top为0的情况
+      if (!rect.width || !rect.top || !rect.left || !rect.height) {
+        throw 'getMenuButtonBoundingClientRect error';
+      }
+    } catch (error) {
+      let gap = ''; //胶囊按钮上下间距 使导航内容居中
+      let width = 96; //胶囊的宽度
+      if (systemInfo.platform === 'android') {
+        gap = 8;
+        width = 96;
+      } else if (systemInfo.platform === 'devtools') {
+        if (ios) {
+          gap = 5.5; //开发工具中ios手机
+        } else {
+          gap = 7.5; //开发工具中android和其他手机
+        }
+      } else {
+        gap = 4;
+        width = 88;
+      }
+      if (!systemInfo.statusBarHeight) {
+        //开启wifi的情况下修复statusBarHeight值获取不到
+        systemInfo.statusBarHeight = systemInfo.screenHeight - systemInfo.windowHeight - 20;
+      }
+      rect = {
+        //获取不到胶囊信息就自定义重置一个
+        bottom: systemInfo.statusBarHeight + gap + 32,
+        height: 32,
+        left: systemInfo.windowWidth - width - 10,
+        right: systemInfo.windowWidth - 10,
+        top: systemInfo.statusBarHeight + gap,
+        width: width
+      };
+      console.log('error', error);
+      console.log('rect', rect);
+    }
+
+    let navBarHeight = '';
+    if (!systemInfo.statusBarHeight) {
+      //开启wifi和打电话下
+      systemInfo.statusBarHeight = systemInfo.screenHeight - systemInfo.windowHeight - 20;
+      navBarHeight = (function() {
+        let gap = rect.top - systemInfo.statusBarHeight;
+        return 2 * gap + rect.height;
+      })();
+
+      systemInfo.statusBarHeight = 0;
+      systemInfo.navBarExtendHeight = 0; //下方扩展4像素高度 防止下方边距太小
+    } else {
+      navBarHeight = (function() {
+        let gap = rect.top - systemInfo.statusBarHeight;
+        return systemInfo.statusBarHeight + 2 * gap + rect.height;
+      })();
+      if (ios) {
+        systemInfo.navBarExtendHeight = 4; //下方扩展4像素高度 防止下方边距太小
+      } else {
+        systemInfo.navBarExtendHeight = 0;
+      }
+    }
+
+    systemInfo.navBarHeight = navBarHeight; //导航栏高度不包括statusBarHeight
+    systemInfo.capsulePosition = rect; //右上角胶囊按钮信息bottom: 58 height: 32 left: 317 right: 404 top: 26 width: 87 目前发现在大多机型都是固定值 为防止不一样所以会使用动态值来计算nav元素大小
+    systemInfo.ios = ios; //是否ios
+    Taro.globalSystemInfo = systemInfo; //将信息保存到全局变量中,后边再用就不用重新异步获取了
+    //console.log('systemInfo', systemInfo);
+    return systemInfo;
+  }
+}
+let globalSystemInfo = getSystemInfo();
+class AtComponent extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      configStyle: this.setStyle(globalSystemInfo)
+    };
+  }
+  static options = {
+    multipleSlots: true,
+    addGlobalClass: true
+  };
+  componentDidShow() {
+    if (globalSystemInfo.ios) {
+      globalSystemInfo = getSystemInfo();
+      this.setState({
+        configStyle: this.setStyle(globalSystemInfo)
+      });
+    }
+  }
+  handleBackClick() {
+    if (_isFunction(this.props.onBack)) {
+      this.props.onBack();
+    } else {
+      const pages = Taro.getCurrentPages();
+      if (pages.length >= 2) {
+        Taro.navigateBack({
+          delta: this.props.delta
+        });
+      }
+    }
+  }
+  handleGoHomeClick() {
+    if (_isFunction(this.props.onHome)) {
+      this.props.onHome();
+    }
+  }
+  handleSearchClick() {
+    if (_isFunction(this.props.onSearch)) {
+      this.props.onSearch();
+    }
+  }
+  static defaultProps = {
+    extClass: '',
+    background: 'rgba(255,255,255,1)', //导航栏背景
+    color: '#000000',
+    title: '',
+    searchText: '点我搜索',
+    searchBar: false,
+    back: false,
+    home: false,
+    iconTheme: 'black',
+    delta: 1
+  };
+
+  state = {};
+
+  setStyle(systemInfo) {
+    const { statusBarHeight, navBarHeight, capsulePosition, navBarExtendHeight, ios, windowWidth } = systemInfo;
+    const { back, home, title, color } = this.props;
+    let rightDistance = windowWidth - capsulePosition.right; //胶囊按钮右侧到屏幕右侧的边距
+    let leftWidth = windowWidth - capsulePosition.left; //胶囊按钮左侧到屏幕右侧的边距
+
+    let navigationbarinnerStyle = [
+      `color:${color}`,
+      //`background:${background}`,
+      `height:${navBarHeight + navBarExtendHeight}px`,
+      `padding-top:${statusBarHeight}px`,
+      `padding-right:${leftWidth}px`,
+      `padding-bottom:${navBarExtendHeight}px`
+    ].join(';');
+    let navBarLeft = [];
+    if ((back && !home) || (!back && home)) {
+      navBarLeft = [
+        `width:${capsulePosition.width}px`,
+        `height:${capsulePosition.height}px`,
+        `margin-left:0px`,
+        `margin-right:${rightDistance}px`
+      ].join(';');
+    } else if ((back && home) || title) {
+      navBarLeft = [
+        `width:${capsulePosition.width}px`,
+        `height:${capsulePosition.height}px`,
+        `margin-left:${rightDistance}px`
+      ].join(';');
+    } else {
+      navBarLeft = [`width:auto`, `margin-left:0px`].join(';');
+    }
+    return {
+      navigationbarinnerStyle,
+      navBarLeft,
+      navBarHeight,
+      capsulePosition,
+      navBarExtendHeight,
+      ios,
+      rightDistance
+    };
+  }
+
+  render() {
+    const {
+      navigationbarinnerStyle,
+      navBarLeft,
+      navBarHeight,
+      capsulePosition,
+      navBarExtendHeight,
+      ios,
+      rightDistance
+    } = this.state.configStyle;
+    const {
+      title,
+      background,
+      backgroundColorTop,
+      back,
+      home,
+      searchBar,
+      searchText,
+      iconTheme,
+      extClass
+    } = this.props;
+    let nav_bar__center = null;
+    if (title) {
+      nav_bar__center = <text>{title}</text>;
+    } else if (searchBar) {
+      nav_bar__center = (
+        <View
+          className='lxy-nav-bar-search'
+          style={`height:${capsulePosition.height}px;`}
+          onClick={this.handleSearchClick.bind(this)}
+        >
+          <View className='lxy-nav-bar-search__icon' />
+          <View className='lxy-nav-bar-search__input'>{searchText}</View>
+        </View>
+      );
+    } else {
+      /* eslint-disable */
+      nav_bar__center = this.props.renderCenter;
+      /* eslint-enable */
+    }
+    return (
+      <View
+        className={`lxy-nav-bar ${ios ? 'ios' : 'android'} ${extClass}`}
+        style={`background: ${backgroundColorTop ? backgroundColorTop : background};height:${navBarHeight +
+          navBarExtendHeight}px;`}
+      >
+        <View
+          className={`lxy-nav-bar__placeholder ${ios ? 'ios' : 'android'}`}
+          style={`padding-top: ${navBarHeight + navBarExtendHeight}px;`}
+        />
+        <View
+          className={`lxy-nav-bar__inner ${ios ? 'ios' : 'android'}`}
+          style={`background:${background};${navigationbarinnerStyle};`}
+        >
+          <View className='lxy-nav-bar__left' style={navBarLeft}>
+            {back && !home && (
+              <View
+                onClick={this.handleBackClick.bind(this)}
+                className={`lxy-nav-bar__button lxy-nav-bar__btn_goback ${iconTheme}`}
+              />
+            )}
+            {!back && home && (
+              <View
+                onClick={this.handleGoHomeClick.bind(this)}
+                className={`lxy-nav-bar__button lxy-nav-bar__btn_gohome ${iconTheme}`}
+              />
+            )}
+            {back && home && (
+              <View className={`lxy-nav-bar__buttons ${ios ? 'ios' : 'android'}`}>
+                <View
+                  onClick={this.handleBackClick.bind(this)}
+                  className={`lxy-nav-bar__button lxy-nav-bar__btn_goback ${iconTheme}`}
+                />
+                <View
+                  onClick={this.handleGoHomeClick.bind(this)}
+                  className={`lxy-nav-bar__button lxy-nav-bar__btn_gohome ${iconTheme}}`}
+                />
+              </View>
+            )}
+            {!back && !home && this.props.renderLeft}
+          </View>
+          <View className='lxy-nav-bar__center' style={`padding-left: ${rightDistance}px`}>
+            {nav_bar__center}
+          </View>
+          <View className='lxy-nav-bar__right' style={`margin-right: ${rightDistance}px`}>
+            {this.props.renderRight}
+          </View>
+        </View>
+      </View>
+    );
+  }
+}
+
+export default AtComponent;

La diferencia del archivo ha sido suprimido porque es demasiado grande
+ 212 - 0
src/components/common/NavBar/index.less


+ 0 - 59
src/components/common/ProgresCanvas/index.jsx

@@ -1,59 +0,0 @@
-import React, { Component } from 'react';
-import { Canvas, Text, View } from '@tarojs/components';
-import { createCanvasContext, getSystemInfoSync } from '@tarojs/taro';
-import './index.less';
-
-export default class ProgresCanvas extends Component {
-  constructor(props) {
-    super(props);
-  }
-
-  facilCanvas (id, dp, color) {
-    let query = createCanvasContext(id);
-    const drawArc = (s, e) => {
-
-      /*
-          * x:X轴绘制点
-          * y: y轴绘制点
-          * 通过x,y轴绘制点来控制你画的弧形进度条位置
-      */
-
-      let x = 98 * dp, y = 102 * dp, radius = 94 * dp;
-      query.setFillStyle('#cdcdcd');
-      query.clearRect(0, 0, 200, 200);
-      query.draw();
-      query.setLineWidth(8);
-      query.setStrokeStyle(color);
-      query.setLineCap('round');
-      query.beginPath();
-      query.arc(x, y, radius, s, e, false);
-      query.stroke();
-      query.draw();
-    };
-
-    /*
-        * step : 个数据
-        * n:总数据
-        * 最终通过 step和n之间的比值来绘制进度
-    */
-    let step = 20, n = 60, startAngle = 1.5 * Math.PI, endAngle = 0;
-    endAngle = step * 2 * Math.PI / n + 1.5 * Math.PI;
-    drawArc(startAngle, endAngle);
-  };
-
-  componentDidMount() {
-    let facility = getSystemInfoSync(); // 获取设备信息
-    let facility_width = facility.windowWidth; // 设备宽度
-    let dpr = facility_width / 750;
-
-    this.facilCanvas('visitor_canvas', dpr, '#d81e06'); // 客访次数
-  }
-
-  render() {
-    return (
-      <View>
-        <Canvas className="visitor_middle_circle" canvasId="visitor_canvas"></Canvas>
-      </View>
-    );
-  }
-}

+ 0 - 4
src/components/common/ProgresCanvas/index.less

@@ -1,4 +0,0 @@
-.visitor_middle_circle{
-  width: 200px;
-  height: 200px;
-}

BIN
src/image/egressSelect.png


BIN
src/image/egressUnSelect.png


BIN
src/image/examineSelect.png


BIN
src/image/examineUnSelect.png


BIN
src/image/noData.png


BIN
src/image/punchClockSelect.png


BIN
src/image/punchClockUnSelect.png


+ 0 - 4
src/index.html

@@ -9,10 +9,6 @@
   <meta name="apple-mobile-web-app-status-bar-style" content="white">
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >
   <title></title>
-  <script type="text/javascript"
-          src="https://api.map.baidu.com/api?v=3.0&ak=iW1tcpzD7GnxvwhDYvtkFAfH65BDNxlA"></script>
-  <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.0&type=webgl&ak=iW1tcpzD7GnxvwhDYvtkFAfH65BDNxlA"></script>
-  <script type="text/javascript" src="http://api.map.baidu.com/library/TrackAnimation/src/TrackAnimation_min.js"></script>
   <script>
     !function(x){function w(){var v,u,t,tes,s=x.document,r=s.documentElement,a=r.getBoundingClientRect().width;if(!v&&!u){var n=!!x.navigator.appVersion.match(/AppleWebKit.*Mobile.*/);v=x.devicePixelRatio;tes=x.devicePixelRatio;v=n?v:1,u=1/v}if(a>=640){r.style.fontSize="40px"}else{if(a<=320){r.style.fontSize="20px"}else{r.style.fontSize=a/320*20+"px"}}}x.addEventListener("resize",function(){w()});w()}(window);
   </script>

+ 2 - 1
src/pages/login/index.config.js

@@ -1,3 +1,4 @@
 export default {
-  navigationBarTitleText: '登录'
+  navigationBarTitleText: '登录',
+  navigationStyle:'custom'
 }

+ 120 - 51
src/pages/login/index.jsx

@@ -1,14 +1,26 @@
 import { Component } from 'react'
 import Taro from '@tarojs/taro'
 import { connect } from 'react-redux'
-import {View, Button, Input} from '@tarojs/components'
+import {View, Input} from '@tarojs/components'
 import {login} from '../../utils/servers/servers';
 import {setOpenId} from '../../utils/servers/servers';
 
 import { add, minus, asyncAdd } from '../../actions/counter'
 
+import { AtButton,AtIcon,AtModal  } from 'taro-ui'
+
+import NavBar from '../../components/common/NavBar';
+
+import 'taro-ui/dist/style/components/button.scss';
+import 'taro-ui/dist/style/components/loading.scss';
+import 'taro-ui/dist/style/components/icon.scss';
+import 'taro-ui/dist/style/components/modal.scss';
+
 import './index.less'
 
+const list = [
+
+]
 
 @connect(({ counter }) => ({
   counter
@@ -28,9 +40,12 @@ class Login extends Component {
     super(props);
     this.state={
       username:'',
-      password:''
+      password:'',
+      isOpened:false,
+      openedType:0
     }
     this.login = this.login.bind(this);
+    this.authorization = this.authorization.bind(this);
   }
 
   componentDidShow () {
@@ -41,21 +56,24 @@ class Login extends Component {
 
   }
 
-  a(){
+  authorization(){
+    this.setState({
+      loading:true,
+    })
+    let _this= this;
     Taro.getSetting({
       withSubscriptions: true,
       success:(res)=>{
         console.log(res.subscriptionsSetting,'res.subscriptionsSetting')
         if(res.subscriptionsSetting.mainSwitch){
-          // res.subscriptionsSetting = {
-          //   mainSwitch: true, // 订阅消息总开关
-          //   itemSettings: {   // 每一项开关
-          //     SYS_MSG_TYPE_RANK: 'accept',
-          //     'pWia-KJPFwDM8ReDu_BOa9FJn31VFc81bp3yxfBmIRI': 'accept',
-          //     'j7WH3EwQnxGxwuV2HwmJhryxySPE8vOiV5cVOpp-42I': 'accept',
-          //     'vo28uzT2sLS-9ioroNyZbMSvu0mMvf6le2pDZVN891U': 'accept',
-          //   }
-          // }
+          if(res.subscriptionsSetting['j7WH3EwQnxGxwuV2HwmJhryxySPE8vOiV5cVOpp-42I'] === "reject" || res.subscriptionsSetting['pWia-KJPFwDM8ReDu_BOa9FJn31VFc81bp3yxfBmIRI'] === "reject" || res.subscriptionsSetting['vo28uzT2sLS-9ioroNyZbMSvu0mMvf6le2pDZVN891U'] === "reject"){
+            this.setState({
+              isOpened:true,
+              loading:false,
+              openedType:1
+            })
+            return;
+          }
           Taro.requestSubscribeMessage({ //获取下发权限
             tmplIds: [
               'pWia-KJPFwDM8ReDu_BOa9FJn31VFc81bp3yxfBmIRI',
@@ -63,22 +81,29 @@ class Login extends Component {
               'vo28uzT2sLS-9ioroNyZbMSvu0mMvf6le2pDZVN891U'
             ], //此处写在后台获取的模板ID,可以写多个模板ID,看自己的需求
              success: function (s) {
-              console.log(s)
+                _this.setState({
+                  loading:false,
+                })
+               _this.login();
             },
             fail: function (err) {
+              _this.setState({
+                loading:false,
+              })
               console.log(err)
             }
           })
-        }else if(res.subscriptionsSetting.mainSwitch.itemSettings){
-          console.log(res)
         }else{
-          Taro.requestSubscribeMessage({
-            tmplIds: ['SLb0P5wDArFZU05iMrrnNEsXZ7H2wArqdY8__4M1NUUM'],
-            success : (res) => {
-
-            }
+          this.setState({
+            isOpened:true,
+            loading:false,
           })
         }
+      },
+      fail:()=>{
+        this.setState({
+          loading:false,
+        })
       }
     })
   }
@@ -117,9 +142,9 @@ class Login extends Component {
               code:res.code,
             }).then(v=>{
               if(v.error.length === 0){
-                // Taro.switchTab({
-                //   url: '/pages/applyDepart/index',
-                // })
+                Taro.switchTab({
+                  url: '/pages/examine/index',
+                })
               }else{
                 Taro.showToast({title:v.error[0].message})
               }
@@ -144,36 +169,80 @@ class Login extends Component {
 
   render () {
     return (
-      <View>
-        <View>
-          <View>用户名</View>
-          <Input
-            type='text'
-            placeholder='请输入用户名'
-            value={this.state.username}
-            onInput={(v)=>{
-              this.setState({
-                username: v.detail.value
-              })
-            }}
-          />
+      <View className='login'>
+        <NavBar
+          extClass='NavBar'
+          title='科德集团'
+          background='#0000'
+          color='#FFF'
+          onHome={()=>{}}
+        />
+        <View className='welcome'>
+          <View className='welcomeTitle'>科德信息管理</View>
+          <View className='welcomeTitle'>欢迎您!</View>
         </View>
-        <View>
-          <View>密码</View>
-          <Input
-            type='password'
-            password
-            placeholder='请输入密码'
-            value={this.state.password}
-            onInput={(v)=>{
-              this.setState({
-                password: v.detail.value
-              })
-            }}
-          />
+        <View className='loginContent'>
+          <View className='loginItem'>
+            <AtIcon value='user' size='20' color='#999999'/>
+            <Input
+              style={{marginLeft:'15px'}}
+              type='text'
+              placeholder='请输入您的系统账户'
+              value={this.state.username}
+              onInput={(v)=>{
+                this.setState({
+                  username: v.detail.value
+                })
+              }}
+            />
+          </View>
+          <View className='loginItem'>
+            <AtIcon value='lock' size='20' color='#999999'/>
+            <Input
+              style={{marginLeft:'15px'}}
+              type='password'
+              placeholder='请输入密码'
+              value={this.state.password}
+              onInput={(v)=>{
+                this.setState({
+                  password: v.detail.value
+                })
+              }}
+            />
+          </View>
+          <AtButton type='primary' 	circle loading={this.state.loading} onClick={this.authorization}>登录</AtButton>
         </View>
-        <Button type='primary' loading={this.state.loading} onClick={this.login}>登录</Button>
-        <Button type='primary' onClick={this.a}>消息</Button>
+        <AtModal
+          isOpened={this.state.isOpened}
+          title='提醒'
+          cancelText='取消'
+          confirmText='确认'
+          onClose={()=>{
+            this.setState({
+              isOpened:false,
+              openedType:0,
+            })
+          }}
+          onCancel={()=>{
+            this.setState({
+              isOpened:false,
+              openedType:0
+            })
+          }}
+          onConfirm={()=>{
+            this.setState({
+              isOpened:false,
+              openedType:0
+            },()=>{
+              Taro.openSetting({
+                success:(value)=> {
+
+                }
+              })
+            })
+          }}
+          content={this.state.openedType === 1 ? '您存在拒绝接收的消息类型,请点击确认按钮,前往设置页->通知管理,点击不接受的消息通知类型,调整为允许' : '您关闭了接收通知权限,将不能收到订阅通知,请点击确认按钮,前往设置页->通知管理->接收通知,打开接收通知权限'}
+        />
       </View>
     )
   }

+ 44 - 0
src/pages/login/index.less

@@ -0,0 +1,44 @@
+.login{
+  position: relative;
+  min-height: 100vh;
+  z-index: 1;
+  //background: #4564DC;
+  .welcome{
+    position: absolute;
+    z-index: -1;
+    top:0;
+    width: 100%;
+    background: url('http://static.jishutao.com/1.1.74/image/bg.jpg');
+    background-size: 100% 100%;
+    padding: 200px 80px 260px 80px;
+    .welcomeTitle{
+      font-size: 60px;
+      color: white;
+      font-weight: bolder;
+      line-height: 60px;
+      padding-bottom: 20px;
+    }
+  }
+  .loginContent{
+    margin: 316px 50px 0 50px;
+    background: #ffffff;
+    padding: 100px 30px 337px 30px;
+    border-radius: 30px;
+    box-shadow: 0 3px 23px 1px #999999;
+    .loginItem{
+      display: flex;
+      flex-flow: row nowrap;
+      align-items: center;
+      padding-bottom: 10px;
+      border-bottom: 1px #dac3c3 solid;
+      margin-bottom: 100px;
+    }
+  }
+  #_n_9{
+    position: absolute;
+    left: -160px;
+    font-family: cursive;
+    font-size: 38px;
+    letter-spacing: 6px;
+  }
+}