ssti-CollegeManage/src/views/projectSettlement/projectSettlement2.vue

<template>
  <!-- 项目结项 结项评语 -->
    <div class="projectSettlement2">
      <div class="vfpHeader">
          <div class="titleOne">项目管理</div>
          <div class="smallTitle" style="left: 100px;">项目详情</div>
          <el-button type="primary" @click="back">返回</el-button>
      </div>
      <hr>
      <div class="AppBar">
          <div @click="content">项目基本内容</div>
          <div @click="remark">项目详情</div>
          <div @click="remark2">项目附件</div>
          <div @click="remark4">项目结题附件</div>
          <div @click="remark5"  class="AppBarActive">结项评语</div>
      </div>

      <!-- 上传文件以及表格开始 -->
      <div class="ps2Inp">
          <el-button type="primary" class="btn" size="mini">上传文件</el-button>
        </div>
      <el-table
        :data="tableData"
        tooltip-effect="dark"
        stripe
        class="fontSize"
        :header-cell-style="{ background: '#f2f2f2',color:'#000' }"
        >
        <el-table-column
          prop="projectName"
          label="项目结项材料"
          align="center"
          >
        </el-table-column>

        <el-table-column
          prop="size"
          label="大小"
          align="center"
          >
        </el-table-column>

        <el-table-column
          prop="date"
          label="时间"
          align="center"
          >
        </el-table-column>
       
        <el-table-column
          prop="operation"
          label="操作"
          align="center"
          >
          <template #default="scope">
              <div class="operations">
                  <!-- <el-button type="primary" > -->
                        <el-button type="primary"  size="mini" @click="edit(scope)" >详情查看</el-button>
                  <!-- </el-button> -->
              </div>
          </template>
        </el-table-column>
      </el-table>
      <!-- 上传文件以及表格结束 -->

      <!-- 多行文本框区域开始 -->
      <div class="PS2tabTit0">
        结项评价
      </div>
      <div class="tabTit">
            <div><p>科研办</p></div>
      </div>
      <hr>
      <div class="ps1textArea">
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="textarea">
        </el-input>
      </div>
      <div class="tabTit">
            <div><p>学术委员会</p></div>
      </div>
      <hr>
      <div class="ps1textArea">
        <el-input
          type="textarea"
          class="textArea"
          :rows="6"
          resize="none"
          placeholder="请输入内容"
          v-model="textarea">
        </el-input>
      </div>
      <div class="tabTit">
            <div><p>部门审核评语</p></div>
      </div>
      <hr>
      <div class="ps1textArea">
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="textarea">
        </el-input>
      </div>
      <!-- 多行文本框区域结束 -->
      <div class="baseBtn">
        <div class="blockWidth">
          <el-button type="primary" class="backBtn" @click="$router.back()">返回</el-button>
        </div>
      </div>
    </div>
  </template>
  
  <script>
      export default {
        data() {
          return {
            textarea:'',
           tableData:[{
            projectName:'创业孵化基地企业情况信息表',
            date:'2022年11月12日',
            size:'50k'
            },
            {
              projectName:'创业孵化基地企业情况信息表',
              size:'50k',
              date:'2022年11月12日',
            }
            ],
         
          }
        },
        methods:{
          content(){
            // alert('222')
              this.$router.push('/projectSettlement1')
            },
            remark(){
            //   this.$router.push('/ProjectManagement2')
            },
            remark2(){
            //   this.$router.push('/ProjectManagement3')
            },
            remark4(){
            //   this.$router.push('/ProjectManagement4')
            },
            remark5(){
              this.$router.push('/projectSettlement2')
            },
            back(){
              this.$router.push('/projectSettlement')
            },
          // backBtn2(){
          //   this.$router.push('/projectSettlement')
          // },
          handleSelectionChange(val) {
            this.multipleSelection = val;
          },
         
        },
       
      }
  </script>
  
  <style lang="less">
  .projectSettlement2{


    .PS2tabTit0{
      width: 100%;
      text-align: left;
      margin: 20px 15px 20px 0px;
      color: #ccc;
      font-size: 22px;
    }

    
    .ps2Inp{
      width: 100%;
      display: flex;  
      justify-content: flex-end;
      margin: 10px 0;
      .btn{
        height: 30px;
        width: 100px;
        background: #477edd;
        margin-left: 10px;
        font-size: 16px;
      }
    }
  }

  </style>