You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
119 lines
3.8 KiB
119 lines
3.8 KiB
import React, { useEffect, useState } from 'react'
|
|
import Taro, { useDidShow } from '@tarojs/taro'
|
|
import { View, Input, Picker, ScrollView } from '@tarojs/components'
|
|
import { AtButton, AtIcon } from 'taro-ui'
|
|
import { NoData } from '@/components/index'
|
|
import moment from 'moment'
|
|
import request from '@/services/request'
|
|
import { getRoadSpotList } from '@/services/api'
|
|
import './index.scss'
|
|
|
|
function Index() {
|
|
// const pageSize = 10
|
|
// const count = 0
|
|
// const [page, setPage] = useState(1)
|
|
const [startTime, setStartTime] = useState('')
|
|
const [endTime, setEndTime] = useState('')
|
|
const [roadSpotList, setRoadSpotList] = useState([])
|
|
|
|
useDidShow(() => {
|
|
getSpotList()
|
|
})
|
|
|
|
const getSpotList = () => {
|
|
request.get(`${getRoadSpotList()}?startTime=${startTime}&endTime=${endTime}`)
|
|
.then(res => {
|
|
if (res.statusCode === 200) {
|
|
setRoadSpotList(res.data)
|
|
}
|
|
})
|
|
}
|
|
|
|
const resetTime = () => {
|
|
setStartTime('')
|
|
setEndTime('')
|
|
}
|
|
|
|
const navigateTo = (url) => {
|
|
Taro.navigateTo({ url })
|
|
}
|
|
|
|
const onScrollToLower = (e) => {
|
|
console.log(e)
|
|
}
|
|
|
|
return (
|
|
<View className='page'>
|
|
<View className='flex spot-check-filter-box'>
|
|
<Picker
|
|
mode='date'
|
|
onChange={e => setStartTime(e.detail.value)}
|
|
>
|
|
<View className='flex'>
|
|
<AtIcon value='calendar' size='20' color='#999' />
|
|
<Input className='input' placeholder='开始日期' disabled value={startTime} />
|
|
</View>
|
|
</Picker>
|
|
<Picker
|
|
mode='date'
|
|
onChange={e => setEndTime(e.detail.value)}
|
|
>
|
|
<View className='flex'>
|
|
<AtIcon value='calendar' size='20' color='#999' />
|
|
<Input className='input' placeholder='结束日期' disabled value={endTime} />
|
|
</View>
|
|
</Picker>
|
|
<AtButton
|
|
type='primary'
|
|
size='small'
|
|
circle
|
|
onClick={getSpotList}
|
|
>查询</AtButton>
|
|
<AtButton
|
|
className='reset-bth'
|
|
type='secondary'
|
|
size='small'
|
|
circle
|
|
onClick={resetTime}
|
|
>重置</AtButton>
|
|
</View>
|
|
|
|
<ScrollView
|
|
className='scrollview'
|
|
scrollY
|
|
scrollWithAnimation
|
|
scrollTop={0}
|
|
onScrollToLower={onScrollToLower}
|
|
enhanced
|
|
pagingEnabled
|
|
>
|
|
{roadSpotList.length
|
|
? roadSpotList.map((item, index) => <View
|
|
key={item.id}
|
|
className='card'
|
|
onClick={() => navigateTo(`/packages/maintenanceSpotCheck/spotCheckRoad/index?item=${encodeURIComponent(JSON.stringify(item))}&isOld=${index !== 0}`)}
|
|
>
|
|
<View className='item'>抽查县道比例（%）：{item.countyPercentage}</View>
|
|
<View className='item'>抽查县道（公里）：{item.countryMil?.toFixed(3)}</View>
|
|
<View className='item'>抽查乡道（公里）：{item.townMil?.toFixed(3)}</View>
|
|
<View className='item'>抽查村道（公里）：{item.villageMil?.toFixed(3)}</View>
|
|
<View className='item'>抽查日期：{moment(item.date).format('YYYY-MM-DD')}</View>
|
|
</View>)
|
|
: <View style={{ paddingTop: 100 }}><NoData /></View>}
|
|
</ScrollView>
|
|
{roadSpotList.length && !roadSpotList[0].abstractFinish
|
|
? <AtButton
|
|
className='to-start-btn'
|
|
type='primary'
|
|
onClick={() => navigateTo(`/packages/maintenanceSpotCheck/startSpotCheck/index?item=${encodeURIComponent(JSON.stringify(roadSpotList[0]))}`)}
|
|
>继续抽查</AtButton>
|
|
: <AtButton
|
|
className='to-start-btn'
|
|
type='primary'
|
|
onClick={() => navigateTo('/packages/maintenanceSpotCheck/startSpotCheck/index')}
|
|
>发起抽查</AtButton>}
|
|
</View>
|
|
)
|
|
}
|
|
|
|
export default Index
|