index.jsx 9.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295
  1. import React, { Component } from 'react';
  2. import Taro from '@tarojs/taro';
  3. import { View, Picker, ScrollView, } from '@tarojs/components'
  4. import { AtTabs, AtTabsPane, AtIcon, AtSearchBar } from 'taro-ui';
  5. import { getRecordList, getNewRecordList } from '../../utils/servers/servers';
  6. import dayjs from 'dayjs';
  7. import { getAccountName, getSecondaryAccountName, removeNull } from '../../utils/tools';
  8. import { accountLtate, } from '../../utils/tools/config'
  9. import ListBottomStart from "../../components/common/listBottomStart";
  10. import AuditModal from "../../components/common/auditModal";
  11. import './index.less';
  12. import 'taro-ui/dist/style/components/tabs.scss';
  13. import "taro-ui/dist/style/components/flex.scss";
  14. import "taro-ui/dist/style/components/action-sheet.scss";
  15. import "taro-ui/dist/style/components/icon.scss";
  16. import "taro-ui/dist/style/components/list.scss";
  17. import "taro-ui/dist/style/components/icon.scss";
  18. import "taro-ui/dist/style/components/modal.scss";
  19. class Examine extends Component {
  20. constructor(props) {
  21. super(props);
  22. this.state = {
  23. typeList: [
  24. { title: '未审核' },
  25. { title: '已审核' }],
  26. current: 0,
  27. starts: {},
  28. list: [],
  29. visible: false,
  30. searchType: { title: "按编号", id: 0 },
  31. search: [
  32. { title: "按编号", id: 0 },
  33. { title: "按企业名称", id: 1 },
  34. ]
  35. }
  36. }
  37. componentDidShow() {
  38. this.setState({
  39. visible: false,
  40. })
  41. this.getPublicReleaseList();
  42. }
  43. // async componentDidMount() {
  44. // await this.getPublicReleaseList();
  45. // }
  46. onPullDownRefresh() {
  47. this.getPublicReleaseList();
  48. }
  49. onReachBottom() {
  50. this.getPublicReleaseList(true);
  51. }
  52. onTabItemTap(obj) {
  53. if (obj.index === 1) {
  54. this.onTabTap();
  55. }
  56. }
  57. onPickerHide() {
  58. this.setState({
  59. isPickerRender: false,
  60. });
  61. }
  62. async onSetPickerTime(val) {
  63. let data = val.detail;
  64. await this.setState({
  65. rangeStartMinuteVal: dayjs(data.selectStartTime).format("YYYY-MM-DD"),
  66. rangeEndMinuteVal: dayjs(data.selectEndTime).format("YYYY-MM-DD")
  67. })
  68. await this.getMyList(1);
  69. }
  70. async onTabTap() {
  71. await this.getMyList(1);
  72. }
  73. async getPublicReleaseList(lv) {
  74. await this.getMyList(lv ? this.state.pageNo + 1 : 1);
  75. Taro.stopPullDownRefresh();
  76. }
  77. async getMyList(pageNo) {
  78. this.setState({
  79. listState: 'LOADING'
  80. })
  81. let data = {
  82. pageNo: pageNo,
  83. pageSize: 10,
  84. // startTime: this.state.rangeStartMinuteVal || undefined,
  85. // endTime: this.state.rangeEndMinuteVal || undefined,
  86. listStatus: this.state.current,
  87. processStatus: 1,
  88. // checkNo: this.state.searchValue,
  89. username: this.state.searchType.id == 1 ? this.state.searchValue : undefined,
  90. checkNo: this.state.searchType.id == 0 ? this.state.searchValue : undefined,
  91. }
  92. let msg = await getNewRecordList(removeNull(data));
  93. if (msg.error.length === 0) {
  94. if (msg.data.totalCount === 0) {
  95. this.setState({
  96. listState: 'NO_DATA'
  97. })
  98. } else if (msg.data.totalCount === this.state.list.length && pageNo !== 1) {
  99. Taro.showToast({ title: '没有更多数据了', icon: 'none' });
  100. this.setState({
  101. listState: 'NO_MORE_DATA'
  102. })
  103. } else {
  104. if (msg.data.totalCount === (pageNo === 1 ? msg.data.list : this.state.list.concat(msg.data.list)).length) {
  105. this.setState({
  106. listState: 'NO_MORE_DATA'
  107. })
  108. }
  109. }
  110. this.setState({
  111. list: pageNo === 1 ? msg.data.list : this.state.list.concat(msg.data.list),
  112. pageNo: msg.data.list.length === 0 ? this.state.pageNo : msg.data.pageNo
  113. })
  114. } else {
  115. Taro.showToast({ title: msg.error[0].message, icon: 'none' });
  116. this.setState({
  117. listState: msg.error[0].field === '403' ? 'NO_DATA' : 'RELOAD'
  118. })
  119. }
  120. Taro.stopPullDownRefresh();
  121. }
  122. onPageScroll(event) {
  123. let touchMove = event.scrollTop;
  124. if (touchMove >= 37) {
  125. this.setState({
  126. openSearch: true
  127. })
  128. } else {
  129. this.setState({
  130. openSearch: false
  131. })
  132. }
  133. }
  134. render() {
  135. const { list, searchType, search } = this.state
  136. return (
  137. <View className='indexPage' >
  138. <View className='searchContent'>
  139. <View className='searchTop'>
  140. <Picker
  141. value={searchType.id}
  142. range={search} rangeKey='title' mode='selector'
  143. onChange={(e) => {
  144. this.setState({
  145. searchType: search[e.detail.value],
  146. })
  147. }}>
  148. <View className='shortValuecontent'>
  149. <View className='selectTitle'>{searchType.title}</View>
  150. <View className='iconContent'><AtIcon value='chevron-down' size='10' color='#FFFFFF' /></View>
  151. </View>
  152. </Picker>
  153. <AtSearchBar
  154. showActionButton
  155. placeholder='请输入'
  156. value={this.state.searchValue}
  157. onActionClick={() => {
  158. this.getPublicReleaseList();
  159. }}
  160. onChange={(value) => {
  161. this.setState({
  162. searchValue: value
  163. })
  164. }}
  165. onClear={() => {
  166. this.setState({
  167. searchValue: ''
  168. })
  169. }}
  170. />
  171. </View>
  172. </View>
  173. <AtTabs
  174. swipeable={false}
  175. current={this.state.current || 0}
  176. tabList={this.state.typeList}
  177. onClick={(current) => {
  178. this.setState({
  179. list: [],
  180. pageNo: 1,
  181. current,
  182. }, () => {
  183. this.getPublicReleaseList();
  184. })
  185. }}>
  186. {
  187. this.state.typeList?.map((item, index) =>
  188. <AtTabsPane
  189. current={this.state.current}
  190. index={index}
  191. >
  192. <View className='list'>
  193. {
  194. list?.map((item) =>
  195. <View className='item' key={item.id}
  196. onClick={() => {
  197. Taro.navigateTo({
  198. url: '/pages/mergedetail/index?id=' + item.id
  199. })
  200. }}
  201. >
  202. {/* {item.status == 1 && <View className='lbt' onClick={e => { e.stopPropagation(); this.setState({ visible: true, id: item.id }) }}>查看审核详情</View>} */}
  203. <View className='line' style={{ color: "#6190E8" }}>报销编号:{item.checkNo}</View>
  204. <View className='line' style={{ color: "#6190E8" }}>总金额:{item.realAmount}元</View>
  205. <View className='line'>报销人:{item.aname}</View>
  206. <View className='line'>报销部门:{item.applyDepName}</View>
  207. <View className='line'>报销时间:{item.createTimeStr}</View>
  208. <View className='lis'></View>
  209. {
  210. item.sonList?.map((it) =>
  211. <View key={it.id} style={{ marginTop: 10 }}>
  212. <View className='line'>报销金额(元):{it.amount}</View>
  213. <View className='line'>报销类型:
  214. {getAccountName(it.type, it.typeOther)}
  215. {it.type == 2 && (" - " + getSecondaryAccountName(it.secondaryType, it.secondaryTypeOther))}
  216. </View>
  217. {it.type == 1 && <View className='line'>公出企业:{it.userNames}</View>}
  218. <View className='line'>{it.type == 1 ? "公出时间" : "费用时间"}:
  219. {!it.releaseStart ? "" : (it.releaseStart.slice(0, 10) + " 至 " + it.releaseEnd.slice(0, 10))}
  220. </View>
  221. </View>
  222. )
  223. }
  224. <View className='lines'
  225. style={{ color: accountLtate[item.status].color }}
  226. >{item.status == 1 && `[${item.examineName}]`}{accountLtate[item.status].title}</View>
  227. </View>
  228. )
  229. }
  230. <ListBottomStart
  231. state={this.state.listState}
  232. reload={() => {
  233. this.getPublicReleaseList(true)
  234. }}
  235. />
  236. </View>
  237. </AtTabsPane>
  238. )
  239. }
  240. </AtTabs>
  241. <timePicker
  242. config={{
  243. endDate: true,
  244. column: "day",
  245. dateLimit: false,
  246. limitStartTime: dayjs().subtract(3, 'year').format('YYYY-MM-DD '),
  247. limitEndTime: dayjs().add(3, 'year').format('YYYY-MM-DD ')
  248. }}
  249. isPartition
  250. pickerShow={this.state.isPickerRender}
  251. onconditionaljudgment={(v) => {
  252. }}
  253. onhidepicker={() => {
  254. this.onPickerHide()
  255. }}
  256. onsetpickertime={(v) => {
  257. this.onSetPickerTime(v)
  258. }}>
  259. </timePicker>
  260. {/* 审核详情 */}
  261. {this.state.visible &&
  262. <AuditModal
  263. id={this.state.id}
  264. isOpened={this.state.visible}
  265. onClose={() => {
  266. this.setState({
  267. visible: false
  268. })
  269. }}
  270. />}
  271. </View >
  272. )
  273. }
  274. }
  275. export default Examine