<template>
           <div class="cell flex justify-between py-3 border-t border-b border-gray-500 px-2">
               <div class="left flex items-center">
                   <app-icon v-if='icon' :name="icon" size='18px'></app-icon>
                   <div class="px-2">
                       {{text}}
                   </div>
                   </div>
               <div class="right">
                   <div v-if="type=='click'" @click="eventEmit(type)">
                        <app-icon name="icon-xiayibu" size='18px'></app-icon>
                   </div>
                
               </div>
           </div>
</template>

<script lang="ts">
import Vue from 'vue';
import { Switch } from 'ant-design-vue'
Vue.use(Switch)
export default Vue.extend({
    components:{
        'app-icon':()=>import('@/components/common/Icon.vue')
    },
  props: {
    size: String,
    type: {
        type:String,
        default:'click'
    },
    disabled:{
        type:Boolean,
        default:false
    },
    text:{
        type: String,
        required: true
    },
    icon:String

  },
  methods:{
      eventEmit(v:any){
          if(this.disabled){
              return
          }
          if(this.type === 'click'){
            this.$emit('onClick',v)
          }    
    
      }
  },
  computed:{
      getSize(){
          switch (this.size) {
              case 'full':
                    return 'w-full'
              default:
                  return 'w-20';
          }
      }
  }
});
</script>

