<template>
  <div class="assignment-detail">
    <!-- <a-button type="primary">导出任务书</a-button> -->
    <div style="margin-top: 16px;"></div>
    <div class="from-table">
      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>研究项目</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          项目名称
        </a-col>
        <a-col :span="22">
          {{value.projName}}
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          起止时间
        </a-col>
        <a-col :span="22">
          {{value.startDate}}至{{value.endDate}}
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>第一承担单位</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          名称
        </a-col>
        <a-col :span="10">
          {{value.appUnitName}}
        </a-col>
        <a-col :span="2" class="bg-gray">
          联系电话
        </a-col>
        <a-col :span="10">
          {{value.linkTel}}
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          地址
        </a-col>
        <a-col :span="10">
          {{value.linkAddress}}
        </a-col>
        <a-col :span="2" class="bg-gray">
          邮政编码
        </a-col>
        <a-col :span="10">
          {{value.postcode}}
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          主管部门
        </a-col>
        <a-col :span="22">
          {{value.authority}}
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>主要合作（参加）单位</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="1" class="bg-gray">
          序号
        </a-col>
        <a-col :span="9" class="bg-gray">
          单位名称
        </a-col>
        <a-col :span="11" class="bg-gray">
          地址
        </a-col>
        <a-col :span="3" class="bg-gray">
          在项目中的分工
        </a-col>
      </a-row>
      <a-row v-for="(item, index) in value.unitList" :key="'unit' + index">
        <a-col :span="1">
          {{index + 1}}
        </a-col>
        <a-col :span="9">
          {{item.unitName}}
        </a-col>
        <a-col :span="11">
          {{item.unitAddress}}
        </a-col>
        <a-col :span="3">
          {{item.projectWork}}
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>项目负责人</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          姓名
        </a-col>
        <a-col :span="10">
          {{value.appPersonName}}
        </a-col>
        <a-col :span="2" class="bg-gray">
          性别
        </a-col>
        <a-col :span="10">
          {{value.sex}}
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          出生年
        </a-col>
        <a-col :span="10">
          {{value.birthYear}}
        </a-col>
        <a-col :span="2" class="bg-gray">
          联系电话
        </a-col>
        <a-col :span="10">
          {{value.mobile}}
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          学位
        </a-col>
        <a-col :span="10">
          {{value.degreeName}}
        </a-col>
        <a-col :span="2" class="bg-gray">
          职称
        </a-col>
        <a-col :span="10">
          {{value.titleName}}
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>项目组</span>
          </div>
        </a-col>
      </a-row>
      <a-row type="flex">
        <a-col :flex="1">
          <div class="bg-gray">总人数</div>
          <div>{{value.memCount}}</div>
        </a-col>
        <a-col :flex="1">
          <div class="bg-gray">高职</div>
          <div>{{value.memHighCount}}</div>
        </a-col>
        <a-col :flex="1">
          <div class="bg-gray">中职</div>
          <div>{{value.memMiddleCount}}</div>
        </a-col>
        <a-col :flex="1">
          <div class="bg-gray">初职</div>
          <div>{{value.memLowCount}}</div>
        </a-col>
        <a-col :flex="1">
          <div class="bg-gray">博士研究生</div>
          <div>{{value.memBsCount}}</div>
        </a-col>
        <a-col :flex="1">
          <div class="bg-gray">硕士研究生</div>
          <div>{{value.memSsCount}}</div>
        </a-col>
        <a-col :flex="1">
          <div class="bg-gray">其他</div>
          <div>{{value.memOtherCount}}</div>
        </a-col>
        <a-col :flex="0.5" class="bg-gray">
          <div style="line-height: 80px;">其中</div>
        </a-col>
        <a-col :flex="1">
          <div class="bg-gray">博士</div>
          <div>{{value.memdegree1}}</div>
        </a-col>
        <a-col :flex="1">
          <div class="bg-gray">硕士</div>
          <div>{{value.memdegree2}}</div>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="4" class="bg-gray">
          实施目标和主要内容
        </a-col>
        <a-col :span="20">
          {{value.testContent}}
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="4" class="bg-gray">
          预期成果形式
        </a-col>
        <a-col :span="20">
          <div style="display: flex;flex-wrap: wrap;line-height: 2.5;">
            <div v-for="(item, index) in value.target" :key="index" style="margin-right: 20px;">
              <a-checkbox :checked="item.checked" :name="item.targetid" disabled>{{item.targetName}}</a-checkbox>
              ({{item.resultCount}})
            </div>
          </div>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>经费投入</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          总经费
        </a-col>
        <a-col :span="10" v-if="value.budget.length > 1">
          {{value.budget[0].totalBudget}}万元
        </a-col>
        <a-col :span="2" class="bg-gray">
          市卫计委资助
        </a-col>
        <a-col :span="10" v-if="value.budget.length > 1">
          {{value.budget[0].govBudget}}万元
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>一、项目要实现的目标和主要研发内容</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="bg-gray">
          （一）项目要实现的目标
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="more-row" v-if="value.cont1.length >= 1">
          <div v-for="(cont, index) in value.cont1" :key="index">
            {{index + 1}}、{{cont.contentInfo}}
          </div>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24" class="bg-gray">
          （二）主要研发内容
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="more-row">
          <div v-for="(cont, index) in value.cont2" :key="index">
            {{index + 1}}、{{cont.contentInfo}}
          </div>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>二、项目的考核指标</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="bg-gray">
          （一）主要技术及学术指标 (形成的专利、新技术、新产品、新装置、论文专著、软件等的数量、指标及其水平等)
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="more-row">
          <div v-for="(cont, index) in value.cont3" :key="index">
            {{index + 1}}、{{cont.contentInfo}}
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="bg-gray">
          （二）人才培养
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="more-row">
          <div v-for="(cont, index) in value.cont4" :key="index">
            {{index + 1}}、{{cont.contentInfo}}
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="bg-gray">
          （三）其他应考核的指标
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24" class="more-row">
          <div v-for="(cont, index) in value.cont5" :key="index">
            {{index + 1}}、{{cont.contentInfo}}
          </div>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>三、项目阶段实施内容及目标</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          阶段
        </a-col>
        <a-col :span="22" class="bg-gray">
          阶段实施内容及阶段目标
        </a-col>
      </a-row>
      <a-row v-for="(item, index) in value.cont6" :key="index">
        <a-col :span="2">
          <div class="special-middle">{{index + 1}}</div>
        </a-col>
        <a-col :span="22" class="more-row">
          <div>
            起止日期：{{item.startTime}}---{{item.endTime}}
          </div>
          <div>
            {{item.contentInfo}}
          </div>
        </a-col>
      </a-row>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>四、项目经费预算</span>
          </div>
        </a-col>
      </a-row>
      <a-row style="text-align: center;">
        <a-col :span="8" class="bg-gray">
          经费来源预算
        </a-col>
        <a-col :span="16" class="bg-gray">
          经费支出预算
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="4">
          科目
        </a-col>
        <a-col :span="4">
          总经费来源（万元）
        </a-col>
        <a-col :span="4">
          科目
        </a-col>
        <a-col :span="6">
          总经费支出（万元）
        </a-col>
        <a-col :span="6">
          其中市卫健委科技计费（万元）
        </a-col>
      </a-row>

      <template v-if="value.budget.length > 1">
        <a-row>
          <a-col :span="4">{{value.budget[0].budgetName}}</a-col>
          <a-col :span="4">{{value.budget[0].totalBudget}}</a-col>
          <a-col :span="4">{{value.budget[3].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[3].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[3].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4">{{value.budget[1].budgetName}}</a-col>
          <a-col :span="4">{{value.budget[1].govBudget}}</a-col>
          <a-col :span="4">{{value.budget[4].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[4].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[4].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4">{{value.budget[2].budgetName}}</a-col>
          <a-col :span="4">{{value.budget[2].unitBudget}}</a-col>
          <a-col :span="4">{{value.budget[5].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[5].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[5].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4"></a-col>
          <a-col :span="4"></a-col>
          <a-col :span="4">{{value.budget[6].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[6].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[6].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4"></a-col>
          <a-col :span="4"></a-col>
          <a-col :span="4">{{value.budget[7].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[7].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[7].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4"></a-col>
          <a-col :span="4"></a-col>
          <a-col :span="4">{{value.budget[8].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[8].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[8].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4"></a-col>
          <a-col :span="4"></a-col>
          <a-col :span="4">{{value.budget[9].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[9].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[9].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4"></a-col>
          <a-col :span="4"></a-col>
          <a-col :span="4">{{value.budget[10].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[10].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[10].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4"></a-col>
          <a-col :span="4"></a-col>
          <a-col :span="4">{{value.budget[11].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[11].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[11].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4"></a-col>
          <a-col :span="4"></a-col>
          <a-col :span="4">{{value.budget[12].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[12].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[12].govBudget}}</a-col>
        </a-row>
        <a-row>
          <a-col :span="4"></a-col>
          <a-col :span="4"></a-col>
          <a-col :span="4">{{value.budget[13].budgetName}}</a-col>
          <a-col :span="6">{{value.budget[13].totalBudget}}</a-col>
          <a-col :span="6">{{value.budget[13].govBudget}}</a-col>
        </a-row>
      </template>

      <a-row>
        <a-col :span="24">
          <div class="tb-title">
            <span>项目组成员（含项目负责人）</span>
          </div>
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="2" class="bg-gray">
          姓名
        </a-col>
        <a-col :span="3" class="bg-gray">
          出生年月
        </a-col>
        <a-col :span="2" class="bg-gray">
          学历
        </a-col>
        <a-col :span="2" class="bg-gray">
          职称
        </a-col>
        <a-col :span="4" class="bg-gray">
          研究方向
        </a-col>
        <a-col :span="6" class="bg-gray">
          工作单位
        </a-col>
        <a-col :span="3" class="bg-gray">
          项目分工
        </a-col>
        <a-col :span="2" class="bg-gray">
          年参加月数
        </a-col>
      </a-row>
      <a-row v-for="(item, index) in value.members" :key="'member' + index">
        <a-col :span="2">
          {{item.name}}
        </a-col>
        <a-col :span="3">
          {{moment(item.birthday).format('YYYY-MM-DD')}}
        </a-col>
        <a-col :span="2">
          {{item.degreeName}}
        </a-col>
        <a-col :span="2">
          {{item.titleName}}
        </a-col>
        <a-col :span="4">
          {{item.researchDirection}}
        </a-col>
        <a-col :span="6">
          {{item.workUnit}}
        </a-col>
        <a-col :span="3">
          {{item.projWork}}
        </a-col>
        <a-col :span="2">
          {{item.forMonths}}
        </a-col>
      </a-row>
      <a-row>
        <a-col :span="24">
          <div class="tb-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 AuditList from '@/views/audit/components/auditInfo'

const cont1 = () => { return { id: null, testId: null, contentInfo: '', startTime: null, endTime: null, contentType: 'd37abeb6-14e0-4486-924d-e1e4baf67098', showIndex: 1 } }
const cont2 = () => { return { id: null, testId: null, contentInfo: '', startTime: null, endTime: null, contentType: 'b1fe4003-16ed-482f-8fd5-e34b1482c3d4', showIndex: 1 } }
const cont3 = () => { return { id: null, testId: null, contentInfo: '', startTime: null, endTime: null, contentType: 'b19cf66b-c1bb-4974-a524-114c1895dbd8', showIndex: 1 } }
const cont4 = () => { return { id: null, testId: null, contentInfo: '', startTime: null, endTime: null, contentType: 'cf3abeff-9f1a-420e-b375-6aad33f12080', showIndex: 1 } }
const cont5 = () => { return { id: null, testId: null, contentInfo: '', startTime: null, endTime: null, contentType: 'f1cea24c-d13d-48af-8abb-58eed9367c27', showIndex: 1 } }
const cont6 = () => { return { id: null, testId: null, contentInfo: '', startTime: null, endTime: null, contentType: 'ebcdf2b0-011c-4d40-a064-f22d6f7ec646', showIndex: 1 } }

export default {
  components: {
    AuditList
  },
  name: "TestInfo",
  data () {
    return {
      testInfo: {
        id: '',
        projId: '',
        projName: '',
        startDate: null,
        endDate: null,
        appUnitName: '',
        linkTel: '',
        linkAddress: '',
        linkEmail: '',
        // 实施目标和主要内容
        testContent: '',
        // 总经费
        budgetCount: 0,
        // 市卫计委资助
        budgetGovCount: 0,
        // 起止日期
        startDate: null,
        endDate: null,
        // 申报人
        appPersonName: null,
        sex: null,
        birthYear: null,
        mobile: null,
        degreeName: null,
        titleName: null,
        // 依托单位
        appUnitName: null,
        linkEmail: null,
        linkTel: null,
        linkAddress: null,
        postcode: null,
        authority: null,
        // 项目内容
        cont1: [cont1()],
        cont2: [cont2()],
        cont3: [cont3()],
        cont4: [cont4()],
        cont5: [cont5()],
        cont6: [cont6()],
        // 成员
        members: [],
        // 预期成果形式
        target: [],
        // 经费
        budget: [],
        //审核记录
        auditList: [{ result: '', unit: '', time: '' }],
      }
    }
  },
  props: {
    value: {
      type: Object,
      default: () => {
        return [...this.testInfo]
      }
    }
  },
  created () {
    this.load()
  },
  mounted () {
    this.tinymceSet()
  },
  methods: {
    moment,
    load () {
    },
    tinymceSet () {
      tinymce.remove('#tinymce_dom')
      tinymce.init({
        selector: '#tinymce_dom',
        language: 'zh_CN',
        content_style: "img {max-width:100%;}",
        height: 800,
        inline: true,
        readonly: true,
      })
    },
  }
}
</script>

<style lang="less" scoped>
.from-table {
  border-right: 1px solid #f0f0f0;
  border-bottom: 1px solid #f0f0f0;
  .ant-col {
    padding: 0 16px;
    line-height: 40px;
    min-height: 40px;
    border-left: 1px solid #f0f0f0;
    border-top: 1px solid #f0f0f0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .bg-gray {
    background-color: #f8fafc;
  }
  .more-row {
    white-space: pre-wrap;
    line-height: 2;
  }
  .flex-layout {
    display: flex;
  }
  // 内容垂直居中
  .special-middle {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
}
// 项目组 格式修改
.ant-row-flex {
  text-align: center;
  .ant-col {
    padding: 0;
  }
  .bg-gray {
    border-bottom: 1px solid #f0f0f0;
  }
}
.tb-title {
  color: #0079fe;
  display: flex;
  text-align: center;
  height: 40px;
  &::after {
    content: "";
    flex-grow: 1;
    border-top: 1px dashed #d9d9d9;
    transform: translateY(50%);
    margin-left: 10px;
  }
}
</style>