Browse Source

审核页面筛选样式调整

HW 3 years ago
parent
commit
8b435bdd4d

File diff suppressed because it is too large
+ 16561 - 0
package-lock.json


+ 1 - 1
src/app.config.js

@@ -3,9 +3,9 @@ export default {
     // 'pages/staffDistribution/index',//员工分布
     'pages/punchClock/index',//打卡
     'pages/examine/index',//审核
-    'pages/applyDepart/index',//申请公出
     'pages/egressDetails/index',//公出详情
     'pages/login/index',//登录
+    'pages/applyDepart/index',//申请公出
   ],
   tabBar: {
     list: [

+ 1 - 1
src/app.jsx

@@ -58,7 +58,7 @@ class App extends Component {
         'token': token,
       },
       url: "wss://bm.jishutao.com/webSocketServer",
-      //  172.16.0.188:8080
+      //  172.16.0.255:8080
       //  uat.jishutao.com
     })
 

+ 1 - 1
src/pages/applyDepart/publicContent.jsx

@@ -349,7 +349,7 @@ class PublicContent extends Component{
         </View>
         <View className='tips'>移动红标只需要拖动地图即可</View>
         <View className='formItem' style={{display:'block',paddingTop:'15px'}}>
-          <View className='formName'>公出事由:</View>
+          <View className='formName'>公出事由:<View className='formNameTips'>请填写今天去企业计划怎么沟通?</View></View>
           <View className='formValue' style={{paddingTop:'10px',textAlign:'left'}}>
             <AtTextarea
               value={this.state.reason}

+ 7 - 0
src/pages/applyDepart/publicContent.less

@@ -7,6 +7,13 @@
     padding-bottom: 28px;
     .formName{
       white-space: nowrap;
+      display: flex;
+      align-items: center;
+      .formNameTips{
+        color: #ff0000;
+        font-size: 20px;
+        padding-left: 10px;
+      }
       .tips{
         color: #ff0000;
         font-size: 20px;

+ 1 - 1
src/pages/egressDetails/index.jsx

@@ -308,7 +308,7 @@ class EgressDetails extends Component{
             {
               dtails.permission === 1 && dtails.status === 1 ?
                 <View className='item'>
-                  <View className='title'>填写审批意见</View>
+                  <View className='title'>填写审批意见<View className='titleTips'>根据公出申请记录指导怎么沟通?并提出详细指导建议</View></View>
                   <AtTextarea
                     value={this.state.opinion}
                     onChange={(value)=>{

+ 5 - 0
src/pages/egressDetails/index.less

@@ -47,6 +47,11 @@
         font-size: 27px;
         padding-bottom: 10px;
         position: relative;
+        .titleTips{
+          color: #ff0000;
+          font-size: 18px;
+          padding-left: 10px;
+        }
         .edit{
           position: absolute;
           right: -30px;

+ 5 - 1
src/pages/egressDetails/publicContent.jsx

@@ -382,7 +382,11 @@ class PublicContent extends Component{
         </View>
         <View className='tips'>移动红标只需要拖动地图即可</View>
         <View className='formItem' style={{display:'block',paddingTop:'15px'}}>
-          <View className='formName'>公出事由:</View>
+          <View className='formName' style={{
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent:'space-between'
+          }}>公出事由:<View className='formNameTips'>请填写今天去企业计划怎么沟通?</View></View>
           <View className='formValue' style={{paddingTop:'10px',textAlign:'left'}}>
             <AtTextarea
               value={this.state.reason}

+ 5 - 0
src/pages/egressDetails/publicContent.less

@@ -7,6 +7,11 @@
     padding-bottom: 25px;
     .formName{
       white-space: nowrap;
+      .formNameTips{
+        color: #ff0000;
+        font-size: 20px;
+        padding-left: 10px;
+      }
       .tips{
         color: #ff0000;
         font-size: 20px;

+ 234 - 160
src/pages/examine/index.jsx

@@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import Taro from '@tarojs/taro';
-import { View ,Picker} from '@tarojs/components'
+import { View ,Picker,ScrollView} from '@tarojs/components'
 import { getPublicReleaseList } from '../../utils/servers/servers';
 import {
   AtSearchBar,
@@ -8,6 +8,7 @@ import {
   AtTabsPane,
   AtList,
   AtListItem,
+  AtIcon
 } from 'taro-ui';
 import {clockState} from '../../utils/tools/config';
 
@@ -18,6 +19,7 @@ import "taro-ui/dist/style/components/flex.scss";
 import "taro-ui/dist/style/components/action-sheet.scss";
 import "taro-ui/dist/style/components/icon.scss";
 import "taro-ui/dist/style/components/list.scss";
+import "taro-ui/dist/style/components/icon.scss";
 
 import MyList from './myList';
 import MessageNoticebar from "../../components/common/messageNoticebar";
@@ -210,9 +212,22 @@ class Examine extends Component {
     Taro.stopPullDownRefresh();
   }
 
+  onPageScroll(event){
+    let touchMove = event.scrollTop;
+    if(touchMove >= 37){
+      this.setState({
+        openSearch:true
+      })
+    }else{
+      this.setState({
+        openSearch:false
+      })
+    }
+  }
+
   render () {
     return (
-      <View className='indexPage'>
+      <View className='indexPage' >
         <MessageNoticebar/>
         <View className='searchContent'>
           <View className='searchTop'>
@@ -220,7 +235,9 @@ class Examine extends Component {
               showActionButton
               placeholder='请输入企业名称'
               value={this.state.current === 0 ? this.state.searchValue : this.state.searchValue1}
-              actionName='更多筛选'
+              onActionClick={()=>{
+                this.getPublicReleaseList();
+              }}
               onChange={(value)=>{
                 if(this.state.current === 0){
                   this.setState({
@@ -232,17 +249,6 @@ class Examine extends Component {
                   })
                 }
               }}
-              onActionClick={()=>{
-                this.setState({
-                  openSearch:!this.state.openSearch
-                })
-              }}
-              onConfirm={()=>{
-                this.setState({
-                  openSearch:false
-                })
-                this.getPublicReleaseList();
-              }}
               onClear={()=>{
                 if(this.state.current === 0){
                   this.setState({
@@ -256,165 +262,233 @@ class Examine extends Component {
               }}
             />
           </View>
-          <View className='searchBottom' style={{display:this.state.openSearch ? 'block' : 'none'}}>
-            <View className='searchBottomBack' onClick={()=>{
-              this.setState({
-                openSearch:false
-              })
-            }}/>
-            <View className='searchItem'>
-              <Picker mode='date' onChange={(e)=>{
-                if(this.state.current === 0){
-                  this.setState({
-                    rangeStartVal:e.detail.value,
-                  })
-                }else{
-                  this.setState({
-                    rangeStartVal1:e.detail.value,
-                  })
-                }
-              }}>
-                <AtList>
+          <ScrollView className={this.state.openSearch ? 'searchBottomLOL' : ''} scrollX style={{width:'100%'}}>
+            <View className='searchBottom'>
+              <View className='searchItem' style={{paddingLeft:'5px'}}>
+                <Picker value={this.state.current === 0 ? this.state.starts.id : this.state.starts1.id} range={clockState} rangeKey='title' mode='selector' onChange={(e)=>{
+                  if(this.state.current === 0){
+                    this.setState({
+                      starts:clockState[e.detail.value],
+                    },()=>{
+                      this.getPublicReleaseList();
+                    })
+                  }else{
+                    this.setState({
+                      starts1:clockState[e.detail.value],
+                    },()=>{
+                      this.getPublicReleaseList();
+                    })
+                  }
+                }}>
                   {
-                    this.state.current === 0 ?
-                      <AtListItem
-                        title='开始时间'
-                        hasBorder={false}
-                        extraText={this.state.rangeStartVal ? this.state.rangeStartVal : '请选择开始时间'}/> :
-                      <AtListItem
-                        title='开始时间'
-                        hasBorder={false}
-                        extraText={this.state.rangeStartVal1 ? this.state.rangeStartVal1 : '请选择开始时间'}/>
+                    (this.state.current === 0 && !this.state.starts.title) || (this.state.current === 1 && !this.state.starts1.title) ?
+                      <View className='shortValuecontent'>
+                        <View className='selectTitle'>审核状态</View>
+                        <View className='iconContent'><AtIcon value='chevron-down' size='10' color='#FFFFFF' /></View>
+                      </View> :
+                      <View className='shortValuecontent'>
+                        <View className='selectValue'>
+                          {this.state.current === 0? this.state.starts.title: this.state.starts1.title}
+                        </View>
+                        <View className='iconContent'/>
+                      </View>
                   }
-                </AtList>
-              </Picker>
-            </View>
-            <View className='searchItem'>
-              <Picker mode='date' onChange={(e)=>{
-                if(this.state.current === 0){
-                  this.setState({
-                    rangeEndVal:e.detail.value,
-                  })
-                }else{
-                  this.setState({
-                    rangeEndVal1:e.detail.value,
-                  })
+                </Picker>
+                {
+                  (this.state.current === 0 && this.state.starts.title) || (this.state.current === 1 && this.state.starts1.title) ?
+                    <View className='searchSelectContent'>
+                      <View className='selectIcon' onClick={(e)=>{
+                        e.stopPropagation();
+                        if(this.state.current === 0){
+                          this.setState({
+                            starts:{}
+                          },()=>{
+                            this.getPublicReleaseList();
+                          })
+                        }else{
+                          this.setState({
+                            starts1:{}
+                          },()=>{
+                            this.getPublicReleaseList();
+                          })
+                        }
+                      }}>
+                        <AtIcon value='close-circle' size='10' color='#FFFFFF' />
+                      </View>
+                    </View> : null
                 }
-              }}>
-                <AtList>
+              </View>
+              <View className='searchItem'>
+                <Picker value={this.state.current === 0 ? this.state.clockInStarts : this.state.clockInStarts1} range={[
+                  '未打卡',
+                  '已打卡'
+                ]} mode='selector' onChange={(e)=>{
+                  if(this.state.current === 0){
+                    this.setState({
+                      clockInStarts:String(e.detail.value)
+                    },()=>{
+                      this.getPublicReleaseList();
+                    })
+                  }else{
+                    this.setState({
+                      clockInStarts1:String(e.detail.value)
+                    },()=>{
+                      this.getPublicReleaseList();
+                    })
+                  }
+                }}>
                   {
-                    this.state.current === 0 ?
-                    <AtListItem
-                      title='结束时间'
-                      hasBorder={false}
-                      extraText={this.state.rangeEndVal ? this.state.rangeEndVal : '请选择结束时间' }
-                    /> :
-                    <AtListItem
-                      title='结束时间'
-                      hasBorder={false}
-                      extraText={this.state.rangeEndVal1 ? this.state.rangeEndVal1 : '请选择结束时间' }
-                    />
+                    (this.state.current === 0 && !this.state.clockInStarts) || (this.state.current === 1 && !this.state.clockInStarts1) ?
+                      <View className='shortValuecontent'>
+                        <View className='selectTitle'>打卡状态</View>
+                        <View className='iconContent'><AtIcon value='chevron-down' size='10' color='#FFFFFF' /></View>
+                      </View> :
+                      <View className='shortValuecontent'>
+                        <View className='selectValue'>
+                          {this.state.current === 0? (
+                            this.state.clockInStarts === '1' ? '已打卡' :
+                              this.state.clockInStarts === '0' ? '未打卡' :''
+                          ): this.state.clockInStarts1 === '1' ? '已打卡' :
+                            this.state.clockInStarts1 === '0' ? '未打卡' :''}
+                        </View>
+                        <View className='iconContent'/>
+                      </View>
                   }
-                </AtList>
-              </Picker>
-            </View>
-            <View className='searchItem'>
-              <Picker value={this.state.current === 0 ? this.state.starts.id : this.state.starts1.id} range={clockState} rangeKey='title' mode='selector' onChange={(e)=>{
-                if(this.state.current === 0){
-                  this.setState({
-                    starts:clockState[e.detail.value],
-                  })
-                }else{
-                  this.setState({
-                    starts1:clockState[e.detail.value],
-                  })
+                </Picker>
+                {
+                  (this.state.current === 0 && this.state.clockInStarts) || (this.state.current === 1 && this.state.clockInStarts1) ?
+                    <View className='searchSelectContent'>
+                      <View className='selectIcon' onClick={(e)=>{
+                        e.stopPropagation();
+                        if(this.state.current === 0){
+                          this.setState({
+                            clockInStarts: '',
+                          },()=>{
+                            this.getPublicReleaseList();
+                          })
+                        }else{
+                          this.setState({
+                            clockInStarts1:'',
+                          },()=>{
+                            this.getPublicReleaseList();
+                          })
+                        }
+                      }}>
+                        <AtIcon value='close-circle' size='10' color='#FFFFFF' />
+                      </View>
+                    </View> : null
                 }
-              }}>
-                <AtList>
+              </View>
+              <View className='searchItem'>
+                <Picker mode='date' onChange={(e)=>{
+                  if(this.state.current === 0){
+                    this.setState({
+                      rangeStartVal:e.detail.value,
+                    },()=>{
+                      this.getPublicReleaseList();
+                    })
+                  }else{
+                    this.setState({
+                      rangeStartVal1:e.detail.value,
+                    },()=>{
+                      this.getPublicReleaseList();
+                    })
+                  }
+                }}>
                   {
-                    this.state.current === 0 ?
-                      <AtListItem
-                        title='审核状态'
-                        hasBorder={false}
-                        extraText={this.state.starts.title ? this.state.starts.title : '请选择审核状态'}/> :
-                      <AtListItem
-                        title='审核状态'
-                        hasBorder={false}
-                        extraText={this.state.starts1.title ? this.state.starts1.title : '请选择审核状态'}/>
+                    (this.state.current === 0 && !this.state.rangeStartVal) || (this.state.current === 1 && !this.state.rangeStartVal1) ?
+                      <View className='valuecontent'>
+                        <View className='selectTitle'>开始时间</View>
+                        <View className='iconContent'><AtIcon value='chevron-down' size='10' color='#FFFFFF' /></View>
+                      </View> :
+                      <View className='valuecontent'>
+                        <View className='selectValue'>
+                          {this.state.current === 0? this.state.rangeStartVal: this.state.rangeStartVal1}
+                        </View>
+                        <View className='iconContent'/>
+                      </View>
                   }
-                </AtList>
-              </Picker>
-            </View>
-            <View className='searchItem'>
-              <Picker value={this.state.current === 0 ? this.state.clockInStarts : this.state.clockInStarts1} range={[
-                '未打卡',
-                '已打卡'
-              ]} mode='selector' onChange={(e)=>{
-                if(this.state.current === 0){
-                  this.setState({
-                    clockInStarts:String(e.detail.value)
-                  })
-                }else{
-                  this.setState({
-                    clockInStarts1:String(e.detail.value)
-                  })
+                </Picker>
+                {
+                  (this.state.current === 0 && this.state.rangeStartVal) || (this.state.current === 1 && this.state.rangeStartVal1) ?
+                    <View className='searchSelectContent'>
+                      <View className='selectIcon' onClick={(e)=>{
+                        e.stopPropagation();
+                        if(this.state.current === 0){
+                          this.setState({
+                            rangeStartVal:''
+                          },()=>{
+                            this.getPublicReleaseList();
+                          })
+                        }else{
+                          this.setState({
+                            rangeStartVal1:''
+                          },()=>{
+                            this.getPublicReleaseList();
+                          })
+                        }
+                      }}>
+                        <AtIcon value='close-circle' size='10' color='#FFFFFF' />
+                      </View>
+                    </View> : null
                 }
-              }}>
-                <AtList>
+              </View>
+              <View className='searchItem' style={{marginRight:'5px'}}>
+                <Picker mode='date' onChange={(e)=>{
+                  if(this.state.current === 0){
+                    this.setState({
+                      rangeEndVal:e.detail.value,
+                    },()=>{
+                      this.getPublicReleaseList();
+                    })
+                  }else{
+                    this.setState({
+                      rangeEndVal1:e.detail.value,
+                    },()=>{
+                      this.getPublicReleaseList();
+                    })
+                  }
+                }}>
                   {
-                    this.state.current === 0 ?
-                      <AtListItem
-                        title='打卡状态'
-                        hasBorder={false}
-                        extraText={
-                          this.state.clockInStarts === '1' ? '已打卡' :
-                            this.state.clockInStarts === '0' ? '未打卡' :'请选择打卡状态'
-                        }/>:
-                      <AtListItem
-                        title='打卡状态'
-                        hasBorder={false}
-                        extraText={
-                          this.state.clockInStarts1 === '1' ? '已打卡' :
-                            this.state.clockInStarts1 === '0' ? '未打卡' :'请选择打卡状态'
-                        }/>
+                    (this.state.current === 0 && !this.state.rangeEndVal) || (this.state.current === 1 && !this.state.rangeEndVal1) ?
+                      <View className='valuecontent'>
+                        <View className='selectTitle'>结束时间</View>
+                        <View className='iconContent'><AtIcon value='chevron-down' size='10' color='#FFFFFF' /></View>
+                      </View> :
+                      <View className='valuecontent'>
+                        <View className='selectValue'>
+                          {this.state.current === 0? this.state.rangeEndVal: this.state.rangeEndVal1}
+                        </View>
+                        <View className='iconContent'/>
+                      </View>
                   }
-                </AtList>
-              </Picker>
-            </View>
-            <View className='searchOperation'>
-              <View className='reset' onClick={()=>{
-                if(this.state.current === 0){
-                  this.setState({
-                    rangeStartVal:'',
-                    rangeEndVal:'',
-                    starts:{},
-                    clockInStarts:'',
-                    openSearch:false,
-                    searchValue:''
-                  },()=>{
-                    this.getPublicReleaseList();
-                  })
-                }else{
-                  this.setState({
-                    rangeStartVal1:'',
-                    rangeEndVal1:'',
-                    starts1:{},
-                    clockInStarts1:'',
-                    openSearch:false,
-                    searchValue1:''
-                  },()=>{
-                    this.getPublicReleaseList();
-                  })
+                </Picker>
+                {
+                  (this.state.current === 0 && this.state.rangeEndVal) || (this.state.current === 1 && this.state.rangeEndVal1) ?
+                    <View className='searchSelectContent'>
+                      <View className='selectIcon' onClick={(e)=>{
+                        e.stopPropagation();
+                        if(this.state.current === 0){
+                          this.setState({
+                            rangeEndVal:''
+                          },()=>{
+                            this.getPublicReleaseList();
+                          })
+                        }else{
+                          this.setState({
+                            rangeEndVal1:''
+                          },()=>{
+                            this.getPublicReleaseList();
+                          })
+                        }
+                      }}>
+                        <AtIcon value='close-circle' size='10' color='#FFFFFF' />
+                      </View>
+                    </View> : null
                 }
-              }}>重置</View>
-              <View className='search' onClick={()=>{
-                this.setState({
-                  openSearch:false
-                })
-                this.getPublicReleaseList();
-              }}>搜索</View>
+              </View>
             </View>
-          </View>
+          </ScrollView>
         </View>
         <AtTabs current={this.state.current || 0} tabList={[{ title: '我的' }, { title: '审核' }]} onClick={(current)=>{
           this.setState({

+ 86 - 26
src/pages/examine/index.less

@@ -27,14 +27,13 @@
       z-index: 1000;
     }
     .searchBottom{
-      position: absolute;
-      z-index: 1000;
-      left: 0;
-      right: 0;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
       background: #FFFFFF;
-      //box-shadow: 1px 11px 14px 1px #999999;
       border-bottom-left-radius: 10px;
       border-bottom-right-radius: 10px;
+      padding: 10px 0 10px 0;
       .searchBottomBack{
         position: fixed;
         z-index: -1;
@@ -45,31 +44,92 @@
         background: rgba(0,0,0,.7);
       }
       .searchItem{
-          font-size: 20px;
-          color: #9BA0AA;
-      }
-      .searchOperation{
-        display: flex;
-        flex-flow: row;
-        align-items: center;
-        font-size: 22px;
-        .reset{
-          flex: 1;
-          text-align: center;
-          padding: 25px 0;
-          border-bottom-left-radius: 10px;
-          background: white;
+          position: relative;
+          font-size: 25px;
+          color: #FFFFFF;
+        .shortValuecontent{
+          position: relative;
+          display: flex;
+          align-items: center;
+          width: 155px;
+          background: #6190E8;
+          border-radius: 100px;
+          padding: 10px 0;
+          margin-right: 5px;
+          .selectValue{
+            width: 110px;
+            padding-left: 15px;
+            white-space: nowrap;
+          }
+          .selectTitle{
+            padding-left: 15px;
+            white-space: nowrap;
+            width: 110px;
+          }
+          .iconContent{
+            width: 45px;
+            padding-right: 20px;
+            text-align: right;
+          }
+        }
+        .valuecontent{
+          position: relative;
+          display: flex;
+          align-items: center;
+          width: 190px;
+          background: #6190E8;
+          border-radius: 100px;
+          padding: 10px 0;
+          margin-right: 5px;
+          .selectValue{
+            padding-left: 15px;
+            width: 145px;
+            white-space: nowrap;
+          }
+          .selectTitle{
+            padding-left: 15px;
+            white-space: nowrap;
+            width: 145px;
+          }
+          .iconContent{
+            width: 45px;
+            padding-right: 20px;
+            text-align: right;
+          }
         }
-        .search{
-          flex:1;
-          background: #f8673c;
-          text-align: center;
-          color: white;
-          padding: 25px 0;
-          border-bottom-right-radius: 10px;
+        .searchSelectContent{
+          position: absolute;
+          right: 0;
+          top: 0;
+          bottom: 0;
+          z-index: 1;
+          width: 45px;
+          padding-right: 20px;
+          text-align: right;
+          display: flex;
+          justify-content: flex-end;
+          align-items: center;
+          padding-bottom: 3px;
+        }
+        .closeIcon{
+          background: #F00;
+          width: 60px;
+          height: 46px;
+          display: flex;
+          padding-left: 20px;
+          align-items: center;
         }
       }
     }
+    .searchBottomLOL{
+      position: fixed;
+      z-index: 1000;
+      top:0;
+      left: 0;
+      right: 0;
+      box-shadow: 0px 6px 27px 16px #8e8d8d;
+      background: #FFFFFF;
+    }
   }
   .list{
     padding: 20px 23px 52px 23px;

+ 2 - 2
src/utils/config.js

@@ -1,3 +1,3 @@
-// export const resourceAddress = 'http://172.16.0.188:3000/upload'
-export const resourceAddress = 'https://static.jishutao.com/upload';
+// export const resourceAddress = 'http://172.16.0.255:3000/upload'
+export const resourceAddress = 'https://s.jishutao.com/upload';
 

+ 2 - 2
src/utils/servers/baseUrl.js

@@ -2,10 +2,10 @@ const getBaseUrl = (url) => {
   let BASE_URL = '';
   if (process.env.NODE_ENV === 'development') {
     //开发环境 - 根据请求不同返回不同的BASE_URL
-    BASE_URL = 'https://uat.jishutao.com'
+    BASE_URL = 'https://bm.jishutao.com'
   } else {
     // 生产环境
-    BASE_URL = 'https://uat.jishutao.com'
+    BASE_URL = 'https://bm.jishutao.com'
   }
   return BASE_URL
 }