projectInfo.vue

<template>
  <div class="from-table font-line-space" v-if="tabsData[0].isShow">
    <div v-if="tabsData[1].isShow">
      <a-row>
        <a-col :span="24" style="border-top: 0px;text-align: center;">
          <div class="main-title">
            <span>项目基本情况</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" style="border-top: 0px">
          <div class="tb-title">
            <span>申请人信息</span>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>姓名</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ value.appPersonName }}
            </div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>性别</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ value.sex }}
            </div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>出生日期</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ moment(value.birthday).format('YYYY-MM-DD') }}
            </div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>民族</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ value.nationName }}
            </div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>学位</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ value.degreeName }}
            </div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>职称</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ value.titleName }}
            </div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>电话</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ value.mobile }}
            </div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>电子邮箱</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ value.email }}
            </div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>每年工作时间(月)</div>
          </div>
        </a-col>
        <a-col :span="5">
          <div class="special-middle">
            <div>
              {{ value.jobTime }}
            </div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>个人通讯地址</div>
          </div>
        </a-col>
        <a-col :span="21">
          <div class="special-middle">
            <div>
              {{ value.address }}
            </div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>工作单位</div>
          </div>
        </a-col>
        <a-col :span="21">
          <div class="special-middle">
            <div>
              {{ value.appUnitName }}
            </div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>主要研究领域</div>
          </div>
        </a-col>
        <a-col :span="21">
          <div class="special-middle">
            <div v-html="toTextarea(value.mainResearchAreas)"></div>
          </div>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24" style="border-top: 0px">
          <div class="tb-title">
            <span>申请单位信息</span>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>单位名称</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div class="special-middle">
            <div>
              {{ value.appUnitName }}
            </div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>联系人</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            <div>
              {{ value.unitLinkName }}
            </div>
          </div>
        </a-col>
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>电话</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            <div>
              {{ value.unitLinkMobile }}
            </div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>电子信箱</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            <div>
              {{ value.unitLinkEmail }}
            </div>
          </div>
        </a-col>
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>传真</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            <div>
              {{ value.unitLinkFax }}
            </div>
          </div>
        </a-col>
      </a-row>

      <!-- 项目合作单位 -->
      <!-- <cooperative-units-info :cooperativeUnits.sync="value.cooperativeUnits" /> -->

      <a-row>
        <a-col :span="24" style="border-top: 0px">
          <div class="tb-title">
            <span>项目基本情况</span>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>项目名称</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div class="special-middle">
            {{ value.projName }}
          </div>
        </a-col>
      </a-row>

      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>学科代码</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div class="special-middle">
            {{ value.knowledgeName }}
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>选题范围</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div class="special-middle">
            {{ value.subjectScope }}
          </div>
        </a-col>
        <!-- <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>项目类别</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            {{ value.projClass }}
          </div>
        </a-col> -->
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>附注说明</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div class="special-middle">
            {{ value.remark }}
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>项日开始时间</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            {{ moment(value.startDate).format('YYYY-MM-DD') }}
          </div>
        </a-col>
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>项目结束时间</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            {{ moment(value.endDate).format('YYYY-MM-DD') }}
          </div>
        </a-col>
      </a-row>

      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>项目总经费(万元）</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            {{ value.totalFunding }} 万元
          </div>
        </a-col>
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>申请经费(万元)</div>
          </div>
        </a-col>
        <a-col :span="8">
          <div class="special-middle">
            {{ value.govFunding }} 万元
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>项目摘要(400字以内)</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div class="special-middle">
            <div v-html="toTextarea(value.projAbstract)"></div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>关键词</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div class="special-middle">
            {{ value.projKeywords }}
          </div>
        </a-col>
      </a-row>
      <!-- 项目主要参与单位及分工 -->
      <participate-units-info :dataList.sync="value.participateUnits" />
    </div>
    <div v-if="tabsData[2].isShow">
      <a-row>
        <a-col :span="24" style="border-top: 0px">
          <div class="main-title">
            <span>项目人员情况</span>
          </div>
        </a-col>
      </a-row>
      <!-- 项目组成员 -->
      <project-member-info :dataList.sync="value.members" />
      <a-row type="flex">
        <a-col :span="24" style="text-align: center;">
          <div class="special-middle">
            &nbsp;
          </div>
        </a-col>
      </a-row>
      <a-row type="flex" class="row_center">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>总人数</div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>高级</div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>中级</div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>初级</div>
          </div>
        </a-col>
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>博士后</div>
          </div>
        </a-col>
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>博士生</div>
          </div>
        </a-col>
        <a-col :span="3" class="bg-gray">
          <div class="special-middle">
            <div>硕士生</div>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex" class="row_center">
        <a-col :span="4">
          <div class="special-middle">
            <div>
              {{ value.memCount }}
            </div>
          </div>
        </a-col>
        <a-col :span="3">
          <div class="special-middle">
            <div>
              {{ value.memHighCount }}
            </div>
          </div>
        </a-col>
        <a-col :span="3">
          <div class="special-middle">
            <div>
              {{ value.memMiddleCount }}
            </div>
          </div>
        </a-col>
        <a-col :span="3">
          <div class="special-middle">
            <div>
              {{ value.memLowCount }}
            </div>
          </div>
        </a-col>
        <a-col :span="4">
          <div class="special-middle">
            <div>
              {{ value.memBshCount }}
            </div>
          </div>
        </a-col>
        <a-col :span="4">
          <div class="special-middle">
            <div>
              {{ value.memBsCount }}
            </div>
          </div>
        </a-col>
        <a-col :span="3">
          <div class="special-middle">
            <div>
              {{ value.memSsCount }}
            </div>
          </div>
        </a-col>
      </a-row>
    </div>
    <div v-if="tabsData[3].isShow">
      <a-row>
        <a-col :span="24" style="border-top: 0px">
          <div class="main-title">
            <span>项目主要实施内容和目标</span>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>项目实施目标</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div v-html="toTextarea(value.researchContent)"></div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" style="border-top: 0px">
          <div class="tb-title">
            <span>项目考核指标</span>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>主要技术指标</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div v-html="toTextarea(value.technologyTarget)"></div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>主要经济指标</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div v-html="toTextarea(value.economyTarget)"></div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>项目实施中形成的示范基地、中试线、生产线及其规模等</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div v-html="toTextarea(value.achievementTarget)"></div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>科技报告考核指标</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div v-html="toTextarea(value.technologyReportsTarget)"></div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="4" class="bg-gray">
          <div class="special-middle">
            <div>其他应考核的指标</div>
          </div>
        </a-col>
        <a-col :span="20">
          <div v-html="toTextarea(value.otherTarget)"></div>
        </a-col>
      </a-row>
    </div>
    <div v-if="tabsData[4].isShow">
      <a-row>
        <a-col :span="24" style="border-top: 0px">
          <div class="main-title">
            <span>申请书正文</span>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :span="24" class="bg-gray">
          <div class="special-middle" style="font-weight: bold;text-align: center;">
            <document-view :fileUrl="value.downloadUrl" :fileName="value.fileName" :imageArray="[value.downloadUrl]" v-if="!!value.downloadUrl"></document-view>
          </div>
        </a-col>
      </a-row>
    </div>
    <div v-if="tabsData[5].isShow">
      <!-- 经费预算 -->
      <budget-info :budget.sync="value.budget" />
      <a-row type="flex">
        <a-col :span="24" style="text-align: center;">
          <div class="special-middle">
            &nbsp;
          </div>
        </a-col>
      </a-row>
      <!-- 分年度用款计划 -->
      <fund-plan-info :fundPlan.sync="value.fundPlan" />
      <!-- 设备费-购置设备预算明细表 -->
      <device-info :deviceList.sync="value.deviceList" />
      <!-- 设备费-试制设备预算明细表 -->
      <manufacture-info :manufactureList.sync:="value.manufactureList" />
      <!-- 项目承担单位研究资金支出预算明细表 -->
      <unit-payment-info :unitPayment.sync="value.unitPayment" />
    </div>
    <div v-if="tabsData[6].isShow">
      <!-- 项目安排及阶段目标 -->
      <proj-stage-goals-info :stageGoals.sync="value.stageGoals" />
    </div>
    <div v-if="tabsData[7].isShow">
      <!-- 项目课题设置 -->
      <project-sub-info :dataList.sync="value.projectSubList" />
    </div>
    <div v-if="tabsData[8].isShow">
      <project-kpi-info v-if="value.projectKPI" :projectKPI.sync="value.projectKPI" />
    </div>
    <div v-if="tabsData[9].isShow">
      <!-- 附件 -->
      <file-info :fileList.sync="value.fileList" />
    </div>
    <div v-if="tabsData[10].isShow">
      <a-row>
        <a-col :span="24">
          <div class="main-title">
            <span>审核记录</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24">
          <audit-list v-model="value.auditList" />
        </a-col>
      </a-row>
    </div>

  </div>
</template>

<script>
import moment from 'moment'

import cooperativeUnitsInfo from '@/views/report/project/components/cooperativeUnitsInfo'
import participateUnitsInfo from '@/views/report/project/components/participateUnitsInfo'
import projectMemberInfo from '@/views/report/project/components/projectMemberInfo'
import projectKpiInfo from '@/views/report/project/components/projectKpiInfo.vue'
import budgetInfo from '@/views/report/project/components/budgetInfo'
import fundPlanInfo from '@/views/report/project/components/fundPlanInfo'
import unitPaymentInfo from '@/views/report/project/components/unitPaymentInfo'
import deviceInfo from '@/views/report/project/components/deviceInfo'
import manufactureInfo from '@/views/report/project/components/manufactureInfo'
import projStageGoalsInfo from "@/views/report/project/components/projStageGoalsInfo";
import projectSubInfo from '@/views/report/project/components/projectSubInfo'
import fileInfo from "@/views/report/project/components/fileInfo";
import documentView from '@/views/components/common/documentView'
import AuditList from '@/views/audit/components/auditInfo'
import { toTextarea } from '@/views/utils/common'


export default {
  components: {
    cooperativeUnitsInfo, projectMemberInfo, projectKpiInfo, budgetInfo, fundPlanInfo, unitPaymentInfo, deviceInfo, manufactureInfo, fileInfo, documentView, AuditList, projStageGoalsInfo, projectSubInfo, participateUnitsInfo
  },
  name: "ProjectInfo",
  data () {
    return {
    }
  },
  props: {
    value: {
      type: Object,
      default: () => {
        return null
      }
    },
    tabsData: {
      type: Array,
      default: () => {
        return []
      }
    },
  },
  created () {
    if (!!!this.tabsData || this.tabsData.length == 0)
      this.tabsData = [
        { title: '全部', key: '0', isShow: true },
        { title: '项目基本信息', key: '1', isShow: true },
        { title: '项目组主要成员', key: '2', isShow: true },
        { title: '项目主要实施内容和目标', key: '3', isShow: true },
        { title: '申请书正文', key: '4', isShow: true },
        { title: '经费预算及设备明细', key: '5', isShow: true },
        { title: '项目实施阶段及任务', key: '6', isShow: true },
        { title: '项目课题设置', key: '7', isShow: true },
        { title: '绩效目标表', key: '8', isShow: true },
        { title: '附件信息', key: '9', isShow: true },
        { title: '项目审核记录', key: '10', isShow: true },
      ]
  },
  mounted () {
  },
  methods: {
    moment, toTextarea,
  }
}
</script>