<template>
  <div>
      <el-carousel trigger="click" height="150px" type="card" arrow="always">
        <el-carousel-item v-for="item in carousels" :key="item.name" style="display:flex;flex-direction: column;align-items: center;">
            <p>{{ item.name }}</p>
            <p>怎么做？请<el-link type="primary" style="font-size: 16px;vertical-align:baseline" @click="open(item)">点击</el-link>我,让我来帮助你</p>
          </el-carousel-item>
          <!-- <el-carousel-item v-for="item in 1" :key="item" style="text-align:center;vertical-align:middle;">
            <component :is='`carousel_${item}`'></component>
          </el-carousel-item> -->
        </el-carousel>

        <el-dialog
            :visible.sync="dialogVisible"
            width="600px"
            custom-class="event"
            :before-close="handleClose"
            append-to-body>
            <addQuestion @formData="handleFormData" :type="type" @resetClose="handleClose" :row="row"></addQuestion>
        </el-dialog>
  </div>
</template>

<script>
import carousel_1 from './carousels/carousel_1.vue';
import addQuestion from '@/views/questionEvent/components/addQuestion.vue';
export default {
  components: {
    carousel_1,
    addQuestion
  },
  props: {},
  data() {
    return {
        carousels:[
            {
                name:'我要做专利培育布局',
                value:1,
                placeholder:'xx产品或技术专利培育布局',
            },
            {
                name:'我要产品上市/控制出口风险',
                value:2,
                placeholder:'xx产品上市/出口风险控制',
            },
            {
                name:'我要处理侵权纠纷',
                value:3,
                placeholder:'xx专利侵权纠纷',
            },
            {
                name:'我要进行专利盘点与运维',
                value:4,
                placeholder:'',
            },
            {
                name:'我要专利维权',
                value:5,
                placeholder:'',
            },
            {
                name:'我要做科技与重大立项专利导航',
                value:6,
                placeholder:'',
            },
            {
                name:'我要IPO上市',
                value:7,
                placeholder:'xx地区IPO上市',
            },
            {
                name:'我要应对竞争对手威胁',
                value:8,
                placeholder:'',
            },
        ],
        type:1,
        row:{},
        dialogVisible:false,

    };
  },
  watch: {},
  computed: {},
  created() {},
  mounted() {},
  methods: {
    open(item){
        this.row = {
            applicationScenarios : [item.value],
            placeholder : item.placeholder
        }
        this.dialogVisible = true
    },
    handleClose(){
        this.dialogVisible = false
        this.row = {}
    },
    async getCommonData() {
      await this.$api.getCommonData({ keys: 'QUERY_GROUP,ENTERPRISE_APPLICATION_SCENARIO,INVESTIGATION_TYPE' }).then(response => {
        this.commonData = response.data
      })
    },

    //新增事件
    handleFormData({ list, option,edit }) {
        console.log(list)
      let lists = JSON.parse(JSON.stringify(list))
      if(lists.length == 0){
        this.handleClose()
        return false
      }
      this.forms = {
        projectId: this.projectId,
        eventAddNewDTOs:lists
      }
      this.$api.eventAddNew(this.forms).then(res => {
        if (res.code == 200) {
          this.$message.success('事件新增成功')
          this.visualRouter(lists)//跳转
          this.handleClose()
        }
      }).catch(error => {
        this.$message.error(error.message)
      })

    },
    visualRouter(val){
        if(val.length ==1){
            if( val[0].applicationScenarios.length == 0){
                return false
            }
            var visuals = {
                Scenario:null,
                eventId:null,
                eventName:val[0].questionName
            }
            this.$router.push({
                path:'/eventVisual',
                query:{
                    visuals:JSON.stringify(visuals)
                }
            })
        }
    },
  },
};
</script>
<style lang="scss" scoped>
</style>