getJcds.vue 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. <template>
  2. <div style="width: 100%">
  3. <!-- 标题栏导航 -->
  4. <div slot="header" class="clearfix">
  5. <el-breadcrumb separator-class="el-icon-arrow-right">
  6. <el-breadcrumb-item >首页</el-breadcrumb-item>
  7. <el-breadcrumb-item>{{parentName}}</el-breadcrumb-item>
  8. <el-breadcrumb-item>{{labelName}}</el-breadcrumb-item>
  9. </el-breadcrumb>
  10. </div>
  11. <!-- 表格区域 -->
  12. <el-table :data="tableData" border stripe highlight-current-row style="width: 100%" >
  13. <el-table-column :key="table.label" v-for="table in tableHeader2" :label="table.label"
  14. :prop="table.prop" align="center" :width="table.width" :fixed="table.fixed" />
  15. <!-- 操作 -->
  16. <el-table-column label="操作" align="center" fixed="right">
  17. <template slot-scope="scope">
  18. <el-button @click="read(scope.row.task_id,scope.row.id)" style="margin:5px 0" type="success" size="small" >查看检测单列表</el-button>
  19. </template>
  20. </el-table-column>
  21. </el-table>
  22. <!--分页器区域-->
  23. <el-pagination class="feyeqi" @size-change="handleSizeChange" @current-change="handleCurrentChange"
  24. :current-page="queryInfo.pageNum" :page-sizes="[10, 15, 20]" :page-size="queryInfo.pageSize"
  25. layout="total, sizes, prev, pager, next, jumper" :total="total" background />
  26. <!-- 返回按钮 -->
  27. <div class="btns">
  28. <el-button plain size="medium" @click="returnTask()" >
  29. 返回
  30. </el-button>
  31. </div>
  32. </div>
  33. </template>
  34. <script>
  35. export default {
  36. data() {
  37. return {
  38. // 数据表格数据
  39. tableData: [],
  40. sampleOrgId:{},
  41. parentName:'',
  42. labelName:'',
  43. queryInfo:{
  44. pageSize:10,
  45. pageNum:1,
  46. // task_class:'例行监测',
  47. task_id:'',
  48. // task_profile_id:''
  49. cyd_status_condition:'',
  50. cyd_status:''
  51. },
  52. total:0,
  53. tableHeader2: [{
  54. label: '抽样机构',
  55. prop: 'sampleOrgId.name',
  56. width: 180,
  57. }, {
  58. label: '检测机构',
  59. prop: 'checkOrgId.name'
  60. },
  61. {
  62. label: '抽样地区',
  63. prop: 'sample_address'
  64. },
  65. ]
  66. }
  67. },
  68. mounted() {
  69. this.getJgTaskProfiles()
  70. },
  71. created() {
  72. this.task_id = this.$route.params.id
  73. this.parentName = this.$route.params.parentName
  74. this.labelName = this.$route.params.labelName
  75. this.getJgTaskProfiles()
  76. },
  77. methods: {
  78. //返回
  79. returnTask(){
  80. console.log(this.parentName)
  81. if(this.parentName == '例行监测'){
  82. this.$router.push({
  83. name:'routineMonitor',
  84. params:{
  85. task_id:this.$route.params.id
  86. }
  87. })
  88. }
  89. else if(this.parentName == '专项监测'){
  90. this.$router.push({
  91. name:'specialMonitor',
  92. params:{
  93. task_id:this.$route.params.id
  94. }
  95. })
  96. }
  97. else if(this.parentName == '监督抽查'){
  98. this.$router.push({
  99. name:'checkMonitor',
  100. params:{
  101. task_id:this.$route.params.id
  102. }
  103. })
  104. }else{
  105. this.$router.push({
  106. name:'reTask',
  107. params:{
  108. task_id:this.$route.params.id
  109. }
  110. })
  111. }
  112. },
  113. // 获取检测机构列表
  114. async getJgTaskProfiles() {
  115. var that = this
  116. const { data: res} = await this.$http.post("getJgTaskProfiles", {
  117. task_id: that.task_id,
  118. task_profile_id:that.id,
  119. pageNum: that.queryInfo.pageNum,
  120. pageSize: that.queryInfo.pageSize
  121. });
  122. that.tableData = res.data.rows
  123. that.total = res.data.total
  124. },
  125. //查看检测单列表
  126. read(task_id,id){
  127. // console.log(11)
  128. // console.log(id)
  129. // console.log(task_id)
  130. this.$router.push({
  131. name:'readCheckList',
  132. params: {
  133. task_id:task_id,
  134. task_profile_id:id
  135. }
  136. })
  137. },
  138. //分页器
  139. handleSizeChange(val) {
  140. console.log(`每页 ${val} 条`);
  141. },
  142. handleCurrentChange(val) {
  143. this.queryInfo.pageNum = val;
  144. console.log(`当前页: ${val}`);
  145. this.getJgTaskProfiles()
  146. },
  147. /** 监听页码的改变 */
  148. handleCurrentChange(newPage) {
  149. this.queryInfo.pageNum = newPage
  150. this.getJgTaskProfiles()
  151. },
  152. /** 监听每页显示多少数据的改变 */
  153. handleSizeChange(newSize) {
  154. this.queryInfo.pageSize = newSize
  155. this.getJgTaskProfiles()
  156. },
  157. },
  158. }
  159. </script>
  160. <style>
  161. .btns{
  162. float:right;
  163. /* margin-top: 10px; */
  164. padding: 10px;
  165. }
  166. .feyeqi{
  167. margin-top: 10px;
  168. }
  169. </style>