ssti-CollegeManage/src/views/projectApply/components/projectApplicationMakerSpaceDetails2.vue

<template>
  <!-- 项目立项申请查看详细项目详细 -->
    <div class="projectApplication2" v-loading="loading">
      <!-- <div class="PA2textArea">
        <div class="PA2textAreaTit">项目创新点</div>
        <vue-editor  :editorToolbar="customToolbar" v-model="data[0][0]"></vue-editor>
      </div> -->

      <div class="PA2mid">项目建设内容及目标</div>
      <div class="PA2textArea">
        <div class="PA2textAreaTit PA2textAreaTit2">一、建设内容<span>（空间优化/场馆规划方面拟解决的关键问题及主要建设指标）</span></div>
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="data.Construction">
        </el-input>
        <!-- <vue-editor  :editorToolbar="customToolbar" v-model="data.Construction"></vue-editor> -->
      </div>

      <div class="PA2mid">预项目建设论证报告</div>
      <div class="PA2textArea">
        <div class="PA2textAreaTit PA2textAreaTit2">一、立项依据<span> （说明本项目的目的、意义以及国内外高校现状、市场预测和发展趋势，预期达到的目标，研究的预期效果分析，成果受益面）</span></div>
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="data.ProjectBasis">
        </el-input>
        <!-- <vue-editor  :editorToolbar="customToolbar" v-model="data.ProjectBasis"></vue-editor> -->
      </div>

      <div class="PA2mid">预期成果</div>
      <div class="PA2textArea">
        <div class="PA2textAreaTit PA2textAreaTit2">一、创客空间物理环境、制度建设及软件设施建设情况<span>（环境优化/制度完善/设施改造）</span></div>
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="data.development">
        </el-input>
        <!-- <vue-editor  :editorToolbar="customToolbar" v-model="data.development"></vue-editor> -->
      </div>
      <div class="PA2textArea">
        <div class="PA2textAreaTit PA2textAreaTit2">二、学生创客工作室建设情况<span>（工作室数量及活动开展情况）</span></div>
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="data.studio">
        </el-input>
        <!-- <vue-editor  :editorToolbar="customToolbar" v-model="data.studio"></vue-editor> -->
      </div>
      <div class="PA2textArea">
        <div class="PA2textAreaTit PA2textAreaTit2">三、学生创客团队（人才）培养预期成果、数量</div>
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="data.studentTeam">
        </el-input>
        <!-- <vue-editor  :editorToolbar="customToolbar" v-model="data.studentTeam"></vue-editor> -->
      </div>
      <div class="PA2textArea">
        <div class="PA2textAreaTit PA2textAreaTit2">四、学生创客活动组织实施情况</div>
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="data.studentActivities">
        </el-input>
        <!-- <vue-editor  :editorToolbar="customToolbar" v-model="data.studentActivities"></vue-editor> -->
      </div>
      <div class="PA2textArea">
        <div class="PA2textAreaTit PA2textAreaTit2">五、学生创客团队孵化、转化创业项目情况</div>
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="data.Transforming">
        </el-input>
        <!-- <vue-editor  :editorToolbar="customToolbar" v-model="data.Transforming"></vue-editor> -->
      </div>

      <div class="PA2mid">立项基础及条件</div>
      <div class="PA2textArea">
        <div class="PA2textAreaTit PA2textAreaTit2">一、基础条件<span>（物理环境/设备设施/项目实施/活动开展/技术力量/社会资源）</span></div>
        <el-input
          type="textarea"
          :rows="6"
          resize="none"
          class="textArea"
          placeholder="请输入内容"
          v-model="data.condition">
        </el-input>
        <!-- <vue-editor  :editorToolbar="customToolbar" v-model="data.condition"></vue-editor> -->
      </div>

      <div class="baseBtn">
        <div class="blockWidth">
          <el-button type="primary" v-show="isUpload==0"  @click="submitHint=true">立即修改</el-button>
          <el-button type="primary" disabled v-show="isUpload!=0" style="background: #ccc !important;border: none;">立即修改</el-button>
          <!-- <el-button type="primary" disabled style="background: #ccc !important;border: none;" v-show="isUpload==2">立即修改</el-button> -->

        </div>
      </div>
      <!-- 修改对话框开始 -->
      <el-dialog
          title="提示"
          :visible.sync="submitHint"
          width="600px"
          class="projectApplicationfundAddDialog">
          <div class="addDialogLogo">LOGO</div>
          <div class="deleteContent">确定修改项目基本信息?</div>
          <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitAll" class="AllDialogBtn">确认提交</el-button>
            <el-button @click="submitHint = false" class="AllDialogBtn" size="small">取消</el-button>
          </span>
        </el-dialog>
      <!-- 修改对话框结束 -->
    </div>
  </template>
  
  <script>
import { VueEditor } from "vue2-editor";

      export default {
        components:{
          VueEditor
        },
        data() {
          return {
            isUpload:0,
            loading:false,
            submitHint:false,
            customToolbar: [
              ["bold", "italic", "underline"], [{ list: "ordered" }, { list: "bullet" }],
              [{ align: "" }, { align: "center" }, { align: "right"}, { align: "justify"}],
              [{header:[false,1,2,3,4]}]
            ],
            data:{
                Construction:"",//建设内容
                ProjectBasis:"",//立项依据
                development:"",//创客空间物理环境、制度建设及软件设施建设情况
                studio:"",//学生创客工作室建设情况
                studentTeam:"",//学生创客团队（人才）培养预期成果、数量
                studentActivities:"",//学生创客活动组织实施情况
                Transforming:"",//学生创客团队孵化、转化创业项目情况
                condition:"",//立 项基 础及条 件

            },
          }
        },
        methods:{
          submitAll(){
            let param={
              uid:this.$store.state.userInfo.userid,
              pid:JSON.parse(localStorage.getItem('pid')),
              chapters:JSON.stringify(this.data)
            }
            this.ajax.post(this.$store.state.api+"/UpdateProjectChaptersMakerSpace",param).then(res=>{
              if(res.data==1){
                this.$message.success("修改成功")
              }else{
                this.$message.error("修改失败")
              }
              this.submitHint = false;
              this.getData();
            }).catch(err=>{
              console.log(err)
            })
          },
          getData(){   //初始化完成获取基本数据进行填充
            this.loading = true;
            let param={
              uid:this.$store.state.userInfo.userid,
              pid:JSON.parse(localStorage.getItem('pid'))
            }
              this.ajax
                    .get(this.$store.state.api+'/SelectProjectChapterMakerSpace',param)
                    .then(res=>{
                      this.isUpload = res.data[0][0]['isupload']
                      this.data = JSON.parse(res.data[0][0]['chapters']);
                      console.log(this.data)
                      this.loading = false;
                    },err=>{
                      console.log(err);
                    })
          },
        },
        mounted(){
          this.getData();
        }
      }
  </script>
  
  <style lang="less">
  .projectApplication2{

 .projectApplicationfundAddDialog{    //项目修改对话框开始
 

 .el-dialog{
   border-radius:5px ;
   overflow: hidden;
 }
 
 .deleteContent{
   width: 100%;
   text-align: center;
   font-size: 22px;
   color: #000;
 }
 .addDialogLogo{
  width: 60px;
        height: 30px;
        display: flex;
        justify-content: center;
        line-height: 30px;
        border-radius: 5px;
        background: #f2f2f2;
        position: absolute;
        left: 20px; top: 15px; 
 }
 .el-dialog__header{
 background: #32455b;
 }
 .el-dialog__title{
  color:#fff;
        display: flex;
        justify-content: center;
        font-size: 18px;
        position: relative;
        top: -2px;
 }
 .addDialogMid{
   box-sizing: border-box;
   padding:0 60px 0 10px;
   .addDialogTit{
     display: flex;
     span{
       width: 80px;
       line-height: 40px;
       text-align: left;
     }
   }
 .addDialogTit1{
   display: flex;
   justify-content: space-between;
   margin-bottom: 15px;
 }
 .addDialogTit2{
   margin-top: 10px;
   font-size: 18px;
   color: #000;
   text-indent: 2em;
 }
 .addDialogCon{
   margin-top: 20px;
 }
}
.dialog-footer{
 display: flex;
 justify-content: center;
//  .btn5{
//    height: 40px;
//    font-size: 16px;
//    background: #0e72e6;
//    width: 200px;
//  }
}
}
//项目修改对话框结束
    .PA2textArea{     //标题栏
        margin: 15px 0;
        .PA2textAreaTit{
            width: 80%;
            text-align: left;
            font-size: 18px;
            font-weight: 550;
            margin-bottom: 15px;
            color: #2387ff;
        }
        .ql-toolbar.ql-snow{
          display: flex;
        }
        .PA2textAreaTit2{
            font-size: 16px;
        }
        .el-textarea__inner{
            background: #f2f2f2;
        }
    }
    
    .PA2mid{    //预期取得成果单独一栏
        width: 100%;
        text-align: left;
        font-size: 18px;
        font-weight: 550;
        margin-bottom: 10px;
        color: #2387ff;
    }
  }
  </style>