|
|
@@ -0,0 +1,1028 @@
|
|
|
+<template>
|
|
|
+ <!-- 成果展示 项目成果展示 -->
|
|
|
+ <div class="rs1apply" v-loading="loading">
|
|
|
+ <!-- 头部展示区开始 -->
|
|
|
+ <div class="header">
|
|
|
+ <div class="imgBlock">
|
|
|
+ <img :src="TitleMessage.image" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="headerConcent">
|
|
|
+ <div class="rsHead1Tit">项目名称：<span>{{ TitleMessage.title }}</span></div>
|
|
|
+ <div class="rsHead2Tit rsHead3Tit">
|
|
|
+ <div>负责人：<span class="titleMessage">{{ TitleMessage.pro_leader }}</span></div>
|
|
|
+ <div v-if="TitleMessage.lead_leader">学院牵头领导：<span class="titleMessage">{{ TitleMessage.lead_leader }}</span></div>
|
|
|
+ </div>
|
|
|
+ <div class="rsHead3Tit rsHead2Tit">
|
|
|
+ <div>学院：<span class="titleMessage">{{ TitleMessage.ClassName }}</span></div>
|
|
|
+ <div>分类：<span class="titleMessage">{{ TitleMessage.TypeName }} - {{ TitleMessage.TypeName=="学生创客项目"?TitleMessage.tn2==0?"创意组":"初创组":TitleMessage.tn2==0?"已建设":"待建设"}}</span></div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="rsHead2Tit personListUL">
|
|
|
+ <!-- 老师 -->
|
|
|
+ <img src="@/assets/img/doctorialHat.svg" style="margin-right: 10px;width:25px;height: 25px;">
|
|
|
+ <div class="personListLI">
|
|
|
+ <span v-for="(item,index) in TitleMessage.teacher" :key="index">{{ item.name }}</span>
|
|
|
+ </div>
|
|
|
+ <!-- 学生 -->
|
|
|
+ <img src="@/assets/img/student.svg" style="margin: 0px 10px;width:25px;height: 25px;">
|
|
|
+ <div class="personListLI">
|
|
|
+ <span v-for="(item,index) in TitleMessage.student" :key="index">{{ item.name }}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <el-button class="backBtn" type="primary" @click="$router.back()">返回</el-button> -->
|
|
|
+ </div>
|
|
|
+ <!-- 头部展示区结束 -->
|
|
|
+ <!--导航栏区域开始-->
|
|
|
+ <div id="Nav">
|
|
|
+ <div class="navLi" @click="pageState=0">
|
|
|
+ <img src="@/assets/anliDetail/proOver.png" alt="">
|
|
|
+ <span>项目基本内容</span>
|
|
|
+ </div>
|
|
|
+ <div class="navLi" @click="pageState=1">
|
|
|
+ <img src="@/assets/anliDetail/proOverTwo.png" alt="">
|
|
|
+ <span>项目详细</span>
|
|
|
+ </div>
|
|
|
+ <div class="navLi" @click="pageState=2">
|
|
|
+ <i class="iconStyle iconfont icon-jiegou" style="color:#58c2fe;font-size:22px;margin-right: 7px;"></i>
|
|
|
+ <span>活动开展</span>
|
|
|
+ </div>
|
|
|
+ <div class="navLi" @click="pageState=3">
|
|
|
+ <i class="iconStyle iconfont icon-wenjian" style="color:#58c2fe;font-size:22px;margin-right: 7px;"></i>
|
|
|
+ <span>项目附件</span>
|
|
|
+ </div>
|
|
|
+ <div class="navLi" @click="pageState=4">
|
|
|
+ <i class="iconStyle iconfont icon-baogao" style="color:#58c2fe;font-size:22px;margin-right: 7px;"></i>
|
|
|
+ <span>项目结题报告</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--导航栏区域结束-->
|
|
|
+ <!--内容区开始-->
|
|
|
+ <!--基础信息开始-->
|
|
|
+ <div class="BaseMessage" v-show="pageState==0">
|
|
|
+ <div class="BaseTitle">
|
|
|
+ <span>项目基本内容</span>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>开始时间与结题时间</span>
|
|
|
+ </div>
|
|
|
+ <div class="beginTime_EndTime">
|
|
|
+ <span>{{ TitleMessage.beginTime }}</span>
|
|
|
+ <i class="el-icon-arrow-right"></i>
|
|
|
+ <span>{{ TitleMessage.EndTime }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>教师组</span>
|
|
|
+ </div>
|
|
|
+ <div class="projectStudent">
|
|
|
+ <el-table
|
|
|
+ :data="TitleMessage.teacher"
|
|
|
+ border
|
|
|
+ style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="姓名"
|
|
|
+ align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="speciality"
|
|
|
+ label="专业"
|
|
|
+ align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="title"
|
|
|
+ label="职称"
|
|
|
+ align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="education"
|
|
|
+ align="center"
|
|
|
+ label="学历">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="section"
|
|
|
+ align="center"
|
|
|
+ label="所在教研室">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="work"
|
|
|
+ align="center"
|
|
|
+ label="项目组任务分工">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 学生组表格 -->
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>学生组</span>
|
|
|
+ </div>
|
|
|
+ <div class="projectStudent">
|
|
|
+ <el-table
|
|
|
+ :data="TitleMessage.student"
|
|
|
+ border
|
|
|
+ style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="姓名"
|
|
|
+ align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="class"
|
|
|
+ label="班级"
|
|
|
+ align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="age"
|
|
|
+ label="年龄"
|
|
|
+ align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="work"
|
|
|
+ align="center"
|
|
|
+ label="项目组任务分工">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief" v-if="TitleMessage.brief!=''">
|
|
|
+ <div class="brief_title">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>简介</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView">
|
|
|
+ {{ TitleMessage.brief }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--基础信息结束-->
|
|
|
+ <!--项目详细开始-->
|
|
|
+ <div class="BaseMessage" v-show="pageState==1">
|
|
|
+ <div class="BaseTitle" type="1">
|
|
|
+ <span>项目详细</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title" type="1.1">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+
|
|
|
+ <span>项目创新点</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="DetailMessage[0]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div class="BaseTitle" type="1">
|
|
|
+ <span>预期取得成果</span>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title" type="1.1">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>一、项目预期成果、数量及形式</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="DetailMessage[1]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title" type="1.1">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>二、创客人才培养预期成果、数量</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="DetailMessage[2]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title" type="1.1">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>三、项目预期孵化、转化创业项目情况</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="DetailMessage[3]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title" type="1.1">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>项目实施计划</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="DetailMessage[4]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 项目详细结束 -->
|
|
|
+ <!-- 活动开展开始 -->
|
|
|
+ <div class="BaseMessage" v-show="pageState==2">
|
|
|
+
|
|
|
+ <div class="BaseTitle" type="1">
|
|
|
+ <span>活动开展</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="arrangement" v-for="(item,index) in AllActivity" :key="item.acId">
|
|
|
+ <div class="arrangement_assignment">
|
|
|
+ <div class="arrangement_assignment_title">
|
|
|
+ <span>
|
|
|
+ <img src="@/assets/anliDetail/jdNewTitle.png">
|
|
|
+ <span>活动{{ index+1 }}:</span>
|
|
|
+ <span>{{ item.title }}</span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title">
|
|
|
+ <!-- <img src="@/assets/anliDetail/jdTitle.png" alt=""> -->
|
|
|
+ <i class="el-icon-tickets"></i>
|
|
|
+ <span>基础信息</span>
|
|
|
+ </div>
|
|
|
+ <div class="ActivityBaseMessage">
|
|
|
+ <el-descriptions class="margin-top" :column="3" border>
|
|
|
+ <el-descriptions-item>
|
|
|
+ <template slot="label">
|
|
|
+ <i class="el-icon-s-custom"></i>
|
|
|
+ 负责人
|
|
|
+ </template>
|
|
|
+ {{ item.pro_leader }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item>
|
|
|
+ <template slot="label">
|
|
|
+ <i class="el-icon-mobile-phone"></i>
|
|
|
+ 联系电话
|
|
|
+ </template>
|
|
|
+ {{ item.phone }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item>
|
|
|
+ <template slot="label">
|
|
|
+ <i class="el-icon-coordinate"></i>
|
|
|
+ 活动创建时间
|
|
|
+ </template>
|
|
|
+ {{item.create_at}}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item>
|
|
|
+ <template slot="label">
|
|
|
+ <i class="el-icon-date"></i>
|
|
|
+ 活动开展时间
|
|
|
+ </template>
|
|
|
+ {{ JSON.parse(item.begin_at)[0]+"\t至\t"+JSON.parse(item.begin_at)[1] }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item>
|
|
|
+ <template slot="label">
|
|
|
+ <i class="el-icon-coin"></i>
|
|
|
+ 活动预算(元)
|
|
|
+ </template>
|
|
|
+ {{ item.money }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item>
|
|
|
+ <template slot="label">
|
|
|
+ <i class="el-icon-user"></i>
|
|
|
+ 参与学生人数
|
|
|
+ </template>
|
|
|
+ {{ item.students }}
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief_title MarginTop30px">
|
|
|
+ <!-- <img src="@/assets/anliDetail/jdTitle.png" alt=""> -->
|
|
|
+ <i class="el-icon-user-solid"></i>
|
|
|
+ <span>指导老师</span>
|
|
|
+ </div>
|
|
|
+ <div class="projectStudent">
|
|
|
+ <el-table
|
|
|
+ :data="JSON.parse(item.course_teacher)"
|
|
|
+ border
|
|
|
+ style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ prop="Name"
|
|
|
+ label="姓名"
|
|
|
+ align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="work"
|
|
|
+ label="工作单位"
|
|
|
+ align="center">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="takeCharge"
|
|
|
+ align="center"
|
|
|
+ label="活动分工">
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ <div class="brief_title MarginTop30px">
|
|
|
+ <img src="@/assets/anliDetail/proOverTwo.png" alt="">
|
|
|
+ <span>活动简介</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView">
|
|
|
+ {{ item.brief }}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief_title MarginTop30px">
|
|
|
+ <!-- <img src="@/assets/anliDetail/jdTitle.png" alt=""> -->
|
|
|
+ <i class="el-icon-edit-outline"></i>
|
|
|
+ <span>活动计划</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="JSON.parse(item.chapters)[0]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief_title MarginTop30px">
|
|
|
+ <!-- <img src="@/assets/anliDetail/jdTitle.png" alt=""> -->
|
|
|
+ <i class="el-icon-data-line"></i>
|
|
|
+ <span>预期目标</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="JSON.parse(item.chapters)[1]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief_title MarginTop30px">
|
|
|
+ <!-- <img src="@/assets/anliDetail/jdTitle.png" alt=""> -->
|
|
|
+ <i class="el-icon-pie-chart"></i>
|
|
|
+ <span>活动受面</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="JSON.parse(item.chapters)[2]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief_title MarginTop30px">
|
|
|
+ <!-- <img src="@/assets/anliDetail/jdTitle.png" alt=""> -->
|
|
|
+ <i class="el-icon-money"></i>
|
|
|
+ <span>经费支出计划</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <VueEditor v-model="JSON.parse(item.chapters)[3]" :disabled="true"></VueEditor>
|
|
|
+ </div>
|
|
|
+ <div class="brief_title MarginTop30px" v-if="ActivityLookFile[index].url!=''">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <!-- <i class="el-icon-money"></i> -->
|
|
|
+ <span>活动完结报告</span>
|
|
|
+ </div>
|
|
|
+ <div class="brief" v-if="ActivityLookFile[index].url!=''">
|
|
|
+ <div class="material">
|
|
|
+ <div class="material_title">
|
|
|
+ <img src="@/assets/anliDetail/fileList.png" alt="">
|
|
|
+ <span>活动完结报告</span>
|
|
|
+ </div>
|
|
|
+ <div class="FileShowArea">
|
|
|
+ <div class="FileShowArea_Left">
|
|
|
+ <vword
|
|
|
+ style="width: 100%; height: 100%; overflow: auto"
|
|
|
+ class="fullStyle"
|
|
|
+ v-if="checkFileType(ActivityLookFile[index].url)['type']!='pdf'&&checkFileType(ActivityLookFile[index].url)['name']!='图片'"
|
|
|
+ :pdfUrl="'https://view.officeapps.live.com/op/view.aspx?src='+ActivityLookFile[index].url"
|
|
|
+ ></vword>
|
|
|
+ <vpdf
|
|
|
+ style="width: 100%; height: 100%; overflow: auto"
|
|
|
+ class="fullStyle"
|
|
|
+ :pdfUrl="ActivityLookFile[index].url"
|
|
|
+ v-if="checkFileType(ActivityLookFile[index].url)['type']=='pdf'"
|
|
|
+ ></vpdf>
|
|
|
+ <img :src="ActivityLookFile[index].url" alt="图片哦" v-if="checkFileType(ActivityLookFile[index].url)['name']=='图片'" style="width: 100%;height: 100%;">
|
|
|
+ </div>
|
|
|
+ <div class="FileShowArea_Right core_dialogue">
|
|
|
+ <div v-for="(i,index2) in item.reportFile" :key="i.url" @click="Object.assign(ActivityLookFile[index],i)" :class="['FileList',ActivityLookFile[index]['url']==i.url?'lookFile':'']"><span>{{ index2+1 }}.{{ checkFileType(i.url)["name"] }}</span><div>{{ i.fileName }}</div></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <!-- 活动开展结束 -->
|
|
|
+ <!-- 项目附件开始 -->
|
|
|
+ <div class="BaseMessage" v-show="pageState==3">
|
|
|
+ <div class="BaseTitle" type="3">
|
|
|
+ <span>项目附件</span>
|
|
|
+ </div>
|
|
|
+ <div class="brief" v-if="ProjectLookFile.url!=''">
|
|
|
+ <div class="material">
|
|
|
+ <div class="material_title">
|
|
|
+ <img src="@/assets/anliDetail/fileList.png" alt="">
|
|
|
+ <span>项目材料</span>
|
|
|
+ </div>
|
|
|
+ <div class="FileShowArea">
|
|
|
+ <div class="FileShowArea_Left">
|
|
|
+ <vword
|
|
|
+ style="width: 100%; height: 100%; overflow: auto"
|
|
|
+ class="fullStyle"
|
|
|
+ v-if="checkFileType(ProjectLookFile.url)['type']!='pdf'&&checkFileType(ProjectLookFile.url)['name']!='图片'"
|
|
|
+ :pdfUrl="'https://view.officeapps.live.com/op/view.aspx?src='+ProjectLookFile.url"
|
|
|
+ ></vword>
|
|
|
+ <vpdf
|
|
|
+ style="width: 100%; height: 100%; overflow: auto"
|
|
|
+ class="fullStyle"
|
|
|
+ :pdfUrl="ProjectLookFile.url"
|
|
|
+ v-if="checkFileType(ProjectLookFile.url)['type']=='pdf'"
|
|
|
+ ></vpdf>
|
|
|
+ <img :src="ProjectLookFile.url" alt="图片哦" v-if="checkFileType(ProjectLookFile.url)['name']=='图片'" style="width: 100%;height: 100%;">
|
|
|
+ </div>
|
|
|
+ <div class="FileShowArea_Right core_dialogue">
|
|
|
+ <div v-for="(item,index) in ProjectFile" :key="item.url" @click="ProjectLookFile = item" :class="['FileList',ProjectLookFile['url']==item.url?'lookFile':'']"><span>{{ index+1 }}.{{ checkFileType(item.url)["name"] }}</span><div>{{ item.fileName }}</div></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 项目中期报告开始 -->
|
|
|
+ <div class="BaseMessage" v-show="pageState==4">
|
|
|
+ <!-- <div class="BaseTitle">
|
|
|
+ <span>结项评价</span>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title" type="1.1">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>科研办</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <div class="TextView">
|
|
|
+ {{ endProjectRemark['kRem'] }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title" type="1.1">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>学术委员会</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <div class="TextView">
|
|
|
+ {{ endProjectRemark["bRem"] }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title" type="1.1">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>部门审核评语</span>
|
|
|
+ </div>
|
|
|
+ <div class="TextView" >
|
|
|
+ <div class="TextView">
|
|
|
+ {{ endProjectRemark["xRem"] }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <div class="BaseTitle" type="5">
|
|
|
+ <span>项目结题报告</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="brief">
|
|
|
+ <div class="brief_title">
|
|
|
+ <img src="@/assets/anliDetail/jdTitle.png" alt="">
|
|
|
+ <span>项目结题附件</span>
|
|
|
+ </div>
|
|
|
+ <div class="material" v-if="ProjectEndLookFile.url!=''">
|
|
|
+ <div class="material_title">
|
|
|
+ <img src="@/assets/anliDetail/fileList.png" alt="">
|
|
|
+ <span>项目结题附件</span>
|
|
|
+ </div>
|
|
|
+ <div class="FileShowArea">
|
|
|
+ <div class="FileShowArea_Left">
|
|
|
+ <vword
|
|
|
+ style="width: 100%; height: 100%; overflow: auto"
|
|
|
+ class="fullStyle"
|
|
|
+ v-if="checkFileType(ProjectEndLookFile.url)['type']!='pdf'&&checkFileType(ProjectEndLookFile.url)['name']!='图片'"
|
|
|
+ :pdfUrl="'https://view.officeapps.live.com/op/view.aspx?src='+ProjectEndLookFile.url"
|
|
|
+ ></vword>
|
|
|
+ <vpdf
|
|
|
+ style="width: 100%; height: 100%; overflow: auto"
|
|
|
+ class="fullStyle"
|
|
|
+ :pdfUrl="ProjectEndLookFile.url"
|
|
|
+ v-if="checkFileType(ProjectEndLookFile.url)['type']=='pdf'"
|
|
|
+ ></vpdf>
|
|
|
+ <img :src="ProjectEndLookFile.url" alt="图片哦" v-if="checkFileType(ProjectEndLookFile.url)['name']=='图片'" style="width: 100%;height: 100%;">
|
|
|
+ </div>
|
|
|
+ <div class="FileShowArea_Right core_dialogue">
|
|
|
+ <div v-for="(item,index) in ProjectEndFile" :key="item.url" @click="ProjectEndLookFile = item" :class="['FileList',ProjectEndLookFile['url']==item.url?'lookFile':'']"><span>{{ index+1 }}.{{ checkFileType(item.url)["name"] }}</span><div>{{ item.fileName }}</div></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!--项目详结束-->
|
|
|
+ <!--内容区结束-->
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <script>
|
|
|
+ import vpdf from '@/components/vpdf.vue'
|
|
|
+ import vword from '@/components/vword.vue'
|
|
|
+ import { VueEditor } from "vue2-editor";
|
|
|
+ export default {
|
|
|
+ components:{vpdf,vword,VueEditor},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ pageState:0,
|
|
|
+ loading:false,
|
|
|
+ //头部信息 项目名称 负责人 学院牵头领导 封面图片 分类 所在部门 优先支持项目 联系电话 项目申请人 美丽校园改造项目
|
|
|
+ TitleMessage:{title:"",pro_leader:"",lead_leader:"",image:"",TypeName:"",ClassName:"",tn2:0},
|
|
|
+ // TitleMessage:{ClassName:"",EndTime:"",TypeName:"",beginTime:"",brief:"",course_student:[],image:"",pro_leader:"",title:""},
|
|
|
+ DetailMessage:[],
|
|
|
+ ProjectFile:[],
|
|
|
+ ProjectLookFile:{url:"",type:""},
|
|
|
+ ProjectEndFile:[],
|
|
|
+ ProjectEndLookFile:{url:"",type:""},
|
|
|
+ AllActivity:[],
|
|
|
+ ActivityLookFile:[],
|
|
|
+ endProjectRemark:{kRem:"",bRem:"",xRem:""},
|
|
|
+ canonical:{
|
|
|
+ Image:/^https?:\/\/(.+\/)+.+(\.(gif|png|jpg|jpeg|webp|svg|psd|bmp|tif))$/i,
|
|
|
+ File:/^https?:\/\/(.+\/)+.+(\.(docx|xlsx|ppt|pdf))$/i
|
|
|
+ },
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ getData(){
|
|
|
+ this.loading = true;
|
|
|
+ this.ActivityLookFile = [];
|
|
|
+ this.ajax.get(this.$store.state.api+"/SelectResultDetailStudent",{
|
|
|
+ uid:this.$store.state.userInfo.userid,
|
|
|
+ pid:this.$route.query["pid"]
|
|
|
+ }).then(res=>{
|
|
|
+ let FormData = res.data;
|
|
|
+ console.log(FormData)
|
|
|
+ // //头部信息
|
|
|
+ this.TitleMessage = FormData[0][0]
|
|
|
+ // // 教师表格
|
|
|
+ // this.TitleMessage['teacher'] = JSON.parse(this.TitleMessage['teacher'])
|
|
|
+ // // 学生表格
|
|
|
+ // this.TitleMessage['student'] = JSON.parse(this.TitleMessage['student'])
|
|
|
+ // // this.DetailMessage= JSON.parse(FormData[1][0]['chapters'])[0];
|
|
|
+ // console.log(FormData[1][0])
|
|
|
+ // this.ProjectFile = JSON.parse(FormData[2][0]['projectFile'])
|
|
|
+ // if(this.ProjectFile!=null)this.ProjectLookFile = this.ProjectFile[0]
|
|
|
+ // else this.ProjectLookFile = {url:'',type:""};
|
|
|
+ // this.ProjectEndFile = JSON.parse(FormData[3][0]['endFile']);
|
|
|
+ // if(this.ProjectEndFile!=null)this.ProjectEndLookFile = this.ProjectEndFile[0];
|
|
|
+ // else this.ProjectEndLookFile = {url:"",type:""}
|
|
|
+ // if(FormData[4][0]['title']!=null){
|
|
|
+ // this.AllActivity = FormData[4]
|
|
|
+ // this.AllActivity.forEach(item=>{
|
|
|
+ // if(item['reportFile']!=null&&item['reportFile']!=''){
|
|
|
+ // item['reportFile'] = JSON.parse(item['reportFile']);
|
|
|
+ // this.ActivityLookFile.push({url:item['reportFile'][0].url,fileName:item['reportFile'][0].fileName})
|
|
|
+ // }else this.ActivityLookFile.push({url:"",type:""})
|
|
|
+ // })
|
|
|
+ // };
|
|
|
+ // if(JSON.parse(FormData[5][0]['endProjectRemark'])!=null)this.endProjectRemark = JSON.parse(FormData[5][0]['endProjectRemark']);
|
|
|
+ this.loading = false;
|
|
|
+ // }).catch(err=>{
|
|
|
+ // console.log(err)
|
|
|
+ })
|
|
|
+
|
|
|
+ },
|
|
|
+ checkFileType(url){
|
|
|
+ if(typeof url=='undefined')return {type:"",name:""};
|
|
|
+ let urlSplit = url.split(".");
|
|
|
+ const type = urlSplit[urlSplit.length-1]
|
|
|
+ if(this.canonical.Image.test(url))return {type:type,name:"图片"}
|
|
|
+ if(this.canonical.File.test(url))return {type:type,name:"文档"}
|
|
|
+ else return {type:type,name:type}
|
|
|
+ },
|
|
|
+ ActivityChangeFileLook(index,item){
|
|
|
+ Object.assign(this.ActivityLookFile[index],item)
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted(){
|
|
|
+ //监听元素滚动
|
|
|
+ let Nav = document.querySelector("#Nav");
|
|
|
+ document.querySelector(".core_dialogue").addEventListener("scroll",(e)=>{
|
|
|
+ let scrollTop = e.target.scrollTop;
|
|
|
+ if(scrollTop>=250){
|
|
|
+ document.querySelector(".core_dialogue").querySelector('.el-header').style='position:fixed;z-index:10;width:100%'
|
|
|
+ Nav.style = `width:100%;padding:0 20%;box-sizing: border-box;border-radius:0;display:flex;justify-content: space-around;position: fixed;top:calc(70px - 20px);z-index:99;align-items: center;box-shadow: 0 0 5px gray;`
|
|
|
+ }else if(scrollTop<=100){
|
|
|
+ document.querySelector(".core_dialogue").querySelector('.el-header').style=''
|
|
|
+ Nav.style = ``
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.getData();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ </script>
|
|
|
+
|
|
|
+ <style lang="less" scoped>
|
|
|
+ .rs1apply{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ // height: auto;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #e6eaf0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-bottom: 50px;
|
|
|
+ }
|
|
|
+ .header{
|
|
|
+ width: 100%;
|
|
|
+ min-height: 200px;
|
|
|
+ background-color: white;
|
|
|
+ margin-top: 10px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 5%;
|
|
|
+ position: relative;
|
|
|
+ .imgBlock{
|
|
|
+ width: 230px;
|
|
|
+ height: 130px;
|
|
|
+ margin-right: 20px;
|
|
|
+
|
|
|
+ img{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ object-fit: cover;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .headerConcent{
|
|
|
+ width: 500px;
|
|
|
+ height: 130px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: space-between;
|
|
|
+ // width: ;
|
|
|
+ .rsHead1Tit{
|
|
|
+ font-size: 22px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ .rsHead2Tit{
|
|
|
+ font-size: 16px;
|
|
|
+ }
|
|
|
+ .rsHead3Tit{
|
|
|
+ display: flex;
|
|
|
+ div{
|
|
|
+ margin-right: 30px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .backBtn{
|
|
|
+ position: absolute;
|
|
|
+ right: 10%;
|
|
|
+ width:100px;
|
|
|
+ top: 10%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 9px 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 16px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ #Nav{
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 80px 0 70px;
|
|
|
+ width: 60%;
|
|
|
+ min-height: 50px;
|
|
|
+ background-color: white;
|
|
|
+ margin-top: 20px;
|
|
|
+ border-radius: 5px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ .navLi{
|
|
|
+ // width: 150px;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 18px;
|
|
|
+ // margin-left: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+ img{
|
|
|
+ height: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .navLi:hover span{
|
|
|
+ color: gray;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .BaseMessage{
|
|
|
+ width: 60%;
|
|
|
+ position: relative;
|
|
|
+ box-sizing: border-box;
|
|
|
+ // margin-bottom: 20px;
|
|
|
+ .BaseTitle{
|
|
|
+ width: 100%;
|
|
|
+ height: 85px;
|
|
|
+ background-color: white;
|
|
|
+ border-radius: 5px;
|
|
|
+ margin-top: 20px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ span{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ // width: 160px;
|
|
|
+
|
|
|
+ height: 50px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ justify-content: center;
|
|
|
+ padding-right: 2%;
|
|
|
+ padding-left: 4%;
|
|
|
+ align-items: center;
|
|
|
+ background-image: url('@/assets/anliDetail/longNavBg.png');
|
|
|
+ background-size: 100% 100%;
|
|
|
+ margin-left: 20px;
|
|
|
+ color: white;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .brief{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ border-radius: 5px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ background-color: white;
|
|
|
+ padding: 10px 10px 20px 10px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .brief_title{
|
|
|
+ width: 100%;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ // margin-top: 10px;
|
|
|
+ font-size: 18px;
|
|
|
+ i{
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ font-size: 1.5em;
|
|
|
+ color: #50c5ff;
|
|
|
+ }
|
|
|
+ img{
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ }
|
|
|
+ span{
|
|
|
+ margin-left: 10px;
|
|
|
+ color: gray;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .TextView{
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 5px;
|
|
|
+ background-color: rgb(240, 240, 240);
|
|
|
+ line-height: 2em;
|
|
|
+ }
|
|
|
+ .FileView{
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0px 10px 10px 10px;
|
|
|
+ border-radius:10px ;
|
|
|
+ background-color: rgb(240, 240, 240);
|
|
|
+ .FileList{
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ border-radius: 10px;
|
|
|
+ background-color: white;
|
|
|
+ display: flex;
|
|
|
+ overflow: hidden;
|
|
|
+ cursor: pointer;
|
|
|
+ box-shadow: 0px 0px 4px rgb(185, 185, 185);
|
|
|
+ margin-top: 10px;
|
|
|
+ .FileType{
|
|
|
+ width: 15%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: white;
|
|
|
+ font-size: 18px;
|
|
|
+ background-color:#0c74ab;
|
|
|
+ }
|
|
|
+ .FileTitle{
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
+ flex: 1;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 2%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .FileShow{
|
|
|
+ width: 100%;
|
|
|
+ height: 200px;
|
|
|
+ background-color: gray;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .material{
|
|
|
+ width: 100%;
|
|
|
+ height: 900px;
|
|
|
+ // height: 1000px;
|
|
|
+ margin-top: 20px;
|
|
|
+ border-radius: 5px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border: 1px solid #2f89dd;
|
|
|
+ overflow: hidden;
|
|
|
+ .material_title{
|
|
|
+ width: 100%;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 10px;
|
|
|
+ color: white;
|
|
|
+ background-color: #2f89dd;
|
|
|
+ }
|
|
|
+ .FileShowArea{
|
|
|
+ width: 100%;
|
|
|
+ height: calc(100% - 40px);
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+ .FileShowArea_Left{
|
|
|
+ width: 60%;
|
|
|
+ height: 95%;
|
|
|
+ background-color: white;
|
|
|
+ }
|
|
|
+ .FileShowArea_Right{
|
|
|
+ width: 35%;
|
|
|
+ height: 95%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #f6f9fe;
|
|
|
+ border-radius: 5px;
|
|
|
+ .FileList{
|
|
|
+ width: 95%;
|
|
|
+ height: 45px;
|
|
|
+ background-color: white;
|
|
|
+ margin-top: 20px;
|
|
|
+ border-radius: 10px;
|
|
|
+ font-size: 18px;
|
|
|
+ cursor: pointer;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ overflow: hidden;
|
|
|
+ div{
|
|
|
+ height: auto;
|
|
|
+ width: 70%;
|
|
|
+ display: block;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+ span{
|
|
|
+ max-width: 20%;
|
|
|
+ min-width: 20%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ color: white;
|
|
|
+ background-color: #0c74ab;
|
|
|
+ margin-right: 10px;
|
|
|
+ float: left;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .FileList:hover{
|
|
|
+ color: gray;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .arrangement{
|
|
|
+ width: 100%;
|
|
|
+ margin-top: 10px;
|
|
|
+ background-color: white;
|
|
|
+ border-radius: 5px;
|
|
|
+ padding: 10 px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .arrangement_assignment_title{
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ display: flex;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0px 20px 0px 10px;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 18px;
|
|
|
+ align-items: center;
|
|
|
+ span{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: black;
|
|
|
+ font-weight: 600;
|
|
|
+ span:nth-of-type(2){
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ img{
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .assignment{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0px 20px 0px 20px;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 18px;
|
|
|
+ align-items: space-between;
|
|
|
+ flex-direction: column;
|
|
|
+ span{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: gray;
|
|
|
+ img{
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .assignment_message{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .fullStyle {
|
|
|
+ width: 100% !important;
|
|
|
+ max-width: 100% !important;
|
|
|
+ height: 100% !important;
|
|
|
+ margin: 0 !important;
|
|
|
+ }
|
|
|
+ .personListUL{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ .personListLI{
|
|
|
+ width: 80%;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ span{
|
|
|
+ margin-right: 10px;
|
|
|
+ color: darkgray;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .titleMessage{
|
|
|
+ color: darkgray;
|
|
|
+ }
|
|
|
+ .projectStudent{
|
|
|
+ width:100%;
|
|
|
+ cursor: default;
|
|
|
+ }
|
|
|
+ .beginTime_EndTime{
|
|
|
+ width: 100%;
|
|
|
+ height: 40px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 18px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 20px;
|
|
|
+ i{
|
|
|
+ margin: 0 20px 0 20px;
|
|
|
+ font-size:22px;
|
|
|
+ }
|
|
|
+ // background-color: red;
|
|
|
+ }
|
|
|
+ /deep/ .ql-toolbar{
|
|
|
+ display: none !important;
|
|
|
+ }
|
|
|
+ /deep/ .ql-container.ql-snow{
|
|
|
+ border:none !important;
|
|
|
+ }
|
|
|
+ .lookFile{
|
|
|
+ color: grey;
|
|
|
+ }
|
|
|
+ .ActivityBaseMessage{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ }
|
|
|
+ .MarginTop30px{
|
|
|
+ margin-top: 30px;
|
|
|
+ }
|
|
|
+ </style>
|
yuanyiming