"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("./index.css");

var _promise = _interopRequireDefault(require("@babel/runtime-corejs2/core-js/promise"));

require("core-js/modules/web.dom.iterable");

var _get = _interopRequireDefault(require("lodash/get"));

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

var _dom = require("../_utils/dom");

var _MenuBar = _interopRequireDefault(require("./MenuBar"));

var _Tips = _interopRequireDefault(require("../Tips"));

var _Content = _interopRequireDefault(require("./Content"));

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

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

/* script */
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var __vue_script__ = {
  name: (0, _component.createComponentName)('editor-help'),
  components: {
    MenuBar: _MenuBar.default,
    Content: _Content.default
  },
  mixins: [_component.componentMixin],
  model: {
    name: 'value',
    event: 'change'
  },
  props: {
    // 是否可以见,可以通过 v-model 绑定
    value: {
      type: Boolean,
      default: false
    },
    // udesk 配置
    udeskConfig: {
      type: Object,
      default: function _default() {
        return {};
      }
    },
    // 展示未读消息
    unread: {
      type: Boolean,
      default: true
    },
    // 哪个位置的帮助内容
    position: {
      type: Number,
      // 2: 抠图编辑器
      default: 2
    }
  },

  data() {
    return {
      list: [],
      articleContentMap: {},
      articleStatusMap: {},
      articleId: null,
      loadContent: false
    };
  },

  computed: {
    content() {
      if (!this.articleId) return null;

      if (this.articleContentMap[this.articleId]) {
        return this.articleContentMap[this.articleId].content;
      }

      return null;
    }

  },
  watch: {
    articleId(value) {
      if (!value) return;
      this.getArticle(value);
    }

  },

  mounted() {
    this.getArticles();
    (0, _dom.clickOutside)(this.$el, this.onClose);
  },

  methods: {
    onClose() {
      if (this.value) {
        // value 变化触发
        // @arg (value: boolean)
        this.$emit('change', false);
      }
    },

    getArticles() {
      var _this = this;

      return (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee() {
        var res;
        return _regenerator.default.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                _context.prev = 0;
                _context.next = 3;
                return _request.default.get('/api/articles', {
                  params: {
                    positions: _this.position,
                    type: 'help'
                  }
                });

              case 3:
                res = _context.sent;
                _this.list = res.data;
                _context.next = 10;
                break;

              case 7:
                _context.prev = 7;
                _context.t0 = _context["catch"](0);
                (0, _Tips.default)(_context.t0);

              case 10:
              case "end":
                return _context.stop();
            }
          }
        }, _callee, this, [[0, 7]]);
      }))();
    },

    getArticle(id) {
      var _this2 = this;

      return (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee2() {
        return _regenerator.default.wrap(function _callee2$(_context2) {
          while (1) {
            switch (_context2.prev = _context2.next) {
              case 0:
                _this2.loadContent = true;
                _context2.next = 3;
                return _promise.default.all([_this2.getArticleContent(id), _this2.getArticleLikeStatus(id)]);

              case 3:
                _this2.loadContent = false;

              case 4:
              case "end":
                return _context2.stop();
            }
          }
        }, _callee2, this);
      }))();
    },

    getArticleContent(id) {
      var _this3 = this;

      return (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee3() {
        var res;
        return _regenerator.default.wrap(function _callee3$(_context3) {
          while (1) {
            switch (_context3.prev = _context3.next) {
              case 0:
                if (!_this3.articleContentMap[id]) {
                  _context3.next = 4;
                  break;
                }

                return _context3.abrupt("return", _this3.articleContentMap[id]);

              case 4:
                _this3.$set(_this3.articleContentMap, id, null);

                _context3.next = 7;
                return _request.default.get('/api/articles/' + id);

              case 7:
                res = _context3.sent;
                _this3.articleContentMap[id] = res.data;

              case 9:
              case "end":
                return _context3.stop();
            }
          }
        }, _callee3, this);
      }))();
    },

    changeArticle(status) {
      var _this4 = this;

      return (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee4() {
        var lastStatus, res, id;
        return _regenerator.default.wrap(function _callee4$(_context4) {
          while (1) {
            switch (_context4.prev = _context4.next) {
              case 0:
                lastStatus = _this4.articleStatusMap[_this4.articleId].status;
                _this4.articleStatusMap[_this4.articleId].status = 'on' + status;
                _context4.prev = 2;

                if (!(lastStatus && lastStatus.indexOf(status) === 0)) {
                  _context4.next = 8;
                  break;
                }

                _context4.next = 6;
                return _this4.deleteArticleStatus();

              case 6:
                _context4.next = 12;
                break;

              case 8:
                _context4.next = 10;
                return _request.default.post(`/api/articles/${_this4.articleId}/likes`, {
                  status: status === 'praise' ? 1 : 0
                });

              case 10:
                res = _context4.sent;
                _this4.articleStatusMap[_this4.articleId] = {
                  status,
                  id: res.data.id
                };

              case 12:
                _context4.next = 19;
                break;

              case 14:
                _context4.prev = 14;
                _context4.t0 = _context4["catch"](2);
                (0, _Tips.default)(_context4.t0);
                id = (0, _get.default)(_this4.articleStatusMap, `${_this4.articleId}.id`, null);
                _this4.articleStatusMap[_this4.articleId] = {
                  status: lastStatus + 'error',
                  id
                };

              case 19:
              case "end":
                return _context4.stop();
            }
          }
        }, _callee4, this, [[2, 14]]);
      }))();
    },

    deleteArticleStatus() {
      var _this5 = this;

      return (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee5() {
        return _regenerator.default.wrap(function _callee5$(_context5) {
          while (1) {
            switch (_context5.prev = _context5.next) {
              case 0:
                _context5.next = 2;
                return _request.default.delete(`api/articles/${_this5.articleId}/likes/${_this5.articleStatusMap[_this5.articleId].id}`);

              case 2:
                _this5.articleStatusMap[_this5.articleId] = {
                  status: null,
                  id: null
                };

              case 3:
              case "end":
                return _context5.stop();
            }
          }
        }, _callee5, this);
      }))();
    },

    getArticleLikeStatus(id) {
      var _this6 = this;

      return (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee6() {
        var res, status;
        return _regenerator.default.wrap(function _callee6$(_context6) {
          while (1) {
            switch (_context6.prev = _context6.next) {
              case 0:
                _context6.next = 2;
                return _request.default.get(`/api/articles/${id}/likes`);

              case 2:
                res = _context6.sent;
                status = (0, _get.default)(res.data, '0.status', null);

                if (status === 0) {
                  status = 'blame';
                } else if (status === 1) {
                  status = 'praise';
                }

                _this6.$set(_this6.articleStatusMap, _this6.articleId, {
                  status,
                  id: (0, _get.default)(res.data, '0.id', null)
                });

              case 6:
              case "end":
                return _context6.stop();
            }
          }
        }, _callee6, this);
      }))();
    }

  }
};
/* template */

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

  var _h = _vm.$createElement;

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

  return _c("transition", {
    attrs: {
      name: "editor-help-slide-fade"
    }
  }, [_c("div", {
    directives: [{
      name: "show",
      rawName: "v-show",
      value: _vm.value,
      expression: "value"
    }],
    class: _vm.bem({
      active: this.articleId
    })
  }, [_c("MenuBar", {
    attrs: {
      unread: _vm.unread,
      udeskConfig: _vm.udeskConfig,
      list: _vm.list
    },
    model: {
      value: _vm.articleId,
      callback: function callback($$v) {
        _vm.articleId = $$v;
      },
      expression: "articleId"
    }
  }, [_vm._t("footer")], 2), _vm._v(" "), _c("transition", {
    attrs: {
      name: "editor-help-fade"
    }
  }, [!_vm.loadContent && _vm.articleId ? _c("Content", {
    attrs: {
      status: _vm.articleStatusMap[_vm.articleId].status,
      content: _vm.content,
      id: _vm.articleId
    },
    on: {
      clickPraise: function clickPraise($event) {
        _vm.changeArticle("praise");
      },
      clickBlame: function clickBlame($event) {
        _vm.changeArticle("blame");
      }
    }
  }) : _vm._e()], 1)], 1)]);
};

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;