<template>
  <!-- 学分登记 -->
  <div class="credit">
    <div class="pAHeader">
      <div class="pAHeader1">学分登记</div>
    </div>
    <hr>
<!-- 搜索框开始 -->
    <div class="selects">
      <div class="selectsBlock">
        <span class="selectLabel">项目筛选</span>
        <el-select v-model="pavalues.value" placeholder="我的项目">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </div>

      <div class="selectsBlock">
        <span class="selectLabel">部门</span>
        <el-select v-model="pavalues.value1" placeholder="请选择">
          <el-option
            v-for="item in options1"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </div>

      <div class="selectsBlock">
        <span class="selectLabel">分类</span>
        <el-select v-model="pavalues.value2" placeholder="请选择">
          <el-option
            v-for="item in options2"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </div>

      <div class="selectsBlock">
        <span class="selectLabel">负责人</span>
        <el-select v-model="pavalues.value3" placeholder="请选择">
          <el-option
            v-for="item in options3"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </div>
    </div>
<!-- 搜索框结束 -->

<!-- 表格开始 -->
    <div>
      <el-table
        :data="tableData"
        tooltip-effect="dark"
        stripe
        class="fontSize"
        :header-cell-style="{ background: '#f2f2f2',color:'#000' }"
        @selection-change="handleSelectionChange"
        >
        <el-table-column
          type="selection"
          min-width="20%">
        </el-table-column>
        <el-table-column
          prop="projectName"
          label="项目名称"
          align="center"
          min-width="20%">
        </el-table-column>
        <el-table-column
          prop="projectPerson"
          label="项目负责人"
          align="center"
          min-width="20%">
        </el-table-column>

        <el-table-column
          prop="persons"
          label="小组成员"
          align="center"
          min-width="15%">
        </el-table-column>

        <el-table-column
          prop="date"
          label="结题时间"
          align="center"
          min-width="20%">
        </el-table-column>
        
       
        <el-table-column
          prop="operation"
          min-width="25%"
          align="center"

          label="操作"
          >
          <template #default="scope">
              <div class="operations">
                      <el-button type="primary" class="bt1" size="mini" >查看学分</el-button>
                      <el-button type="primary" class="bt1" size="mini" @click="edit(scope)">修改</el-button>
              </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
<!-- 表格结束 -->

  </div>
</template>

<script>
    export default {
      data() {
        return {
          options:[],
          options1:[],
          options2:[],
          options3:[],
          options4:[],
          tableData:[{
            projectName:'陆地游泳辅助器',
            projectPerson:'王多鱼',
            persons:'5',
            date:'2022年11月12日',
          },
          {
            projectName:'北极运冰',
            projectPerson:'王多鱼',
            persons:'5',
            date:'2022年11月12日',
          }
          ],
          pavalues:{
            value:'',
            value1:'',
            value2:'',
            value3:'',
            value4:'',

          }
        }
      },
      methods:{
        edit(){
            this.$router.push('/credit1')
        },
        handleSelectionChange(val) {
          this.multipleSelection = val;
        },
       
      }
    }
</script>

<style lang="less">

</style>