|
@@ -2,28 +2,24 @@ import React, { Component } from 'react'
|
|
|
import { connect } from 'react-redux'
|
|
|
import { Map, OpenData, View, Image, Text, Button } from '@tarojs/components'
|
|
|
import Taro from '@tarojs/taro';
|
|
|
-import { AtIcon, AtModal, AtModalContent, AtModalAction, AtTextarea } from "taro-ui";
|
|
|
+import { AtIcon, AtModal, AtModalHeader, AtModalContent, AtModalAction, AtTextarea, AtRadio, AtList } from "taro-ui";
|
|
|
import dayjs from 'dayjs';
|
|
|
import Skeleton from 'taro-skeleton'
|
|
|
-
|
|
|
import HistoricalClock from '../../components/historicalClock';
|
|
|
-
|
|
|
import ImagePicker from '../../components/common/imagePicker';
|
|
|
-
|
|
|
import { add, minus, asyncAdd } from '../../actions/counter'
|
|
|
-
|
|
|
-import { getPublicReleaseList, publicReleaseClockIn, getPunchClockInfo } from '../../utils/servers/servers';
|
|
|
-
|
|
|
+import { getPublicReleaseList, publicReleaseClockIn, getPunchClockInfo, getReleasetDails } from '../../utils/servers/servers';
|
|
|
import './index.less'
|
|
|
-
|
|
|
import switchIocn from '../../image/switch.png';
|
|
|
import Location from '../../image/location.png';
|
|
|
import PunchRange from '../../image/punchRange.png';
|
|
|
-
|
|
|
import 'taro-ui/dist/style/components/noticebar.scss';
|
|
|
import 'taro-ui/dist/style/components/icon.scss';
|
|
|
import 'taro-ui/dist/style/components/list.scss';
|
|
|
-import { getClockState } from "../../utils/tools";
|
|
|
+import "taro-ui/dist/style/components/radio.scss";
|
|
|
+import "taro-ui/dist/style/components/icon.scss";
|
|
|
+
|
|
|
+import { getClockState, getNewOptions } from "../../utils/tools";
|
|
|
|
|
|
const QQMapWX = require('../../components/common/mapSDK/qqmap-wx-jssdk.min.js');
|
|
|
|
|
@@ -52,6 +48,7 @@ class PunchClocks extends Component {
|
|
|
addressLongitude: '',
|
|
|
distance: '',
|
|
|
dtails: {},
|
|
|
+ data: {},
|
|
|
loading: true,
|
|
|
isAbnormalOpen: false,
|
|
|
clockInRemarks: "",//打卡说明
|
|
@@ -63,6 +60,8 @@ class PunchClocks extends Component {
|
|
|
this.abnormalClockIn = this.abnormalClockIn.bind(this);
|
|
|
this.refresh = this.refresh.bind(this);
|
|
|
this.getDtails = this.getDtails.bind(this);
|
|
|
+ this.selectArrder = this.selectArrder.bind(this);
|
|
|
+ this.selectOn = this.selectOn.bind(this);
|
|
|
}
|
|
|
|
|
|
nowTime = null;
|
|
@@ -79,6 +78,44 @@ class PunchClocks extends Component {
|
|
|
this.getDtails();
|
|
|
}
|
|
|
|
|
|
+ selectOn() {
|
|
|
+ const { dtails, selectUid } = this.state
|
|
|
+ if (!selectUid) {
|
|
|
+ Taro.showToast({ title: '请选择您要打卡的企业', icon: 'none' });
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let list = dtails.prdList
|
|
|
+ for (var i = 0; i < list.length; i++) {
|
|
|
+ if (list[i].uid == selectUid) {
|
|
|
+ this.setState({
|
|
|
+ data: list[i],
|
|
|
+ addressLatitude: parseFloat(list[i].latitude),
|
|
|
+ addressLongitude: parseFloat(list[i].longitude),
|
|
|
+ isTips: false,
|
|
|
+ selectUid: "",
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ selectArrder() {
|
|
|
+ const { dtails, data } = this.state
|
|
|
+ this.props.getId(dtails.id, data.uid)
|
|
|
+ this.props.getHome()
|
|
|
+ const key = "AWBBZ-GRAC2-JFYUO-CLA7I-JAHXK-YFFGT"; //使用在腾讯位置服务申请的key
|
|
|
+ const referer = "科德打卡定位"; //调用插件的app的名称
|
|
|
+ const category = "公司企业,房产小区";
|
|
|
+ Taro.navigateTo({
|
|
|
+ url:
|
|
|
+ "plugin://chooseLocation/index?key=" +
|
|
|
+ key +
|
|
|
+ "&referer=" +
|
|
|
+ referer +
|
|
|
+ "&category=" +
|
|
|
+ category,
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
getDtails() {
|
|
|
this.getData(() => {
|
|
|
Taro.startLocationUpdate({
|
|
@@ -145,25 +182,45 @@ class PunchClocks extends Component {
|
|
|
})
|
|
|
|
|
|
Taro.eventCenter.on('GoPunchIn', (arg) => {
|
|
|
- this.setState({
|
|
|
- dtails: arg,
|
|
|
- addressLatitude: parseFloat(arg.latitude),
|
|
|
- addressLongitude: parseFloat(arg.longitude),
|
|
|
- }, () => {
|
|
|
- Taro.showToast({ title: '切换成功' });
|
|
|
- Taro.startLocationUpdate({
|
|
|
- success: () => {
|
|
|
- Taro.onLocationChange((v) => {
|
|
|
- this.getSpacing(v.latitude, v.longitude)
|
|
|
- })
|
|
|
- },
|
|
|
- fail: () => {
|
|
|
+ getReleasetDails({
|
|
|
+ id: arg.id,
|
|
|
+ }).then((v) => {
|
|
|
+ if (v.error.length === 0) {
|
|
|
+ if (v.data) {
|
|
|
+ if (!v.data.prdList) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let data = v.data.prdList[0]
|
|
|
this.setState({
|
|
|
- loading: false
|
|
|
+ dtails: v.data,
|
|
|
+ data,
|
|
|
+ // addressLatitude: parseFloat(arg.latitude),
|
|
|
+ // addressLongitude: parseFloat(arg.longitude),
|
|
|
+ addressLatitude: parseFloat(data.latitude),
|
|
|
+ addressLongitude: parseFloat(data.longitude),
|
|
|
+ }, () => {
|
|
|
+ Taro.showToast({ title: '切换成功' });
|
|
|
+ Taro.startLocationUpdate({
|
|
|
+ success: () => {
|
|
|
+ Taro.onLocationChange((v) => {
|
|
|
+ this.getSpacing(v.latitude, v.longitude)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ fail: () => {
|
|
|
+ this.setState({
|
|
|
+ loading: false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
})
|
|
|
+ } else {
|
|
|
}
|
|
|
- })
|
|
|
- })
|
|
|
+ } else {
|
|
|
+ Taro.showToast({ title: v.error[0].message, icon: "none" });
|
|
|
+ }
|
|
|
+ }).catch((err) => {
|
|
|
+ Taro.showToast({ title: "系统错误,请稍后再试", icon: "none" });
|
|
|
+ });
|
|
|
})
|
|
|
}
|
|
|
|
|
@@ -171,8 +228,10 @@ class PunchClocks extends Component {
|
|
|
Taro.offLocationChange();
|
|
|
this.nowTime && this.nowTime.clearTimeout();
|
|
|
}
|
|
|
+
|
|
|
// 正常打卡
|
|
|
- publicReleaseClockIn() {
|
|
|
+ publicReleaseClockIn(uid) {
|
|
|
+
|
|
|
if (this.state.dtails.status === 3) {
|
|
|
Taro.hideLoading()
|
|
|
Taro.showToast({ title: '申请已撤销,无法打卡', icon: 'none' });
|
|
@@ -203,18 +262,20 @@ class PunchClocks extends Component {
|
|
|
Taro.showToast({ title: '请上传打卡照片', icon: 'none' })
|
|
|
return;
|
|
|
}
|
|
|
+
|
|
|
publicReleaseClockIn({
|
|
|
id: this.state.dtails.id,
|
|
|
photoUrl: this.state.imgs.join(','),
|
|
|
clockIn: 1,
|
|
|
+ uid: this.state.data.uid,
|
|
|
}).then(v => {
|
|
|
Taro.hideLoading()
|
|
|
if (v.error.length === 0) {
|
|
|
Taro.showToast({ title: '打卡成功', icon: 'none' });
|
|
|
this.imagePicker.clear();
|
|
|
- this.state.dtails.clockIn = 1;
|
|
|
+ this.state.data.clockIn = 1;
|
|
|
this.setState({
|
|
|
- dtails: this.state.dtails,
|
|
|
+ data: this.state.data,
|
|
|
imgs: []
|
|
|
})
|
|
|
} else {
|
|
@@ -245,9 +306,9 @@ class PunchClocks extends Component {
|
|
|
if (v.error.length === 0) {
|
|
|
Taro.showToast({ title: '打卡成功', icon: 'none' });
|
|
|
this.imagePicker.clear();
|
|
|
- this.state.dtails.clockIn = 2;
|
|
|
+ this.state.data.clockIn = 2;
|
|
|
this.setState({
|
|
|
- dtails: this.state.dtails,
|
|
|
+ data: this.state.data,
|
|
|
imgs: [],
|
|
|
clockInRemarks: "",
|
|
|
isAbnormalOpen: false,
|
|
@@ -263,6 +324,7 @@ class PunchClocks extends Component {
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
+
|
|
|
getData(fn) {
|
|
|
this.setState({
|
|
|
loading: true
|
|
@@ -273,16 +335,19 @@ class PunchClocks extends Component {
|
|
|
loading: false
|
|
|
})
|
|
|
if (v.data) {
|
|
|
+ let data = v.data.prdList[0]
|
|
|
this.setState({
|
|
|
dtails: v.data,
|
|
|
- addressLatitude: v.data.latitude,
|
|
|
- addressLongitude: v.data.longitude,
|
|
|
+ data,
|
|
|
+ addressLatitude: data.latitude,
|
|
|
+ addressLongitude: data.longitude,
|
|
|
}, () => {
|
|
|
fn();
|
|
|
})
|
|
|
} else {
|
|
|
this.setState({
|
|
|
dtails: {},
|
|
|
+ data: {},
|
|
|
})
|
|
|
}
|
|
|
} else {
|
|
@@ -354,7 +419,7 @@ class PunchClocks extends Component {
|
|
|
}
|
|
|
|
|
|
render() {
|
|
|
- const { dtails } = this.state;
|
|
|
+ const { dtails, data } = this.state;
|
|
|
return (
|
|
|
<View className='punchClock'>
|
|
|
<View className='header'>
|
|
@@ -373,21 +438,21 @@ class PunchClocks extends Component {
|
|
|
<View className='infor'>
|
|
|
<View className='name'>
|
|
|
{
|
|
|
- Object.keys(this.state.dtails).length <= 0 ?
|
|
|
+ Object.keys(dtails).length <= 0 ?
|
|
|
Taro.getStorageSync('userInfor').name :
|
|
|
dtails.aname
|
|
|
}
|
|
|
</View>
|
|
|
- <View className='address'>
|
|
|
+ {/* <View className='address'>
|
|
|
公出企业:
|
|
|
<View className='nickname'>
|
|
|
{
|
|
|
- Object.keys(this.state.dtails).length <= 0 ?
|
|
|
+ Object.keys(dtails).length <= 0 ?
|
|
|
'无' :
|
|
|
- dtails.nickname
|
|
|
+ dtails.userNames
|
|
|
}
|
|
|
</View>
|
|
|
- </View>
|
|
|
+ </View> */}
|
|
|
<View className='types'
|
|
|
style={{ color: ["#1D4FEA", "#1E90FF", "#FF5500", "red"][dtails.type] }}
|
|
|
>
|
|
@@ -454,6 +519,19 @@ class PunchClocks extends Component {
|
|
|
</View> :
|
|
|
<View>
|
|
|
<View className='content'>
|
|
|
+ <View className="enterprise">
|
|
|
+ <View className='entit'>公出企业</View>
|
|
|
+ <View className='userlist'>
|
|
|
+ <Text className='username'>{data.userName}</Text>
|
|
|
+ {
|
|
|
+ this.state.dtails.prdList?.length > 1 &&
|
|
|
+ <View className='switch'>
|
|
|
+ <View className='stxt' onClick={() => { this.setState({ isTips: true }) }}>切换企业</View>
|
|
|
+ <Image src={switchIocn} className='sicon' />
|
|
|
+ </View>
|
|
|
+ }
|
|
|
+ </View>
|
|
|
+ </View>
|
|
|
<View className='timeContent'>
|
|
|
<View className='timeItem'>
|
|
|
<View className='timeTitle'>公出开始时间</View>
|
|
@@ -488,7 +566,7 @@ class PunchClocks extends Component {
|
|
|
false &&
|
|
|
<View
|
|
|
className="photographUnusual"
|
|
|
- style={{ background: dtails.clockIn === 1 ? "#f69c9f" : "red" }}
|
|
|
+ style={{ background: data.clockIn === 1 ? "#f69c9f" : "red" }}
|
|
|
onClick={() => {
|
|
|
if (this.state.imgs.length === 0) {
|
|
|
Taro.hideLoading()
|
|
@@ -499,8 +577,9 @@ class PunchClocks extends Component {
|
|
|
isAbnormalOpen: true
|
|
|
})
|
|
|
}}
|
|
|
- >{(dtails.clockIn === 1 || dtails.clockIn === 2) ? "刷新打卡" : "异常打卡"}</View>
|
|
|
+ >{(data.clockIn === 1 || data.clockIn === 2) ? "刷新打卡" : "异常打卡"}</View>
|
|
|
}
|
|
|
+
|
|
|
<View className='punchClockContent'
|
|
|
onClick={() => {
|
|
|
let _this = this;
|
|
@@ -532,23 +611,31 @@ class PunchClocks extends Component {
|
|
|
&& this.state.distance <= this.wxConfig.clockInRange && this.state.distance >= 0 &&
|
|
|
!(dayjs().isBefore(this.state.dtails.releaseStarts) || dayjs().isAfter(this.state.dtails.releaseEnds)) &&
|
|
|
dtails.status !== 3
|
|
|
- ? ((dtails.clockIn === 1 && dtails.clockIn === 2) ? '1px 1px 15px 1px #3f82e8' : '1px 1px 15px 1px #659268') : '1px 1px 15px 1px #828e83',
|
|
|
+ ? ((data.clockIn === 1 || data.clockIn === 2) ? '1px 1px 15px 1px #3f82e8' : '1px 1px 15px 1px #72cb78') : '1px 1px 15px 1px #828e83',
|
|
|
background: (!isNaN(parseInt(this.state.distance)))
|
|
|
&&
|
|
|
this.state.distance <= this.wxConfig.clockInRange &&
|
|
|
this.state.distance >= 0 &&
|
|
|
!(dayjs().isBefore(this.state.dtails.releaseStarts) || dayjs().isAfter(this.state.dtails.releaseEnds)) &&
|
|
|
dtails.status !== 3
|
|
|
- ? ((dtails.clockIn === 1 && dtails.clockIn === 2) ? '#3f82e8' : '#72cb78') : '#828e83'
|
|
|
+ ? ((data.clockIn === 1 || data.clockIn === 2) ? '#3f82e8' : '#72cb78') : '#828e83'
|
|
|
}}>
|
|
|
<View className='punchClockTitle'>
|
|
|
{
|
|
|
- (dtails.clockIn === 1 || dtails.clockIn === 2) ?
|
|
|
+ (data.clockIn === 1 || data.clockIn === 2) ?
|
|
|
'刷新打卡' : '公出打卡'
|
|
|
}
|
|
|
</View>
|
|
|
<View className='punchClockTime'>{this.state.nowTime}</View>
|
|
|
</View>
|
|
|
+
|
|
|
+ {
|
|
|
+ !(this.state.distance <= this.wxConfig.clockInRange && this.state.distance >= 0) &&
|
|
|
+ <View className='switchposition'>您不在打卡范围:
|
|
|
+ <Text className='stxt' onClick={this.selectArrder}>切换位置</Text>
|
|
|
+ </View>
|
|
|
+ }
|
|
|
+
|
|
|
<View className='map'>
|
|
|
<View className='locationContent'>
|
|
|
<View className='location' onClick={() => {
|
|
@@ -658,7 +745,8 @@ class PunchClocks extends Component {
|
|
|
</AtModalAction>
|
|
|
</AtModal>
|
|
|
}
|
|
|
- {this.state.historicalIsOpened &&
|
|
|
+ {
|
|
|
+ this.state.historicalIsOpened &&
|
|
|
<HistoricalClock
|
|
|
id={dtails.id}
|
|
|
isOpened={this.state.historicalIsOpened}
|
|
@@ -667,7 +755,25 @@ class PunchClocks extends Component {
|
|
|
historicalIsOpened: false
|
|
|
})
|
|
|
}}
|
|
|
- />}
|
|
|
+ />
|
|
|
+ }
|
|
|
+ {
|
|
|
+ this.state.isTips &&
|
|
|
+ <AtModal isOpened={this.state.isTips}>
|
|
|
+ <AtModalHeader>请选择</AtModalHeader>
|
|
|
+ <AtModalContent>
|
|
|
+ <AtRadio
|
|
|
+ options={getNewOptions(dtails.prdList)}
|
|
|
+ value={this.state.selectUid}
|
|
|
+ onClick={e => { this.setState({ selectUid: e }) }}
|
|
|
+ />
|
|
|
+ </AtModalContent>
|
|
|
+ <AtModalAction>
|
|
|
+ <Button type='secondary' onClick={() => { this.setState({ isTips: false }) }}>取消</Button>
|
|
|
+ <Button type='primary' onClick={this.selectOn}>确定</Button>
|
|
|
+ </AtModalAction>
|
|
|
+ </AtModal>
|
|
|
+ }
|
|
|
</View>
|
|
|
)
|
|
|
}
|