<template>
    <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>
		</div>

        <!-- 选择区域 -->
          <el-select v-model="value" placeholder="请选择" style="margin:20px 0px">
       <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
     </el-option>
     </el-select>

        <!-- 表格区域 -->
        	<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 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>

    		<!--    分页器区域-->
		<!-- <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>
    
</template>

<script>
	const token = window.sessionStorage.getItem('token')
	export default {
		name: '',
		data() {
			return {
                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: []
            }
        }
    }

</script>