web/src/components/selector/IndustrySelector.vue

<template>
  <selector-card
    class="industry-selector"
    :cardType="selectorType"
    @onConfirm="onConfirm"
    @onCancel="onCancel"
  >
    <div slot="header" :class="{ 's-header': selectorType === 'line' }">
      <slot name="header">选择行业分类</slot>
    </div>
    <IndustrySelectorContent
      ref="content"
      @onChange="onChange"
      :dataType="dataType"
      :selectorType="selectorType"
      :initIndustry="initIndustry"
    />
  </selector-card>
</template>

<script>
import SelectorCard from '@/components/selector/SelectorCard.vue'
import IndustrySelectorContent from '@/components/selector/IndustrySelectorContent.vue'
export default {
  name: 'industry-selector',
  components: {
    SelectorCard,
    IndustrySelectorContent
  },
  props: {
    selectorType: {
      type: String,
      default: 'card'
    },
    dataType: {
      type: String,
      default: 'industry'
    },
    initIndustry: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  data () {
    return {}
  },
  created () {},
  methods: {
    setIndustryState (data) {
      return this.$refs.content.setIndustryState(data)
    },
    getSelected () {
      return this.$refs.content.getSelected()
    },
    onCancel () {
      this.$emit('onCancel')
    },
    onConfirm () {
      const selected = this.getSelected()
      this.$emit('onConfirm', selected)
    },
    onChange (selected) {
      this.$emit('onChange', selected)
    }
  }
}
</script>

<style lang="scss" scoped>

</style>