exports.ids = [6,1];
exports.modules = {

/***/ 153:
/***/ (function(module, exports, __webpack_require__) {

// style-loader: Adds some css to the DOM by adding a <style> tag

// load the styles
var content = __webpack_require__(159);
if(content.__esModule) content = content.default;
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add CSS to SSR context
var add = __webpack_require__(5).default
module.exports.__inject__ = function (context) {
  add("07fbb799", content, true, context)
};

/***/ }),

/***/ 158:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_3_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_3_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_3_oneOf_1_2_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Barrage_vue_vue_type_style_index_0_id_c3f32de4_lang_css_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(153);
/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_3_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_3_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_3_oneOf_1_2_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Barrage_vue_vue_type_style_index_0_id_c3f32de4_lang_css_scoped_true___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_3_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_3_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_3_oneOf_1_2_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Barrage_vue_vue_type_style_index_0_id_c3f32de4_lang_css_scoped_true___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_vue_style_loader_index_js_ref_3_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_3_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_3_oneOf_1_2_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Barrage_vue_vue_type_style_index_0_id_c3f32de4_lang_css_scoped_true___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_vue_style_loader_index_js_ref_3_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_3_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_3_oneOf_1_2_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Barrage_vue_vue_type_style_index_0_id_c3f32de4_lang_css_scoped_true___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));


/***/ }),

/***/ 159:
/***/ (function(module, exports, __webpack_require__) {

// Imports
var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(4);
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(false);
// Module
___CSS_LOADER_EXPORT___.push([module.i, ".z_barrage-container[data-v-c3f32de4]{pointer-events:none}.z_container[data-v-c3f32de4]{width:100%;overflow:hidden}.z_barrage[data-v-c3f32de4]{position:absolute;top:0;left:0}", ""]);
// Exports
module.exports = ___CSS_LOADER_EXPORT___;


/***/ }),

/***/ 169:
/***/ (function(module, exports, __webpack_require__) {

// style-loader: Adds some css to the DOM by adding a <style> tag

// load the styles
var content = __webpack_require__(199);
if(content.__esModule) content = content.default;
if(typeof content === 'string') content = [[module.i, content, '']];
if(content.locals) module.exports = content.locals;
// add CSS to SSR context
var add = __webpack_require__(5).default
module.exports.__inject__ = function (context) {
  add("38ee8f50", content, true, context)
};

/***/ }),

/***/ 174:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);

// CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@nuxt/components/dist/loader.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/Barrage.vue?vue&type=template&id=c3f32de4&scoped=true&
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"z_barrage-container"},[_vm._ssrNode("<canvas"+(_vm._ssrAttr("width",_vm.containerWidth))+(_vm._ssrAttr("height",_vm.containerHeight))+" style=\"display: none\" data-v-c3f32de4></canvas> <div class=\"z_container\""+(_vm._ssrStyle(null,{ height: _vm.containerHeight / 2 + 'px' }, null))+" data-v-c3f32de4><canvas id=\"canvas\""+(_vm._ssrAttr("width",_vm.containerWidth))+(_vm._ssrAttr("height",_vm.containerHeight))+" class=\"z_barrage\""+(_vm._ssrStyle(null,{
        width: _vm.containerWidth / 2 + 'px',
        height: _vm.containerHeight / 2 + 'px'
      }, null))+" data-v-c3f32de4></canvas></div>")])}
var staticRenderFns = []


// CONCATENATED MODULE: ./src/components/Barrage.vue?vue&type=template&id=c3f32de4&scoped=true&

// CONCATENATED MODULE: ./node_modules/babel-loader/lib??ref--2-0!./node_modules/@nuxt/components/dist/loader.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/components/Barrage.vue?vue&type=script&lang=js&
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
// import faceMap from '../../assets/emoji'
let aniId, aniId1;
/* harmony default export */ var Barragevue_type_script_lang_js_ = ({
  name: 'Barrage',
  props: {
    barrageList: {
      type: Array,
      default: () => []
    },
    speed: {
      type: Number,
      default: 4
    },
    loop: {
      type: Boolean,
      default: true
    },
    channels: {
      type: Number,
      default: 2
    },
    barrageHeight: {
      type: Number,
      default: 60
    },
    screenPercent: {
      type: Number,
      default: 0.3
    },
    borderColor: {
      type: String,
      default: ''
    },
    background: {
      type: String,
      default: ''
    },
    deviceType: {
      type: String,
      default: 'pc'
    },
    linearGradient: {
      type: Object,
      default: () => {
        return {
          startColor: '',
          endColor: ''
        };
      }
    }
  },

  data() {
    return {
      newBarrageArray: [],
      // 新增弹幕之后的总弹幕
      barrageArray: [],
      barrageQueue: [],
      containerWidth: 0,
      containerHeight: 0,
      channelsArray: [],
      barrageChannels: 1
    };
  },

  watch: {
    barrageList(val) {
      if (val.length !== 0) {
        this.barrageQueue = JSON.parse(JSON.stringify(val));
        this.newBarrageArray = JSON.parse(JSON.stringify(val));
        this.initData();
        window.cancelAnimationFrame(aniId);
        aniId = window.requestAnimationFrame(this.render);
      }
    }

  },

  mounted() {
    this.containerWidth = this.deviceType === 'pc' ? 723 * 2 : document.body.clientWidth * 2;
    this.containerHeight = 365 * 2; // 设定总高度

    this.barrageChannels = this.channels; // 总高度对应的轨道数

    this.ctx = this.$refs.canvas.getContext('2d');
    this.ctx1 = this.$refs.canvasContainer.getContext('2d');
    this.barrageClickEvent();
  },

  methods: {
    /**
     * 数据初始化
     */
    initData() {
      for (let i = 0; i < this.barrageQueue.length; i++) {
        // 此处处理只显示50个字符
        let tagImg = null;
        let img = null;

        if (this.barrageQueue[i].icon) {
          img = new Image();
          img.src = this.barrageQueue[i].icon;
        }

        if (this.barrageQueue[i].tagImage) {
          tagImg = new Image();
          tagImg.src = this.barrageQueue[i].tagImage;
        }

        const content = this.dealStr(this.barrageQueue[i].content);
        this.barrageArray.push({
          id: this.barrageQueue[i].id,
          content,
          x: this.containerWidth + this.barrageHeight,
          icon: img,
          tagImage: tagImg,
          width: this.ctx1.measureText(content).width * 3.6 + (this.barrageQueue[i].icon ? 60 : 0),
          color: this.barrageQueue[i].color || '#FFFFFF',
          bgColor: this.barrageQueue[i].bgColor || 'rgba(0,0,0,0.4)'
        });
      }

      this.initChannel();
    },

    /**
     * 初始化轨道数据
     */
    initChannel() {
      for (let i = 0; i < this.barrageChannels; i++) {
        const item = this.barrageArray.shift();

        if (item) {
          this.channelsArray[i] = [item];
        } else {
          this.channelsArray[i] = [];
        }
      }
    },

    /**
     * 渲染
     */
    render() {
      this.ctx.clearRect(0, 0, this.containerWidth, this.containerHeight);
      this.ctx.font = '36px Microsoft YaHei';
      this.draw();
      window.cancelAnimationFrame(aniId1);
      aniId1 = window.requestAnimationFrame(this.render);
    },

    draw() {
      for (let i = 0; i < this.channelsArray.length; i++) {
        for (let j = 0; j < this.channelsArray[i].length; j++) {
          try {
            const barrage = this.channelsArray[i][j];
            barrage.x -= this.speed;

            if (barrage.x <= this.containerWidth) {
              // 弹幕显示
              this.borderColor && this.drawRoundRectBorder(this.ctx, barrage.x - this.barrageHeight / 2, i * (this.barrageHeight + 60) + 20, barrage.width + this.barrageHeight, this.barrageHeight, this.barrageHeight / 2);
              this.drawRoundRect(this.ctx, barrage.bgColor, barrage.x - this.barrageHeight / 2, i * (this.barrageHeight + 60) + 21, barrage.width + this.barrageHeight, this.barrageHeight - 2, this.barrageHeight / 2);
              this.ctx.fillStyle = `${barrage.color}`;
              this.ctx.fillText(barrage.content, barrage.x + (barrage.icon ? this.barrageHeight / 2 + 10 : -5), i * (this.barrageHeight + 60) + this.barrageHeight - 25);

              if (barrage.icon) {
                this.circleImg(this.ctx, barrage.icon, barrage.x - 40, i * (this.barrageHeight + 60) + 40, 40);
              }

              if (barrage.tagImage) {
                this.originImg(this.ctx, barrage.tagImage, barrage.x - this.barrageHeight - 10, i * (this.barrageHeight + 60) + 20, this.barrageHeight, this.barrageHeight);
              }
            }

            if (barrage.x < -(barrage.width + this.barrageHeight)) {
              // 弹幕删除
              const arr = this.channelsArray.reduce((a, b) => a.concat(b));

              if (this.loop) {
                if (this.checkBarrageStatus(arr)) {
                  this.barrageQueue = [];
                  this.barrageQueue = JSON.parse(JSON.stringify(this.newBarrageArray));
                  this.initData();
                }
              }
            } // 弹幕插入时机判断


            if (barrage.x <= Math.floor(this.containerWidth - barrage.width - 40) && barrage.x >= Math.floor(this.containerWidth - barrage.width - 40 - this.speed) && j === this.channelsArray[i].length - 1 && this.barrageArray.length !== 0) {
              const item = this.barrageArray.shift();
              this.channelsArray[i].push(item);
            }
          } catch (e) {
            console.log(e);
          }
        }
      }
    },

    /**
     * 重置数据
     */
    add(obj) {
      const content = this.dealStr(obj.content);
      let img = null;
      let tagImg = null;

      if (obj.icon) {
        img = new Image();
        img.src = obj.icon;
      }

      if (obj.tagImage) {
        tagImg = new Image();
        tagImg.src = obj.tagImage;
      }

      const item = {
        id: obj.id,
        content,
        x: this.containerWidth + this.barrageHeight,
        icon: obj.icon ? img : '',
        tagImage: obj.tagImage ? tagImg : '',
        width: this.ctx1.measureText(content).width * 3 + (obj.icon ? this.barrageHeight : 0),
        color: obj.color || '#FFFFFF',
        bgColor: obj.bgColor || 'rgba(0,0,0,0.4)'
      };
      const originItem = {
        id: obj.id,
        content: obj.content,
        icon: obj.icon,
        tagImage: obj.tagImage,
        color: obj.color || '#FFFFFF',
        bgColor: obj.bgColor || 'rgba(0,0,0,0.4)'
      };

      if (this.barrageArray.length === 0) {
        // 剩余弹幕数为0
        this.newBarrageArray.unshift(originItem);
      } else {
        this.barrageArray.unshift(item);
        const insertIndex = this.barrageList.length - this.barrageArray.length;
        this.newBarrageArray.splice(insertIndex, 0, originItem);
      }
    },

    /**
     * 弹幕点击事件
     */
    barrageClickEvent() {
      document.getElementById('canvas').addEventListener('click', e => {
        const p = this.getEventPosition(e);
        const channelIndex = Math.floor(p.y / (this.barrageHeight + 36));
        const tempArray = JSON.parse(JSON.stringify(this.channelsArray[channelIndex]));

        for (let i = 0; i < tempArray.length; i++) {
          const channelItemArray = tempArray[i];

          if (p.x > channelItemArray.x && p.x < channelItemArray.x + channelItemArray.width) {
            if (channelItemArray.id) {
              this.$emit('doLike', channelItemArray.id);
            }
          }
        }
      }, false);
    },

    /**
     * 获取点击位置
     */
    getEventPosition(ev) {
      let x, y;

      if (ev.layerX || ev.layerX === 0) {
        x = ev.layerX;
        y = ev.layerY;
      } else if (ev.offsetX || ev.offsetX === 0) {
        x = ev.offsetX;
        y = ev.offsetY;
      }

      return {
        x: 2 * x,
        y: 2 * y
      };
    },

    /**
     * 判断所有的弹幕是否滚动完成
     * @params arr
     */
    checkBarrageStatus(arr) {
      for (let i = 0; i < arr.length; i++) {
        if (arr[i].x > -arr[i].width) return false;
      }

      return true;
    },

    /**
     * 处理字符
     */
    dealStr(str) {
      return str.length > 50 ? `${str.substring(0, 50)}...` : str;
    },

    /**
     * 获取随机颜色
     */
    getColor() {
      return `#${Math.floor(Math.random() * 16777215).toString(16)}`;
    },

    /**
     * 裁剪图片
     * @param ctx
     * @param img
     * @param x
     * @param y
     * @param r
     */
    circleImg(ctx, img, x, y, r) {
      ctx.save();
      const d = 2 * r;
      const cx = x + r;
      const cy = y + r;
      ctx.beginPath();
      ctx.arc(cx, cy, r, 0, 2 * Math.PI);
      ctx.clip();
      ctx.drawImage(img, x, y, d, d);
      ctx.restore();
      ctx.closePath();
    },

    /**
     * 绘制原始图片
     * @param ctx
     * @param img
     * @param x
     * @param y
     * @param width
     * @param height
     */
    originImg(ctx, img, x, y, width, height) {
      try {
        ctx.beginPath();
        ctx.drawImage(img, x, y, width, height);
        ctx.closePath();
      } catch (e) {
        console.log(e);
      }
    },

    /**
     * 绘画圆角矩形
     * @param context
     * @param bgColor
     * @param x
     * @param y
     * @param width
     * @param height
     * @param radius
     */
    drawRoundRect(context, bgColor, x, y, width, height, radius) {
      if (this.linearGradient.startColor && this.linearGradient.endColor) {
        const linearGrad = context.createLinearGradient(x, y, x, y + height);
        linearGrad.addColorStop(0, this.linearGradient.startColor);
        linearGrad.addColorStop(1, this.linearGradient.endColor);
        context.fillStyle = linearGrad || bgColor;
      } else {
        context.fillStyle = this.background || bgColor;
      }

      context.beginPath();
      context.arc(x + radius, y + radius, radius, Math.PI, Math.PI * 3 / 2);
      context.lineTo(width - radius + x, y);
      context.arc(width - radius + x, radius + y, radius, Math.PI * 3 / 2, Math.PI * 2);
      context.lineTo(width + x, height + y - radius);
      context.arc(width - radius + x, height - radius + y, radius, 0, Math.PI / 2);
      context.lineTo(radius + x, height + y);
      context.arc(radius + x, height - radius + y, radius, Math.PI / 2, Math.PI);
      context.fill();
      context.closePath();
    },

    /**
     * 绘画圆角矩形
     * @param context
     * @param x
     * @param y
     * @param width
     * @param height
     * @param radius 半径
     */
    drawRoundRectBorder(context, x, y, width, height, radius) {
      context.beginPath();
      context.lineWidth = 2;
      context.strokeStyle = this.borderColor;
      context.arc(x + radius, y + radius, radius, Math.PI, Math.PI * 3 / 2);
      context.lineTo(width - radius + x, y);
      context.arc(width - radius + x, radius + y, radius, Math.PI * 3 / 2, Math.PI * 2);
      context.lineTo(width + x, height + y - radius);
      context.arc(width - radius + x, height - radius + y, radius, 0, Math.PI / 2);
      context.lineTo(radius + x, height + y);
      context.arc(radius + x, height - radius + y, radius, Math.PI / 2, Math.PI);
      context.stroke();
      context.closePath();
    }

  }
});
// CONCATENATED MODULE: ./src/components/Barrage.vue?vue&type=script&lang=js&
 /* harmony default export */ var components_Barragevue_type_script_lang_js_ = (Barragevue_type_script_lang_js_); 
// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
var componentNormalizer = __webpack_require__(1);

// CONCATENATED MODULE: ./src/components/Barrage.vue



function injectStyles (context) {
  
  var style0 = __webpack_require__(158)
if (style0.__inject__) style0.__inject__(context)

}

/* normalize component */

var component = Object(componentNormalizer["a" /* default */])(
  components_Barragevue_type_script_lang_js_,
  render,
  staticRenderFns,
  false,
  injectStyles,
  "c3f32de4",
  "61721d3f"
  
)

/* harmony default export */ var Barrage = __webpack_exports__["default"] = (component.exports);

/***/ }),

/***/ 193:
/***/ (function(module, exports, __webpack_require__) {

module.exports = __webpack_require__.p + "img/chatbot_audio_feature.458e9b3.png";

/***/ }),

/***/ 194:
/***/ (function(module, exports, __webpack_require__) {

module.exports = __webpack_require__.p + "img/play_chatbot_audio.87713b4.png";

/***/ }),

/***/ 195:
/***/ (function(module, exports, __webpack_require__) {

module.exports = __webpack_require__.p + "img/pause_chatbot_audio.48f50e9.png";

/***/ }),

/***/ 196:
/***/ (function(module, exports) {

module.exports = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAA4JJREFUWEfVmO+LFVUYx7/f2Uv+AaE2cyl8EfUiMWkNg3BnxDSlCLWZa0GhICqYJb1YDCXoRSJoEAoG3YgKFevOZNGLDEt3Zn2h4C8INyp6Vd4Z3YVAeqXunSfORZd19/44M3vvcp1XlzvP83k+58w5Z84Zoscv9rgfHmzB5DVnQa0Gpw9ii6AA8JJQRop+9HOeno/dgVUA+0k+LZT/mOLUQynPPXwivNaM17AHr7vOy0LZI8BzjRIF+AvEyUJfYe/846dvtJK98fqK+eO18T0QrCHweKNYAudSwWfFIPpi6v37BIccp/DE3PRjgjt0ekiAXykyaAXDpxrFqx4T8gCBRTo8Amf+xdiap/zfbt+LnxCsesufJNLfdUDTWikomUHkT/4/cW1PiEoe3u1aai04cTZRuZME7SoBKw+wDpokORO5u1Ijph8tnBCMXbsMYkteOZVXH5cixwxwNCXebTbetGsI37eC8ENWPXslgYZjSBvWrUCRFxmX7HcgONitGjPhkhxk7NmfAtg6E1AXc48owYsA+rtYJDe6vozFni25CbOQyMQbOC/g0lmolbmEAFdYLdmHKHg7c/asJPBz9YjVBFETpecuoexg/KqzBIZc6Dk7JZTy2fqrLnbtIyDe6ClJwVEriN6sC1ZLzgsUybXH61ajhFxZrIS/TGwWYs/+DsDabhXMyP3e8qN1E5sF9ePvDc7CQiqnAczLCOt0+Oi4wRWPfRNevU+wPhZ7Y0Zvs/yofK/V07b8iet8KZSNne4WHR6FX5lBuGly7HRBb9lcgfETgGd0oB2MuUykq03/7FhLQXXzH9dx+ihKck4HBVqhbtWEqx8NwnBqUNNzceLa24U4PBuCFLxlBtEnjWq1PLjH3sA+gO91VVKw2wqifc1qtP2ykJTswyLY3g1J9a4tVoZbPqW2gvU3jWfvJzDYSUm1nTcr4UftmFqCCpJ4ziaBTDv5tyvQ8D6x06pEh3RytQUVbNRzFo9DruiAm44pyktmZfhHXUYmQQUdW7/MvNNHH+DzukXuxv0pMF4p+kN/ZMnLLKjg8gGMZMQpA7JZpxiBHx7BvPX0/ZpOfNuFWhcSu/ZeELtbxZPYb1aiXbpM7YVaFxh7y/uBVB0bpp6ty4BRtvyhS7qszAt1FvA1z1lsMN0oKW5SjK+tb8NcX8o63oNZGpEnNtckyVMob07PC/4PRJ4btbS2eHQAAAAASUVORK5CYII="

/***/ }),

/***/ 197:
/***/ (function(module, exports, __webpack_require__) {

module.exports = __webpack_require__.p + "img/public.43b7bb8.png";

/***/ }),

/***/ 198:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_7_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_7_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_7_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_7_oneOf_1_3_node_modules_sass_resources_loader_lib_loader_js_ref_7_oneOf_1_4_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_id_vue_vue_type_style_index_0_lang_scss___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(169);
/* harmony import */ var _node_modules_vue_style_loader_index_js_ref_7_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_7_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_7_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_7_oneOf_1_3_node_modules_sass_resources_loader_lib_loader_js_ref_7_oneOf_1_4_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_id_vue_vue_type_style_index_0_lang_scss___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_vue_style_loader_index_js_ref_7_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_7_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_7_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_7_oneOf_1_3_node_modules_sass_resources_loader_lib_loader_js_ref_7_oneOf_1_4_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_id_vue_vue_type_style_index_0_lang_scss___WEBPACK_IMPORTED_MODULE_0__);
/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_vue_style_loader_index_js_ref_7_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_7_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_7_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_7_oneOf_1_3_node_modules_sass_resources_loader_lib_loader_js_ref_7_oneOf_1_4_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_id_vue_vue_type_style_index_0_lang_scss___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_vue_style_loader_index_js_ref_7_oneOf_1_0_node_modules_css_loader_dist_cjs_js_ref_7_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_7_oneOf_1_2_node_modules_sass_loader_dist_cjs_js_ref_7_oneOf_1_3_node_modules_sass_resources_loader_lib_loader_js_ref_7_oneOf_1_4_node_modules_nuxt_components_dist_loader_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_id_vue_vue_type_style_index_0_lang_scss___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));


/***/ }),

/***/ 199:
/***/ (function(module, exports, __webpack_require__) {

// Imports
var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(4);
var ___CSS_LOADER_GET_URL_IMPORT___ = __webpack_require__(6);
var ___CSS_LOADER_URL_IMPORT_0___ = __webpack_require__(8);
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(false);
var ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);
// Module
___CSS_LOADER_EXPORT___.push([module.i, "*{margin:0;border:none;padding:0}html{height:100%}body{position:relative;min-width:320px;min-height:100%;background:#fff;font-family:MicrosoftYaHei;font-size:0}body .outer-container{min-width:1258px}body .outer-container.isMobile{min-width:auto}body .outer-container.isMobile .content-container{padding:60px 0 62px;width:100%}body .outer-container.isMobile .content-container .left-content{display:block!important;margin-right:0!important;width:100%!important}body .outer-container.isMobile .content-container .footer-outer{position:absolute!important;min-width:auto!important}body .outer-container.isMobile .content-container .load-more{width:100%!important}body .outer-container.isMobile .content-container .common-flex{display:block!important}body .outer-container.isMobile .content-container .common-other-content{margin:0!important}body .outer-container.isMobile .content-container .common-other-content h6{margin-bottom:10px!important;font-size:20px!important;line-height:28px!important}body .outer-container.isMobile .content-container .common-other-content .font-content b,body .outer-container.isMobile .content-container .common-other-content .font-content h5,body .outer-container.isMobile .content-container .common-other-content .font-content h6,body .outer-container.isMobile .content-container .common-other-content .font-content p{margin-bottom:8px!important;font-size:16px!important;line-height:24px!important;word-break:break-all}body .outer-container.isMobile .content-container .common-other-content .font-content h5{font-size:18px!important}body .outer-container.isMobile.hasLoginBottom{padding-bottom:calc(env(safe-area-inset-bottom) + 55px)}body .outer-container.isMobile.hasLoginBottom .bottom-outer,body .outer-container.isMobile.hasLoginBottom .footer-outer{bottom:calc(constant(safe-area-inset-bottom) + 55px);bottom:calc(env(safe-area-inset-bottom) + 55px)}body .outer-container.isMobile.hasLoginBottom .fixed-box{bottom:calc(constant(safe-area-inset-bottom) + 65px)!important;bottom:calc(env(safe-area-inset-bottom) + 65px)!important}body .content-container{margin:0 auto;width:1080px}body img{vertical-align:top;-o-object-fit:cover;object-fit:cover}body a{text-decoration:none}.article-detail-page .comment-model-popup .content>div>div>div>div body p,body .article-detail-page .comment-model-popup .content>div>div>div>div p,body .text-ellipsis{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}body .left-content{display:inline-block;margin-right:32px;width:723px}body .right-content{float:right;display:inline-block;width:325px}body .common-flex{display:grid;grid-template-columns:repeat(4,25%)}body .load-more{margin:0 auto;width:357px;height:50px;background:#f5f5f8;border-radius:4px;font-size:18px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#939aa7;line-height:50px;text-align:center}body .footer-outer{position:fixed;bottom:0;left:0;width:100%;min-width:1258px;background:#f5f5f8;z-index:9}body .common-title{padding:20px 0 10px;text-align:left;font-size:24px;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#001965;line-height:33px}body .common-title a{float:right;font-size:16px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#5d6269}body .common-title a i{color:#001965}body p.go-follow{margin-bottom:23px;height:50px;background:#e6553f;border-radius:4px;text-align:center;cursor:pointer;font-size:18px;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#fff;line-height:50px}body .common-other-content{margin:44px 0;padding:30px;box-sizing:border-box}body .common-other-content h6{margin-bottom:20px;font-size:24px;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#001965;line-height:33px}body .common-other-content .font-content b,body .common-other-content .font-content h5,body .common-other-content .font-content h6,body .common-other-content .font-content p{margin-bottom:12px;font-size:18px;color:#5d6269;line-height:30px}body .common-other-content .font-content h5{font-size:20px}body .el-message{top:50%!important}body .el-message i{font-size:16px}@media screen and (max-width:500px){body .el-message{min-width:200px;max-width:80%}}body .video-player-box .vjs-big-play-button{top:50%;left:50%;border:none;outline:none;width:68px;height:67px;transform:translate(-50%,-50%);background:url(" + ___CSS_LOADER_URL_REPLACEMENT_0___ + ") 50% no-repeat;background-color:transparent!important;background-size:68px 67px}body .video-player-box .vjs-big-play-button .vjs-icon-placeholder:before{display:none}body .video-player-box .vjs-control-bar button{outline:none}body .el-avatar>img{width:100%}.article-detail-page{position:relative}.article-detail-page .left-content div.top{margin-bottom:20px;border-bottom:1px solid #f5f5f8;padding-bottom:30px}.article-detail-page .left-content div.top img{width:100%;height:407px;border-radius:4px}.article-detail-page .left-content div.top h4{font-size:32px;font-family:MicrosoftYaHei-Bold,MicrosoftYaHei;font-weight:700;color:#292b2c;line-height:44px}.article-detail-page .left-content>p:nth-child(2){margin-bottom:20px;font-size:16px;font-family:Apis-Regular,Apis;font-weight:400;color:#bac0c2;line-height:28px}.article-detail-page .left-content .video-box{margin-bottom:20px}.article-detail-page .left-content .video-box video{width:100%}.article-detail-page .left-content .chatbot-audio{position:relative;margin-bottom:20px;padding:16px 16px 0 85px;width:100%;height:105px;background:#f5f5f8;border-radius:8px;box-sizing:border-box}.article-detail-page .left-content .chatbot-audio>img{position:absolute;top:12px;left:12px;width:57px;height:87px}.article-detail-page .left-content .chatbot-audio>div h6{font-size:18px;font-family:PingFangSC-Semibold,PingFang SC;font-weight:600;color:#333;line-height:25px}.article-detail-page .left-content .chatbot-audio>div>div{position:relative;margin-top:25px;padding-left:48px}.article-detail-page .left-content .chatbot-audio>div>div>img{position:absolute;top:-17px;left:-10px;width:60px;height:60px;cursor:pointer}.article-detail-page .left-content .chatbot-audio>div>div div{display:flex}.article-detail-page .left-content .chatbot-audio>div>div div>span{width:38px;font-size:12px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#939aa7;line-height:17px}.article-detail-page .left-content .chatbot-audio>div>div div p{position:relative;margin-top:7px;width:calc(100% - 76px);height:3px;background:#e3e3e3;border-radius:2px}.article-detail-page .left-content .chatbot-audio>div>div div p span{position:absolute;top:0;left:0;height:3px;background:linear-gradient(90deg,#3b97de,#38b0ff);border-radius:2px}.article-detail-page .left-content .chatbot-audio>div>div div>span:last-child{text-align:right}.article-detail-page .left-content .article-content{border-bottom:1px solid #f5f5f8;padding:23px 0;font-size:18px;color:#292b2c;line-height:30px}.article-detail-page .left-content .article-content img{max-width:100%;border-radius:4px}.article-detail-page .left-content .bottom-box{padding-top:20px}.article-detail-page .left-content .bottom-box div.comment-box{position:relative}.article-detail-page .left-content .bottom-box div.comment-box h6{height:50px}.article-detail-page .left-content .bottom-box div.comment-box h6 span:first-child{font-size:24px;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:#001965;line-height:50px}.article-detail-page .left-content .bottom-box div.comment-box h6 span:last-child{float:right;width:208px;height:50px;background:#3099ea;border-radius:4px;text-align:center;font-size:18px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#fff;line-height:50px;cursor:pointer}.article-detail-page .left-content .bottom-box div.comment-box .comment-content{position:relative;margin-top:24px;height:365px;box-sizing:border-box}.article-detail-page .left-content .bottom-box div.comment-box .comment-content .baberrage-item{padding:0}.article-detail-page .left-content .bottom-box div.comment-box .comment-content .baberrage-item .barrage-items{display:inline-block;border:1px solid #ededed;padding:0 20px 0 10px;height:60px;background:#fff;border-radius:30px;box-sizing:border-box}.article-detail-page .left-content .bottom-box div.comment-box .comment-content .baberrage-item .barrage-items img{margin:9px 10px 0 0;width:40px;height:40px;border-radius:20px}.article-detail-page .left-content .bottom-box div.comment-box .comment-content .baberrage-item .barrage-items span{font-size:18px;font-family:AppleColorEmoji;color:#939aa7;line-height:58px}.article-detail-page .left-content .bottom-box div.comment-box>p{position:absolute;top:100px;width:100%;font-size:20px;color:#292b2c;text-align:center;line-height:100px}.article-detail-page .right-content{position:fixed;top:116px}.article-detail-page .right-content .common-title{padding:0 0 8px;font-size:18px;color:#292b2c;line-height:25px}.article-detail-page .right-content .common-title img{margin:3px 0 0 4px;width:20px;height:20px}.article-detail-page .right-content .list .list-item{display:block;position:relative;border-bottom:1px solid #f5f5f8;padding:20px 0 0 124px;height:120px;box-sizing:border-box}.article-detail-page .right-content .list .list-item img{position:absolute;left:0;width:110px;height:80px;border-radius:4px}.article-detail-page .right-content .list .list-item p{font-size:16px;color:#292b2c;line-height:24px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.article-detail-page .right-content .list .list-item div.bottom{position:absolute;right:0;bottom:19px;text-align:right}.article-detail-page .right-content .list .list-item div.bottom span{font-size:16px;font-family:Apis-Regular,Apis;font-weight:400;color:#bac0c2;line-height:28px}.article-detail-page .right-content .list .list-item div.bottom span i{margin-left:3px}.article-detail-page .right-content .stack-bottom{position:-webkit-sticky;position:sticky;bottom:0;left:0;font-size:16px;color:#000;padding:0 20px 10px;height:117px;border-radius:6px;background-color:#f5f5f8}.article-detail-page .right-content .stack-bottom .s-container{position:absolute;bottom:10px;left:32px;display:flex;grid-gap:24px;gap:24px;align-items:flex-end}.article-detail-page .right-content .stack-bottom .s-container .s-left{flex-shrink:0;width:121px;height:178px}.article-detail-page .right-content .stack-bottom .s-container .s-right{flex:1;text-align:center}.article-detail-page .right-content .stack-bottom .s-container .s-right .code{padding:4px;width:80px;height:80px;background-color:#fff;border-radius:7px;box-shadow:0 2px 12px rgba(0,0,0,.10196)}.article-detail-page .right-content .stack-bottom .s-container .s-right .name{margin-top:10px;font-size:14px;line-height:20px;color:#292b2c}.article-detail-page .comment-model-popup{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9}.article-detail-page .comment-model-popup .mask{position:absolute;top:0;left:0;width:100%;height:100%}.article-detail-page .comment-model-popup .content{position:absolute;bottom:0;left:0;border:1px solid #e3e3e3;padding:44px 0 42px;width:100%;box-shadow:0 -10px 10px 0 rgba(0,0,0,.08);border-radius:4px 4px 0 0;background:#fff;text-align:center}.article-detail-page .comment-model-popup .content>div{overflow-y:scroll;margin:0 auto 39px;max-width:1044px;max-height:300px}.article-detail-page .comment-model-popup .content>div>div>div{display:flex;flex-wrap:wrap}.article-detail-page .comment-model-popup .content>div>div>div>div{padding:0 14px}.article-detail-page .comment-model-popup .content>div>div>div>div p{margin-bottom:20px;border:1px solid #f5f5f8;padding:0 20px;min-width:320px;height:60px;box-sizing:border-box;background:#f5f5f8;font-size:16px;font-family:AppleColorEmoji;color:#292b2c;line-height:58px;border-radius:30px;cursor:pointer}.article-detail-page .comment-model-popup .content>div>div>div>div p.chosen{border-color:#3099ea;background:rgba(48,153,234,.1)}.article-detail-page .comment-model-popup .content>p{margin:0 auto;width:325px;height:50px;background:#3099ea;border-radius:4px;font-size:18px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#fff;line-height:50px;cursor:pointer}.isMobile .article-detail-page{padding:11px 15px 400px!important;background:#fff}.isMobile .article-detail-page .left-content div.top{margin-bottom:10px;padding-bottom:10px}.isMobile .article-detail-page .left-content div.top h4{font-size:24px;line-height:30px}.isMobile .article-detail-page .left-content>p:nth-child(2){margin-bottom:10px;font-size:14px}.isMobile .article-detail-page .left-content .chatbot-audio{margin-top:20px;padding:25px 15px 10px 70px}.isMobile .article-detail-page .left-content .chatbot-audio>img{left:10px;top:-15px}.isMobile .article-detail-page .left-content .chatbot-audio>div>div{margin-left:-55px;padding:0;width:calc(100% + 55px)}.isMobile .article-detail-page .left-content .chatbot-audio>div>div>img{top:-62px;right:-13px;left:auto}.isMobile .article-detail-page .left-content .bottom-box{position:absolute;bottom:20px;left:0;padding:0 15px;width:100%;box-sizing:border-box}.isMobile .article-detail-page .left-content .bottom-box div.comment-box h6{height:40px}.isMobile .article-detail-page .left-content .bottom-box div.comment-box h6 span:first-child{display:none}.isMobile .article-detail-page .left-content .bottom-box div.comment-box h6 span:last-child{width:150px;height:40px;line-height:40px}.isMobile .article-detail-page .left-content .bottom-box div.comment-box .comment-content{height:290px}.isMobile .article-detail-page .left-content .bottom-box div.comment-box .comment-content .z_barrage{left:-15px}.isMobile .article-detail-page .right-content{float:none;padding-top:10px;width:100%}.isMobile .article-detail-page .right-content>div>div{margin-bottom:10px;border:none;padding:15px 15px 12px;height:auto;background:#f1f1f1;border-radius:10px;box-sizing:border-box}.isMobile .article-detail-page .right-content>div>div img{display:none}.isMobile .article-detail-page .right-content>div>div div.bottom{position:unset;margin-top:4px;text-align:left}.isMobile .article-detail-page .comment-model-popup{z-index:10}.isMobile .article-detail-page .comment-model-popup .mask{background:rgba(0,0,0,.5)}.isMobile .article-detail-page .comment-model-popup .content{border:none;padding:62px 15px 15px;box-shadow:0 0 10px 0 rgba(0,0,0,.05);border-radius:20px 20px 0 0;box-sizing:border-box}.isMobile .article-detail-page .comment-model-popup .content>div{margin:0;width:100%;max-width:none}.isMobile .article-detail-page .comment-model-popup .content>div>div>div{display:block}.isMobile .article-detail-page .comment-model-popup .content>div>div>div>div{padding:0}.isMobile .article-detail-page .comment-model-popup .content>div>div>div>div p{margin-bottom:10px;border:none;padding:11px 15px;height:auto;min-width:auto;background:#eef5fb;border-radius:10px;box-sizing:border-box;text-align:left;font-size:16px;font-family:AppleColorEmoji;color:#292b2c;line-height:26px}.isMobile .article-detail-page .comment-model-popup .content>div>div>div>div p.chosen{color:#3099ea}.isMobile .article-detail-page .comment-model-popup .content>p{position:absolute;top:15px;right:15px;width:100px;height:32px;line-height:32px;font-size:16px}", ""]);
// Exports
module.exports = ___CSS_LOADER_EXPORT___;


/***/ }),

/***/ 223:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);

// CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@nuxt/components/dist/loader.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/pages/article/_id.vue?vue&type=template&id=4a21580c&
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"article-detail-page",staticStyle:{"padding":"30px 0"}},[_vm._ssrNode("<div class=\"left-content\">","</div>",[_vm._ssrNode("<div class=\"top\">"+((!_vm.articleData.thumb)?("<img"+(_vm._ssrAttr("src",__webpack_require__(63)))+" alt style=\"display: none\">"):("<img"+(_vm._ssrAttr("src",_vm.articleData.thumb))+(_vm._ssrAttr("alt",_vm.articleData.title))+" style=\"display: none\">"))+" <h4>"+_vm._ssrEscape(_vm._s(_vm.articleData.title))+"</h4></div> <p>"+_vm._ssrEscape("\n      "+_vm._s(_vm.articleData.hit)+" ")+"<i class=\"el-icon-view\"></i>"+_vm._ssrEscape("  "+_vm._s(_vm.articleData.published_at)+"\n    ")+"</p> "+((_vm.showNovoTeacher)?("<div class=\"chatbot-audio\"><img"+(_vm._ssrAttr("src",__webpack_require__(193)))+" alt> <div><h6>保护双眼，听小诺朗读</h6> <div><img"+(_vm._ssrAttr("src",__webpack_require__(194)))+" alt"+(_vm._ssrStyle(null,{ display: _vm.audioPause ? '' : 'none' }, null))+"> <img"+(_vm._ssrAttr("src",__webpack_require__(195)))+" alt"+(_vm._ssrStyle(null,{ display: !_vm.audioPause ? '' : 'none' }, null))+"> <div><span"+(_vm._ssrStyle(null,{ color: _vm.playTime != '00:00' ? '#3099EA' : '' }, null))+">"+_vm._ssrEscape(_vm._s(_vm.playTime))+"</span> <p><span"+(_vm._ssrStyle(null,{ width: _vm.playWidth + '%' }, null))+"></span></p> <span>"+_vm._ssrEscape(_vm._s(_vm.allTime))+"</span></div></div> <audio"+(_vm._ssrAttr("src",_vm.articleData.audio_url))+"></audio></div></div>"):"<!---->")+" "+((_vm.articleData.video_url)?("<div class=\"video-box\"><video x5-video-player-type=\"h5\" x5-video-player-fullscreen=\"true\" x-webkit-airplay=\"true\" x5-playsinline=\"true\" webkit-playsinline=\"true\" playsinline=\"true\" width=\"100%\" controls=\"controls\""+(_vm._ssrAttr("poster",_vm.articleData.thumb))+(_vm._ssrAttr("src",_vm.articleData.video_url))+" style=\"object-fit: fill\"></video></div>"):"<!---->")+" <div class=\"article-content\">"+(_vm._s(_vm.articleData.content))+"</div> "),_vm._ssrNode("<div class=\"bottom-box\">","</div>",[_vm._ssrNode(((!_vm.isLogin && _vm.deviceType === 'pc')?("<p class=\"go-follow\">\n        点击关注微信公众号，查看更多专业资讯\n      </p>"):"<!---->")+" "),_vm._ssrNode("<div class=\"comment-box\">","</div>",[_vm._ssrNode("<h6><span>最新看法</span> <span>发表你的看法</span></h6> "),_vm._ssrNode("<div class=\"comment-content\">","</div>",[_c('Barrage',{ref:"barrage",staticClass:"barrage",attrs:{"barrage-list":_vm.barrageList,"speed":_vm.deviceType === 'pc' ? 4 : 3,"loop":true,"channels":3,"border-color":'#ededed',"background":'#fff',"barrage-height":120,"device-type":_vm.deviceType}})],1),_vm._ssrNode(" "+((!_vm.barrageIsShow)?("<p>还没有人发表看法</p>"):"<!---->"))],2)],2)],2),_vm._ssrNode(" <div class=\"right-content\""+(_vm._ssrStyle(null,{ position: _vm.isFixed ? 'fixed' : 'static', right: _vm.right + 'px' }, null))+"><h6 class=\"common-title\">\n      猜你喜欢<img"+(_vm._ssrAttr("src",__webpack_require__(196)))+" alt></h6> <div class=\"list\" style=\"min-height: 100vh\">"+(_vm._ssrList((_vm.recommendArticles),function(item){return ("<div class=\"list-item\">"+((!item.thumb)?("<img"+(_vm._ssrAttr("src",__webpack_require__(63)))+" alt>"):("<img"+(_vm._ssrAttr("src",item.thumb))+(_vm._ssrAttr("alt",item.title))+">"))+" <p>"+_vm._ssrEscape(_vm._s(item.title))+"</p> <div class=\"bottom\"><span>"+_vm._ssrEscape(_vm._s(item.hit))+"<i class=\"el-icon-view\" style=\"margin-right: 8px\"></i>"+_vm._ssrEscape(_vm._s(item.collect))+"<i class=\"el-icon-star-on\"></i></span></div></div>")}))+"</div> <div class=\"stack-bottom\"><div class=\"s-container\"><img"+(_vm._ssrAttr("src",__webpack_require__(197)))+" alt class=\"s-left\"> <div class=\"s-right\"><img"+(_vm._ssrAttr("src",_vm.isPro ? _vm.qrcodeUrl : _vm.qrcodeUrlTest))+" alt class=\"code\"> <div class=\"name\">\n            微信扫一扫\n            <br>\n            获取最新糖尿病展示\n          </div></div></div></div></div> "+((_vm.commentModelPopupShow)?("<div class=\"comment-model-popup\"><div class=\"mask\"></div> <div class=\"content\"><div"+(_vm._ssrStyle(null,{ maxHeight: _vm.commentMaxHeight + 'px' }, null))+"><div><div>"+(_vm._ssrList((_vm.commentModelList),function(item,index){return ("<div><p"+(_vm._ssrClass(null,item.chosen ? 'chosen' : ''))+">"+_vm._ssrEscape("\n                  "+_vm._s(item.content)+"\n                ")+"</p></div>")}))+"</div> "+((_vm.commentLoading)?("<p class=\"load-more\">\n            加载更多<i class=\"el-icon-loading\"></i></p>"):"<!---->")+"</div></div> <p>立即发布</p></div></div>"):"<!---->")+" "),_c('BottomRightFixed',{attrs:{"show-share":true,"show-collect":true,"is-login":_vm.isLogin,"is-collect":_vm.articleData.is_collected,"show-comment":true},on:{"commentClick":function($event){return _vm.getCommentCorpus(1, 2)},"collectClick":_vm.collectArticle}})],2)}
var staticRenderFns = []


// CONCATENATED MODULE: ./src/pages/article/_id.vue?vue&type=template&id=4a21580c&

// EXTERNAL MODULE: external "vuex"
var external_vuex_ = __webpack_require__(3);

// CONCATENATED MODULE: ./node_modules/babel-loader/lib??ref--2-0!./node_modules/@nuxt/components/dist/loader.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/pages/article/_id.vue?vue&type=script&lang=js&
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//

const {
  mapActions,
  mapGetters
} = Object(external_vuex_["createNamespacedHelpers"])('user');
/* harmony default export */ var _idvue_type_script_lang_js_ = ({
  name: 'ArticleDetailPage',
  layout: 'detail',

  validate({
    params
  }) {
    return /^\d+$/.test(params.id);
  },

  async asyncData({
    $axios,
    params,
    req,
    redirect
  }) {
    // if (!process.server) return;
    const data = await $axios.$get('/article/detail/' + params.id, $axios.genSSROptions(req)); //            data.detail.articleData.audio_url = 'https://app.diabetes.com.cn/uploadfile/article/audio/8160-16395833618215.mp3';
    // console.log('dafa:', data);

    if (data.success === false) {
      redirect('/error?code=' + 404);
    }

    return { ...data.detail
    };
  },

  data() {
    return {
      audioPause: true,
      playTime: '00:00',
      allTime: '00:00',
      canPlayAudio: false,
      playWidth: 0,
      barrageIsShow: false,
      barrageList: [],
      commentModelPopupShow: false,
      commentModelList: [],
      inComment: false,
      commentPage: 1,
      commentLoading: false,
      commentHasMore: true,
      chosenCommentId: 0,
      inCollect: false,
      isFixed: false,
      right: 89,
      commentMaxHeight: 300,
      isPro: false,
      qrcodeUrl: __webpack_require__(64),
      qrcodeUrlTest: __webpack_require__(65)
    };
  },

  head() {
    return {
      title: this.articleData.title,
      meta: [{
        hid: 'description',
        name: 'description',
        content: 'Home page description'
      }]
    };
  },

  computed: { ...mapGetters({
      isLogin: 'isLogin'
    }),

    deviceType() {
      return this.$store.state.device.deviceType;
    },

    env() {
      return this.$store.state.device.env;
    }

  },

  mounted() {
    this.isPro = "production" === 'production';
    const that = this;
    this.getComment();
    this.$nextTick(() => {
      if (that.deviceType === 'pc') {
        window.addEventListener('scroll', function () {
          that.isFixed = true;
          const scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;

          if (document.documentElement.offsetWidth < 1258) {
            that.right = 89 - (1258 - document.documentElement.offsetWidth) + scrollLeft;
          } else {
            that.right = (document.documentElement.offsetWidth - 1080) / 2;
          }
        });
      } else {
        that.commentMaxHeight = (document.documentElement.clientHeight || document.body.clientHeight) * 0.6;

        if (this.deviceType === 'ios') {
          if (that.env === 'wechat') {
            document.addEventListener('WeixinJSBridgeReady', function () {
              that.$refs.chatbotAudio.play();
              that.$refs.chatbotAudio.pause();
              that.$refs.chatbotAudio.currentTime = 0;
            }, false);
          } else {
            window.onload = function () {
              that.$refs.chatbotAudio.play();
              that.$refs.chatbotAudio.pause();
              that.$refs.chatbotAudio.currentTime = 0;

              if (!isNaN(that.$refs.chatbotAudio.duration)) {
                const duration = that.$refs.chatbotAudio.duration;
                let minutes = parseInt(duration / 60, 10);
                let seconds = parseInt(duration % 60);
                minutes = minutes < 10 ? '0' + minutes : minutes;
                seconds = seconds < 10 ? '0' + seconds : seconds;
                that.allTime = minutes + ':' + seconds;
                that.canPlayAudio = true;
              } else {
                that.canPlayAudio = true;
              }
            };
          }
        }
      }
    });
  },

  methods: { ...mapActions({
      showLoginDialog: 'showLoginDialog'
    }),

    getDuration() {
      const duration = this.$refs.chatbotAudio.duration;
      let minutes = parseInt(duration / 60, 10);
      let seconds = parseInt(duration % 60);
      minutes = minutes < 10 ? '0' + minutes : minutes;
      seconds = seconds < 10 ? '0' + seconds : seconds;
      this.allTime = minutes + ':' + seconds;
      this.canPlayAudio = true;
    },

    playPauseAudio() {
      if (this.canPlayAudio) {
        if (this.audioPause) {
          this.baiduStat('文章详情页', 'click', '小诺老师语音控件');
          this.$refs.chatbotAudio.play();
        } else {
          this.$refs.chatbotAudio.pause();
        }

        this.audioPause = !this.audioPause;
      }
    },

    updateTime(e) {
      const currentTime = e.target.currentTime;
      const duration = e.target.duration;
      let minutes = parseInt(currentTime / 60, 10);
      let seconds = parseInt(currentTime % 60);
      minutes = minutes < 10 ? '0' + minutes : minutes;
      seconds = seconds < 10 ? '0' + seconds : seconds;
      this.playWidth = currentTime / duration * 100;
      this.playTime = minutes + ':' + seconds;
    },

    audioEnd() {
      this.audioPause = true;
      this.playTime = '00:00';
      this.playWidth = 0;
    },

    async getComment() {
      const data = await this.$axios.$get('/article/comment-list?aid=' + this.$route.params.id);

      for (const item of data.detail.commentList) {
        item.time = Math.random() * 15 + 9;
      }

      this.barrageIsShow = data.detail.commentList.length > 0;
      const _list = [];

      for (const comment of data.detail.commentList) {
        _list.push({
          content: comment.comment_content,
          color: '#939AA7',
          icon: comment.headimgurl
        });
      }

      this.barrageList = _list;
    },

    async getCommentCorpus(page, type) {
      if (!this.isLogin) {
        this.showLoginDialog(true);
      } else {
        const that = this;

        if (page === 1) {
          this.baiduStat('文章详情页', 'click', type === 1 ? '文章内发表你的想法-点击' : '文章内评论');
          this.chosenCommentId = 0;
          this.commentModelList = [];
          this.commentPage = 1;
          this.commentHasMore = true;
          this.commentModelPopupShow = true;
          setTimeout(function () {
            that.$refs.commentCorpus.addEventListener('scroll', function () {
              // 变量scrollTop是滚动条滚动时，距离顶部的距离
              const scrollTop = that.$refs.commentCorpus.scrollTop; // 变量windowHeight是可视区的高度

              const contentHeight = that.$refs.commentCorpus.clientHeight; // 变量scrollHeight是滚动条的总高度

              const allHeight = that.$refs.commentCorpusContent.clientHeight; // 滚动条到底部的条件

              if (scrollTop + contentHeight > allHeight - 20) {
                // 写后台加载数据的函数 一定要用that
                that.getCommentCorpus();
              }
            });
          });
        }

        if (this.commentHasMore && !this.commentLoading) {
          this.commentLoading = true;
          const data = await this.$axios.$get('/article/comment-corpus?page=' + this.commentPage);

          for (const item of data.detail.list) {
            item.chosen = false;
          }

          this.commentPage = this.commentPage + 1;
          this.commentModelList = this.commentModelList.concat(data.detail.list);
          this.commentHasMore = data.detail.hasMore;
          this.commentLoading = false;
        }
      }
    },

    chooseCorpus(id, index) {
      for (const item of this.commentModelList) {
        item.chosen = false;
      }

      this.chosenCommentId = id;
      this.commentModelList[index].chosen = true;
    },

    async commentArticle() {
      if (this.chosenCommentId === 0) {
        this.$message({
          message: '请选择看法模版',
          type: 'warning'
        });
      } else {
        const loading = this.$loading({
          lock: true,
          text: 'Loading',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
        const data = await this.$axios.$post('/article/user-comment', {
          aid: this.$route.params.id,
          comment_template_id: this.chosenCommentId
        });

        if (data && data.success) {
          this.baiduStat('文章详情页', 'click', '文章内发表你的想法-发表成功');
        }

        console.log(data);
        loading.close();
        this.commentModelPopupShow = false;
        this.getComment();
      }
    },

    async collectArticle() {
      if (!this.isLogin) {
        this.showLoginDialog(true);
      } else if (this.inCollect) {
        this.$message({
          message: '您的操作太快了',
          type: 'warning'
        });
      } else {
        this.baiduStat('文章详情页', 'click', '文章内收藏');
        this.inCollect = true;
        const data = await this.$axios.$post('/article/user-collect', {
          aid: this.$route.params.id
        });
        console.log(data);
        this.articleData.is_collected = data.detail.curState;
        this.inCollect = false;
      }
    },

    goHref(url) {
      let openNew = false;

      if (this.deviceType === 'pc') {
        openNew = true;
      }

      url = this.$router.resolve({
        path: url
      });

      if (openNew) {
        window.open(url.href, '_blank');
      } else {
        window.location.href = url.href;
      }
    }

  }
});
// CONCATENATED MODULE: ./src/pages/article/_id.vue?vue&type=script&lang=js&
 /* harmony default export */ var article_idvue_type_script_lang_js_ = (_idvue_type_script_lang_js_); 
// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
var componentNormalizer = __webpack_require__(1);

// CONCATENATED MODULE: ./src/pages/article/_id.vue



function injectStyles (context) {
  
  var style0 = __webpack_require__(198)
if (style0.__inject__) style0.__inject__(context)

}

/* normalize component */

var component = Object(componentNormalizer["a" /* default */])(
  article_idvue_type_script_lang_js_,
  render,
  staticRenderFns,
  false,
  injectStyles,
  null,
  "733e848e"
  
)

/* harmony default export */ var _id = __webpack_exports__["default"] = (component.exports);

/* nuxt-component-imports */
installComponents(component, {Barrage: __webpack_require__(174).default,BottomRightFixed: __webpack_require__(66).default})


/***/ })

};;
//# sourceMappingURL=_id.js.map