<template>
  <div id="fabuList">
    <el-row>
      <el-col :span="24" class="info">
        <el-col :span="24" class="one">
          <span></span>
          <span>需求发布</span>
        </el-col>
        <el-col :span="24">
          <el-form ref="form" :model="form" label-width="80px">
            <el-form-item label="需求技术名称">
              <el-input v-model="form.name"></el-input>
            </el-form-item>

            <el-form-item label="所属领域">
              <el-radio-group v-model="form.resource">
                <el-radio label="工业"></el-radio>
                <el-radio label="农业"></el-radio>
                <el-radio label="社会发展"></el-radio>
                <el-radio label="医药健康"></el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="拟投入预算（万）">
              <el-input v-model="form.name"></el-input>
            </el-form-item>

            <el-form-item label="需求截止日期">
              <el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
            </el-form-item>

            <el-form-item label="难题或瓶颈问题">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>

            <el-form-item label="企业解决技术需求已具备的条件">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>

            <el-form-item label="合作方式">
              <el-radio-group v-model="form.resource">
                <el-radio label="技术转让"></el-radio>
                <el-radio label="技术服务"></el-radio>
                <el-radio label="技术许可"></el-radio>
                <el-radio label="技术融资"></el-radio>
                <el-radio label="其他"></el-radio>
              </el-radio-group>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="onSubmit">发布</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { mapState, createNamespacedHelpers } from 'vuex';
export default {
  name: 'fabuList',
  props: { form: null },
  components: {},
  data: function() {
    return {};
  },
  created() {},
  methods: {
    onSubmit() {
      console.log('submit!');

      this.$emit('submit', this.form);
    },
  },
  computed: {
    ...mapState(['user']),
    pageTitle() {
      return `${this.$route.meta.title}`;
    },
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
};
</script>

<style lang="less" scoped>
.info {
  width: 100%;
  min-height: 600px;
  background: #fff;
  padding: 0 20px;
  .one {
    height: 35px;
    margin: 20px 0;
    border-bottom: 1px dashed #ccc;
    span:first-child {
      display: inline-block;
      width: 4px;
      height: 20px;
      background: #005293;
      margin: 0 10px -3px 0;
    }
    span:nth-child(2) {
      font-size: 20px;
      color: #005293;
      font-weight: bold;
    }
  }
}
</style>
