index.jsx 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979
  1. import React, { Component } from "react";
  2. import Taro, { getCurrentInstance } from "@tarojs/taro";
  3. import { Button, Picker, Text, View } from "@tarojs/components";
  4. import dayjs from "dayjs";
  5. import ImagePicker from "../../components/common/imagePicker";
  6. import InquiryModal from "../../components/common/inquiryModal";
  7. import AccountModal from "../../components/common/accountModal";
  8. import Select from "../applyreimbursement/select";
  9. import {
  10. AtButton,
  11. AtInput,
  12. AtModal,
  13. AtTextarea,
  14. AtModalHeader,
  15. AtModalContent,
  16. AtRadio,
  17. AtModalAction,
  18. AtIcon,
  19. } from "taro-ui";
  20. import {
  21. getPridDetail,
  22. getAccountList,
  23. selectList,
  24. detailsDelete,
  25. subAccount,
  26. getDepartmentList,
  27. } from "../../utils/servers/servers";
  28. import {
  29. getNumHourse,
  30. getAccountName,
  31. getTypeName,
  32. getVehicleName,
  33. commonAdd,
  34. getNewOptions,
  35. removeNull,
  36. } from "../../utils/tools";
  37. import { resourceAddress } from "../../utils/config";
  38. import "taro-ui/dist/style/components/form.scss";
  39. import "taro-ui/dist/style/components/button.scss";
  40. import "taro-ui/dist/style/components/loading.scss";
  41. import "taro-ui/dist/style/components/icon.scss";
  42. import "taro-ui/dist/style/components/textarea.scss";
  43. import "taro-ui/dist/style/components/input.scss";
  44. import "./index.less";
  45. import NewModal from "./modal"
  46. class Drafts extends Component {
  47. $instance = getCurrentInstance();
  48. constructor(props) {
  49. super(props);
  50. this.state = {
  51. imgs: [],
  52. data: {},
  53. visible: "",
  54. list: [],
  55. total: 0,
  56. reality: 0,
  57. accountvisible: "",
  58. typeVisible: "",
  59. bankData: {},
  60. upaccount: false,
  61. accountsList: [],
  62. isShow: false,
  63. };
  64. this.onChange = this.onChange.bind(this);
  65. this.getNumHourse = this.getNumHourse.bind(this);
  66. }
  67. componentDidMount() {
  68. this.getDepartmentList()
  69. this.$instance.router.params && this.$instance.router.params.id &&
  70. (
  71. this.getDetail(),
  72. this.state.data.type != 2 && this.getMyList()
  73. )
  74. }
  75. componentDidShow() { // 对应onShow,只有在onShow中才会监听到当前页面的改变
  76. let pages = Taro.getCurrentPages();
  77. let currPage = pages[pages.length - 1]; // 获取当前页面
  78. const { data } = this.state
  79. const obj = {
  80. buyerName: currPage.data.name || data.buyerName,
  81. contractNo: currPage.data.contractNo || data.contractNo,
  82. orderNo: currPage.data.orderNo || data.orderNo,
  83. debitId: currPage.data.debitId || data.debitId,
  84. debitTotalAmount: currPage.data.totalAmount || data.debitTotalAmount || 0,
  85. }
  86. this.setState({
  87. data: { ...this.state.data, ...obj },
  88. })
  89. this.getAccountList();
  90. }
  91. // 部门数据
  92. getDepartmentList() {
  93. getDepartmentList({}).then(v => {
  94. let thedata = v.data;
  95. let theArr = [];
  96. if (!thedata) {
  97. if (v.error && v.error.length) {
  98. Taro.showToast({ title: v.error[0].message, icon: 'none' })
  99. }
  100. } else {
  101. thedata.map(function (item, index) {
  102. theArr.push({
  103. key: index,
  104. name: item.name,
  105. id: item.id
  106. });
  107. });
  108. }
  109. this.setState({
  110. departmentArr: theArr
  111. });
  112. }).catch(() => {
  113. Taro.showToast({
  114. title: '系统错误,请稍后再试',
  115. icon: 'none'
  116. })
  117. })
  118. }
  119. // 图片上传操作
  120. onChange(value, type) {
  121. let arr = this.state.imgs.concat([]);
  122. if (type === "add") {
  123. arr.push(value);
  124. } else if (type === "remove") {
  125. arr.splice(value, 1);
  126. }
  127. this.setState({
  128. imgs: arr,
  129. });
  130. }
  131. onInputChange(title, value) {
  132. }
  133. // 取消添加
  134. onAccountClose() {
  135. this.setState({
  136. accountvisible: "",
  137. })
  138. }
  139. // 添加收款账户
  140. onAccountOk() {
  141. this.setState({
  142. accountvisible: "",
  143. }, () => { this.getMyList() })
  144. }
  145. // 类型修改 取消
  146. onTypeClose() {
  147. this.setState({
  148. typeVisible: "",
  149. })
  150. }
  151. // 类型修改 确定
  152. onTypeOk(type, typeOther) {
  153. const oldType = this.state.data.type
  154. const oldTypeOther = this.state.data.typeOther
  155. if ((oldType == type) && (typeOther == oldTypeOther)) {
  156. this.setState({
  157. typeVisible: "",
  158. })
  159. } else {
  160. let data = {
  161. updateType: 1,
  162. id: this.$instance.router.params.id,
  163. type,
  164. typeOther,
  165. }
  166. subAccount(removeNull(data))
  167. .then((v) => {
  168. if (v.error.length === 0) {
  169. this.getAccountList()
  170. // 手动刷新
  171. const obj = { type, typeOther }
  172. this.setState({
  173. data: { ...this.state.data, ...obj },
  174. typeVisible: "",
  175. })
  176. Taro.showToast({
  177. title: "修改成功!",
  178. icon: "none",
  179. });
  180. } else {
  181. Taro.showToast({
  182. title: v.error[0].message,
  183. icon: "none",
  184. });
  185. }
  186. })
  187. .catch(() => {
  188. });
  189. }
  190. }
  191. // 费用弹窗
  192. onClose() {
  193. this.setState({
  194. visible: "",
  195. })
  196. this.getAccountList()
  197. }
  198. // 报销账户列表
  199. getMyList(sta) {
  200. let data1 = { status: 1 }
  201. let data2 = {
  202. pageNo: 1,
  203. pageSize: 99,
  204. }
  205. selectList(sta ? data2 : data1).then(v => {
  206. if (v.error.length === 0) {
  207. let list = v.data.list || []
  208. if (list?.length > 0) {
  209. if (sta) {
  210. this.setState({
  211. accountsList: list
  212. })
  213. } else {
  214. this.setState({
  215. bankData: list[0],
  216. })
  217. }
  218. }
  219. } else {
  220. Taro.showToast({ title: v.error[0].message, icon: 'none' })
  221. }
  222. }).catch(() => {
  223. Taro.showToast({
  224. title: '系统错误,请稍后再试',
  225. icon: 'none'
  226. })
  227. })
  228. }
  229. // 确认收款账户
  230. selectOn() {
  231. let list = this.state.accountsList
  232. for (var i = 0; i < list.length; i++) {
  233. if (list[i].id == this.state.aid) {
  234. this.setState({
  235. upaccount: false,
  236. bankData: list[i]
  237. })
  238. }
  239. }
  240. }
  241. // 报销单详情
  242. getDetail() {
  243. getPridDetail({
  244. id: this.$instance.router.params.id,
  245. }).then(v => {
  246. if (v.error.length === 0) {
  247. let list = [];
  248. for (let i of (v.data.attachmentUrl || '').split(',')) {
  249. if (i) {
  250. list.push({ 'url': resourceAddress + i })
  251. }
  252. }
  253. this.setState({
  254. data: v.data,
  255. rangeStartMinuteVal: v.data.releaseStartStr,
  256. rangeEndMinuteVal: v.data.releaseEndStr,
  257. totalDuration: v.data.duration,
  258. imgs: list,
  259. })
  260. this.getAccountList()
  261. } else {
  262. Taro.showToast({ title: v.error[0].message, icon: 'none' })
  263. }
  264. }).catch(() => {
  265. Taro.showToast({
  266. title: '系统错误,请稍后再试',
  267. icon: 'none'
  268. })
  269. })
  270. }
  271. // 报销详情金额列表
  272. getAccountList() {
  273. const { data } = this.state
  274. getAccountList({
  275. eaid: this.$instance.router.params.id,
  276. }).then(v => {
  277. if (v.error.length === 0) {
  278. let sum = 0
  279. for (var i = 0; i < v.data.length; i++) {
  280. // sum += v.data[i].amount
  281. sum = commonAdd(sum, v.data[i].amount)
  282. }
  283. let reality = (sum > data.debitTotalAmount) ? commonAdd(sum, -data.debitTotalAmount) : 0
  284. this.setState({
  285. list: v.data,
  286. total: sum,
  287. reality,
  288. })
  289. } else {
  290. Taro.showToast({ title: v.error[0].message, icon: 'none' })
  291. }
  292. }).catch(() => {
  293. Taro.showToast({
  294. title: '系统错误,请稍后再试',
  295. icon: 'none'
  296. })
  297. }).finally(() => {
  298. this.setState({
  299. isShow: true
  300. })
  301. })
  302. }
  303. // 删除报销详情
  304. detailsDelete(id) {
  305. detailsDelete({
  306. id,
  307. }).then(v => {
  308. if (v.error.length === 0) {
  309. Taro.showToast({ title: "操作成功", icon: 'none' })
  310. this.getAccountList()
  311. } else {
  312. Taro.showToast({ title: v.error[0].message, icon: 'none' })
  313. }
  314. }).catch(() => {
  315. Taro.showToast({
  316. title: '系统错误,请稍后再试',
  317. icon: 'none'
  318. })
  319. })
  320. }
  321. // 提交申请
  322. onSubmit() {
  323. const { data, bankData } = this.state
  324. if (data.type == 1) {
  325. if (!data.userNames) {
  326. Taro.showToast({ title: "请填写公出客户名称", icon: "none" });
  327. return;
  328. }
  329. if (!data.districtName) {
  330. Taro.showToast({ title: "请填写公出地点", icon: "none" });
  331. return;
  332. }
  333. if (!this.state.rangeStartMinuteVal) {
  334. Taro.showToast({ title: "请选择公出时间", icon: "none" });
  335. return;
  336. }
  337. if (!this.state.rangeEndMinuteVal) {
  338. Taro.showToast({ title: "请选择公出时间", icon: "none" });
  339. return;
  340. }
  341. }
  342. if (!data.remarks) {
  343. Taro.showToast({ title: "请填写报销事由", icon: "none" });
  344. return;
  345. }
  346. this.setState({
  347. loading: true,
  348. });
  349. let comData = {
  350. updateType: 0,
  351. id: this.$instance.router.params.id,
  352. status: 1, // 提交审核
  353. type: data.type, // 报销类型
  354. typeOther: data.type == 0 ? data.typeOther : undefined, // 其他类型
  355. remarks: data.remarks, // 报销事由
  356. applyDep: data.applyDep, // 申请部门
  357. attachmentUrl: this.state.imgs.length === 0 ? "" : this.state.imgs.join(","), // 附件
  358. payDep: (data.type == 4 || data.type == 5) ? undefined : data.payDep, // 支付部门(借支抵扣不需要)
  359. orderNo: (data.type == 4 || data.type == 5) ? undefined : data.orderNo, // 订单编号(借支抵扣不需要)
  360. debitId: data.type == 4 ? undefined : data.debitId, // 预支单
  361. eaaid: data.type == 3 ? undefined : bankData.id, // 报销账户(第三方付款不需要)
  362. // 差旅费
  363. userNames: data.type == 1 ? data.userNames : undefined, // 公出客户名称
  364. districtName: data.type == 1 ? data.districtName : undefined, // 公出地点
  365. releaseStart: data.type == 1 ? this.state.rangeStartMinuteVal : undefined, // 开始时间
  366. releaseEnd: data.type == 1 ? this.state.rangeEndMinuteVal : undefined, // 结束时间
  367. duration: data.type == 1 ? this.state.totalDuration : undefined, // 公出时长
  368. }
  369. subAccount(removeNull(comData))
  370. .then((v) => {
  371. this.setState({
  372. loading: false,
  373. })
  374. if (v.error.length === 0) {
  375. Taro.showToast({
  376. title: "提交成功!",
  377. icon: "none",
  378. });
  379. Taro.switchTab({
  380. url: "/pages/recordlist/index",
  381. });
  382. } else {
  383. Taro.showToast({
  384. title: v.error[0].message,
  385. icon: "none",
  386. });
  387. }
  388. })
  389. .catch(() => {
  390. this.setState({
  391. loading: false,
  392. });
  393. });
  394. }
  395. getNumHourse(startTime, endTime) {
  396. this.setState({
  397. totalDuration: getNumHourse(
  398. startTime,
  399. endTime,
  400. this.state.validDates.length
  401. ),
  402. });
  403. }
  404. onPickerHide() {
  405. this.setState({
  406. isPickerRender: false,
  407. });
  408. }
  409. onSetPickerTime(val) {
  410. let data = val.detail;
  411. this.setState({
  412. rangeStartMinuteVal: data.selectStartTime,
  413. rangeEndMinuteVal: data.selectEndTime,
  414. });
  415. let arr = [];
  416. if (data.startTime && data.endTime) {
  417. let a = dayjs(data.startTime);
  418. let b = dayjs(data.endTime);
  419. let num;
  420. if (a.hour() <= b.hour()) {
  421. num = b.diff(a, "day") + 1;
  422. } else {
  423. num = b.diff(a, "day") + 2;
  424. }
  425. let strAdd = data.startTime;
  426. for (let i = 0; i < num; i++) {
  427. let time = dayjs(strAdd).add(i, "days").format("YYYY-MM-DD");
  428. arr.push({ value: time });
  429. }
  430. }
  431. this.setState({
  432. rangeEndVal: dayjs(data.endTime).format("YYYY-MM-DD"),
  433. rangeStartVal: dayjs(data.startTime).format("YYYY-MM-DD"),
  434. validDates: arr,
  435. }, () => {
  436. let a1 = dayjs(dayjs(data.endTime).format("YYYY-MM-DD HH:mm:ss"));
  437. let b1 = dayjs(dayjs(data.startTime).format("YYYY-MM-DD HH:mm:ss"));
  438. this.getNumHourse(b1, a1);
  439. });
  440. }
  441. render() {
  442. const { data, list, total, bankData, } = this.state
  443. const departmentArr = this.state.departmentArr || [];
  444. return (
  445. <View className="subform">
  446. <View className="title">{getAccountName(data.type, data.typeOther)}</View>
  447. {data.type == 1 &&
  448. <View className="inputFormItem">
  449. <AtInput
  450. name='userNames'
  451. title='公出企业:'
  452. type='text'
  453. placeholder='请填写公出企业'
  454. value={data.userNames}
  455. onChange={e => { data.userNames = e }}
  456. />
  457. </View>}
  458. {data.type == 1 &&
  459. <View className="inputFormItem">
  460. <AtInput
  461. name='districtName'
  462. title='公出地点:'
  463. type='text'
  464. placeholder='请填写公出地点'
  465. value={data.districtName}
  466. onChange={e => { data.districtName = e }}
  467. />
  468. </View>}
  469. {data.type == 1 &&
  470. <View className="formItem">
  471. <View className="formName">公出时间:</View>
  472. <View className="formValue">
  473. <View
  474. className="time"
  475. onClick={() => {
  476. this.setState({
  477. isPickerRender: true,
  478. });
  479. }}
  480. >
  481. {this.state.rangeStartMinuteVal &&
  482. this.state.rangeEndMinuteVal ? (
  483. <View className="timeContent">
  484. <View style={{ textAlign: "center" }}>{this.state.rangeStartMinuteVal}</View>
  485. &nbsp;&nbsp;至&nbsp;&nbsp;
  486. <View style={{ textAlign: "center" }}>{this.state.rangeEndMinuteVal}</View>
  487. </View>
  488. ) : (
  489. "请选择时间"
  490. )}
  491. </View>
  492. <timePicker
  493. config={{
  494. endDate: true,
  495. column: "minute",
  496. dateLimit: false,
  497. limitStartTime: dayjs()
  498. .subtract(3, "year")
  499. .format("YYYY-MM-DD HH:mm:ss"),
  500. limitEndTime: dayjs()
  501. .add(3, "year")
  502. .format("YYYY-MM-DD HH:mm:ss"),
  503. }}
  504. isPartition
  505. pickerShow={this.state.isPickerRender}
  506. onconditionaljudgment={(v) => {
  507. let a = dayjs(
  508. dayjs(v.detail.endTime)
  509. .second(0)
  510. .format("YYYY-MM-DD HH:mm:ss")
  511. );
  512. }}
  513. onhidepicker={() => {
  514. this.onPickerHide();
  515. }}
  516. onsetpickertime={(v) => {
  517. this.onSetPickerTime(v);
  518. }}
  519. />
  520. </View>
  521. </View>}
  522. {data.type == 1 &&
  523. <View className="formItem">
  524. <View className="formName">公出时长:</View>
  525. <View className="formValue">{this.state.totalDuration}小时</View>
  526. </View>}
  527. <View className="formItem">
  528. <View className="formName">申请类型:</View>
  529. <View className="formValue" onClick={() => {
  530. this.setState({
  531. isInquiryOpened: true,
  532. inquiryTitle: "温馨提示",
  533. inquiryContent: "您是否需要重新选择费用类型?原报销数据将清空后,需重新填写!!!",
  534. inquiryFn: () => {
  535. this.setState({
  536. typeVisible: "edit"
  537. })
  538. },
  539. });
  540. }}>
  541. {getAccountName(data.type, data.typeOther)}
  542. <AtIcon value="chevron-right" size="20" color="#000000" />
  543. </View>
  544. </View>
  545. {data.type != 4 && data.type != 5 &&
  546. <View className="formItem">
  547. <View className="formName">报销至订单:</View>
  548. <View className="formValue" onClick={() => {
  549. Taro.navigateTo({
  550. url: "/pages/dataindex/index"
  551. })
  552. }}>
  553. <View>
  554. <View>{data.buyerName}</View>
  555. <View>{data.contractNo}</View>
  556. </View>
  557. <AtIcon value="chevron-right" size="20" color="#000000" />
  558. </View>
  559. </View>}
  560. <View className="formTitle">
  561. 报销详细
  562. </View>
  563. <View className="formItem">
  564. <View className="formName">申请人:</View>
  565. <View className="formValue">{data.aname}</View>
  566. </View>
  567. {
  568. data.type != 4 && data.type != 5 &&
  569. <View className="formItem">
  570. <View className="formName">报销公司:</View>
  571. <View className="formValue">
  572. <Picker
  573. value={departmentArr.findIndex(item => item.id === data.applyDep)}
  574. range={departmentArr} rangeKey='name' mode='selector'
  575. onChange={(e) => {
  576. const obj = { applyDep: departmentArr[e.detail.value].id, appDepName: departmentArr[e.detail.value].name }
  577. this.setState({
  578. data: { ...data, ...obj },
  579. })
  580. }}>
  581. <View>
  582. {data.appDepName}
  583. <AtIcon value="chevron-right" size="20" color="#000000" />
  584. </View>
  585. </Picker>
  586. </View>
  587. </View>
  588. }
  589. <View className="formItem">
  590. <View className="formName">支付公司:</View>
  591. <View className="formValue">
  592. <Picker
  593. value={departmentArr.findIndex(item => item.id === data.payDep)}
  594. range={departmentArr} rangeKey='name' mode='selector'
  595. onChange={(e) => {
  596. const obj = { payDep: departmentArr[e.detail.value].id, payDepName: departmentArr[e.detail.value].name }
  597. this.setState({
  598. data: { ...data, ...obj },
  599. })
  600. }}>
  601. <View>
  602. {data.payDepName}
  603. <AtIcon value="chevron-right" size="20" color="#000000" />
  604. </View>
  605. </Picker>
  606. </View>
  607. </View>
  608. <View className="formItem">
  609. <View className="formName">报销事由:</View>
  610. <View className="formValues">
  611. <AtTextarea
  612. value={data.remarks == null ? "" : data.remarks}
  613. onChange={e => {
  614. const obj = { remarks: e }
  615. this.setState({
  616. data: { ...data, ...obj }
  617. })
  618. }}
  619. height={75}
  620. maxLength={50}
  621. placeholder="请填写报销事由"
  622. />
  623. </View>
  624. </View>
  625. <View className="formTitle">
  626. 报销费用详细
  627. <Button className="ftBottom" size='mini' type='primary'
  628. onClick={() => {
  629. data.type == 1
  630. ? this.setState({ visible: "add" })
  631. : Taro.navigateTo({
  632. url: `/pages/accountfrom/index?type=${data.type}&id=${this.$instance.router.params.id}`
  633. })
  634. }}>+ 增加</Button>
  635. </View>
  636. {this.state.visible != "" &&
  637. <NewModal
  638. eaid={this.$instance.router.params.id}
  639. visible={this.state.visible}
  640. onClose={this.onClose.bind(this)}
  641. />}
  642. {/* 差旅费显示 */}
  643. {data.type == 1 &&
  644. list?.map(item =>
  645. item.type == 1
  646. ? <View className="unItem" key={item.id}>
  647. <View className="close"
  648. onClick={() => {
  649. this.setState({
  650. isInquiryOpened: true,
  651. inquiryTitle: "提醒",
  652. inquiryContent: "您确定要删除吗?",
  653. inquiryFn: () => {
  654. this.detailsDelete(item.id);
  655. },
  656. });
  657. }}
  658. >删除</View>
  659. {/* <View className="edit">编辑</View> */}
  660. <View className="formItem">
  661. <View className="formName">交通工具:</View>
  662. <View className="formValue">{getVehicleName(item.vehicle, item.vehicleOther)}</View>
  663. </View>
  664. <View className="formItem">
  665. <View className="formName">时间:</View>
  666. <View className="formValue">
  667. <View className="ftxt">{item.startTimeStr}</View>
  668. &nbsp;&nbsp;至&nbsp;&nbsp;
  669. <View className="ftxt">{item.endTimeStr}</View>
  670. </View>
  671. </View>
  672. <View className="formItem">
  673. <View className="formName">地点:</View>
  674. <View className="formValue">
  675. <View className="ftxt">{item.startDistrict}</View>
  676. &nbsp;&nbsp;至&nbsp;&nbsp;
  677. <View className="ftxt">{item.endDistrict}</View>
  678. </View>
  679. </View>
  680. <View className="formItem">
  681. <View className="formName">金额:</View>
  682. <View className="formValue">{item.amount}(元)</View>
  683. </View>
  684. </View>
  685. : <View className="inputFormItems" key={item.id}>
  686. <AtInput
  687. name={item.id}
  688. title={getTypeName(item.type) + ":"}
  689. type='number'
  690. placeholder='请输入金额(元)'
  691. value={item.amount}
  692. />
  693. (元)
  694. <View className="close"
  695. onClick={() => {
  696. this.setState({
  697. isInquiryOpened: true,
  698. inquiryTitle: "提醒",
  699. inquiryContent: "您确定要删除吗?",
  700. inquiryFn: () => {
  701. this.detailsDelete(item.id);
  702. },
  703. });
  704. }}
  705. >删除</View>
  706. </View>)
  707. }
  708. {/* 通用 */}
  709. {(data.type == 0 || data.type == 2 || data.type == 4 || data.type == 5) &&
  710. list?.map(item =>
  711. <View className="unItem" key={item.id}>
  712. <View className="close"
  713. onClick={() => {
  714. this.setState({
  715. isInquiryOpened: true,
  716. inquiryTitle: "提醒",
  717. inquiryContent: "您确定要删除吗?",
  718. inquiryFn: () => {
  719. this.detailsDelete(item.id);
  720. },
  721. });
  722. }}
  723. >删除</View>
  724. {/* <View className="edit">编辑</View> */}
  725. <View className="formItem">
  726. <View className="formName">需付款时间:</View>
  727. <View className="formValue">{item.agreeTimeStr.slice(0, 10)}</View>
  728. </View>
  729. <View className="formItem">
  730. <View className="formName">金额:</View>
  731. <View className="formValue">{item.amount}(元)</View>
  732. </View>
  733. </View>
  734. )
  735. }
  736. {/* 第三方付款 */}
  737. {data.type == 3 &&
  738. list?.map(item =>
  739. <View className="unItem" key={item.id}>
  740. <View className="close"
  741. onClick={() => {
  742. this.setState({
  743. isInquiryOpened: true,
  744. inquiryTitle: "提醒",
  745. inquiryContent: "您确定要删除吗?",
  746. inquiryFn: () => {
  747. this.detailsDelete(item.id);
  748. },
  749. });
  750. }}
  751. >删除</View>
  752. {/* <View className="edit">编辑</View> */}
  753. <View className="formItem">
  754. <View className="formName">需付款时间:</View>
  755. <View className="formValue">{item.agreeTimeStr.slice(0, 10)}</View>
  756. </View>
  757. <View className="formItem">
  758. <View className="formName">付款方式:</View>
  759. <View className="formValue">{["公对公转账"][item.payType]}</View>
  760. </View>
  761. <View className="formItem">
  762. <View className="formName">发票类型:</View>
  763. <View className="formValue">{["普票", "专票"][item.invoiceType]}</View>
  764. </View>
  765. <View className="formItem">
  766. <View className="formName">发票号:</View>
  767. <View className="formValue">{item.invoiceNo}</View>
  768. </View>
  769. <View className="formItem">
  770. <View className="formName">付款单位:</View>
  771. <View className="formValue">{item.payerName}</View>
  772. </View>
  773. <View className="formItem">
  774. <View className="formName">开户银行:</View>
  775. <View className="formValue">{item.openBank}</View>
  776. </View>
  777. <View className="formItem">
  778. <View className="formName">银行账户:</View>
  779. <View className="formValue">{item.bankAccounts}</View>
  780. </View>
  781. <View className="formItem">
  782. <View className="formName">开户行地址:</View>
  783. <View className="formValue">{item.openBankAddress}</View>
  784. </View>
  785. <View className="formItem">
  786. <View className="formName">金额:</View>
  787. <View className="formValue">{item.amount}</View>
  788. </View>
  789. </View>
  790. )
  791. }
  792. {
  793. data.type != 4 &&
  794. <View className="formItem">
  795. <View className="formName">预借支:</View>
  796. <View className="formValue"
  797. onClick={() => {
  798. Taro.navigateTo({
  799. url: `/pages/debitnote/index?depId=${data.applyDep}`
  800. })
  801. }}
  802. >
  803. {!data.debitId
  804. ? <Button size='mini' type='primary' style={{ marginRight: 0 }}>选择借支订单</Button>
  805. : <View>已选择<Text style={{ color: "red" }}>{data.debitTotalAmount}</Text>元借支订单
  806. <AtIcon value="chevron-right" size="20" color="#000000" />
  807. </View>}
  808. </View>
  809. </View>
  810. }
  811. <View className="formItem" style={{ paddingTop: "10px" }}>
  812. <View className="formName">总金额:</View>
  813. <View className="formValue"><Text style={{ color: "red" }}>{total}</Text>(元)</View>
  814. </View>
  815. <View className="formItem" style={{ paddingTop: "10px" }}>
  816. <View className="formName">实报金额:</View>
  817. <View className="formValue"><Text style={{ color: "red" }}>{this.state.reality}</Text>(元)</View>
  818. </View>
  819. <View className="formItem" style={{ display: "block", paddingBottom: 0 }}>
  820. <View className="formName">附件:</View>
  821. <View
  822. className="formValue"
  823. style={{ paddingTop: "10px", textAlign: "left" }}
  824. >
  825. {this.state.isShow &&
  826. <ImagePicker
  827. files={this.state.imgs}
  828. showAddBtn={true}
  829. ref={(ref) => (this.imagePickerRef = ref)}
  830. url="/api/admin/release/upload"
  831. onChange={this.onChange}
  832. />}
  833. </View>
  834. </View>
  835. <View className="tips">上传附件要求</View>
  836. <View className="tips">①需要提供发票报销</View>
  837. <View className="tips">②需要填写报销明细表</View>
  838. <View className="tips">③招待费需要提供报备截图</View>
  839. {data.type != 3 &&
  840. <View className="formTitle" style={{ marginTop: "20px" }}>
  841. 报销收款账户
  842. </View>}
  843. {data.type != 3 &&
  844. <View className="unobstructedList">
  845. {(!bankData.id)
  846. ? <View className="noAccout" onClick={() => { this.setState({ accountvisible: true }) }}>
  847. 暂未有收款账户
  848. <View className="nbt">去添加 &gt;</View>
  849. </View>
  850. : <View className="unItem" >
  851. <View className="edit"
  852. onClick={() => {
  853. this.setState({
  854. upaccount: true,
  855. aid: bankData.id,
  856. }, () => {
  857. this.getMyList(true)
  858. })
  859. }}
  860. >修改</View>
  861. <View className="formItem">
  862. <View className="formName">收款人:{bankData.name}</View>
  863. </View>
  864. <View className="formItem">
  865. <View className="formName">收款银行:{bankData.bank}</View>
  866. </View>
  867. <View className="formItem">
  868. <View className="formName">收款账户:{bankData.accounts}</View>
  869. </View>
  870. </View>}
  871. </View>}
  872. <View className="bottom">
  873. <AtButton
  874. disabled={this.state.loading}
  875. type="primary"
  876. circle
  877. onClick={() => {
  878. this.onSubmit()
  879. }}
  880. >
  881. {data.status == 0 ? "提交申请" : data.status == 3 && "重新发起"}
  882. </AtButton>
  883. </View>
  884. {/* 二级确认弹窗 */}
  885. <InquiryModal
  886. isOpened={this.state.isInquiryOpened}
  887. title={this.state.inquiryTitle}
  888. content={this.state.inquiryContent}
  889. onClose={() => {
  890. this.setState({
  891. isInquiryOpened: false,
  892. inquiryTitle: "",
  893. inquiryContent: "",
  894. isNo: true,
  895. });
  896. }}
  897. onDetermine={() => {
  898. this.state.inquiryFn();
  899. this.setState({
  900. isInquiryOpened: false,
  901. inquiryTitle: "",
  902. inquiryContent: "",
  903. isNo: true,
  904. inquiryFn: () => { },
  905. });
  906. }}
  907. />
  908. {/* 收款账户添加 */}
  909. {this.state.accountvisible != "" &&
  910. <AccountModal
  911. isSub={true}
  912. visible={this.state.accountvisible}
  913. onClose={this.onAccountClose.bind(this)}
  914. onOk={this.onAccountOk.bind(this)}
  915. />}
  916. {/* 收款账户列表 */}
  917. <AtModal isOpened={this.state.upaccount}>
  918. <AtModalHeader>请选择收款账户</AtModalHeader>
  919. <AtModalContent>
  920. <AtRadio
  921. options={getNewOptions(this.state.accountsList)}
  922. value={this.state.aid}
  923. onClick={e => { this.setState({ aid: e }) }}
  924. />
  925. </AtModalContent>
  926. <AtModalAction>
  927. <Button type='secondary' onClick={() => { this.setState({ upaccount: false, accountsList: [] }) }}>取消</Button>
  928. <Button type='primary' onClick={() => { this.selectOn() }}>确定</Button>
  929. </AtModalAction>
  930. </AtModal>
  931. {/* 申请类型修改 */}
  932. {this.state.typeVisible != "" &&
  933. <Select
  934. visible={this.state.typeVisible}
  935. onClose={this.onTypeClose.bind(this)}
  936. onOk={this.onTypeOk.bind(this)}
  937. type={data.type}
  938. other={data.typeOther}
  939. />}
  940. </View>
  941. );
  942. }
  943. }
  944. export default Drafts;