<template>


<view :class="(extClass)+' weui-icon'" :style="'background:'+(color)+';width:'+(size)+'px;height:'+(utils.ifSpecialIcon(icon) ? utils.double(size) : size)+'px;mask-image:url('+(src)+');-webkit-mask-image:url('+(src)+');-moz-mask-image:url('+(src)+')'"></view>

</template>
<script module="utils" lang="wxs">
    var double = function(a) {
        return 2*a
    };
    var ifSpecialIcon = function(v) {
      return v === 'arrow' || v === 'back'
    }
    module.exports = {
      double: double,
      ifSpecialIcon: ifSpecialIcon
    }
</script>
<script >
var _base = _interopRequireDefault(__webpack_require__(11));
var _icondata = _interopRequireDefault(__webpack_require__(12));
function _interopRequireDefault(obj) {
  return obj && obj.__esModule ? obj : {
    default: obj
  };
}
const getFixedIconType = function (type) {
  // 兼容旧版本 typo
  return type === 'field' ? 'filled' : type;
};
export default {
                    data() {
            return {
  src: '',
  height: 20,
  width: 20
};
        }, 
options: {
  addGlobalClass: true
}, 
props: {
  extClass: {
    type: String,
    default: ''
  },
  type: {
    type: String,
    default: 'outline'
  },
  icon: {
    type: String,
    default: ''
  },
  size: {
    type: Number,
    default: 20
  },
  color: {
    type: String,
    default: '#000000'
  }
}, 
methods: {
  genSrcByIconFun(v) {
    this.genSrcFun(_icondata.default[v][getFixedIconType(this.data.type)]);
  },
  genSrcByTypeFun(v) {
    this.genSrcFun(_icondata.default[this.data.icon][getFixedIconType(v)]);
  },
  genSrcFun(rawData) {
    if (!rawData) return; // type 不存在

    const base64 = _base.default.encode(rawData);
    this.setData({
      src: 'data:image/svg+xml;base64,' + base64
    });
  }
}, 
created: function() {},
                    watch:{
                      type: {
                        handler: function(v) {
                          this.genSrcFun(_icondata.default[this.data.icon][getFixedIconType(v)]);
                        },

                        immediate: true
                      },

                      icon: {
                        handler: function(v) {
                          this.genSrcFun(_icondata.default[v][getFixedIconType(this.data.type)]);
                        },

                        immediate: true
                      }
                    }
                };

/***/
</script>
<style >
 .weui-icon{vertical-align:middle;display:inline-block;background:black;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;-moz-mask-repeat:no-repeat;mask-size:cover;-webkit-mask-size:cover;-moz-mask-size:cover}  
</style>