index.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450
  1. import React, { useState, useEffect, useRef } from 'react';
  2. import {
  3. Modal,
  4. Button,
  5. Calendar,
  6. Popover,
  7. Spin,
  8. Row,
  9. Col,
  10. message,
  11. } from 'antd';
  12. import AddModal from './AddModal';
  13. import WorkList from './WorkList';
  14. import { connect } from 'dva';
  15. import dayjs from 'dayjs';
  16. import { useRequest, useModel } from '@umijs/max';
  17. function List(props) {
  18. const {
  19. typeList,
  20. dispatch,
  21. loading,
  22. dataList,
  23. projectList,
  24. // currentUser,
  25. allType,
  26. depUserTree,
  27. depUserMap,
  28. } = props;
  29. const {
  30. initialState: { user },
  31. } = useModel('@@initialState');
  32. const [visible, setVisible] = useState(false);
  33. const [current, setCurrent] = useState({
  34. date: dayjs(),
  35. list: [],
  36. });
  37. const onAuth = (item, workload) => {
  38. if (workload == 0) return message.error('请上报有效工时');
  39. Modal.confirm({
  40. title: '提示',
  41. content: '是否上报审批?',
  42. okText: '确认',
  43. cancelText: '取消',
  44. onOk() {
  45. console.log(item);
  46. let params = [
  47. {
  48. type_id: Number(item.type_id),
  49. // 父级id
  50. parent_type_id: allType[item.type_id].parent_id,
  51. data: [
  52. {
  53. id: item.id,
  54. project_id: item.project_id,
  55. workload: workload,
  56. day: item.time,
  57. pay_dep_id: item.pay_dep_id,
  58. },
  59. ],
  60. },
  61. ];
  62. dispatch({
  63. type: 'workload/addAuthWorkHours',
  64. payload: params,
  65. callback: (list) => {
  66. let time = current.date.format('YYYY-MM-DD');
  67. setCurrent({
  68. ...current,
  69. list: list.filter((item) => item.time == time),
  70. });
  71. },
  72. });
  73. },
  74. });
  75. };
  76. const MultiAuth = () => {
  77. Modal.confirm({
  78. title: '提示',
  79. content: '是否上报全部审批?',
  80. okText: '确认',
  81. cancelText: '取消',
  82. onOk() {
  83. let params = [];
  84. debugger;
  85. for (let i = 0; i < dataList.length; i++) {
  86. const element = dataList[i];
  87. if (element.audit_state != 0) continue;
  88. var arr = params.find((arr) => arr.type_id == element.type_id);
  89. if (arr) {
  90. console.log(arr);
  91. arr.parent_type_id = allType[element.type_id].parent_id;
  92. arr.data.push({
  93. id: element.id,
  94. project_id: element.project_id,
  95. workload: element.workload,
  96. day: element.time,
  97. pay_dep_id: element.pay_dep_id,
  98. });
  99. } else {
  100. let data = [];
  101. data.push({
  102. id: element.id,
  103. project_id: element.project_id,
  104. workload: element.workload,
  105. day: element.time,
  106. pay_dep_id: element.pay_dep_id,
  107. });
  108. params.push({
  109. type_id: Number(element.type_id),
  110. // 父级id
  111. parent_type_id: allType[element.type_id].parent_id,
  112. data: data,
  113. });
  114. }
  115. }
  116. console.log(params);
  117. dispatch({
  118. type: 'workload/addAuthWorkHours',
  119. payload: params,
  120. });
  121. },
  122. });
  123. };
  124. const currentDayAuth = () => {
  125. var list = current.list;
  126. Modal.confirm({
  127. title: '提示',
  128. content: '是否上报本日审批?',
  129. okText: '确认',
  130. cancelText: '取消',
  131. onOk() {
  132. let params = [];
  133. for (let i = 0; i < list.length; i++) {
  134. const element = list[i];
  135. if (element.audit_state != 0) continue;
  136. var arr = params.find((arr) => arr.type_id == element.type_id);
  137. if (arr) {
  138. console.log(arr);
  139. arr.parent_type_id = allType[element.type_id].parent_id;
  140. arr.data.push({
  141. id: element.id,
  142. project_id: element.project_id,
  143. workload: element.workload,
  144. day: element.time,
  145. pay_dep_id: element.pay_dep_id,
  146. });
  147. } else {
  148. let data = [];
  149. data.push({
  150. id: element.id,
  151. project_id: element.project_id,
  152. workload: element.workload,
  153. day: element.time,
  154. pay_dep_id: element.pay_dep_id,
  155. });
  156. params.push({
  157. type_id: Number(element.type_id),
  158. // 父级id
  159. parent_type_id: allType[element.type_id].parent_id,
  160. data: data,
  161. });
  162. }
  163. }
  164. console.log(params);
  165. dispatch({
  166. type: 'workload/addAuthWorkHours',
  167. payload: params,
  168. });
  169. },
  170. });
  171. };
  172. const onSave = (item, workload) => {
  173. let params = [
  174. {
  175. type_id: Number(item.type_id),
  176. comment: '',
  177. // 父级id
  178. parent_type_id: allType[item.type_id].parent_id,
  179. data: [
  180. {
  181. id: item.id,
  182. project_id: Number(item.project_id),
  183. workload: workload,
  184. day: item.time,
  185. pay_dep_id: item.pay_dep_id,
  186. },
  187. ],
  188. },
  189. ];
  190. dispatch({
  191. type: 'workload/addWorkHours',
  192. payload: params,
  193. callback: (list) => {
  194. let time = current.date.format('YYYY-MM-DD');
  195. setCurrent({
  196. ...current,
  197. list: list.filter((item) => item.time == time),
  198. });
  199. },
  200. });
  201. };
  202. const onDelete = (item) => {
  203. Modal.confirm({
  204. title: '提示',
  205. content: '确认删除工时?',
  206. okText: '确认',
  207. cancelText: '取消',
  208. onOk() {
  209. dispatch({
  210. type: 'workload/deleteWorkHour',
  211. payload: { id: item.id },
  212. callback: (list) => {
  213. let time = current.date.format('YYYY-MM-DD');
  214. setCurrent({
  215. ...current,
  216. list: list.filter((item) => item.time == time),
  217. });
  218. },
  219. });
  220. },
  221. });
  222. };
  223. const onAddWork = (data) => {
  224. dispatch({
  225. type: 'workload/addWorkHours',
  226. payload: data,
  227. callback: (list) => {
  228. setVisible(false);
  229. let time = current.date.format('YYYY-MM-DD');
  230. setCurrent({
  231. ...current,
  232. list: list.filter((item) => item.time == time),
  233. });
  234. },
  235. });
  236. };
  237. const dateCellRender = (value, info) => {
  238. let current = value.format('YYYY-MM-DD');
  239. // console.log(value);
  240. let list = dataList.filter(
  241. (item) => item.time == current && item.status == 0,
  242. );
  243. // let total = list.reduce((total, item) => total + item.workload, 0);
  244. let waitTotal = 0,
  245. successTotal = 0;
  246. list.forEach((item) => {
  247. if (item.audit_state == 2) {
  248. successTotal += item.workload;
  249. } else {
  250. waitTotal += item.workload;
  251. }
  252. });
  253. if (list.length == 0) return info.origin;
  254. let content = (
  255. <div>
  256. {list.map((item) => (
  257. <div key={item.type_id}>
  258. {getName(item)}-{item.TypeInfo?.name}:{item.workload}小时
  259. </div>
  260. ))}
  261. </div>
  262. );
  263. return (
  264. <Popover content={content}>
  265. {successTotal !== 0 && <div>已审批: {successTotal}</div>}
  266. {waitTotal !== 0 && (
  267. <div style={{ color: '#e43d33' }}>待处理: {waitTotal}</div>
  268. )}
  269. </Popover>
  270. );
  271. };
  272. const onChangeDate = (value) => {
  273. console.log(value);
  274. let time = value.format('YYYY-MM-DD');
  275. if (current.date.format('YYYY-MM') != value.format('YYYY-MM')) {
  276. const s_date = value.format('YYYY-MM') + '-01';
  277. const e_date = dayjs(s_date)
  278. .add(1, 'month')
  279. .add(-1, 'days')
  280. .format('YYYY-MM-DD');
  281. dispatch({
  282. type: 'workload/queryWorkHours',
  283. payload: {
  284. pageSize: 9999,
  285. user_id: user.ID,
  286. s_time: s_date + ' 00:00:00',
  287. e_time: e_date + ' 23:59:59',
  288. },
  289. callback: (list) => {
  290. setCurrent({
  291. date: value,
  292. list: list.filter((item) => item.time == time),
  293. });
  294. },
  295. });
  296. } else {
  297. setCurrent({
  298. date: value,
  299. list: dataList.filter((item) => item.time == time),
  300. });
  301. }
  302. };
  303. const getName = (item) => {
  304. let name;
  305. if (item.project_id == '0') {
  306. let pid = allType[item.type_id]?.parent_id;
  307. if (!pid) return '';
  308. name = allType[pid].name;
  309. } else {
  310. name = item.Project.Name;
  311. }
  312. return name;
  313. };
  314. useEffect(() => {
  315. if (!user.ID) return;
  316. // 查询分类以及工时
  317. dispatch({
  318. type: 'workload/queryWorkType',
  319. callback: () => {
  320. const s_date = current.date.format('YYYY-MM') + '-01';
  321. const e_date = dayjs(s_date)
  322. .add(1, 'month')
  323. .add(-1, 'days')
  324. .format('YYYY-MM-DD');
  325. dispatch({
  326. type: 'workload/queryWorkHours',
  327. payload: {
  328. pageSize: 9999,
  329. user_id: user.ID,
  330. s_time: s_date + ' 00:00:00',
  331. e_time: e_date + ' 23:59:59',
  332. },
  333. callback: (list) => {
  334. let time = current.date.format('YYYY-MM-DD');
  335. setCurrent({
  336. ...current,
  337. list: list.filter((item) => item.time == time),
  338. });
  339. },
  340. });
  341. },
  342. });
  343. // 查询项目列表
  344. // dispatch({
  345. // type: 'workload/queryProject',
  346. // });
  347. return () => {
  348. // 清空查询数据
  349. dispatch({
  350. type: 'workload/save',
  351. payload: {
  352. filter: {},
  353. list: [],
  354. },
  355. });
  356. };
  357. }, [user.ID]);
  358. console.log(current.date);
  359. // useEffect(() => {
  360. // onChangeDate(current.date);
  361. // }, [dataList]);
  362. useEffect(() => {
  363. dispatch({
  364. type: 'workload/fetchDepV2',
  365. });
  366. }, []);
  367. return (
  368. <div>
  369. <Spin spinning={loading}>
  370. <Row gutter={8}>
  371. <Col span={10}>
  372. <Calendar
  373. // value={current.date}
  374. // cellRender={dateCellRender}
  375. onChange={onChangeDate}
  376. />
  377. </Col>
  378. <Col span={14}>
  379. <div>
  380. <Button
  381. type="primary"
  382. style={{ marginBottom: 20 }}
  383. onClick={() => setVisible(true)}
  384. >
  385. 新增
  386. </Button>
  387. <Button
  388. type="primary"
  389. style={{ marginBottom: 20, marginLeft: 20 }}
  390. onClick={() => MultiAuth()}
  391. >
  392. 上报所有工时
  393. </Button>
  394. {current.list.length > 0 && (
  395. <Button
  396. type="primary"
  397. style={{ marginBottom: 20, marginLeft: 20, float: 'right' }}
  398. onClick={() => currentDayAuth()}
  399. >
  400. 上报今日工时
  401. </Button>
  402. )}
  403. </div>
  404. <WorkList
  405. allType={allType}
  406. list={current.list}
  407. onAuth={onAuth}
  408. onSave={onSave}
  409. onDelete={onDelete}
  410. depUserMap={depUserMap}
  411. />
  412. </Col>
  413. </Row>
  414. </Spin>
  415. <AddModal
  416. typeList={typeList}
  417. visible={visible}
  418. onOk={onAddWork}
  419. time={current.date?.format('YYYY-MM-DD')}
  420. onCancel={() => setVisible(false)}
  421. depUserTree={depUserTree}
  422. />
  423. </div>
  424. );
  425. }
  426. export default connect(({ workload, user, loading }) => ({
  427. dataList: workload.dataList,
  428. typeList: workload.typeList,
  429. allType: workload.allType,
  430. // currentUser: user.currentUser,
  431. loading: loading.models.workload,
  432. depUserTree: workload.depUserTree,
  433. depUserMap: workload.depUserMap,
  434. }))(List);