|
|
@@ -1,122 +1,215 @@
|
|
|
<template>
|
|
|
-
|
|
|
- <div style="width: 100%">
|
|
|
+ <div style="width: 100%">
|
|
|
<div slot="header" class="clearfix">
|
|
|
<el-breadcrumb separator-class="el-icon-arrow-right">
|
|
|
<el-breadcrumb-item >首页</el-breadcrumb-item>
|
|
|
- <el-breadcrumb-item>监测任务</el-breadcrumb-item>
|
|
|
- <el-breadcrumb-item>专项监测</el-breadcrumb-item>
|
|
|
- <el-breadcrumb-item>牵头报告单位列表</el-breadcrumb-item>
|
|
|
+ <el-breadcrumb-item>监测任务</el-breadcrumb-item>
|
|
|
+ <el-breadcrumb-item>专项监测</el-breadcrumb-item>
|
|
|
+ <el-breadcrumb-item>牵头报告单位列表</el-breadcrumb-item>
|
|
|
</el-breadcrumb>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <!-- 下拉菜单 -->
|
|
|
- <el-select v-model="value" placeholder="请选择">
|
|
|
- <el-option
|
|
|
- v-for="item in options"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <!-- 返回按钮 -->
|
|
|
- <el-button plain class="btns" type="info" size="small" @click="returnTask">
|
|
|
- 返回
|
|
|
- </el-button>
|
|
|
- </div>
|
|
|
- <!-- 表格 -->
|
|
|
- <el-table :data="tableData" style="width: 100%">
|
|
|
- <el-table-column
|
|
|
- prop="num"
|
|
|
- label="序号"
|
|
|
- width="80">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="year"
|
|
|
- label="年份"
|
|
|
- width="80">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="task"
|
|
|
- label="所属任务"
|
|
|
- width="200">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="company"
|
|
|
- label="单位"
|
|
|
- width="120">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="reportname"
|
|
|
- label="报告名称"
|
|
|
- width="200">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="state"
|
|
|
- label="状态"
|
|
|
- width="80">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="operation"
|
|
|
- label="操作"
|
|
|
- width="80">
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- <!--分页器区域-->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="headSearch">
|
|
|
+ <el-row :gutter="50" style="margin-right: 0px;">
|
|
|
+ <el-form :inline="true">
|
|
|
+ <!-- <el-form style="display: flex; flex-direction: row;" > -->
|
|
|
+ <el-form-item label="年度" class="select" size="small">
|
|
|
+ <el-date-picker v-model="queryInfo.year" style="width: 110px;" value-format="yyyy" type="year" clearable />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="任务名称" class="select" size="small">
|
|
|
+ <el-input v-model="queryInfo.task_name"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-button type="success" size="small">查询</el-button>
|
|
|
+ <el-button plain class="btns" size="medium" @click="returnTask()">
|
|
|
+ 返回
|
|
|
+ </el-button>
|
|
|
+ </el-form>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 表格区域 -->
|
|
|
+ <div class="table">
|
|
|
+ <!-- 表格数据区域-->
|
|
|
+ <el-table ref="multipleTable"
|
|
|
+ :data="tableData"
|
|
|
+ border
|
|
|
+ stripe
|
|
|
+ highlight-current-row
|
|
|
+ style="width: 100%"
|
|
|
+ :row-style="rowStyle"
|
|
|
+ :cell-style="cellStyle"
|
|
|
+ @selection-change="handleSelectionChange">
|
|
|
+ <el-table-column label="序号" width="50px">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ {{ scope.$index+1 }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column :key="table.label"
|
|
|
+ v-for="table in tableHeader"
|
|
|
+ :label="table.label"
|
|
|
+ :prop="table.prop" align="center"
|
|
|
+ :width="table.width"
|
|
|
+ :fixed="table.fixed" />
|
|
|
+ <el-table-column label="操作" align="center" fixed="right">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <!--分页器区域-->
|
|
|
<div class="block">
|
|
|
<el-pagination
|
|
|
@size-change="handleSizeChange"
|
|
|
@current-change="handleCurrentChange"
|
|
|
- :current-page="currentPage"
|
|
|
- :page-sizes="[10, 25, 50, 100]"
|
|
|
- :page-size="100"
|
|
|
+ :current-page="currentPage4"
|
|
|
+ :page-sizes="[10, 15, 20, ]"
|
|
|
+ :page-size="queryInfo.pageSize"
|
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
|
- :total="total">
|
|
|
- </el-pagination>
|
|
|
+ :total="total"
|
|
|
+ background />
|
|
|
+
|
|
|
</div>
|
|
|
-
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+
|
|
|
</template>
|
|
|
+
|
|
|
<script>
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- currentPage: 1,
|
|
|
- options: [{
|
|
|
- value: '选项1',
|
|
|
- label: '测试1'
|
|
|
- }, {
|
|
|
- value: '选项2',
|
|
|
- label: '测试2'
|
|
|
- }, {
|
|
|
- value: '选项3',
|
|
|
- label: '测试3'
|
|
|
- }, {
|
|
|
- value: '选项4',
|
|
|
- label: '测试4'
|
|
|
- }],
|
|
|
- value: '',
|
|
|
- total:0
|
|
|
- }
|
|
|
- },
|
|
|
- methods:{
|
|
|
- returnTask()
|
|
|
- {
|
|
|
- this.$router.push('specialMonitor')
|
|
|
+ const token = window.sessionStorage.getItem('token')
|
|
|
+ export default {
|
|
|
+ name: '',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ total:0,
|
|
|
+ queryInfo:{
|
|
|
+ year:'',
|
|
|
+ task_name:'',
|
|
|
+ starttime:'',
|
|
|
+ endtime:'',
|
|
|
+ ispublic:'',
|
|
|
+ pageSize:10,
|
|
|
+ pageNum:1,
|
|
|
+ task_class:'专项监测'
|
|
|
+ },
|
|
|
+ cellStyle: {
|
|
|
+ padding: 2 + 'px'
|
|
|
+ },
|
|
|
+ rowStyle: {
|
|
|
+ height: 35 + 'px'
|
|
|
+ },
|
|
|
+ tableHeader: [{
|
|
|
+ label: '年份',
|
|
|
+ prop: '',
|
|
|
+ width: 50
|
|
|
+ // fixed: 'left'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '所属任务',
|
|
|
+ prop: '',
|
|
|
+ width:200
|
|
|
+ // fixed: 'left'
|
|
|
+ }, {
|
|
|
+ label: '单位',
|
|
|
+ prop: '',
|
|
|
+ width: 150
|
|
|
+ // fixed: 'left'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '报告名称',
|
|
|
+ prop: '',
|
|
|
+ width: 200
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '状态',
|
|
|
+ prop: '',
|
|
|
+ width: 180
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ options: [{
|
|
|
+ value: '选项1',
|
|
|
+ label: '测试1'
|
|
|
+ }, {
|
|
|
+ value: '选项2',
|
|
|
+ label: '测试2'
|
|
|
+ }, {
|
|
|
+ value: '选项3',
|
|
|
+ label: '测试3'
|
|
|
+ }],
|
|
|
+ // 数据表格数据
|
|
|
+ tableData: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted: function() {
|
|
|
+ this.getJgQtouList()
|
|
|
},
|
|
|
- handleSizeChange(val) {
|
|
|
+ created: function() {
|
|
|
+ console.log(this.$route.params.task_id)
|
|
|
+ // this.unit_id = this.$route.params.unit_id
|
|
|
+ this.task_id = this.$route.params.task_id
|
|
|
+ this.getJgQtouList()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /** 监听页码的改变 */
|
|
|
+ handleCurrentChange(newPage) {
|
|
|
+ this.queryInfo.pageNum = newPage
|
|
|
+ this.getJgQtouList()
|
|
|
+ },
|
|
|
+ /** 监听每页显示多少数据的改变 */
|
|
|
+ handleSizeChange(newSize) {
|
|
|
+ this.queryInfo.pageSize = newSize
|
|
|
+ this.getJgQtouList()
|
|
|
+ },
|
|
|
+
|
|
|
+ /** 监听页码的改变 */
|
|
|
+ handleCurrentChange(newPage) {
|
|
|
+ this.queryInfo.pageNum = newPage
|
|
|
+ this.getJgQtouList()
|
|
|
+ },
|
|
|
+ // 获取牵头单位报告列表
|
|
|
+ async getJgQtouList() {
|
|
|
+ const result = await this.$http.post('getJgQtouList', {
|
|
|
+ task_id: this.task_id,
|
|
|
+ pageSize:this.queryInfo.pageSize,
|
|
|
+ pageNum:this.queryInfo.pageNum
|
|
|
+ })
|
|
|
+ console.log( result.data)
|
|
|
+ console.log(this.queryInfo.pageSize)
|
|
|
+ if (result.data.code == 0) {
|
|
|
+ this.tableData = result.data.data
|
|
|
+ }
|
|
|
+ console.log(this.tableData)
|
|
|
+ },
|
|
|
+
|
|
|
+ returnTask(){
|
|
|
+ this.$router.push('specialMonitor')
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
console.log(`每页 ${val} 条`);
|
|
|
},
|
|
|
handleCurrentChange(val) {
|
|
|
- console.log(`当前页: ${val}`);
|
|
|
+ console.log(`当前页: ${val}`);
|
|
|
}
|
|
|
- }
|
|
|
-}
|
|
|
+ },
|
|
|
+ }
|
|
|
</script>
|
|
|
|
|
|
-
|
|
|
<style>
|
|
|
.btns{
|
|
|
float:right;
|
|
|
+ padding: 10px;
|
|
|
+}
|
|
|
+.table{
|
|
|
+ padding: 10px;
|
|
|
+}
|
|
|
+.foottable .pager{
|
|
|
+ float: left;
|
|
|
+
|
|
|
+}
|
|
|
+.footer {
|
|
|
+ padding: 5px 0;
|
|
|
+ border-top: 1px solid #e5e5e5;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+.headSearch{
|
|
|
+ margin-left: 25px;
|
|
|
}
|
|
|
</style>
|
yyfang