"use strict";

var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

var _regenerator = _interopRequireDefault(require("@babel/runtime-corejs2/regenerator"));

require("regenerator-runtime/runtime");

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/asyncToGenerator"));

require("./TextPanel.css");

var _Panel = _interopRequireDefault(require("./Panel"));

var _Icon = _interopRequireDefault(require("../Icon"));

var _request = _interopRequireDefault(require("../request"));

var _ossDprUrl = _interopRequireDefault(require("../oss/oss-dpr-url"));

var _component = require("../_utils/component");

var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));

var _LoadMore = _interopRequireDefault(require("../LoadMore"));

var _vueNormalizeComponent = _interopRequireDefault(require("../_utils/vue-normalize-component.js"));

/* script */
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var PREVIEW_WIDTH = 110;
var PREVIEW_HEIGHT = 74;
var cachesMap = {};
var __vue_script__ = {
  name: (0, _component.createComponentName)('editor-text-panel'),
  components: {
    Panel: _Panel.default,
    LoadMore: _LoadMore.default,
    Icon: _Icon.default
  },
  mixins: [_component.componentMixin],
  props: {
    // 默认字体
    fonts: {
      type: Array,
      default: function _default() {
        return [{
          label: '标题',
          displayFontSize: 28,
          data: {
            type: 'text',
            content: '双击编辑文字',
            fontFamily: 'SourceHanSansSC-Bold',
            fontWeight: 700,
            fontSize: 70,
            textAlign: 'center',
            color: '#333',
            ruleIndex: -1
          }
        }, {
          label: '正文',
          displayFontSize: 16,
          data: {
            type: 'text',
            content: '双击编辑文字',
            fontFamily: 'SourceHanSansSC-Regular',
            fontSize: 20,
            textAlign: 'center',
            color: '#333',
            ruleIndex: -1
          }
        }];
      }
    },
    // 获取字体数据的平台ID
    platformId: {
      type: Number,
      default: 256
    },
    // 业务场景，二进制 1：web  2：淘宝 web 4： 超级详情 8：APP 16: H5 32: 小程序
    channels: {
      type: [String, Number]
    },
    title: {
      type: String
    }
  },

  data() {
    return {
      textEffects: [],
      pagination: {
        num: 0,
        size: 40,
        total: 10000
      },
      autoLoadingTimes: Infinity
    };
  },

  computed: {
    hasMore() {
      return (this.pagination.num - 1) * this.pagination.size + this.__listLenght < this.pagination.total;
    }

  },
  methods: {
    loadMore() {
      var _this = this;

      return (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee() {
        return _regenerator.default.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                _context.next = 2;
                return _this.loadMoreData();

              case 2:
                return _context.abrupt("return", _this.hasMore);

              case 3:
              case "end":
                return _context.stop();
            }
          }
        }, _callee, this);
      }))();
    },

    loadMoreData() {
      var _this2 = this;

      return _request.default.get('/api/materials', {
        params: {
          page_num: this.pagination.num + 1,
          page_size: this.pagination.size,
          type: 'text_effect',
          channels: this.channels,
          platforms: this.platformId
        }
      }).then(function (res) {
        var _this2$textEffects;

        _this2.__listLenght = res.data.length;
        _this2.pagination.total = res.pagination.total;
        _this2.pagination.num = res.pagination.num;

        (_this2$textEffects = _this2.textEffects).push.apply(_this2$textEffects, res.data);
      });
    },

    getTextEffect(id) {
      var _this3 = this;

      if (cachesMap[id]) return this.$emit('addElement', (0, _cloneDeep.default)(cachesMap[id]));

      _request.default.get(`/api/materials/${id}`).then(function (res) {
        var model = JSON.parse(res.data.content).model;
        model.materialId = res.data.id;
        model.disableColor = true;
        model.ruleIndex = -1;
        cachesMap[id] = model;

        _this3.$emit('addElement', (0, _cloneDeep.default)(model));
      }).catch(function (err) {
        throw err;
      });
    },

    getTextResourceCssBg(item) {
      var url = item.preview && item.preview.url; // zoom with max width or height

      if (url) {
        url += `?x-oss-process=image/resize,w_${Math.ceil(PREVIEW_WIDTH * 2)},h_${Math.ceil(PREVIEW_HEIGHT * 2)}/interlace,1`;
      }

      return url ? (0, _ossDprUrl.default)(`url(${url})`) : null;
    }

  }
};
/* template */

var __vue_render__ = function __vue_render__() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c("Panel", {
    attrs: {
      name: "text",
      title: _vm.title
    },
    scopedSlots: _vm._u([{
      key: "tab",
      fn: function fn(ref) {
        var active = ref.active;
        return [_vm._t("label", [_c("Icon", {
          attrs: {
            name: "text"
          }
        }), _vm._v(" "), _c("span", [_vm._v("文字")])], {
          active: active
        })];
      }
    }])
  }, [_c("template", {
    slot: "title"
  }, [_vm._t("title")], 2), _vm._v(" "), _vm._t("default", [_c("div", {
    class: _vm.bem()
  }, [_c("ul", {
    class: _vm.bem("list")
  }, [_vm._l(_vm.fonts, function (font) {
    return _c("li", {
      key: font.label,
      style: {
        fontSize: font.displayFontSize + "px",
        fontWeight: font.data.fontWeight,
        fontFamily: font.data.fontFamily
      },
      on: {
        click: function click($event) {
          _vm.$emit("addElement", font.data);
        }
      }
    }, [_c("span", [_vm._v(_vm._s(font.label))])]);
  }), _vm._v(" "), _vm._l(_vm.textEffects, function (item) {
    return _c("li", {
      key: item.id,
      style: {
        backgroundImage: _vm.getTextResourceCssBg(item)
      },
      on: {
        click: function click($event) {
          _vm.getTextEffect(item.id);
        }
      }
    });
  })], 2), _vm._v(" "), _c("LoadMore", {
    class: _vm.bem("loadmore"),
    attrs: {
      loadmore: _vm.loadMore,
      autoLoadingTimes: _vm.autoLoadingTimes,
      showNoMore: false
    }
  })], 1)])], 2);
};

var __vue_staticRenderFns__ = [];
__vue_render__._withStripped = true;
/* style */

var __vue_inject_styles__ = undefined;
/* scoped */

var __vue_scope_id__ = undefined;
/* module identifier */

var __vue_module_identifier__ = undefined;
/* functional template */

var __vue_is_functional_template__ = false;
/* component normalizer */

/* style inject */

/* style inject SSR */
var _default2 = (0, _vueNormalizeComponent.default)({
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, undefined, undefined);

exports.default = _default2;