应用层PC端前端服务

caseList.vue 16KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582
  1. <template>
  2. <div class="app-container">
  3. <el-form
  4. :model="queryParams"
  5. ref="queryForm"
  6. size="small"
  7. :inline="true"
  8. label-width="68px"
  9. >
  10. <el-form-item label="案件编号" prop="caseNum">
  11. <el-input
  12. v-model="queryParams.caseNum"
  13. placeholder="请输入案件编号"
  14. clearable
  15. @keyup.enter.native="handleQuery"
  16. />
  17. </el-form-item>
  18. <el-form-item label="案件状态" prop="caseStatus">
  19. <el-select
  20. v-model="queryParams.caseStatus"
  21. placeholder="请选择案件状态"
  22. clearable
  23. @keyup.enter.native="handleQuery"
  24. >
  25. <el-option
  26. v-for="dict in dict.type.case_status"
  27. :key="dict.value"
  28. :label="dict.label"
  29. :value="dict.value"
  30. ></el-option>
  31. </el-select>
  32. </el-form-item>
  33. <el-form-item label="开庭日期" prop="hearDate">
  34. <el-date-picker
  35. v-model="queryParams.hearDate"
  36. type="daterange"
  37. range-separator="至"
  38. start-placeholder="开始日期"
  39. end-placeholder="结束日期"
  40. >
  41. </el-date-picker>
  42. </el-form-item>
  43. <el-form-item>
  44. <el-button
  45. type="primary"
  46. icon="el-icon-search"
  47. size="mini"
  48. @click="handleQuery"
  49. >搜索</el-button
  50. >
  51. <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
  52. >重置</el-button
  53. >
  54. </el-form-item>
  55. </el-form>
  56. <el-row :gutter="10" class="mb8">
  57. <el-col :span="1.5">
  58. <el-button
  59. type="primary"
  60. plain
  61. icon="el-icon-plus"
  62. size="mini"
  63. @click="filingApplication"
  64. v-hasPermi="['monitor:job:add']"
  65. >案件录入</el-button
  66. >
  67. <el-button
  68. type="primary"
  69. plain
  70. icon="el-icon-plus"
  71. size="mini"
  72. @click="batchApplication"
  73. v-hasPermi="['monitor:job:add']"
  74. >案件批量导入</el-button
  75. >
  76. </el-col>
  77. </el-row>
  78. <el-table v-loading="loading" :data="dataList" style="width: 100%">
  79. <el-table-column label="序号" type="index" align="center">
  80. <template slot-scope="scope">
  81. <span>{{
  82. (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
  83. }}</span>
  84. </template>
  85. </el-table-column>
  86. <el-table-column
  87. label="案件编号"
  88. align="center"
  89. prop="caseNum"
  90. :show-overflow-tooltip="true"
  91. />
  92. <!-- <el-table-column
  93. label="申请人"
  94. align="center"
  95. prop="caseAffiliates[0].name"
  96. :show-overflow-tooltip="true"
  97. /> -->
  98. <el-table-column
  99. label="案件标的"
  100. align="center"
  101. prop="caseSubjectAmount"
  102. />
  103. <el-table-column
  104. label="立案日期"
  105. align="center"
  106. prop="registerDate"
  107. :show-overflow-tooltip="true"
  108. />
  109. <!-- 仲裁员 -->
  110. <el-table-column label="仲裁员" align="center" prop="arbitratorName" />
  111. <!-- 开庭日期 -->
  112. <el-table-column
  113. label="开庭日期"
  114. align="center"
  115. prop="hearDate"
  116. :show-overflow-tooltip="true"
  117. />
  118. <el-table-column label="案件状态" align="center" prop="caseStatus" />
  119. <el-table-column
  120. label="操作"
  121. align="center"
  122. class-name="small-padding fixed-width"
  123. >
  124. <template slot-scope="scope">
  125. <!-- <el-button
  126. size="mini"
  127. type="text"
  128. icon="el-icon-check"
  129. @click="onsubmitRow(scope.row)"
  130. v-hasPermi="['monitor:online:forceLogout']"
  131. >提交</el-button
  132. > -->
  133. <el-button
  134. size="mini"
  135. type="text"
  136. icon="el-icon-zoom-in"
  137. @click="detailRow(scope.row)"
  138. v-hasPermi="['monitor:online:forceLogout']"
  139. >详情</el-button
  140. >
  141. <el-button
  142. size="mini"
  143. type="text"
  144. icon="el-icon-edit"
  145. @click="editRow(scope.row)"
  146. v-hasPermi="['monitor:online:forceLogout']"
  147. >修改</el-button
  148. >
  149. <el-button
  150. size="mini"
  151. type="text"
  152. icon="el-icon-delete"
  153. @click="deleteRow(scope.row)"
  154. v-hasPermi="['monitor:online:forceLogout']"
  155. >删除</el-button
  156. >
  157. <el-button
  158. size="mini"
  159. type="text"
  160. icon="el-icon-zoom-in"
  161. @click="filingreviewRow(scope.row)"
  162. v-hasPermi="['monitor:online:forceLogout']"
  163. >立案审查</el-button
  164. >
  165. <el-button
  166. size="mini"
  167. type="text"
  168. icon="el-icon-tickets"
  169. @click="viewpaymentRow(scope.row)"
  170. v-hasPermi="['monitor:online:forceLogout']"
  171. >查看缴费</el-button
  172. >
  173. <!-- <el-button
  174. size="mini"
  175. type="text"
  176. icon="el-icon-data-analysis"
  177. @click="formationcourtRow(scope.row)"
  178. v-hasPermi="['monitor:online:forceLogout']"
  179. >组庭</el-button
  180. > -->
  181. <el-button
  182. size="mini"
  183. type="text"
  184. icon="el-icon-s-check"
  185. @click="courtconfirmationRow(scope.row)"
  186. v-hasPermi="['monitor:online:forceLogout']"
  187. >组庭确认</el-button
  188. >
  189. <el-button
  190. size="mini"
  191. type="text"
  192. icon="el-icon-check"
  193. @click="courtreviewRow(scope.row)"
  194. v-hasPermi="['monitor:online:forceLogout']"
  195. >组庭审核</el-button
  196. >
  197. <el-button
  198. size="mini"
  199. type="text"
  200. icon="el-icon-sort"
  201. @click="choosetrialmethodRow(scope.row)"
  202. v-hasPermi="['monitor:online:forceLogout']"
  203. >选择开庭方式</el-button
  204. >
  205. <el-button
  206. size="mini"
  207. type="text"
  208. icon="el-icon-edit-outline"
  209. @click="adjudicaterecordRow(scope.row)"
  210. v-hasPermi="['monitor:online:forceLogout']"
  211. >书面审理</el-button
  212. >
  213. <el-button
  214. size="mini"
  215. type="text"
  216. icon="el-icon-service"
  217. @click="trialcourtRow(scope.row)"
  218. v-hasPermi="['monitor:online:forceLogout']"
  219. >开庭审理</el-button
  220. >
  221. <el-button
  222. size="mini"
  223. type="text"
  224. icon="el-icon-document"
  225. @click="generateawardRow(scope.row)"
  226. v-hasPermi="['monitor:online:forceLogout']"
  227. >生成裁决书</el-button
  228. >
  229. <el-button
  230. size="mini"
  231. type="text"
  232. icon="el-icon-receiving"
  233. @click="fileRow(scope.row)"
  234. v-hasPermi="['monitor:online:forceLogout']"
  235. >归档</el-button
  236. >
  237. </template>
  238. </el-table-column>
  239. </el-table>
  240. <pagination
  241. v-show="total > 0"
  242. :total="total"
  243. :page.sync="queryParams.pageNum"
  244. :limit.sync="queryParams.pageSize"
  245. @pagination="getcaseApply"
  246. />
  247. <!-- 立案申请弹框 -->
  248. <caseentryDialog
  249. :visible="visible"
  250. @cancel="cancel"
  251. :form="form"
  252. :dialogtitle="dialogtitle"
  253. :getcaseApply="getcaseApply"
  254. :flag="flag"
  255. :initpaymentArr="initpaymentArr"
  256. :initpaymentArr1="initpaymentArr1"
  257. ></caseentryDialog>
  258. <!-- 批量申请弹框 openbatch-->
  259. <batchDialog
  260. :openbatch="openbatch"
  261. @cancelBatch="cancelBatch"
  262. :getcaseApply="getcaseApply"
  263. ></batchDialog>
  264. <!-- 组庭页面---改为组庭审核 -->
  265. <formateCourtDialog
  266. :showformateCourt="showformateCourt"
  267. @cancelcourtDialog="cancelcourtDialog"
  268. :formateCourtData="formateCourtData"
  269. @getcaseApply="getcaseApply"
  270. ></formateCourtDialog>
  271. <!-- 组庭审核--改组庭确认 -->
  272. <courtReviewDialog
  273. :showcourtReview="showcourtReview"
  274. @cancelcourtReview="cancelcourtReview"
  275. ></courtReviewDialog>
  276. <!-- 选择开庭方式 -->
  277. <choosetrialmethodDaiog
  278. :showchoosetrialmethod="showchoosetrialmethod"
  279. :choosetrialmethodata="choosetrialmethodata"
  280. @getcaseApply="getcaseApply"
  281. @cancelshowchoosetrialMethod="cancelshowchoosetrialMethod"
  282. ></choosetrialmethodDaiog>
  283. <!-- 书面审理 -->
  284. <adjudicaterecordDialog
  285. :showadjudicaterecord="showadjudicaterecord"
  286. @canceladjudicaterecord="canceladjudicaterecord"
  287. ></adjudicaterecordDialog>
  288. <!-- 开庭审理 -->
  289. <trialincourtDialog
  290. :showtrialincourt="showtrialincourt"
  291. @canceltrialincourt="canceltrialincourt"
  292. ></trialincourtDialog>
  293. </div>
  294. </template>
  295. <script>
  296. import caseentryDialog from "./components/caseentryDialog";
  297. import batchDialog from "./components/batchDialog";
  298. import formateCourtDialog from "./components/formateCourtDialog.vue";
  299. import courtReviewDialog from "./components/courtReviewDialog.vue";
  300. import choosetrialmethodDaiog from "./components/choosetrialmethodDaiog.vue";
  301. import adjudicaterecordDialog from "./components/adjudicaterecordDialog.vue";
  302. import trialincourtDialog from './components/trialincourtDialog.vue';
  303. import {
  304. caseApply,
  305. removeCaseApply,
  306. submitCaseApply,
  307. selectCaseApply,
  308. } from "@/api/caseAccess/caseEntry";
  309. export default {
  310. name: "caseList",
  311. dicts: ["case_status"],
  312. components: {
  313. caseentryDialog,
  314. batchDialog,
  315. formateCourtDialog,
  316. courtReviewDialog,
  317. choosetrialmethodDaiog,
  318. adjudicaterecordDialog,
  319. trialincourtDialog
  320. },
  321. data() {
  322. return {
  323. // 遮罩层
  324. loading: true,
  325. // 总条数
  326. total: 0,
  327. isapply: "申请人:",
  328. // 表格数据
  329. dataList: [],
  330. // 查询参数
  331. queryParams: {
  332. caseNum: undefined,
  333. hearDate: "",
  334. caseStatus: null,
  335. pageNum: 1,
  336. pageSize: 10,
  337. },
  338. dialogtitle: "", //弹框标题
  339. visible: false, //申请弹框控制
  340. form: {},
  341. starttime: "", //开始时间
  342. endtime: "", //结束时间
  343. formData: {},
  344. flag: "-1",
  345. initpaymentArr: [],
  346. initpaymentArr1: [],
  347. openbatch: false, // 批量申请弹框
  348. formateCourtData: {}, //组庭
  349. showformateCourt: false, //组庭界面显示
  350. showcourtReview: false, //组庭审核页面
  351. showchoosetrialmethod: false, //选择仲裁方式页面
  352. choosetrialmethodata:{},
  353. showadjudicaterecord: false, //书面审理弹框
  354. showtrialincourt: false, //开庭审理
  355. };
  356. },
  357. created() {
  358. this.getcaseApply();
  359. },
  360. methods: {
  361. cancel() {
  362. this.visible = false;
  363. },
  364. cancelBatch() {
  365. this.openbatch = false;
  366. },
  367. /** 查询列表 */
  368. getcaseApply() {
  369. this.loading = true;
  370. caseApply(this.queryParams).then((response) => {
  371. this.dataList = response.rows;
  372. this.dataList.forEach((item) => {
  373. item.caseStatus = item.caseStatus == 0 ? "立案申请" : "待缴费";
  374. });
  375. this.total = response.total;
  376. this.loading = false;
  377. });
  378. },
  379. /** 搜索按钮操作 */
  380. handleQuery() {
  381. this.queryParams.pageNum = 1;
  382. this.getcaseApply();
  383. },
  384. /** 重置按钮操作 */
  385. resetQuery() {
  386. this.resetForm("queryForm");
  387. this.handleQuery();
  388. },
  389. // 案件录入
  390. filingApplication() {
  391. this.form = {};
  392. this.paymentArr = [
  393. {
  394. identityType: 1,
  395. name: "",
  396. identityNum: "",
  397. contactTelphone: "",
  398. workAddress: "",
  399. workTelphone: "",
  400. contactAddress: "",
  401. nameAgent: "",
  402. contactTelphoneAgent: "",
  403. contactAddressAgent: "",
  404. },
  405. ];
  406. this.paymentArr1 = [
  407. {
  408. identityType: 2,
  409. name: "",
  410. identityNum: "",
  411. contactTelphone: "",
  412. workAddress: "",
  413. workTelphone: "",
  414. contactAddress: "",
  415. nameAgent: "",
  416. contactTelphoneAgent: "",
  417. contactAddressAgent: "",
  418. },
  419. ];
  420. this.visible = true;
  421. this.dialogtitle = "立案申请";
  422. this.flag = "2";
  423. },
  424. // 批量批量录入
  425. batchApplication() {
  426. this.openbatch = true;
  427. },
  428. // 列表提交立案
  429. onsubmitRow(row) {
  430. this.$modal
  431. .confirm("是否提交立案?")
  432. .then(function () {
  433. return submitCaseApply({ id: row.id });
  434. })
  435. .then(() => {
  436. this.getcaseApply();
  437. this.$modal.msgSuccess("立案成功");
  438. })
  439. .catch(() => {});
  440. },
  441. // 详情
  442. detailRow(row) {
  443. this.flag = "0";
  444. this.form = row;
  445. this.visible = true;
  446. this.dialogtitle = "立案详情";
  447. this.getInfo(row);
  448. },
  449. // 修改
  450. editRow(row) {
  451. this.flag = "1";
  452. this.form = row;
  453. this.visible = true;
  454. this.dialogtitle = "立案修改";
  455. this.getInfo(row);
  456. },
  457. // 立案审查
  458. filingreviewRow(row) {
  459. console.log(row, "立案审查");
  460. this.$modal
  461. .confirm("确定提交案件数据吗?")
  462. .then(function () {
  463. return submitCaseApply({ id: row.id });
  464. })
  465. .then(() => {
  466. this.getcaseApply();
  467. this.$modal.msgSuccess("立案成功");
  468. })
  469. .catch(() => {});
  470. },
  471. // 查看缴费
  472. viewpaymentRow(row) {
  473. console.log(row, "查看缴费");
  474. },
  475. // 组庭
  476. // formationcourtRow(row) {
  477. // console.log(row, "组庭");
  478. // this.formateCourtData = row;
  479. // this.showformateCourt = true;
  480. // },
  481. // 关闭组庭页面
  482. cancelcourtDialog() {
  483. this.showformateCourt = false;
  484. },
  485. // 组庭确认
  486. courtconfirmationRow(row) {
  487. console.log(row, "组庭确认");
  488. this.showcourtReview = true;
  489. // this.$modal
  490. // .confirm("确定进行组庭吗?")
  491. // .then(function () {})
  492. // .then(() => {
  493. // this.$modal.msgSuccess("组庭成功");
  494. // })
  495. // .catch((err) => {});
  496. },
  497. // 组庭审核
  498. courtreviewRow(row) {
  499. console.log(row, "组庭审核");
  500. this.formateCourtData = row;
  501. this.showformateCourt = true;
  502. },
  503. cancelcourtReview() {
  504. this.showcourtReview = false;
  505. },
  506. // 选择开庭方式
  507. choosetrialmethodRow(row) {
  508. console.log(row, "选择开庭方式");
  509. this.choosetrialmethodata = row;
  510. this.showchoosetrialmethod = true;
  511. },
  512. // 关闭选择开庭方式
  513. cancelshowchoosetrialMethod() {
  514. this.showchoosetrialmethod = false;
  515. },
  516. // 书面审理
  517. adjudicaterecordRow(row) {
  518. console.log(row, "书面审理");
  519. this.showadjudicaterecord = true;
  520. },
  521. canceladjudicaterecord() {
  522. this.showadjudicaterecord = false;
  523. },
  524. // 开庭审理
  525. trialcourtRow(row) {
  526. console.log(row, "开庭审理");
  527. this.showtrialincourt = true;
  528. },
  529. canceltrialincourt() {
  530. this.showtrialincourt = false;
  531. },
  532. // 生成裁决书
  533. generateawardRow(row) {
  534. console.log(row, "生成裁决书");
  535. },
  536. // 归档
  537. fileRow(row) {
  538. console.log(row, "归档");
  539. },
  540. // 查找主体信息数据
  541. getInfo(row) {
  542. const id = row.id;
  543. selectCaseApply({ id }).then((res) => {
  544. this.visible = true;
  545. this.formData = res.data;
  546. this.initpaymentArr = [];
  547. this.initpaymentArr1 = [];
  548. res.data.caseAffiliates.forEach((item) => {
  549. if (item.identityType == 1) {
  550. this.initpaymentArr.push(item);
  551. } else {
  552. this.initpaymentArr1.push(item);
  553. }
  554. });
  555. });
  556. },
  557. // 删除
  558. deleteRow(row) {
  559. // const id = row.id;
  560. this.$modal
  561. .confirm("是否确认删除?")
  562. .then(function () {
  563. return removeCaseApply({ id: row.id });
  564. })
  565. .then((res) => {
  566. this.getcaseApply();
  567. this.$modal.msgSuccess("删除成功");
  568. })
  569. .catch(() => {});
  570. },
  571. },
  572. };
  573. </script>
  574. <style lang="scss" scoped>
  575. #formContainer {
  576. }
  577. </style>