myTask.vue 31 KB

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