myTask.vue 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923
  1. <template>
  2. <!-- <div class="app-container">-->
  3. <div>
  4. <el-card shadow="hover">
  5. <!-- 查询表单区域 -->
  6. <el-form :model="queryParams" ref="queryForm" inline>
  7. <el-form-item label="项目名称" prop="projectName">
  8. <el-input
  9. v-model.trim="queryParams.projectName"
  10. placeholder="请输入项目名称"
  11. clearable
  12. @keyup.enter.native="handleQuery"
  13. />
  14. </el-form-item>
  15. <el-form-item label="项目负责人" prop="investHead">
  16. <el-input
  17. v-model.trim="queryParams.investHead"
  18. placeholder="请输入项目负责人"
  19. clearable
  20. @keyup.enter.native="handleQuery"
  21. />
  22. </el-form-item>
  23. <el-form-item label="公司联系人" prop="projectContacts">
  24. <el-input
  25. v-model.trim="queryParams.projectContacts"
  26. placeholder="请输入公司联系人"
  27. clearable
  28. @keyup.enter.native="handleQuery"
  29. />
  30. </el-form-item>
  31. <el-form-item label="渠道" prop="channel">
  32. <el-select v-model="queryParams.channel" placeholder="全部" clearable>
  33. <el-option
  34. v-for="item in channelList"
  35. :key="item.id"
  36. :label="item.channelName"
  37. :value="item.id"
  38. />
  39. <el-option label="无" value="-1" />
  40. </el-select>
  41. </el-form-item>
  42. <el-form-item label="所属组别" prop="projectGroup">
  43. <el-select
  44. v-model="queryParams.projectGroup"
  45. placeholder="全部"
  46. clearable
  47. >
  48. <el-option
  49. v-for="dict in dict.type.project_group"
  50. :key="dict.value"
  51. :label="dict.label"
  52. :value="dict.value"
  53. />
  54. </el-select>
  55. </el-form-item>
  56. <el-form-item label="项目公司" prop="company">
  57. <el-input
  58. v-model.trim="queryParams.company"
  59. placeholder="请输入项目所属公司"
  60. clearable
  61. @keyup.enter.native="handleQuery"
  62. />
  63. </el-form-item>
  64. <!-- 可继续扩展其他查询表单项目,比如项目编号、负责人等 -->
  65. <el-form-item>
  66. <!-- <el-button type="primary" @click="handleQuery">查询</el-button>
  67. <el-button @click="handleReset">重置</el-button>-->
  68. <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
  69. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
  70. </el-form-item>
  71. </el-form>
  72. <!-- Tab 切换区域 -->
  73. <el-tabs v-model="activeTab" type="card" @tab-click="handleTabClick">
  74. <el-tab-pane label="待办任务" name="list1">
  75. <!-- 列表一内容 -->
  76. <el-table
  77. ref="dataTable"
  78. @row-click="clickRow"
  79. class="tableWrapper"
  80. v-loading="loading"
  81. border
  82. :data="myTaskList"
  83. >
  84. <el-table-column type="selection" width="40" align="center" />
  85. <el-table-column
  86. type="index"
  87. label="序号"
  88. width="50"
  89. align="center"
  90. ></el-table-column>
  91. <!-- <el-table-column label="主键id" align="center" prop="id" /> -->
  92. <el-table-column label="项目名称" align="center" prop="projectName">
  93. <template slot-scope="scope">
  94. <div
  95. :title="scope.row.projectName"
  96. >
  97. {{ scope.row.projectName }}
  98. </div>
  99. </template>
  100. </el-table-column>
  101. <el-table-column
  102. label="公司名称"
  103. align="center"
  104. prop="tProjectCompany.companyName"
  105. >
  106. <template slot-scope="scope">
  107. <div :title="scope.row.tProjectCompany.companyName">
  108. {{ scope.row.tProjectCompany.companyName }}
  109. </div>
  110. </template>
  111. </el-table-column>
  112. <el-table-column
  113. label="项目所属城市"
  114. align="center"
  115. prop="tProjectCompany.registeredAddress"
  116. >
  117. <template slot-scope="scope">
  118. <div :title="scope.row.tProjectCompany.registeredAddress">
  119. {{ scope.row.tProjectCompany.registeredAddress }}
  120. </div>
  121. </template>
  122. </el-table-column>
  123. <el-table-column label="所属行业" align="center" prop="industry"
  124. ><template slot-scope="scope">
  125. <dict-tag
  126. :options="dict.type.CUSTOMER_TRADE"
  127. :value="scope.row.industry"
  128. />
  129. </template>
  130. </el-table-column>
  131. <el-table-column label="项目阶段" align="center" prop="projectStage">
  132. <template slot-scope="scope">
  133. <dict-tag
  134. :options="dict.type.project_stage"
  135. :value="scope.row.projectStage"
  136. />
  137. </template>
  138. </el-table-column>
  139. <!-- <el-table-column
  140. label="项目状态"
  141. align="center"
  142. prop="projectState"
  143. width="120"
  144. >
  145. <template slot-scope="scope">
  146. <dict-tag
  147. :options="dict.type.project_state"
  148. :value="scope.row.projectState"
  149. />
  150. </template>
  151. </el-table-column>-->
  152. <el-table-column
  153. label="备案时间"
  154. align="center"
  155. prop="tProjectCompany.filingTime"
  156. >
  157. <template slot-scope="scope">
  158. <span>{{
  159. parseTime(scope.row.tProjectCompany.filingTime, "{y}-{m}-{d}")
  160. }}</span>
  161. </template>
  162. </el-table-column>
  163. <el-table-column label="项目负责人" align="center" prop="investHead">
  164. <template slot-scope="scope">
  165. <div :title="scope.row.investHead">
  166. {{ scope.row.investHead }}
  167. </div>
  168. </template>
  169. </el-table-column>
  170. <!-- <el-table-column label="项目编号" align="center" prop="projectCode" /> -->
  171. <el-table-column
  172. label="渠道"
  173. align="center"
  174. prop="tProjectChannel.channelName"
  175. >
  176. <template slot-scope="scope">
  177. <div
  178. v-if="
  179. scope.row.tProjectChannel && scope.row.tProjectChannel.channelName
  180. "
  181. :title="scope.row.tProjectChannel.channelName"
  182. >
  183. {{ scope.row.tProjectChannel.channelName }}
  184. </div>
  185. </template>
  186. </el-table-column>
  187. <el-table-column label="状态" align="center" prop="investHead">
  188. <template slot-scope="scope">
  189. <div :title="scope.row.delFlag === '1' ? '终止' : '正常'">
  190. {{ scope.row.delFlag === "1" ? "终止" : "正常" }}
  191. </div>
  192. </template>
  193. </el-table-column>
  194. <el-table-column label="申请人" align="center" prop="startUserName">
  195. <template slot-scope="scope">
  196. <div :title="scope.row.startUserName">
  197. {{ scope.row.startUserName }}
  198. </div>
  199. </template>
  200. </el-table-column>
  201. <el-table-column label="申请人" align="center" prop="startUserName">
  202. <template slot-scope="scope">
  203. <div :title="scope.row.startUserName">
  204. {{ scope.row.startUserName }}
  205. </div>
  206. </template>
  207. </el-table-column>
  208. <el-table-column label="申请日期" align="center" prop="createTime">
  209. <template slot-scope="scope">
  210. <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}</span>
  211. </template>
  212. </el-table-column>
  213. <el-table-column label="当前节点" align="center" prop="taskName">
  214. <template slot-scope="scope">
  215. <div :title="scope.row.taskName" class="public-text-blue public-cursor" @click="handleReadImage(scope.row)">
  216. {{ scope.row.taskName}}
  217. </div>
  218. </template>
  219. </el-table-column>
  220. <el-table-column label="当前处理人" align="center" prop="assigneeName">
  221. <template slot-scope="scope">
  222. <div :title="scope.row.assigneeName">
  223. {{ scope.row.assigneeName}}
  224. </div>
  225. </template>
  226. </el-table-column>
  227. <el-table-column label="流程状态" align="center" prop="status">
  228. <template slot-scope="scope">
  229. <div :title="scope.row.status">
  230. <span v-if="scope.row.status === 0">暂存</span>
  231. <span v-else-if="scope.row.status === 1">已提交</span>
  232. <span v-else-if="scope.row.status === 2">审批中</span>
  233. <span v-else-if="scope.row.status === 3">审批完成</span>
  234. <span v-else-if="scope.row.status === 4">关闭</span>
  235. </div>
  236. </template>
  237. </el-table-column>
  238. <el-table-column label="操作" align="center" width="150" fixed="right" class-name="small-padding fixed-width">
  239. <template slot-scope="scope">
  240. <el-button v-if="scope.row.taskDefKey=='modifyApply'" type="text" @click="handleEdit(scope.row)">处理</el-button>
  241. <template v-else>
  242. <!-- 1. 签收按钮:无签收人时显示 -->
  243. <el-button v-if="!scope.row.assignee" type="primary" size="mini" @click="handleSign(scope.row)">签收</el-button>
  244. <!-- 2. 处理按钮:有签收人时显示 -->
  245. <el-button v-else size="mini" type="text" @click="handleProcess(scope.row)">处理</el-button>
  246. <!-- 3. 撤回按钮:需补充逻辑(比如仅未签收可撤回,可结合 signPerson 判断) -->
  247. <!-- <el-button v-if="!scope.row.assignee" size="mini" type="text" icon="el-icon-refresh-right" @click="handleWithdraw(scope.row)">撤回</el-button>-->
  248. <!-- 4. 详情按钮:一直显示 -->
  249. </template>
  250. <el-button type="text" size="small" @click="handleDetail(scope.row)">详情</el-button>
  251. </template>
  252. </el-table-column>
  253. </el-table>
  254. <!-- 分页 -->
  255. <pagination
  256. v-show="myTaskTotal > 0"
  257. :total="myTaskTotal"
  258. :page.sync="queryParams.pageNum"
  259. :limit.sync="queryParams.pageSize"
  260. @pagination="getMyTaskList"
  261. />
  262. </el-tab-pane>
  263. <el-tab-pane label="已办任务" name="list2">
  264. <!-- 我的单据表格 -->
  265. <!-- 列表一内容 -->
  266. <el-table
  267. ref="dataTable"
  268. @row-click="clickRow"
  269. class="tableWrapper"
  270. v-loading="loading"
  271. border
  272. :data="myDoneTaskList"
  273. >
  274. <el-table-column type="selection" width="40" align="center" />
  275. <el-table-column
  276. type="index"
  277. label="序号"
  278. width="50"
  279. align="center"
  280. ></el-table-column>
  281. <!-- <el-table-column label="主键id" align="center" prop="id" /> -->
  282. <el-table-column label="项目名称" align="center" prop="projectName">
  283. <template slot-scope="scope">
  284. <div
  285. :title="scope.row.projectName"
  286. >
  287. {{ scope.row.projectName }}
  288. </div>
  289. </template>
  290. </el-table-column>
  291. <el-table-column
  292. label="公司名称"
  293. align="center"
  294. prop="tProjectCompany.companyName"
  295. >
  296. <template slot-scope="scope">
  297. <div :title="scope.row.tProjectCompany.companyName">
  298. {{ scope.row.tProjectCompany.companyName }}
  299. </div>
  300. </template>
  301. </el-table-column>
  302. <el-table-column
  303. label="项目所属城市"
  304. align="center"
  305. prop="tProjectCompany.registeredAddress"
  306. >
  307. <template slot-scope="scope">
  308. <div :title="scope.row.tProjectCompany.registeredAddress">
  309. {{ scope.row.tProjectCompany.registeredAddress }}
  310. </div>
  311. </template>
  312. </el-table-column>
  313. <el-table-column label="所属行业" align="center" prop="industry"
  314. ><template slot-scope="scope">
  315. <dict-tag
  316. :options="dict.type.CUSTOMER_TRADE"
  317. :value="scope.row.industry"
  318. />
  319. </template>
  320. </el-table-column>
  321. <el-table-column label="项目阶段" align="center" prop="projectStage">
  322. <template slot-scope="scope">
  323. <dict-tag
  324. :options="dict.type.project_stage"
  325. :value="scope.row.projectStage"
  326. />
  327. </template>
  328. </el-table-column>
  329. <!-- <el-table-column
  330. label="项目状态"
  331. align="center"
  332. prop="projectState"
  333. width="120"
  334. >
  335. <template slot-scope="scope">
  336. <dict-tag
  337. :options="dict.type.project_state"
  338. :value="scope.row.projectState"
  339. />
  340. </template>
  341. </el-table-column>-->
  342. <el-table-column
  343. label="备案时间"
  344. align="center"
  345. prop="tProjectCompany.filingTime"
  346. >
  347. <template slot-scope="scope">
  348. <span>{{
  349. parseTime(scope.row.tProjectCompany.filingTime, "{y}-{m}-{d}")
  350. }}</span>
  351. </template>
  352. </el-table-column>
  353. <el-table-column label="项目负责人" align="center" prop="investHead">
  354. <template slot-scope="scope">
  355. <div :title="scope.row.investHead">
  356. {{ scope.row.investHead }}
  357. </div>
  358. </template>
  359. </el-table-column>
  360. <el-table-column
  361. label="渠道"
  362. align="center"
  363. prop="tProjectChannel.channelName"
  364. >
  365. <template slot-scope="scope">
  366. <div
  367. v-if="
  368. scope.row.tProjectChannel && scope.row.tProjectChannel.channelName
  369. "
  370. :title="scope.row.tProjectChannel.channelName"
  371. >
  372. {{ scope.row.tProjectChannel.channelName }}
  373. </div>
  374. </template>
  375. </el-table-column>
  376. <el-table-column label="状态" align="center" prop="investHead">
  377. <template slot-scope="scope">
  378. <div :title="scope.row.delFlag === '1' ? '终止' : '正常'">
  379. {{ scope.row.delFlag === "1" ? "终止" : "正常" }}
  380. </div>
  381. </template>
  382. </el-table-column>
  383. <el-table-column label="申请人" align="center" prop="startUserName">
  384. <template slot-scope="scope">
  385. <div :title="scope.row.startUserName">
  386. {{ scope.row.startUserName }}
  387. </div>
  388. </template>
  389. </el-table-column>
  390. <el-table-column label="申请日期" align="center" prop="createTime">
  391. <template slot-scope="scope">
  392. <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}</span>
  393. </template>
  394. </el-table-column>
  395. <el-table-column label="处理节点" align="center" prop="taskName">
  396. <template slot-scope="scope">
  397. <div v-if="scope.row.deployId !== null && scope.row.deployId !== undefined && scope.row.deployId !== ''" :title="scope.row.taskName" class="public-text-blue public-cursor" @click="handleReadImage(scope.row)">
  398. {{ scope.row.taskName}}
  399. </div>
  400. <div v-else :title="scope.row.taskName">
  401. {{ scope.row.taskName}}
  402. </div>
  403. </template>
  404. </el-table-column>
  405. <el-table-column label="处理人" align="center" prop="assigneeName">
  406. <template slot-scope="scope">
  407. <div :title="scope.row.assigneeName">
  408. {{ scope.row.assigneeName}}
  409. </div>
  410. </template>
  411. </el-table-column>
  412. <el-table-column label="流程状态" align="center" prop="status">
  413. <template slot-scope="scope">
  414. <div :title="scope.row.status">
  415. <span v-if="scope.row.status === 0">暂存</span>
  416. <span v-else-if="scope.row.status === 1">已提交</span>
  417. <span v-else-if="scope.row.status === 2">审批中</span>
  418. <span v-else-if="scope.row.status === 3">审批完成</span>
  419. <span v-else-if="scope.row.status === 4">关闭</span>
  420. </div>
  421. </template>
  422. </el-table-column>
  423. <el-table-column label="操作" align="center" width="150" fixed="right" class-name="small-padding fixed-width">
  424. <template slot-scope="scope">
  425. <el-button type="text" size="small" @click="handleDetail(scope.row)">详情</el-button>
  426. </template>
  427. </el-table-column>
  428. </el-table>
  429. <!-- 分页 -->
  430. <pagination
  431. v-show="myTotal > 0"
  432. :total="myTotal"
  433. :page.sync="queryParams.pageNum"
  434. :limit.sync="queryParams.pageSize"
  435. @pagination="getMyDoneTaskList"
  436. />
  437. </el-tab-pane>
  438. <el-tab-pane label="我的单据" name="list3">
  439. <!-- 我的单据表格 -->
  440. <!-- 列表一内容 -->
  441. <el-table
  442. ref="dataTable"
  443. @row-click="clickRow"
  444. class="tableWrapper"
  445. v-loading="loading"
  446. border
  447. :data="myList"
  448. >
  449. <el-table-column type="selection" width="40" align="center" />
  450. <el-table-column
  451. type="index"
  452. label="序号"
  453. width="50"
  454. align="center"
  455. ></el-table-column>
  456. <!-- <el-table-column label="主键id" align="center" prop="id" /> -->
  457. <el-table-column label="项目名称" align="center" prop="projectName">
  458. <template slot-scope="scope">
  459. <div
  460. :title="scope.row.projectName"
  461. >
  462. {{ scope.row.projectName }}
  463. </div>
  464. </template>
  465. </el-table-column>
  466. <el-table-column
  467. label="公司名称"
  468. align="center"
  469. prop="tProjectCompany.companyName"
  470. >
  471. <template slot-scope="scope">
  472. <div :title="scope.row.tProjectCompany.companyName">
  473. {{ scope.row.tProjectCompany.companyName }}
  474. </div>
  475. </template>
  476. </el-table-column>
  477. <el-table-column
  478. label="项目所属城市"
  479. align="center"
  480. prop="tProjectCompany.registeredAddress"
  481. >
  482. <template slot-scope="scope">
  483. <div :title="scope.row.tProjectCompany.registeredAddress">
  484. {{ scope.row.tProjectCompany.registeredAddress }}
  485. </div>
  486. </template>
  487. </el-table-column>
  488. <el-table-column label="所属行业" align="center" prop="industry"
  489. ><template slot-scope="scope">
  490. <dict-tag
  491. :options="dict.type.CUSTOMER_TRADE"
  492. :value="scope.row.industry"
  493. />
  494. </template>
  495. </el-table-column>
  496. <el-table-column label="项目阶段" align="center" prop="projectStage">
  497. <template slot-scope="scope">
  498. <dict-tag
  499. :options="dict.type.project_stage"
  500. :value="scope.row.projectStage"
  501. />
  502. </template>
  503. </el-table-column>
  504. <!-- <el-table-column
  505. label="项目状态"
  506. align="center"
  507. prop="projectState"
  508. width="120"
  509. >
  510. <template slot-scope="scope">
  511. <dict-tag
  512. :options="dict.type.project_state"
  513. :value="scope.row.projectState"
  514. />
  515. </template>
  516. </el-table-column>-->
  517. <el-table-column
  518. label="备案时间"
  519. align="center"
  520. prop="tProjectCompany.filingTime"
  521. >
  522. <template slot-scope="scope">
  523. <span>{{
  524. parseTime(scope.row.tProjectCompany.filingTime, "{y}-{m}-{d}")
  525. }}</span>
  526. </template>
  527. </el-table-column>
  528. <el-table-column label="项目负责人" align="center" prop="investHead">
  529. <template slot-scope="scope">
  530. <div :title="scope.row.investHead">
  531. {{ scope.row.investHead }}
  532. </div>
  533. </template>
  534. </el-table-column>
  535. <el-table-column
  536. label="渠道"
  537. align="center"
  538. prop="tProjectChannel.channelName"
  539. >
  540. <template slot-scope="scope">
  541. <div
  542. v-if="
  543. scope.row.tProjectChannel && scope.row.tProjectChannel.channelName
  544. "
  545. :title="scope.row.tProjectChannel.channelName"
  546. >
  547. {{ scope.row.tProjectChannel.channelName }}
  548. </div>
  549. </template>
  550. </el-table-column>
  551. <el-table-column label="状态" align="center" prop="investHead">
  552. <template slot-scope="scope">
  553. <div :title="scope.row.delFlag === '1' ? '终止' : '正常'">
  554. {{ scope.row.delFlag === "1" ? "终止" : "正常" }}
  555. </div>
  556. </template>
  557. </el-table-column>
  558. <el-table-column label="申请人" align="center" prop="startUserName">
  559. <template slot-scope="scope">
  560. <div :title="scope.row.startUserName">
  561. {{ scope.row.startUserName }}
  562. </div>
  563. </template>
  564. </el-table-column>
  565. <el-table-column label="申请日期" align="center" prop="createTime">
  566. <template slot-scope="scope">
  567. <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d}") }}</span>
  568. </template>
  569. </el-table-column>
  570. <el-table-column label="当前节点" align="center" prop="taskName">
  571. <template slot-scope="scope">
  572. <div :title="scope.row.taskName" class="public-text-blue public-cursor" @click="handleReadImage(scope.row)">
  573. {{ scope.row.taskName}}
  574. </div>
  575. </template>
  576. </el-table-column>
  577. <el-table-column label="当前处理人" align="center" prop="assigneeName">
  578. <template slot-scope="scope">
  579. <div :title="scope.row.assigneeName">
  580. {{ scope.row.assigneeName}}
  581. </div>
  582. </template>
  583. </el-table-column>
  584. <el-table-column label="流程状态" align="center" prop="status">
  585. <template slot-scope="scope">
  586. <div :title="scope.row.status">
  587. <span v-if="scope.row.status === 0">暂存</span>
  588. <span v-else-if="scope.row.status === 1">已提交</span>
  589. <span v-else-if="scope.row.status === 2">审批中</span>
  590. <span v-else-if="scope.row.status === 3">审批完成</span>
  591. <span v-else-if="scope.row.status === 4">关闭</span>
  592. </div>
  593. </template>
  594. </el-table-column>
  595. <el-table-column label="操作" align="center" width="150" fixed="right" class-name="small-padding fixed-width">
  596. <template slot-scope="scope">
  597. <el-button type="text" size="small" @click="handleDetail(scope.row)">详情</el-button>
  598. </template>
  599. </el-table-column>
  600. </el-table>
  601. <!-- 分页 -->
  602. <pagination
  603. v-show="myTotal > 0"
  604. :total="myTotal"
  605. :page.sync="queryParams.pageNum"
  606. :limit.sync="queryParams.pageSize"
  607. @pagination="getMyList"
  608. />
  609. </el-tab-pane>
  610. </el-tabs>
  611. </el-card>
  612. <!-- Flowable 流程图弹窗 -->
  613. <!-- 流程图 -->
  614. <el-dialog :title="readImage.title" :visible.sync="readImage.open" width="70%" append-to-body>
  615. <!-- <el-image :src="readImage.src"></el-image> -->
  616. <flow :flowData="flowData"/>
  617. </el-dialog>
  618. </div>
  619. </template>
  620. <script>
  621. import { getMyTaskList,getMyDoneTaskList,getMyList } from "@/api/project/investOpp/pool";
  622. import { flowXmlAndNode } from "@/api/flowable/definition";
  623. import { listChannel } from "@/api/invest/channel";
  624. import dueDiligenceList from "../../invest/components/dueDiligenceList.vue";
  625. import followList from "../../invest/components/followList.vue";
  626. import meetingList from "../../invest/components/meetingList.vue";
  627. import businessUpdate from "../../invest/components/businessUpdate.vue";
  628. import flow from '@/views/flowable/task/todo/detail/flow';
  629. import { mapGetters } from "vuex";
  630. export default {
  631. dicts: ["project_group", "project_stage", "project_state", "CUSTOMER_TRADE"],
  632. components: {
  633. dueDiligenceList,
  634. followList,
  635. meetingList,
  636. businessUpdate,
  637. flow
  638. },
  639. data() {
  640. return {
  641. // 当前激活的 Tab
  642. activeTab:"list1",
  643. // 遮罩层
  644. loading: false,
  645. // 查询参数
  646. queryParams: {
  647. id: null,
  648. pageNum: 1,
  649. pageSize: 10,
  650. projectName: null,
  651. projectGroup: "",
  652. projectCode: null,
  653. channel: null,
  654. contactDate: null,
  655. projectDate: null,
  656. decisionDate: null,
  657. industry: null,
  658. company: null,
  659. projectContacts: null,
  660. investHead: null,
  661. previousFinancing: null,
  662. financingStage: null,
  663. financingMoney: null,
  664. financingDate: null,
  665. investValuation: null,
  666. investMoney: null,
  667. investType: null,
  668. investPloy: null,
  669. investWorth: null,
  670. projectStage: null,
  671. projectState: null,
  672. orderByColumn: "createTime",
  673. isAsc: "desc",
  674. createTime: null,
  675. },
  676. // 数据列表(分开存储不同Tab的数据)
  677. myTaskList: [], // 待办任务数据
  678. // 待办任务总条数,用于分页
  679. myTaskTotal: 0,
  680. myDoneTaskList: [], // 已办任务数据
  681. // 已办任务总条数,用于分页
  682. myDoneTaskTotal: 0,
  683. myList: [], // 我的单据数据
  684. // 我的单据总条数,用于分页
  685. myTotal: 0,
  686. channelList: [], //渠道
  687. //流程图信息
  688. readImage:{
  689. open: false,
  690. src: "",
  691. },
  692. // xml
  693. flowData: {},
  694. };
  695. },
  696. computed: {
  697. ...mapGetters(["user"]),
  698. },
  699. created() {
  700. // 页面初始化时,加载当前激活Tab的数据
  701. this.initTabData();
  702. },
  703. mounted() {
  704. // 渠道
  705. listChannel({
  706. pageNum: 1,
  707. pageSize: 100,
  708. }).then((response) => {
  709. this.channelList = response.rows;
  710. });
  711. },
  712. methods: {
  713. // Tab切换事件处理
  714. handleTabClick(tab) {
  715. // tab为当前点击的Tab对象,tab.name即标识(list1/list2)
  716. this.activeTab = tab.name;
  717. // 根据Tab标识加载对应数据
  718. this.initTabData();
  719. },
  720. // 初始化当前Tab数据(支持传入Tab名,默认用activeTab)
  721. initTabData() {
  722. switch (this.activeTab) {
  723. case "list1":
  724. // 待办任务:调用待办查询方法
  725. this.getMyTaskList();
  726. break;
  727. case "list2":
  728. // 已办任务:调用已办查询方法
  729. this.getMyDoneTaskList();
  730. break;
  731. case "list3":
  732. // 我的单据:调用单据查询方法
  733. this.getMyList();
  734. break;
  735. default:
  736. break;
  737. }
  738. },
  739. // 1. 查询“我的待办任务”数据
  740. getMyTaskList() {
  741. this.loading = true;
  742. // 调用待办任务接口(示例)
  743. getMyTaskList(this.queryParams).then((response) => {
  744. this.myTaskList = response.rows; // 表格数据
  745. this.myTaskTotal = response.total; // 分页总条数
  746. this.loading = false;
  747. }).catch(() => {
  748. this.loading = false;
  749. });
  750. },
  751. // 2. 查询“我的已办任务”数据
  752. getMyDoneTaskList() {
  753. this.loading = true;
  754. // 调用待办任务接口(示例)
  755. getMyDoneTaskList(this.queryParams).then((response) => {
  756. this.myDoneTaskList = response.rows; // 表格数据
  757. this.myDoneTaskTotal = response.total; // 分页总条数
  758. this.loading = false;
  759. }).catch(() => {
  760. this.loading = false;
  761. });
  762. },
  763. // 3. 查询“我的单据”数据
  764. getMyList() {
  765. this.loading = true;
  766. // 调用我的单据接口(示例)
  767. getMyList(this.queryParams).then((response) => {
  768. this.myList = response.rows;
  769. this.myTotal = response.total;
  770. this.loading = false;
  771. }).catch(() => {
  772. this.loading = false;
  773. });
  774. },
  775. /** 搜索按钮操作 */
  776. handleQuery() {
  777. this.queryParams.pageNum = 1;
  778. this.initTabData();
  779. },
  780. /** 重置按钮操作 */
  781. resetQuery() {
  782. this.resetForm("queryForm");
  783. this.queryParams.orderByColumn = "createTime";
  784. this.queryParams.isAsc = "desc";
  785. this.queryParams.pageNum = 1;
  786. this.queryParams.pageSize = 10;
  787. this.handleQuery();
  788. },
  789. clickRow(row) {
  790. this.$refs.dataTable.toggleRowSelection(row);
  791. },
  792. // 跳转到处理页面(暂存节点页面)
  793. handleEdit(row){
  794. const id = row.id || this.ids;
  795. const pInstId=row.procInstId;
  796. this.$router.push({ path: "/project/investOpp/edit", query: { id: id , pInstId: pInstId} });
  797. },
  798. // 签收操作
  799. handleSign(row) {
  800. // 标记签收人、更新状态等逻辑
  801. row.signPerson = '当前用户';
  802. this.$message.success('签收成功');
  803. },
  804. // 跳转到处理页面
  805. handleProcess(row){
  806. /*this.$router.push({ path: '/flowable/task/todo/detail/index',
  807. query: {
  808. procInsId: row.procInsId,
  809. executionId: row.executionId,
  810. deployId: row.deployId,
  811. taskId: row.taskId,
  812. taskName: row.taskName,
  813. startUser: row.startUserName + '-' + row.startDeptName,
  814. }})*/
  815. const id = row.id || this.ids;
  816. const pInstId=row.procInstId;
  817. this.$router.push({ path: "/project/investOpp/audit", query: { id:id , pInstId: pInstId } });
  818. },
  819. // 撤回操作
  820. handleWithdraw(row) {
  821. // 撤回逻辑(比如清空签收人)
  822. row.signPerson = '';
  823. this.$message.success('已撤回');
  824. },
  825. // 详情操作
  826. /*handleFlowRecord(row) {
  827. // 查看流程详情逻辑
  828. console.log('流程详情:', row);
  829. }*/
  830. /*详情*/
  831. handleDetail(row) {
  832. const id = row.id || this.ids;
  833. const pInstId=row.procInstId;
  834. this.$router.push({ path: "/project/investOpp/detail", query: { id: id , pInstId: pInstId } });
  835. },
  836. /** 修改按钮操作 */
  837. handleUpdate(row) {
  838. const id = row.id;
  839. this.$router.push({ path: "/invest/pool/add", query: { id: id } });
  840. },
  841. /**终止按钮操作 */
  842. handleDelete(row) {
  843. const ids = row.id || this.ids;
  844. const idsName = row.projectName ? row.projectName : this.idsName;
  845. this.$modal
  846. .confirm('是否终止"' + idsName + '"项目?')
  847. .then(function () {
  848. return delPool(ids);
  849. })
  850. .then(() => {
  851. this.getList();
  852. this.$modal.msgSuccess("已终止");
  853. })
  854. .catch(() => {});
  855. },
  856. /** 导出按钮操作 */
  857. handleExport() {
  858. this.download(
  859. "invest/pool/export",
  860. {
  861. ...this.queryParams,
  862. },
  863. `pool_${new Date().getTime()}.xlsx`
  864. );
  865. },
  866. /** 流程图查看 */
  867. handleReadImage(row){
  868. this.readImage.title = "流程图";
  869. this.readImage.open = true;
  870. // this.readImage.src = process.env.VUE_APP_BASE_API + "/flowable/definition/readImage/" + deploymentId;
  871. flowXmlAndNode({procInsId: row.procInstId,deployId:row.deployId}).then(res => {
  872. this.flowData = res.data;
  873. })
  874. },
  875. },
  876. };
  877. </script>
  878. <style lang="scss" scoped>
  879. .tableWrapper {
  880. font-size: 12px;
  881. color: #000;
  882. ::v-deep .el-table__header-wrapper th {
  883. font-size: 12px;
  884. font-weight: bolder;
  885. color: #000;
  886. }
  887. ::v-deep td.el-table__cell:not(:last-child) div {
  888. text-overflow: -o-ellipsis-lastline;
  889. overflow: hidden;
  890. text-overflow: ellipsis;
  891. display: -webkit-box;
  892. -webkit-line-clamp: 1;
  893. line-clamp: 1;
  894. -webkit-box-orient: vertical;
  895. }
  896. }
  897. /**找到表头那一行,然后把里面的复选框隐藏掉**/
  898. .hideHeaderCheckBox
  899. ::v-deep
  900. .el-table__header-wrapper
  901. .el-table__header
  902. .el-checkbox {
  903. display: none;
  904. }
  905. </style>