index.jsx 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609
  1. import React, { Component } from 'react';
  2. import Taro from '@tarojs/taro';
  3. import { View, Picker, ScrollView, Button } from '@tarojs/components'
  4. import { getPublicReleaseList, techReject, getReleasetDails } from '../../utils/servers/servers';
  5. import dayjs from 'dayjs';
  6. import {
  7. AtSearchBar,
  8. AtTabs,
  9. AtTabsPane,
  10. AtIcon,
  11. AtModal,
  12. AtModalContent,
  13. AtModalAction,
  14. AtTextarea
  15. } from 'taro-ui';
  16. import { clockState } from '../../utils/tools/config';
  17. import './index.less';
  18. import 'taro-ui/dist/style/components/tabs.scss';
  19. import "taro-ui/dist/style/components/flex.scss";
  20. import "taro-ui/dist/style/components/action-sheet.scss";
  21. import "taro-ui/dist/style/components/icon.scss";
  22. import "taro-ui/dist/style/components/list.scss";
  23. import "taro-ui/dist/style/components/icon.scss";
  24. import "taro-ui/dist/style/components/modal.scss";
  25. import MyList from '../project/myList';
  26. import MessageNoticebar from "../../components/common/messageNoticebar";
  27. import InquiryModal from "../../components/common/inquiryModal";
  28. import PublicContent from "../egressDetails/publicContent";
  29. import { resourceAddress } from "../../utils/config";
  30. class Examine extends Component {
  31. constructor(props) {
  32. super(props);
  33. this.state = {
  34. typeList: [
  35. { title: '我的公出' },
  36. { title: '我的协单' }],
  37. current: 0,
  38. isPickerRender: false,
  39. validDates: '',
  40. list: [],
  41. pageNo: 1,
  42. listState: 'LOADING',
  43. starts: {},
  44. clockInStarts: '',
  45. rangeEndVal: '',
  46. rangeStartVal: '',
  47. rangeEndMinuteVal: '',
  48. rangeStartMinuteVal: '',
  49. id: "",
  50. rmk: "",
  51. isOpen: false,
  52. coorder: [
  53. { title: '协单助手', type: 3 },
  54. { title: '技术协单', type: 2 },
  55. { title: '全部', type: 4 }],
  56. selcotype: 4,
  57. }
  58. this.getPublicReleaseList = this.getPublicReleaseList.bind(this);
  59. this.getMyList = this.getMyList.bind(this);
  60. this.onSetPickerTime = this.onSetPickerTime.bind(this);
  61. this.onPickerHide = this.onPickerHide.bind(this);
  62. this.getReleasetDails = this.getReleasetDails.bind(this);
  63. }
  64. componentDidShow() {
  65. Taro.eventCenter.on('listOperation', (data) => {
  66. if (!isNaN(parseInt(data.index))) {
  67. let arr = this.state.list.concat([]);
  68. arr[data.index] = {
  69. ...arr[data.index],
  70. ...data
  71. }
  72. this.setState({
  73. list: arr
  74. })
  75. }
  76. })
  77. //获取地区选定数据
  78. const chooseLocation = requirePlugin("chooseLocation");
  79. const location = chooseLocation.getLocation();
  80. if (location) {
  81. this.setState({
  82. selectArrderLocation: location,
  83. });
  84. }
  85. this.getPublicReleaseList();
  86. }
  87. async componentDidMount() {
  88. await this.getPublicReleaseList();
  89. }
  90. onPullDownRefresh() {
  91. this.getPublicReleaseList();
  92. }
  93. onReachBottom() {
  94. this.getPublicReleaseList(true);
  95. }
  96. onTabItemTap(obj) {
  97. if (obj.index === 1) {
  98. this.onTabTap();
  99. }
  100. }
  101. onPickerHide() {
  102. this.setState({
  103. isPickerRender: false,
  104. });
  105. }
  106. // 公出详情
  107. getReleasetDails(id) {
  108. getReleasetDails({
  109. id: id
  110. }).then((v) => {
  111. if (v.error.length === 0) {
  112. if (v.data) {
  113. let list = [];
  114. for (let i of v.data.annexUrl.split(",")) {
  115. if (i) {
  116. list.push({ url: resourceAddress + i });
  117. }
  118. }
  119. v.data.annexUrl = list;
  120. this.setState({
  121. dtails: v.data,
  122. selectArrderLocation: {
  123. longitude: parseFloat(v.data.prdList[0]?.longitude),
  124. latitude: parseFloat(v.data.prdList[0]?.latitude),
  125. name: v.data.prdList[0]?.districtName,
  126. },
  127. })
  128. }
  129. } else {
  130. Taro.showToast({ title: v.error[0].message, icon: "none" });
  131. }
  132. }).catch((err) => {
  133. // Taro.showToast({ title: "系统错误,请稍后再试", icon: "none" });
  134. });
  135. }
  136. async onSetPickerTime(val) {
  137. let data = val.detail;
  138. await this.setState({
  139. rangeStartMinuteVal: dayjs(data.selectStartTime).format("YYYY-MM-DD"),
  140. rangeEndMinuteVal: dayjs(data.selectEndTime).format("YYYY-MM-DD")
  141. })
  142. await this.getMyList(1);
  143. }
  144. async onTabTap() {
  145. await this.getMyList(1);
  146. }
  147. async getPublicReleaseList(lv) {
  148. await this.getMyList(lv ? this.state.pageNo + 1 : 1);
  149. Taro.stopPullDownRefresh();
  150. }
  151. async getMyList(pageNo) {
  152. this.setState({
  153. listState: 'LOADING'
  154. })
  155. let data = {
  156. pageNo: pageNo,
  157. pageSize: 10,
  158. type: '0',
  159. assist: this.state.current === 0 ? 0 : this.state.selcotype,
  160. releaseStarts: this.state.rangeStartMinuteVal || undefined,
  161. releaseEnds: this.state.rangeEndMinuteVal || undefined,
  162. status: isNaN(parseInt(this.state.starts.id)) ? undefined : String(this.state.starts.id),
  163. clockIn: this.state.clockInStarts || undefined,
  164. userName: this.state.searchValue || undefined,
  165. }
  166. for (let i in data) {
  167. if (!data[i]) {
  168. delete data[i]
  169. }
  170. }
  171. let msg = await getPublicReleaseList(data);
  172. if (msg.error.length === 0) {
  173. if (msg.data.totalCount === 0) {
  174. this.setState({
  175. listState: 'NO_DATA'
  176. })
  177. } else if (msg.data.totalCount === this.state.list.length && pageNo !== 1) {
  178. // 防止提示挡住驳回弹窗
  179. !this.state.isOpen && Taro.showToast({ title: '没有更多数据了', icon: 'none' });
  180. this.setState({
  181. listState: 'NO_MORE_DATA'
  182. })
  183. } else {
  184. if (msg.data.totalCount === (pageNo === 1 ? msg.data.list : this.state.list.concat(msg.data.list)).length) {
  185. this.setState({
  186. listState: 'NO_MORE_DATA'
  187. })
  188. }
  189. }
  190. this.setState({
  191. list: pageNo === 1 ? msg.data.list : this.state.list.concat(msg.data.list),
  192. pageNo: msg.data.list.length === 0 ? this.state.pageNo : msg.data.pageNo
  193. })
  194. } else {
  195. Taro.showToast({ title: msg.error[0].message, icon: 'none' });
  196. this.setState({
  197. listState: msg.error[0].field === '403' ? 'NO_DATA' : 'RELOAD'
  198. })
  199. }
  200. Taro.stopPullDownRefresh();
  201. }
  202. onPageScroll(event) {
  203. let touchMove = event.scrollTop;
  204. if (touchMove >= 37) {
  205. this.setState({
  206. openSearch: true
  207. })
  208. } else {
  209. this.setState({
  210. openSearch: false
  211. })
  212. }
  213. }
  214. submit() {
  215. if (!this.state.rmk) {
  216. Taro.showToast({ title: '请填写备注!', icon: 'none' });
  217. return
  218. }
  219. Taro.showLoading({ title: '正在提交...' });
  220. techReject({
  221. id: this.state.id,
  222. remarks: this.state.rmk,
  223. }).then(v => {
  224. Taro.hideLoading()
  225. if (v.error.length === 0) {
  226. Taro.showToast({ title: '提交成功', icon: 'none' });
  227. this.getPublicReleaseList();
  228. this.setState({
  229. isOpen: false,
  230. rmk: "",
  231. })
  232. } else {
  233. Taro.showToast({ title: v.error[0].message, icon: 'none' })
  234. }
  235. }).catch(() => {
  236. Taro.hideLoading()
  237. Taro.showToast({
  238. title: '系统错误,请稍后再试',
  239. icon: 'none'
  240. })
  241. })
  242. }
  243. render() {
  244. return (
  245. <View className='indexPage' >
  246. <MessageNoticebar />
  247. <View className='searchContent'>
  248. <View className='searchTop'>
  249. <AtSearchBar
  250. showActionButton
  251. placeholder='请输入企业/渠道'
  252. value={this.state.searchValue}
  253. onActionClick={() => {
  254. this.getPublicReleaseList();
  255. }}
  256. onChange={(value) => {
  257. this.setState({
  258. searchValue: value
  259. })
  260. }}
  261. onClear={() => {
  262. this.setState({
  263. searchValue: ''
  264. })
  265. }}
  266. />
  267. </View>
  268. <ScrollView className={this.state.openSearch ? 'searchBottomLOL' : ''} scrollX style={{ width: '100%' }}>
  269. <View className='searchBottom'>
  270. <View className='searchItem' style={{ paddingLeft: '5px' }}>
  271. <Picker
  272. value={this.state.starts.id}
  273. range={clockState} rangeKey='title' mode='selector'
  274. onChange={(e) => {
  275. this.setState({
  276. starts: clockState[e.detail.value],
  277. }, () => {
  278. this.getPublicReleaseList();
  279. })
  280. }}>
  281. {
  282. !this.state.starts.title ?
  283. <View className='shortValuecontent'>
  284. <View className='selectTitle'>审核状态</View>
  285. <View className='iconContent'><AtIcon value='chevron-down' size='10' color='#FFFFFF' /></View>
  286. </View> :
  287. <View className='shortValuecontent'>
  288. <View className='selectValue'>
  289. {this.state.starts.title}
  290. </View>
  291. <View className='iconContent' />
  292. </View>
  293. }
  294. </Picker>
  295. {
  296. this.state.starts.title &&
  297. <View className='searchSelectContent'>
  298. <View className='selectIcon'
  299. onClick={(e) => {
  300. e.stopPropagation();
  301. this.setState({
  302. starts: {}
  303. }, () => {
  304. this.getPublicReleaseList();
  305. })
  306. }}>
  307. <AtIcon value='close-circle' size='10' color='#FFFFFF' />
  308. </View>
  309. </View>
  310. }
  311. </View>
  312. <View className='searchItem' >
  313. <Picker
  314. value={this.state.clockInStarts}
  315. range={['未打卡', '已打卡', '异常打卡']}
  316. mode='selector'
  317. onChange={(e) => {
  318. this.setState({
  319. clockInStarts: String(e.detail.value)
  320. }, () => {
  321. this.getPublicReleaseList();
  322. })
  323. }}>
  324. {
  325. !this.state.clockInStarts ?
  326. <View className='shortValuecontent'>
  327. <View className='selectTitle'>打卡状态</View>
  328. <View className='iconContent'><AtIcon value='chevron-down' size='10' color='#FFFFFF' /></View>
  329. </View> :
  330. <View className='shortValuecontent'>
  331. <View className='selectValue'>
  332. {
  333. this.state.clockInStarts === '2'
  334. ? '异常打卡' : this.state.clockInStarts === '1'
  335. ? '已打卡' : this.state.clockInStarts === '0'
  336. ? '未打卡' : ''
  337. }
  338. </View>
  339. <View className='iconContent' />
  340. </View>
  341. }
  342. </Picker>
  343. {
  344. this.state.clockInStarts ?
  345. <View className='searchSelectContent'>
  346. <View className='selectIcon'
  347. onClick={(e) => {
  348. e.stopPropagation();
  349. this.setState({
  350. clockInStarts: '',
  351. }, () => {
  352. this.getPublicReleaseList();
  353. })
  354. }}>
  355. <AtIcon value='close-circle' size='10' color='#FFFFFF' />
  356. </View>
  357. </View> : null
  358. }
  359. </View>
  360. {/* */}
  361. {/* 多选时间框 */}
  362. <View className='searchItem' onClick={() => {
  363. this.setState({
  364. isPickerRender: true
  365. })
  366. }}>
  367. <View>
  368. {
  369. !this.state.rangeStartMinuteVal ?
  370. <View className='valuecontent' style={{ width: '200px' }}>
  371. <View className='selectTitle' style={{ paddingLeft: '50px' }}>开始及结束时间</View>
  372. <View className='iconContent' style={{ paddingLeft: '20px' }}><AtIcon value='chevron-down' size='10' color='#FFFFFF' /></View>
  373. </View> :
  374. <View className='valuecontent' style={{ width: '200px' }}>
  375. <View className='selectValue' >
  376. {this.state.rangeStartMinuteVal + "~" + this.state.rangeEndMinuteVal}
  377. </View>
  378. <View className='iconContent' />
  379. </View>
  380. }
  381. </View>
  382. {
  383. this.state.rangeStartMinuteVal &&
  384. <View className='searchSelectContent'>
  385. <View className='selectIcon'
  386. onClick={(e) => {
  387. e.stopPropagation();
  388. this.setState({
  389. rangeStartMinuteVal: '',
  390. rangeEndMinuteVal: '',
  391. }, () => {
  392. this.getPublicReleaseList();
  393. })
  394. }}>
  395. <AtIcon value='close-circle' size='10' color='#FFFFFF' />
  396. </View>
  397. </View>
  398. }
  399. </View>
  400. </View>
  401. </ScrollView>
  402. </View>
  403. <AtTabs
  404. swipeable={false}
  405. current={this.state.current || 0}
  406. tabList={this.state.typeList}
  407. onClick={(current) => {
  408. this.setState({
  409. list: [],
  410. pageNo: 1,
  411. current,
  412. }, () => {
  413. this.getPublicReleaseList();
  414. })
  415. }}>
  416. {
  417. this.state.typeList?.map((item, index) =>
  418. <AtTabsPane
  419. current={this.state.current}
  420. index={index}
  421. >
  422. {
  423. this.state.current === 1 &&
  424. <View className='navs'>
  425. {
  426. this.state.coorder.map((it) =>
  427. <View className={this.state.selcotype == it.type ? 'nitems' : 'nitem'}
  428. key={it.type}
  429. onClick={() => {
  430. this.setState({
  431. list: [],
  432. pageNo: 1,
  433. selcotype: it.type,
  434. }, () => {
  435. this.getPublicReleaseList();
  436. })
  437. }}
  438. >{it.title}</View>
  439. )
  440. }
  441. </View>
  442. }
  443. <MyList
  444. type={0}
  445. title={item.title}
  446. typelist={this.state.typeList}
  447. seeView={this.state.current}
  448. list={this.state.list}
  449. listState={this.state.listState}
  450. onRefresh={() => {
  451. this.getPublicReleaseList(true);
  452. }}
  453. opens={e => {
  454. this.setState({
  455. id: e,
  456. isOpen: true,
  457. })
  458. }}
  459. again={e => {
  460. this.getReleasetDails(e.id)
  461. this.setState({
  462. isInquiryOpened: true,
  463. inquiryTitle: "温馨提示",
  464. inquiryContent: "您确定需再次公出拜访同一家企业吗?",
  465. inquiryFn: () => {
  466. },
  467. });
  468. }}
  469. />
  470. </AtTabsPane>
  471. )
  472. }
  473. </AtTabs>
  474. <timePicker
  475. config={{
  476. endDate: true,
  477. column: "day",
  478. dateLimit: false,
  479. limitStartTime: dayjs().subtract(3, 'year').format('YYYY-MM-DD '),
  480. limitEndTime: dayjs().add(3, 'year').format('YYYY-MM-DD ')
  481. }}
  482. isPartition
  483. pickerShow={this.state.isPickerRender}
  484. onconditionaljudgment={(v) => {
  485. // let a = dayjs(dayjs(v.detail.endTime).second(0).format('YYYY-MM-DD'));
  486. // let b = dayjs(dayjs().second(0).format('YYYY-MM-DD'))
  487. // if(a.isBefore(b)){
  488. // Taro.showToast({
  489. // title:'结束时间不能小于当前时间',
  490. // icon:'none'
  491. // })
  492. // v.detail.setLv(false);
  493. // }
  494. }}
  495. onhidepicker={() => {
  496. this.onPickerHide()
  497. }}
  498. onsetpickertime={(v) => {
  499. this.onSetPickerTime(v)
  500. }}>
  501. </timePicker>
  502. {/* 驳回协单 */}
  503. {
  504. this.state.isOpen &&
  505. <AtModal
  506. isOpened={this.state.isOpen}
  507. >
  508. <AtModalContent>
  509. <AtTextarea
  510. value={this.state.rmk}
  511. onChange={e => {
  512. this.setState({ rmk: e })
  513. }}
  514. maxLength={200}
  515. placeholder='请填写备注~'
  516. />
  517. </AtModalContent>
  518. <AtModalAction>
  519. <Button type='secondary' onClick={() => { this.setState({ isOpen: false }) }}>取消</Button>
  520. <Button type='primary' onClick={this.submit.bind(this)}>提交</Button>
  521. </AtModalAction>
  522. </AtModal>
  523. }
  524. {/* 再次公出申请 */}
  525. {
  526. this.state.isInquiryOpened &&
  527. <InquiryModal
  528. isOpened={this.state.isInquiryOpened}
  529. title={this.state.inquiryTitle}
  530. content={this.state.inquiryContent}
  531. color="black"
  532. isNo={this.state.isNo}
  533. onClose={() => {
  534. this.setState({
  535. isInquiryOpened: false,
  536. dtails: {},
  537. inquiryTitle: "",
  538. inquiryContent: "",
  539. isNo: true,
  540. });
  541. }}
  542. onDetermine={() => {
  543. this.setState({
  544. isModifyOpened: true,
  545. isInquiryOpened: false,
  546. inquiryTitle: "",
  547. inquiryContent: "",
  548. isNo: true,
  549. inquiryFn: () => { },
  550. });
  551. }}
  552. />
  553. }
  554. {/* 再次公出详情 */}
  555. {
  556. this.state.isModifyOpened &&
  557. <AtModal
  558. isOpened={this.state.isModifyOpened}
  559. onClose={() => {
  560. this.setState({
  561. isModifyOpened: false,
  562. dtails: {},
  563. })
  564. }}
  565. >
  566. <AtModalContent>
  567. <PublicContent
  568. again={true}
  569. onClose={() => {
  570. this.setState({
  571. isModifyOpened: false,
  572. dtails: {},
  573. })
  574. }}
  575. locationInfor={this.state.selectArrderLocation}
  576. dtails={this.state.dtails}
  577. isOpened={this.state.isModifyOpened}
  578. />
  579. </AtModalContent>
  580. </AtModal>
  581. }
  582. </View>
  583. )
  584. }
  585. }
  586. export default Examine