index.jsx 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330
  1. import React,{Component} from "react";
  2. import { View,Image,Button } from '@tarojs/components'
  3. import Taro, { getCurrentInstance } from "@tarojs/taro";
  4. import {AtButton, AtCalendar, AtIcon, AtTextarea} from 'taro-ui'
  5. import {examinePublicRelease,getReleasetDails,getListPublicReleaseLog} from '../../utils/servers/servers';
  6. import {resourceAddress} from '../../utils/config';
  7. import { AtModal, AtTimeline, AtModalContent, AtModalAction } from "taro-ui";
  8. import Modify from './modify';
  9. import './index.less';
  10. import 'taro-ui/dist/style/components/icon.scss';
  11. import 'taro-ui/dist/style/components/textarea.scss'
  12. import 'taro-ui/dist/style/components/modal.scss';
  13. import 'taro-ui/dist/style/components/timeline.scss';
  14. import 'taro-ui/dist/style/components/icon.scss';
  15. import 'taro-ui/dist/style/components/calendar.scss';
  16. import Rejected from '../../image/rejected.png';
  17. import Passed from '../../image/passed.png';
  18. import Reviewed from '../../image/reviewed.png';
  19. import ImagePicker from "../../components/common/imagePicker";
  20. import switchIocn from '../../image/switch.png';
  21. class EgressDetails extends Component{
  22. $instance = getCurrentInstance()
  23. constructor(props) {
  24. super(props);
  25. this.state={
  26. dtails:{},
  27. opinion:'',
  28. publicReleaseLog:[],
  29. isDetailedOpened:false,
  30. isOpened:false,
  31. isModifyOpened:false,
  32. modifyType:0,
  33. selectArrderLocation:{}
  34. }
  35. this.examinePublicRelease= this.examinePublicRelease.bind(this);
  36. this.getReleasetDails= this.getReleasetDails.bind(this);
  37. this.getListPublicReleaseLog= this.getListPublicReleaseLog.bind(this);
  38. }
  39. componentDidMount() {
  40. this.getReleasetDails();
  41. }
  42. componentDidShow() {
  43. //获取地区选定数据
  44. const chooseLocation = requirePlugin('chooseLocation');
  45. const location = chooseLocation.getLocation();
  46. if(location){
  47. this.setState({
  48. selectArrderLocation: location
  49. })
  50. }
  51. }
  52. getReleasetDails(){
  53. getReleasetDails({
  54. id:this.$instance.router.params.id
  55. }).then(v=>{
  56. if(v.error.length === 0){
  57. let list = [];
  58. for(let i of v.data.annexUrl.split(',')){
  59. if(i){
  60. list.push({'url':resourceAddress + i})
  61. }
  62. }
  63. v.data.annexUrl = list;
  64. this.setState({
  65. dtails:v.data,
  66. selectArrderLocation:{
  67. longitude:parseFloat(v.data.longitude),
  68. latitude:parseFloat(v.data.latitude),
  69. name:v.data.userName
  70. }
  71. })
  72. }else{
  73. Taro.showToast({title:v.error[0].message,icon:'none'})
  74. }
  75. }).catch(err=>{
  76. Taro.showToast({title:'系统错误,请稍后再试',icon:'none'});
  77. console.log(err)
  78. })
  79. }
  80. examinePublicRelease(status){
  81. if(!this.state.opinion){
  82. Taro.showToast({title:'请填写审批意见',icon:'none'})
  83. return;
  84. }
  85. examinePublicRelease({
  86. status,
  87. remarks:this.state.opinion,
  88. id:this.state.dtails.id
  89. }).then(v=>{
  90. if(v.error.length === 0){
  91. Taro.showToast({title:status===0?'驳回成功':'通过成功',icon:'none'});
  92. this.state.dtails.status=status;
  93. this.setState({
  94. dtails:this.state.dtails
  95. })
  96. }else{
  97. Taro.showToast({title:v.error[0].message,icon:'none'})
  98. }
  99. }).catch(()=>{
  100. Taro.showToast({title:'系统错误,请稍后再试',icon:'none'})
  101. })
  102. }
  103. getListPublicReleaseLog(){
  104. getListPublicReleaseLog({
  105. id:this.$instance.router.params.id
  106. }).then(v=>{
  107. if(v.error.length === 0){
  108. let arr = [];
  109. for (let i of v.data){
  110. arr.push({
  111. title:
  112. i.status === 0 ? '驳回' :
  113. i.status === 1 ? '审核中' :
  114. i.status === 2 ? '通过' : '',
  115. content: ['审核员:'+i.aname,i.remarks ? '审核意见:'+i.remarks : null],
  116. color: i.status === 0 ? '#f31212' :
  117. i.status === 1 ? '#1d4fea' :
  118. i.status === 2 ? '#34de38' : ''
  119. })
  120. }
  121. this.setState({
  122. publicReleaseLog:arr,
  123. isOpened:true
  124. })
  125. }else{
  126. Taro.showToast({title:v.error[0].message,icon:'none'})
  127. }
  128. }).catch(err=>{
  129. Taro.showToast({title:'系统错误.请稍后重试',icon:'none'})
  130. console.log(err)
  131. })
  132. }
  133. render() {
  134. const {dtails} = this.state;
  135. return (
  136. <View className='egressDetails'>
  137. <View className='titleContent'>
  138. <View className='title'>{dtails.aname}提交的公出申请</View>
  139. <View className='address'>
  140. {/*<AtIcon value='map-pin' size='15' color='#767272'/>*/}
  141. 公出企业: {dtails.nickname}
  142. {this.$instance.router.params.type === '0' && dtails.status === 0 ? <Image src={switchIocn} className='switchItem' onClick={()=>{
  143. this.setState({
  144. isModifyOpened:true,
  145. modifyType:1,
  146. })
  147. }}/> : null}
  148. </View>
  149. <View className='state' style={{
  150. color:dtails.status === 0 ? '#f31212' :
  151. dtails.status === 1 ? '#1d4fea' :
  152. dtails.status === 2 ? '#34de38' : ''
  153. }}>
  154. {
  155. dtails.status === 0 ? '驳回' :
  156. dtails.status === 1 ? '审核中' :
  157. dtails.status === 2 ? '通过' : ''
  158. }
  159. </View>
  160. <Image src={
  161. dtails.status === 0 ? Rejected :
  162. dtails.status === 1 ? Reviewed :
  163. dtails.status === 2 ? Passed : ''} className='startIcon'/>
  164. </View>
  165. <View className='valueContent'>
  166. {/*<View className='item'>*/}
  167. {/* <View className='title'>公出编号</View>*/}
  168. {/* <View className='value'>20212584646465495462</View>*/}
  169. {/*</View>*/}
  170. {/*<View className='item'>*/}
  171. {/* <View className='title'>企业类型</View>*/}
  172. {/* <View className='value'>稀有企业</View>*/}
  173. {/*</View>*/}
  174. {/*<View className='item'>*/}
  175. {/* <View className='title'>审核人</View>*/}
  176. {/* <View className='value'>营销经理</View>*/}
  177. {/*</View>*/}
  178. <View className='item'>
  179. <View className='title'>
  180. 公出地点:
  181. {this.$instance.router.params.type === '0' && dtails.status === 0 ? <AtIcon value='edit' size='18' color='#3864ef' onClick={()=>{
  182. this.setState({
  183. isModifyOpened:true,
  184. modifyType:2,
  185. })
  186. }}/> : null}
  187. </View>
  188. <View className='value'>{dtails.userName}</View>
  189. <View className='timeContent'>
  190. <View className='time'>
  191. <View className='num'>公出{dtails.duration}小时</View>
  192. <View className='journal' onClick={()=>{
  193. this.setState({
  194. isDetailedOpened:true
  195. })
  196. }}>明细</View>
  197. </View>
  198. <View className='timeAxis'>
  199. <View className='startTime'>
  200. <View className='circle'/>
  201. {dtails.releaseStarts}
  202. </View>
  203. <View className='axis'/>
  204. <View className='endTime'>
  205. <View className='circle'/>
  206. {dtails.releaseEnds}
  207. </View>
  208. </View>
  209. </View>
  210. </View>
  211. <AtModal isOpened={this.state.isDetailedOpened}>
  212. <AtModalContent>
  213. {dtails.validDate ? <AtCalendar
  214. isSwiper={false}
  215. validDates={JSON.parse(dtails.validDate)}
  216. /> : null
  217. }
  218. </AtModalContent>
  219. <AtModalAction>
  220. <Button onClick={()=>{
  221. this.setState({
  222. isDetailedOpened:false
  223. })
  224. }}>确定</Button>
  225. </AtModalAction>
  226. </AtModal>
  227. <View className='item'>
  228. <View className='title'>
  229. 申请时间
  230. </View>
  231. <View className='value'>{dtails.createTimes}</View>
  232. </View>
  233. <View className='item'>
  234. <View className='title'>公出原因</View>
  235. <View className='value'>
  236. {dtails.remarks}
  237. </View>
  238. </View>
  239. <View className='item'>
  240. <View className='title'>附件</View>
  241. <View className='value'>
  242. {dtails.annexUrl && dtails.annexUrl.length > 0 ? <ImagePicker
  243. files={dtails.annexUrl}
  244. showAddBtn={false} /> : null}
  245. </View>
  246. </View>
  247. {
  248. this.$instance.router.params.type === '1' ?
  249. <View className='item'>
  250. <View className='title'>填写审批意见</View>
  251. <AtTextarea
  252. value={this.state.opinion}
  253. onChange={(value)=>{
  254. this.setState({
  255. opinion:value
  256. })
  257. }}
  258. maxLength={200}
  259. placeholder='请填写审批意见'
  260. />
  261. </View> : null
  262. }
  263. {
  264. this.$instance.router.params.type === '1' ?
  265. <View className='operation'>
  266. <AtButton type='secondary' circle loading={this.state.loading} onClick={()=>{
  267. this.examinePublicRelease(0);
  268. }}>
  269. 驳回
  270. </AtButton>
  271. <AtButton type='primary' loading={this.state.loading} circle onClick={()=>{
  272. this.examinePublicRelease(2);
  273. }}>
  274. 同意
  275. </AtButton>
  276. </View> : null
  277. }
  278. </View>
  279. <View className='valueContent history' onClick={this.getListPublicReleaseLog}>
  280. 查看TA的历史记录
  281. <AtIcon value='chevron-right' size='20' color='#767272'/>
  282. </View>
  283. <AtModal isOpened={this.state.isOpened}>
  284. <AtModalContent>
  285. <AtTimeline
  286. pending
  287. items={this.state.publicReleaseLog}
  288. />
  289. </AtModalContent>
  290. <AtModalAction>
  291. <Button onClick={()=>{
  292. this.setState({
  293. isOpened:false
  294. })
  295. }}>确定</Button>
  296. </AtModalAction>
  297. </AtModal>
  298. <Modify
  299. dtails={dtails}
  300. locationInfor={this.state.selectArrderLocation}
  301. id={this.$instance.router.params.id}
  302. isOpened={this.state.isModifyOpened}
  303. modifyType={this.state.modifyType}
  304. onClose={()=>{
  305. this.setState({
  306. isModifyOpened:false,
  307. dtails:{}
  308. },()=>{
  309. this.getReleasetDails();
  310. })
  311. }}/>
  312. </View>
  313. )
  314. }
  315. }
  316. export default EgressDetails;