'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _typeof2 = require('babel-runtime/helpers/typeof');

var _typeof3 = _interopRequireDefault(_typeof2);

var _popup = require('../popup');

var _popup2 = _interopRequireDefault(_popup);

var _transferDom = require('../directives/transfer-dom');

var _transferDom2 = _interopRequireDefault(_transferDom);

require('./index.less');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

var ActionSheet = {
    name: 'SnActionSheet',
    data: function data() {
        return {
            show: false
        };
    },

    directives: { TransferDom: _transferDom2['default'] },
    props: {
        value: {
            type: Boolean,
            'default': false
        },
        options: Array,
        message: String,
        cancel: {
            type: Boolean,
            'default': true
        },
        cancelText: {
            type: String,
            'default': '取消'
        }
    },
    created: function created() {},
    mounted: function mounted() {},

    methods: {
        onInput: function onInput(val) {
            this.show = val;
        },
        renderMessage: function renderMessage() {
            var h = this.$createElement;

            if (this.message !== undefined && this.message !== null && this.message !== '') {
                return h(
                    'div',
                    { 'class': 'sn-action-sheet-message' },
                    [this.message]
                );
            }
        },
        renderOptions: function renderOptions() {
            var _this = this;

            var h = this.$createElement;

            var options = this.options || [];

            return options.map(function (item, index) {
                if ((typeof item === 'undefined' ? 'undefined' : (0, _typeof3['default'])(item)) === 'object') {
                    return h(
                        'div',
                        {
                            'class': 'sn-action-sheet-item',
                            style: {
                                color: item.disabled ? '#999' : item.color ? item.color : ''
                            },
                            on: {
                                'click': function click() {
                                    return item.disabled ? undefined : _this.onOptionClick(item, index);
                                }
                            }
                        },
                        [item.title]
                    );
                } else {
                    return h(
                        'div',
                        {
                            'class': 'sn-action-sheet-item',
                            on: {
                                'click': function click() {
                                    return _this.onOptionClick(item, index);
                                }
                            }
                        },
                        [item]
                    );
                }
            });
        },
        renderCancel: function renderCancel() {
            var h = this.$createElement;

            if (this.cancel) {
                return h(
                    'div',
                    { 'class': 'sn-action-sheet-cancel', on: {
                            'click': this.onCancel
                        }
                    },
                    [this.cancelText]
                );
            }
        },
        onShow: function onShow() {
            this.$emit('show');
        },
        onHide: function onHide() {
            this.show = false;
            this.$emit('input', false);
            this.$emit('hide');
        },
        onOptionClick: function onOptionClick(item, index) {
            this.onHide();
            this.$emit('select', item, index);
        },
        onCancel: function onCancel() {
            this.onHide();
            this.$emit('cancel');
        }
    },
    watch: {
        value: function value(newVal, oldVal) {
            this.show = newVal;
        }
    },
    render: function render() {
        var h = arguments[0];
        var show = this.show;


        return h(
            'div',
            {
                directives: [{
                    name: 'transfer-dom',
                    value: true
                }]
            },
            [h(
                _popup2['default'],
                {
                    attrs: {
                        value: show
                    },
                    on: {
                        'input': this.onInput,
                        'click-overlay': this.onHide
                    },

                    style: 'background: transparent;'
                },
                [h(
                    'div',
                    { 'class': 'sn-action-sheet' },
                    [this.renderMessage(), h(
                        'div',
                        { 'class': 'sn-action-sheet-options-group' },
                        [this.renderOptions()]
                    ), this.renderCancel()]
                )]
            )]
        );
    }
};

ActionSheet.install = function (Vue) {
    Vue.component(ActionSheet.name, ActionSheet);
};

exports['default'] = ActionSheet;
module.exports = exports.default;