应用层PC端前端服务

courtReviewlist.vue 5.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
  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>
  19. <el-button
  20. type="primary"
  21. icon="el-icon-search"
  22. size="mini"
  23. @click="handleQuery"
  24. >搜索</el-button
  25. >
  26. <!-- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
  27. >重置</el-button
  28. > -->
  29. </el-form-item>
  30. </el-form>
  31. <el-table v-loading="loading" :data="formationData" style="width: 100%">
  32. <el-table-column label="序号" type="index" align="center">
  33. <template slot-scope="scope">
  34. <span>{{
  35. (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1
  36. }}</span>
  37. </template>
  38. </el-table-column>
  39. <el-table-column
  40. label="案件编号"
  41. align="center"
  42. prop="caseNum"
  43. :show-overflow-tooltip="true"
  44. />
  45. <el-table-column
  46. label="申请人"
  47. align="center"
  48. prop="name"
  49. :show-overflow-tooltip="true"
  50. />
  51. <el-table-column
  52. label="案件标的"
  53. align="center"
  54. prop="caseSubjectAmount"
  55. />
  56. <el-table-column
  57. label="立案日期"
  58. align="center"
  59. prop="registerDate"
  60. :show-overflow-tooltip="true"
  61. />
  62. <!-- 开庭日期 -->
  63. <el-table-column
  64. label="开庭日期"
  65. align="center"
  66. prop="hearDate"
  67. :show-overflow-tooltip="true"
  68. />
  69. <!-- 案件仲裁员 -->
  70. <el-table-column
  71. label="案件仲裁员"
  72. align="center"
  73. prop="caseArbitrator"
  74. />
  75. <el-table-column label="案件状态" align="center" prop="caseStatus" />
  76. <el-table-column
  77. label="操作"
  78. align="center"
  79. class-name="small-padding fixed-width"
  80. >
  81. <template slot-scope="scope">
  82. <el-button
  83. size="mini"
  84. type="text"
  85. icon="el-icon-zoom-in"
  86. @click="viewdetails(scope.row)"
  87. v-hasPermi="['monitor:online:forceLogout']"
  88. >案件详情</el-button
  89. >
  90. <el-button
  91. size="mini"
  92. type="text"
  93. icon="el-icon-shopping-bag-1"
  94. @click="courtReview(scope.row)"
  95. v-hasPermi="['monitor:online:forceLogout']"
  96. >组庭审核</el-button
  97. >
  98. <!-- <el-button
  99. size="mini"
  100. type="text"
  101. icon="el-icon-delete"
  102. @click="deleteRow(scope.row)"
  103. v-hasPermi="['monitor:online:forceLogout']"
  104. >删除</el-button
  105. > -->
  106. </template>
  107. </el-table-column>
  108. </el-table>
  109. <pagination
  110. v-show="total > 0"
  111. :total="total"
  112. :page.sync="queryParams.pageNum"
  113. :limit.sync="queryParams.pageSize"
  114. @pagination="getcourtConfirmationData"
  115. />
  116. <!-- 案件详情页面 -->
  117. <formateCourtdetailDaiog
  118. :showDetails="showDetails"
  119. @cancelDetails="cancelDetails"
  120. :formateListdata="formateListdata"
  121. ></formateCourtdetailDaiog>
  122. <!-- 组庭审核 -->
  123. <courtReviewDialog
  124. :showcourtReview="showcourtReview"
  125. @cancelcourtReview="cancelcourtReview"
  126. ></courtReviewDialog>
  127. </div>
  128. </template>
  129. <script>
  130. import courtReviewDialog from "./components/courtReviewDialog.vue";
  131. import formateCourtdetailDaiog from "./components/formateCourtdetailDaiog.vue";
  132. export default {
  133. name: "courtReviewlist",
  134. components: {
  135. formateCourtdetailDaiog,
  136. courtReviewDialog,
  137. },
  138. data() {
  139. return {
  140. // key: value
  141. // 遮罩层
  142. loading: true,
  143. showDetails: false,
  144. // 总条数
  145. total: 0,
  146. queryParams: {
  147. caseNum: undefined,
  148. pageNum: 1,
  149. pageSize: 10,
  150. },
  151. formateListdata: {},
  152. showcourtReview: false, //组庭审核页面
  153. };
  154. },
  155. created() {
  156. this.getcourtConfirmationData();
  157. },
  158. methods: {
  159. // 搜索
  160. handleQuery() {
  161. this.queryParams.pageNum = 1;
  162. this.getformationData();
  163. },
  164. /** 重置按钮操作 */
  165. resetQuery() {
  166. this.resetForm("queryForm");
  167. this.handleQuery();
  168. },
  169. getcourtConfirmationData() {
  170. this.loading = true;
  171. this.formationData = [
  172. {
  173. caseNum: "1",
  174. name: "hcb",
  175. caseSubjectAmount: "3000",
  176. registerDate: "2022-05-05 20:23:08",
  177. hearDate: "2022-09-05 20:23:08",
  178. caseArbitrator: "hhl",
  179. caseStatus: "待组庭",
  180. },
  181. ];
  182. this.total = this.formationData.length;
  183. this.loading = false;
  184. },
  185. // 详情
  186. viewdetails(val) {
  187. this.showDetails = true;
  188. this.formateListdata = val;
  189. },
  190. // 关闭详情
  191. cancelDetails() {
  192. this.showDetails = false;
  193. },
  194. // 组庭审核
  195. courtReview() {
  196. this.showcourtReview = true;
  197. },
  198. cancelcourtReview() {
  199. this.showcourtReview = false;
  200. },
  201. },
  202. };
  203. </script>
  204. <style lang="scss" scoped>
  205. </style>