<template>
  <div>
    <a-row>
      <a-col :span="24">
        <div class="tb-title">
          <span>项目课题设置</span>
        </div>
      </a-col>
    </a-row>
    <a-row type="flex" class="row_center">
      <a-col :span="6" class="bg-gray">
        <div class="special-middle">
          <div class="required">课题名称</div>
        </div>
      </a-col>
      <a-col :span="4" class="bg-gray">
        <div class="special-middle">
          <div class="required">承担单位</div>
        </div>
      </a-col>
      <a-col :span="2" class="bg-gray">
        <div class="special-middle">
          <div class="required">课题负责人</div>
        </div>
      </a-col>
      <a-col :span="3" class="bg-gray">
        <div class="special-middle">
          <div class="required">课题预算总经费</div>
        </div>
      </a-col>
      <a-col :span="3" class="bg-gray">
        <div class="special-middle">
          <div class="required">其中：省科技经费</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-row>
    <a-row v-for="(item, index) in projectSubList" :key="'projectSubList'+index" type="flex" class="row_center">
      <a-col :span="6">
        <a-form-model-item :prop="'projectSubList.' + index + '.projName'" :rules="{ required: true, message: '*', trigger: 'blur',}">
          <a-input v-model="item.projName" :maxLength="100" placeholder="课题名称" style="width:85%" />
        </a-form-model-item>
      </a-col>
      <a-col :span="4">
        <a-form-model-item :prop="'projectSubList.' + index + '.undertakingUnit'" :rules="{ required: true, message: '*', trigger: 'blur',}">
          <a-input v-model="item.undertakingUnit" :maxLength="100" placeholder="承担单位" style="width:85%" />
        </a-form-model-item>
      </a-col>
      <a-col :span="2">
        <a-form-model-item :prop="'projectSubList.' + index + '.director'" :rules="{ required: true, message: '*', trigger: 'blur',}">
          <a-input v-model="item.director" :maxLength="50" placeholder="课题负责人" style="width:85%" />
        </a-form-model-item>
      </a-col>
      <a-col :span="3">
        <a-form-model-item :prop="'projectSubList.' + index + '.totalBudget'" :rules="{ required: true, message: '*', trigger: 'blur',}">
          <a-input-number v-model="item.totalBudget" placeholder="课题预算总经费" :min="0" :step="0.01" style="width:85%" />
        </a-form-model-item>
      </a-col>
      <a-col :span="3">
        <a-form-model-item :prop="'projectSubList.' + index + '.govBudget'" :rules="{ required: true, message: '*', trigger: 'blur',}">
          <a-input-number v-model="item.govBudget" placeholder="其中:省科技经费" :min="0" :step="0.01" style="width:85%" />
        </a-form-model-item>
      </a-col>
      <a-col :span="3">
        <a-form-model-item :prop="'projectSubList.' + index + '.selfBudget'" :rules="{ required: true, message: '*', trigger: 'blur',}">
          <a-input-number v-model="item.selfBudget" placeholder="自筹经费" :min="0" :step="0.01" style="width:85%" />
        </a-form-model-item>
      </a-col>
      <a-col :span="3">
        <div class="special-middle">
          <a-popconfirm title="确定要删除吗？" ok-text="确定" cancel-text="取消" @confirm="deleteArray(item)">
            <a-button type="link" size="small">删除</a-button>
          </a-popconfirm>
        </div>
      </a-col>
    </a-row>
    <a-row type="flex">
      <a-col :span="24" style="text-align: center">
        <div class="special-middle">
          <a-button type="dashed" style="width: 20%" @click="addArray()">
            <a-icon type="plus" /> 添加 <span style="color:red;margin-left:10px"></span>
          </a-button>
        </div>
      </a-col>
    </a-row>
  </div>
</template>

<script>
const ProjectSub = { projName: null, undertakingUnit: null, address: null, director: null, totalBudget: null, govBudget: null, selfBudget: null, cooperativeUnits: null, fileId: null, downloadId: null, fileName: null, downloadUrl: null }

import { isEmptyParams } from "@/views/utils/common"


export default {
  name: "projectSubEdit",
  components: {
    
  },
  props: {
    projectSubList: {
      type: Array,
      default: () => {
        return [{ ...ProjectSub }]
      }
    },
  },
  data () {
    return {

    };
  },
  created () {

  },
  computed: {

  },
  methods: {
    addArray () {//添加成员
      this.projectSubList.push({ ...ProjectSub })
    },
    deleteArray (item) {//移除成员
      let index = this.projectSubList.indexOf(item)
      if (index !== -1) {
        this.projectSubList.splice(index, 1)
      }
    },
  },
};
</script>
<style scoped lang="less">
.file-description {
  display: block;
  width: 100%;
  line-height: 22px;
  padding: 3px 3px 3px 3px;
  color: red;
  white-space: normal;
  word-wrap: break-word;
  //   text-indent: 1em;
}
.inner_from {
  .ant-row-flex:last-child .ant-col {
    border-bottom: 0;
  }
  .ant-row-flex .ant-col:first-child {
    border-left: 0;
  }
  .ant-row-flex {
    border-right: 0;
  }
}
.special-middle {
  .font_s {
    margin: 0 6px;
  }
}
</style>