ssti-CollegeManage/src/views/projectSettlement/components/projectSettlementDetail_Student.vue

<template>
    <!-- 项目管理 项目详细 -->
      <div class="ProjectManagement2">
     
        <div id="w">
                <p class="pTit">研发内容</p>
                <div>
                  <p class="pTit2">一、项目研发背景</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.back">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.back"></vue-editor> -->
                  </div>
                </div>
                <div>
                  <p class="pTit2">二、项目创新点</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.innovate">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.innovate"></vue-editor> -->
                  </div>
                </div>
                <div>
                  <p class="pTit2">三、技术研发路线</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.path">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.path"></vue-editor> -->
                  </div>
                </div>
                <div>
                  <p class="pTit2">四、项目应用场景</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.scene">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.scene"></vue-editor> -->
                  </div>
                </div>
                <!-- <div class="editor">
                  <vue-editor  :editorToolbar="customToolbar" v-model="content.contentOne"></vue-editor>
                </div> -->
              </div>
              <div>
                <p class="pTit">商业模式及社会价值</p>
                <div>
                  <p class="pTit2">一、项目商业模式/社会价值</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.worth">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.worth"></vue-editor> -->
                  </div>
                </div>
              </div>
              <div>
                <p class="pTit">团队优势</p>
                <div>
                  <p class="pTit2">一、团队构成及优势</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.team">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.team"></vue-editor> -->
                  </div>
                </div>
              </div>
  
              <div>
                <p class="pTit">研发成本</p>
                <div>
                  <p class="pTit2">一、研发成本来源及构成</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.cost">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.cost"></vue-editor> -->
                  </div>
                </div>
              </div>
              <div id="e">
                <p class="pTit">预期成果</p>
                <div>
                  <p class="pTit2">一、项目预期成果、数量及形式（产品原型/发明专利/双创竞赛/成果转化/社会效益）</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.expectResults">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.expectResults"></vue-editor> -->
                  </div>
                </div>
                <div>
                  <p class="pTit2">二、学生创客人才培养预期成果、数量（教师填写）</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.expectResultsTeacher">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.expectResultsTeacher"></vue-editor> -->
                  </div>
                </div>
                <div>
                  <p class="pTit2">三、项目预期孵化、转化创业项目情况</p>
                  <div class="editor">
                    <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.expectConversion">
                    </el-input>
                    <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.expectConversion"></vue-editor> -->
                  </div>
                </div>
              </div>
              <div>
                <p class="pTit" style="margin-bottom: 0;">实施计划</p>
                <div class="editor">
                  <el-input
                      type="textarea"
                      :rows="6"
                      resize="none"
                      class="textArea"
                      placeholder="请输入内容"
                      v-model="content.plan">
                    </el-input>
                  <!-- <vue-editor  :editorToolbar="customToolbar" v-model="content.plan"></vue-editor> -->
                </div>
              </div>
        <div class="baseBtn">
          <div class="blockWidth">
            <el-button type="primary" v-show="isUpload==0"  @click="audit">立即修改</el-button>
            <el-button type="primary" v-show="isUpload==1" disabled style="background: #ccc !important;border: none;" >立即修改</el-button>
            <el-button type="primary"  v-show="isUpload==2"  disabled style="background: #ccc !important;border: none;">立即修改</el-button>
  
          </div>
        </div>
        <!-- 修改对话框开始 -->
        <el-dialog
            title="提示"
            :visible.sync="submitHint"
            width="600px"
            class="projectApplicationfundAddDialog"
            :before-close="init">
            <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="init" class="AllDialogBtn" size="small">取消</el-button>
            </span>
          </el-dialog>
        <!-- 修改对话框结束 -->
      </div>
    </template>
    
    <script>
  import { VueEditor } from "vue2-editor";
  
        export default {
          components:{
            VueEditor
          },
          data() {
            return {
              isUpload:'',
              data:[["","","","",""],[]],
              submitHint:false,
              customToolbar: [
                ["bold", "italic", "underline"], [{ list: "ordered" }, { list: "bullet" }],
                [{ align: "" }, { align: "center" }, { align: "right"}, { align: "justify"}],
                [{header:[false,1,2,3,4]}]
              ],
              content:'',
            }
          },
          methods:{
            // content(){      //导航栏项目详情跳转
            //   this.$router.push('/projectApplicationDetails')
            // },
           
            // backBtn(){
            //   this.$router.push('/projectApplicationApply2')
            // },
            audit(){   //立即修改按钮
              this.submitHint=true
            },
            submitAll(){
              let param={
                uid:this.$store.state.userInfo.userid,
                pid:this.$route.query['pid'],
                message:JSON.stringify(this.content)
              }
                this.ajax
                    .post(this.$store.state.api+'/updateProjectApplication2Student',param)
                    .then(res=>{
                      // console.log(res);
                      this.$message.success('修改成功')
                      this.init()
                    },err=>{
                      console.log(err);
                    })
            },
            init(){
              this.submitHint=false
            },
            // getData(){   //初始化完成获取基本数据进行填充
            //   let param={
            //     uid:this.$store.state.userInfo.userid,
            //     pid:this.$route.query['pid']
            //   }
            //     this.ajax
            //           .get(this.$store.state.api+'/GetProjectDetailMessage',param)
            //           .then(res=>{
            //             this.isUpload=res.data[0][0].isupload;
            //             let GetData=JSON.parse(res.data[0][0].chapters)
            //             this.data=GetData;
            //           },err=>{
            //             console.log(err);
            //           })
            // },
            getData(){
                  let param={
                      uid:this.$store.state.userInfo.userid,
                      pid:this.$route.query['pid']
                  }
                  this.ajax
                      .get(this.$store.state.api+'/SelectProjectApplyDetailStudent',param)
                      .then(res=>{
                          let data=res.data[0][0]
                          // console.log(data.chapters);
                          this.isUpload=data.isupload
                          this.content=JSON.parse(data.chapters)
                          // console.log(this.content);
                      },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;
          }
      }
      
  
  
    // }
    </style>