123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185 |
- <template>
- <div>
- <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>
- </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>
- <!-- 返回按钮 -->
- <div class="btns">
- <el-button type="info" size="small" @click="returnTask">
- 返回任务列表
- </el-button>
- <el-button type="info" size="small" @click="sendBack">
- 退回
- </el-button>
- </div>
-
- </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 type="selection" width="50">
- </el-table-column>
- <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>
- <el-table-column label="操作" align="center" fixed="right">
- <!-- 操作按钮区域的作用域插槽 -->
- <template slot-scope="scope">
- <el-button type="success" size="mini" @click="readDialogVisible1(scope.row)">抽样单详情</el-button>
- </template>
- </el-table-column>
- </el-table>
- <!-- 分页器区域-->
- <div class="block">
- <el-pagination
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- :current-page="queryInfo.pageNum"
- :page-sizes="[10, 15, 20]"
- :page-size="queryInfo.pageSize"
- layout="total, sizes, prev, pager, next, jumper"
- :total="total"
- background />
- </div>
- </div>
- </div>
-
- </template>
- <script>
- const token = window.sessionStorage.getItem('token')
- export default {
- name: '',
- data() {
- return {
- total:0,
- options: [{
- value: '选项1',
- label: '部级监测机构'
- }],
- 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: 150
- // fixed: 'left'
- },
- {
- label: '样品编码',
- prop: '',
- width: 80
- // fixed: 'left'
- }, {
- label: '商标',
- prop: '',
- width: 150
- // fixed: 'left'
- },
- {
- label: '等级',
- prop: '',
- width: 120
- },
- {
- label: '抽样基数',
- prop: '',
- width: 120
- },
- {
- label: '抽样场所',
- prop: '',
- width: 120
- },
- {
- label: '状态',
- prop: '',
- width: 180
- }
- ],
- // 数据表格数据
- tableData: []
- }
- },
- created() {
-
- },
- methods: {
- sendBack(){},
- // 获取牵头单位
- getTaskById(){
- },
- // 获取抽样单列表
- getZLTaskSampleListByJcInfo(){
-
- },
- returnTask(){
- this.$router.push('routineMonitor')
- },
- handleSizeChange(val) {
- console.log(`每页 ${val} 条`);
- },
- handleCurrentChange(val) {
- console.log(`当前页: ${val}`);
- }
- },
- }
- </script>
- <style>
- .block{
- padding: 10px;
- }
- btns{
- float:right;
- }
- </style>
|