<template>
  <div id="info-1">
    <van-row>
      <van-col span="24" class="main">
        <van-col span="24" class="one">
          <van-image :src="img_url"></van-image>
        </van-col>
        <van-col span="24" class="two">
          <van-form>
            <van-field v-model="info.term" name="term" label="专利有效性" />
            <van-field v-model="info.name" name="name" label="名称" />
            <van-field v-model="info.create_number" name="create_number" label="申请号" />
            <van-field v-model="info.create_date" name="create_date" label="申请日" />
            <van-field v-model="info.success_number" name="success_number" label="公开(公告)号" />
            <van-field v-model="info.success_date" name="success_date" label="公开(公告)日" />
            <van-field v-model="info.type" name="type" label="专利类型" />
            <van-field v-model="info.inventor" name="inventor" label="发明人" />
            <van-field v-model="info.address" name="address" label="发明人地址" />
            <van-field v-model="info.apply_personal" name="apply_personal" label="申请人" />
            <van-field v-model="info.agent_personal" name="agent_personal" label="代理人" />
            <van-field v-model="info.agent" name="agent" label="代理机构" />
            <van-field v-model="info.abstract" name="abstract" label="摘要" rows="1" autosize type="textarea" />
          </van-form>
        </van-col>
      </van-col>
    </van-row>
  </div>
</template>

<script>
import { mapState, createNamespacedHelpers } from 'vuex';
export default {
  name: 'info-1',
  props: {
    info: { type: Object },
  },
  components: {},
  data: function () {
    return { img_url: '' };
  },
  created() {},
  methods: {
    searchImg(data) {
      if (data & (data.length > 0)) {
        var url = data.map((item) => item.url)[0];
        this.$set(this, `img_url`, url);
      } else {
        var url = require('@/assets/fmzl.jpg');
        this.$set(this, `img_url`, url);
      }
    },
  },
  computed: {
    ...mapState(['user']),
  },
  metaInfo() {
    return { title: this.$route.meta.title };
  },
  watch: {
    info: {
      deep: true,
      immediate: true,
      handler(val) {
        this.searchImg(val.img_url);
      },
    },
  },
};
</script>
<style lang="less" scoped>
.main {
  .one {
    height: 220px;
    border-bottom: 1px solid #f1f1f1;
    .van-image {
      width: 100%;
      height: 219px;
    }
  }
}
</style>
