@web-utils/component 2.0.13 → 2.7.0

package/dist/components/column-menu/index.js

@@ -0,0 +1,286 @@
+import { c as u } from "../../chunks/config.46422d7f.js";
+import { p as d } from "../../chunks/permission.ce5d2121.js";
+import { o as a } from "../../chunks/util.5053d54e.js";
+import { n as l } from "../../chunks/vueComponentNormalizer.71e2aa87.js";
+var m = function() {
+  var e = this, o = e.$createElement, r = e._self._c || o;
+  return e.optVal(e.crud.tableOption.menu, e.config.menu) && e.crud.getPermission("menu") ? r("ElTableColumn", {
+    key: "menu",
+    staticClass: "avue-crud__btn",
+    attrs: {
+      prop: "menu",
+      fixed: e.optVal(e.crud.tableOption.menuFixed, e.config.menuFixed),
+      label: e.crud.tableOption.menuTitle || "操作",
+      align: e.crud.tableOption.menuAlign || e.config.menuAlign,
+      "header-align": e.crud.tableOption.menuHeaderAlign || e.config.menuHeaderAlign,
+      width: e.crud.isMobile ? e.crud.tableOption.menuXsWidth || e.config.menuXsWidth : e.crud.tableOption.menuWidth || e.config.menuWidth
+    },
+    scopedSlots: e._u([{
+      key: "default",
+      fn: function(s) {
+        var n = s.row, t = s.$index;
+        return [e.isMenu ? r("ElDropdown", {
+          attrs: {
+            size: e.crud.isMediumSize
+          }
+        }, [r("ElButton", {
+          attrs: {
+            type: "text",
+            size: e.crud.isMediumSize
+          }
+        }, [e._v(" " + e._s(e.crud.tableOption.menuBtnTitle || "按钮") + " "), r("i", {
+          staticClass: "el-icon-arrow-down el-icon--right"
+        })]), r("ElDropdownMenu", {
+          attrs: {
+            slot: "dropdown"
+          },
+          slot: "dropdown"
+        }, [e.optVal(e.crud.tableOption.viewBtn, e.config.viewBtn) ? r("ElDropdownItem", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("viewBtn", n, t),
+            expression: "crud.getPermission('viewBtn',row,$index)"
+          }],
+          attrs: {
+            icon: e.crud.getBtnIcon("viewBtn")
+          },
+          nativeOn: {
+            click: function(i) {
+              return e.crud.rowView(n, t);
+            }
+          }
+        }, [e._v(" " + e._s(e.crud.menuIcon("viewBtn")) + " ")]) : e._e(), e.optVal(e.crud.tableOption.editBtn, e.config.editBtn) ? r("ElDropdownItem", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("editBtn", n, t),
+            expression: "crud.getPermission('editBtn',row,$index)"
+          }],
+          attrs: {
+            icon: e.crud.getBtnIcon("editBtn")
+          },
+          nativeOn: {
+            click: function(i) {
+              return e.crud.rowEdit(n, t);
+            }
+          }
+        }, [e._v(" " + e._s(e.crud.menuIcon("editBtn")) + " ")]) : e._e(), e.optVal(e.crud.tableOption.copyBtn, e.config.copyBtn) ? r("ElDropdownItem", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("copyBtn", n, t),
+            expression: "crud.getPermission('copyBtn',row,$index)"
+          }],
+          attrs: {
+            icon: e.crud.getBtnIcon("copyBtn")
+          },
+          nativeOn: {
+            click: function(i) {
+              return e.crud.rowCopy(n);
+            }
+          }
+        }, [e._v(" " + e._s(e.crud.menuIcon("copyBtn")) + " ")]) : e._e(), e.optVal(e.crud.tableOption.delBtn, e.config.delBtn) ? r("ElDropdownItem", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("delBtn", n, t),
+            expression: "crud.getPermission('delBtn',row,$index)"
+          }],
+          attrs: {
+            icon: e.crud.getBtnIcon("delBtn")
+          },
+          nativeOn: {
+            click: function(i) {
+              return e.crud.rowDel(n, t);
+            }
+          }
+        }, [e._v(" " + e._s(e.crud.menuIcon("delBtn")) + " ")]) : e._e(), e._t("menuBtn", null, {
+          row: n,
+          type: e.menuText("primary"),
+          disabled: e.crud.btnDisabled,
+          size: e.crud.isMediumSize,
+          index: t
+        })], 2)], 1) : ["button", "text", "icon"].includes(e.menuType) ? [e.optVal(e.crud.tableOption.cellBtn, e.config.cellBtn) ? [e.optVal(e.crud.tableOption.editBtn, e.config.editBtn) && !n.$cellEdit ? r("ElButton", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("editBtn", n, t),
+            expression: "crud.getPermission('editBtn',row,$index)"
+          }],
+          attrs: {
+            type: e.menuText("primary"),
+            icon: e.crud.getBtnIcon("editBtn"),
+            size: e.crud.isMediumSize,
+            disabled: e.crud.btnDisabledList[t]
+          },
+          on: {
+            click: function(i) {
+              return i.stopPropagation(), e.crud.rowCell(n, t);
+            }
+          }
+        }, [e.isIconMenu ? e._e() : [e._v(" " + e._s(e.crud.menuIcon("editBtn")) + " ")]], 2) : e.optVal(e.crud.tableOption.saveBtn, e.config.saveBtn) && n.$cellEdit ? r("ElButton", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("saveBtn", n, t),
+            expression: "crud.getPermission('saveBtn',row,$index)"
+          }],
+          attrs: {
+            type: e.menuText("primary"),
+            icon: e.crud.getBtnIcon("saveBtn"),
+            size: e.crud.isMediumSize,
+            disabled: e.crud.btnDisabledList[t]
+          },
+          on: {
+            click: function(i) {
+              return i.stopPropagation(), e.crud.rowCell(n, t);
+            }
+          }
+        }, [e.isIconMenu ? e._e() : [e._v(" " + e._s(e.crud.menuIcon("saveBtn")) + " ")]], 2) : e._e(), n.$cellEdit ? r("ElButton", {
+          attrs: {
+            type: e.menuText("danger"),
+            icon: e.crud.getBtnIcon("cancelBtn"),
+            size: e.crud.isMediumSize,
+            disabled: e.crud.btnDisabledList[t]
+          },
+          on: {
+            click: function(i) {
+              return i.stopPropagation(), e.crud.rowCancel(n, t);
+            }
+          }
+        }, [e.isIconMenu ? e._e() : [e._v(" " + e._s(e.crud.menuIcon("cancelBtn")) + " ")]], 2) : e._e()] : e._e(), e.optVal(e.crud.tableOption.viewBtn, e.config.viewBtn) ? r("ElButton", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("viewBtn", n, t),
+            expression: "crud.getPermission('viewBtn',row,$index)"
+          }],
+          attrs: {
+            type: e.menuText("success"),
+            icon: e.crud.getBtnIcon("viewBtn"),
+            size: e.crud.isMediumSize,
+            disabled: e.btnDisabled
+          },
+          on: {
+            click: function(i) {
+              return i.stopPropagation(), e.crud.rowView(n, t);
+            }
+          }
+        }, [e.isIconMenu ? e._e() : [e._v(" " + e._s(e.crud.menuIcon("viewBtn")) + " ")]], 2) : e._e(), e.optVal(e.crud.tableOption.editBtn, e.config.editBtn) && !e.crud.tableOption.cellBtn ? r("ElButton", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("editBtn", n, t),
+            expression: "crud.getPermission('editBtn',row,$index)"
+          }],
+          attrs: {
+            type: e.menuText("primary"),
+            icon: e.crud.getBtnIcon("editBtn"),
+            size: e.crud.isMediumSize,
+            disabled: e.btnDisabled
+          },
+          on: {
+            click: function(i) {
+              return i.stopPropagation(), e.crud.rowEdit(n, t);
+            }
+          }
+        }, [e.isIconMenu ? e._e() : [e._v(" " + e._s(e.crud.menuIcon("editBtn")) + " ")]], 2) : e._e(), e.optVal(e.crud.tableOption.copyBtn, e.config.copyBtn) ? r("ElButton", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("copyBtn", n, t),
+            expression: "crud.getPermission('copyBtn',row,$index)"
+          }],
+          attrs: {
+            type: e.menuText("primary"),
+            icon: e.crud.getBtnIcon("copyBtn"),
+            size: e.crud.isMediumSize,
+            disabled: e.btnDisabled
+          },
+          on: {
+            click: function(i) {
+              return i.stopPropagation(), e.crud.rowCopy(n);
+            }
+          }
+        }, [e.isIconMenu ? e._e() : [e._v(" " + e._s(e.crud.menuIcon("copyBtn")) + " ")]], 2) : e._e(), e.optVal(e.crud.tableOption.delBtn, e.config.delBtn) && !n.$cellEdit ? r("ElButton", {
+          directives: [{
+            name: "permission",
+            rawName: "v-permission",
+            value: e.crud.getPermission("delBtn", n, t),
+            expression: "crud.getPermission('delBtn',row,$index)"
+          }],
+          attrs: {
+            type: e.menuText("danger"),
+            icon: e.crud.getBtnIcon("delBtn"),
+            size: e.crud.isMediumSize,
+            disabled: e.btnDisabled
+          },
+          on: {
+            click: function(i) {
+              return i.stopPropagation(), e.crud.rowDel(n, t);
+            }
+          }
+        }, [e.isIconMenu ? e._e() : [e._v(" " + e._s(e.crud.menuIcon("delBtn")) + " ")]], 2) : e._e()] : e._e(), e._t("menu", null, {
+          row: n,
+          type: e.menuText("primary"),
+          disabled: e.crud.btnDisabled,
+          size: e.crud.isMediumSize,
+          index: t
+        })];
+      }
+    }], null, !0)
+  }) : e._e();
+}, p = [];
+const B = {
+  name: "ColumnMenu",
+  directives: {
+    permission: d
+  },
+  inject: ["crud"],
+  data() {
+    return {
+      config: u
+    };
+  },
+  computed: {
+    menuType() {
+      return this.crud.tableOption.menuType || this.$AVUE.menuType || "button";
+    },
+    isIconMenu() {
+      return this.menuType === "icon";
+    },
+    isTextMenu() {
+      return this.menuType === "text";
+    },
+    isMenu() {
+      return this.menuType === "menu";
+    }
+  },
+  methods: {
+    optVal: a,
+    menuText(e) {
+      return ["text", "menu"].includes(this.menuType) ? "text" : e;
+    }
+  }
+}, c = {};
+var v = /* @__PURE__ */ l(
+  B,
+  m,
+  p,
+  !1,
+  g,
+  null,
+  null,
+  null
+);
+function g(e) {
+  for (let o in c)
+    this[o] = c[o];
+}
+const f = /* @__PURE__ */ function() {
+  return v.exports;
+}();
+export {
+  f as default
+};

package/dist/components/column-slot/index.js

@@ -0,0 +1,265 @@
+import { d as h } from "../../chunks/detail.a3249549.js";
+import { c as i, o as f, u as b, i as g, a as p, t as y, k as _ } from "../../chunks/util.5053d54e.js";
+import { s as C } from "../../chunks/dic.5f7e3523.js";
+import { n as $ } from "../../chunks/vueComponentNormalizer.71e2aa87.js";
+var v = function() {
+  var e = this, t = e.$createElement, l = e._self._c || t;
+  return e.getColumnProp(e.column, "hide") ? l("ElTableColumn", {
+    key: e.column.prop,
+    attrs: {
+      prop: e.column.prop,
+      label: e.column.label,
+      "column-key": e.column.prop,
+      "filter-placement": "bottom-end",
+      filters: e.getColumnProp(e.column, "filters"),
+      "filter-method": e.getColumnProp(e.column, "filterMethod") ? e.handleFilterMethod : void 0,
+      "filter-multiple": e.optVal(e.column.filterMultiple, !0),
+      "show-overflow-tooltip": e.column.overHidden,
+      "min-width": e.column.minWidth,
+      sortable: e.getColumnProp(e.column, "sortable"),
+      "sort-method": e.column.sortMethod,
+      "sort-orders": e.column.sortOrders,
+      "sort-by": e.column.sortBy,
+      resizable: e.column.resizable,
+      "render-header": e.column.renderHeader,
+      align: e.column.align || e.crud.tableOption.align,
+      "header-align": e.column.headerAlign || e.crud.tableOption.headerAlign,
+      width: e.getColumnProp(e.column, "width"),
+      fixed: e.getColumnProp(e.column, "fixed")
+    },
+    scopedSlots: e._u([{
+      key: "header",
+      fn: function(n) {
+        var r = n.$index;
+        return [e.crud.getSlotName(e.column, "H", e.crud.$scopedSlots) ? e._t(e.crud.getSlotName(e.column, "H"), null, null, {
+          column: e.column,
+          $index: r
+        }) : l("span", [e._v(e._s(e.column.label))])];
+      }
+    }, {
+      key: "default",
+      fn: function(n) {
+        var r = n.row, a = n.$index;
+        return [r.$cellEdit && e.column.cell ? l("ElFormItem", {
+          attrs: {
+            prop: e.crud.isTree ? "" : `list.${a}.${e.column.prop}`,
+            label: e.vaildLabel(e.column, r, " "),
+            "label-width": e.vaildLabel(e.column, r, "1px"),
+            rules: e.column.rules
+          }
+        }, [l("ElTooltip", {
+          attrs: {
+            content: (e.crud.listError[`list.${a}.${e.column.prop}`] || {}).msg,
+            disabled: !(e.crud.listError[`list.${a}.${e.column.prop}`] || {}).valid,
+            placement: "top"
+          }
+        }, [e.crud.getSlotName(e.column, "F", e.crud.$scopedSlots) ? e._t(e.crud.getSlotName(e.column, "F"), null, null, {
+          row: r,
+          dic: e.crud.DIC[e.column.prop],
+          size: e.crud.isMediumSize,
+          index: a,
+          disabled: e.crud.btnDisabledList[a],
+          label: e.handleDetail(r, e.column),
+          $cell: r.$cellEdit
+        }) : l("FormTemp", e._b({
+          attrs: {
+            column: e.column,
+            size: e.crud.isMediumSize,
+            "table-data": {
+              index: a,
+              row: r,
+              label: e.handleDetail(r, e.column)
+            },
+            dic: (e.crud.cascaderDIC[a] || {})[e.column.prop] || e.crud.DIC[e.column.prop],
+            props: e.column.props || e.crud.tableOption.props,
+            readonly: e.column.readonly,
+            disabled: e.crud.disabled || e.crud.tableOption.disabled || e.column.disabled || e.crud.btnDisabledList[a],
+            clearable: e.optVal(e.column.clearable, !1),
+            "column-slot": e.crud.mainSlot
+          },
+          on: {
+            change: function(o) {
+              return e.columnChange(r, e.column, a);
+            }
+          },
+          scopedSlots: e._u([e._l(e.crud.mainSlot, function(o) {
+            return {
+              key: o,
+              fn: function(c) {
+                return [e._t(o, null, null, c)];
+              }
+            };
+          })], null, !0),
+          model: {
+            value: r[e.column.prop],
+            callback: function(o) {
+              e.$set(r, e.column.prop, o);
+            },
+            expression: "row[column.prop]"
+          }
+        }, "FormTemp", e.uploadFun(e.column, e.crud), !1))], 2)], 1) : e.crud.$scopedSlots[e.column.prop] ? e._t(e.column.prop, null, {
+          row: r,
+          index: a,
+          dic: e.crud.DIC[e.column.prop],
+          size: e.crud.isMediumSize,
+          label: e.handleDetail(r, e.column)
+        }) : [["img", "upload"].includes(e.column.type) ? l("span", {
+          staticClass: "avue-crud__img "
+        }, [e._l(e.getImgList(r, e.column), function(o, c) {
+          return [e.isMediaType(o, e.column.fileType) ? l(e.isMediaType(o, e.column.fileType), {
+            key: c,
+            tag: "Component",
+            attrs: {
+              src: o
+            },
+            on: {
+              click: function(s) {
+                return s.stopPropagation(), e.openImg(r, e.column, c);
+              }
+            }
+          }) : l("i", {
+            key: c,
+            staticClass: "el-icon-document",
+            attrs: {
+              src: o
+            },
+            on: {
+              click: function(s) {
+                return s.stopPropagation(), e.openImg(r, e.column, c);
+              }
+            }
+          })];
+        })], 2) : e.column.type === "url" ? l("span", e._l(e.corArray(r, e.column), function(o, c) {
+          return l("ElLink", {
+            key: c,
+            attrs: {
+              type: "primary",
+              href: o,
+              target: e.column.target || "_blank"
+            }
+          }, [e._v(e._s(o))]);
+        }), 1) : e.column.type === "rate" ? l("span", [l("FyRate", {
+          attrs: {
+            disabled: ""
+          },
+          model: {
+            value: r[e.column.prop],
+            callback: function(o) {
+              e.$set(r, e.column.prop, o);
+            },
+            expression: "row[column.prop]"
+          }
+        })], 1) : e.column.type === "color" ? l("i", {
+          staticClass: "avue-crud__color",
+          style: {
+            backgroundColor: r[e.column.prop]
+          }
+        }) : e.column.type === "icon" ? l("IconTemp", {
+          attrs: {
+            text: r[e.column.prop]
+          }
+        }) : e.column.html ? l("span", {
+          domProps: {
+            innerHTML: e._s(e.handleDetail(r, e.column))
+          }
+        }) : l("span", {
+          domProps: {
+            textContent: e._s(e.handleDetail(r, e.column))
+          }
+        })]];
+      }
+    }], null, !0)
+  }) : e._e();
+}, I = [];
+const d = {}, D = {
+  name: "ColumnSlot",
+  inject: ["dynamic", "crud"],
+  props: {
+    column: Object,
+    columnOption: Array
+  },
+  created() {
+    const e = [
+      "getColumnProp",
+      "handleFilterMethod",
+      "handleFilters"
+    ];
+    Object.keys(this.dynamic).forEach((t) => {
+      e.includes(t) && (this[t] = this.dynamic[t]);
+    });
+  },
+  methods: {
+    isBlank: i,
+    optVal: f,
+    uploadFun: b,
+    isMediaType(e, t) {
+      return g(e, t);
+    },
+    vaildLabel(e, t, l) {
+      if (e.rules && t.$cellEdit)
+        return l;
+    },
+    columnChange(e, t, l) {
+      let n = `${l}-${t.prop}`;
+      d[n] || (this.handleChange(t, e), typeof t.change == "function" && t.cell == !0 && t.change({ row: e, column: t, index: l, value: e[t.prop] })), d[n] = !0, this.$nextTick(() => d[n] = !1);
+    },
+    handleChange(e, t) {
+      e.cascader && this.$nextTick(() => {
+        [...this.crud.propOption];
+        const l = e.cascader;
+        l.join(","), l.forEach((n) => {
+          const r = n, a = t[e.prop], o = t.$index, c = this.findObject(this.columnOption, r);
+          i(c) || (i(this.crud.cascaderDIC[o]) && this.$set(this.crud.cascaderDIC, o, {}), this.crud.cascaderIndexList.includes(o) && l.forEach((s) => {
+            this.$set(this.crud.cascaderDIC[o], s.prop, []), l.forEach((u) => t[u] = "");
+          }), !(i(l) || i(a) || i(c)) && C({
+            column: c,
+            value: a,
+            form: t
+          }).then((s) => {
+            const u = s || [];
+            this.crud.cascaderIndexList.includes(o) || this.crud.cascaderIndexList.push(o), this.crud.cascaderDicList[o] || this.$set(this.crud.cascaderDicList, o, {}), this.crud.cascaderDicList[o][r] || this.$set(this.crud.cascaderDicList[o], r, u), this.$set(this.crud.cascaderDIC[o], r, u), !i(u[c.cascaderIndex]) && !i(u) && !i(c.cascaderIndex) && (t[r] = u[c.cascaderIndex][(c.props || {}).value || p.value]);
+          }));
+        });
+      });
+    },
+    handleDetail(e, t) {
+      let l, n = t.parentProp ? (this.crud.cascaderDIC[e.$index] || {})[t.prop] : this.crud.DIC[t.prop];
+      return l = h(e, t, this.crud.tableOption, n), !i(n) && this.crud.tableOption.filterDic !== !0 && (e["$" + t.prop] = l), l;
+    },
+    corArray(e, t) {
+      let l = this.handleDetail(e, t);
+      return Array.isArray(l) || (l = i(l) ? [] : l.split(y)), _(l);
+    },
+    openImg(e, t, l) {
+      let n = this.getImgList(e, t);
+      n = n.map((r) => ({ thumbUrl: r, url: r, type: t.fileType })), this.$ImagePreview(n, l);
+    },
+    getImgList(e, t) {
+      var a, o;
+      let l = ((a = t.propsHttp) == null ? void 0 : a.home) || "", n = ((o = t.props) == null ? void 0 : o.value) || p.value, r = this.corArray(e, t);
+      return r.forEach((c, s) => {
+        r[s] = l + (c[n] ? c[n] : c);
+      }), r;
+    }
+  }
+}, m = {};
+var x = /* @__PURE__ */ $(
+  D,
+  v,
+  I,
+  !1,
+  k,
+  null,
+  null,
+  null
+);
+function k(e) {
+  for (let t in m)
+    this[t] = m[t];
+}
+const E = /* @__PURE__ */ function() {
+  return x.exports;
+}();
+export {
+  E as default
+};

package/dist/components/comment/index.js

@@ -0,0 +1,94 @@
+import { n as s } from "../../chunks/vueComponentNormalizer.71e2aa87.js";
+var n = function() {
+  var t = this, a = t.$createElement, e = t._self._c || a;
+  return e("div", {
+    class: ["avue-comment", {
+      "avue-comment--reverse": t.reverse
+    }]
+  }, [e("img", {
+    staticClass: "avue-comment__avatar",
+    attrs: {
+      src: t.avatar,
+      alt: ""
+    }
+  }), e("div", {
+    staticClass: "avue-comment__main"
+  }, [e("div", {
+    staticClass: "avue-comment__header"
+  }, [t.author ? e("div", {
+    staticClass: "avue-comment__author",
+    domProps: {
+      textContent: t._s(t.author)
+    }
+  }) : t._e(), t._t("default")], 2), t.body ? e("div", {
+    staticClass: "avue-comment__body",
+    domProps: {
+      innerHTML: t._s(t.body)
+    }
+  }) : t._e()])]);
+}, u = [];
+const r = {
+  avatar: "avatar",
+  author: "author",
+  body: "body"
+}, _ = {
+  name: "Comment",
+  props: {
+    reverse: {
+      type: Boolean,
+      default: !1
+    },
+    data: {
+      type: Object,
+      default: () => ({})
+    },
+    props: {
+      type: Object,
+      default: () => r
+    },
+    option: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  computed: {
+    avatarKey() {
+      return this.props.avatar || r.avatar;
+    },
+    authorKey() {
+      return this.props.author || r.author;
+    },
+    bodyKey() {
+      return this.props.body || r.body;
+    },
+    avatar() {
+      return this.data[this.avatarKey];
+    },
+    author() {
+      return this.data[this.authorKey];
+    },
+    body() {
+      return this.data[this.bodyKey];
+    }
+  }
+}, o = {};
+var c = /* @__PURE__ */ s(
+  _,
+  n,
+  u,
+  !1,
+  i,
+  null,
+  null,
+  null
+);
+function i(t) {
+  for (let a in o)
+    this[a] = o[a];
+}
+const d = /* @__PURE__ */ function() {
+  return c.exports;
+}();
+export {
+  d as default
+};

package/dist/components/comment/style.css

@@ -0,0 +1 @@
+.avue-comment{margin-bottom:30px;display:flex;align-items:flex-start}.avue-comment--reverse{flex-direction:row-reverse}.avue-comment--reverse .avue-comment__main:before,.avue-comment--reverse .avue-comment__main:after{left:auto;right:-8px;border-width:8px 0 8px 8px}.avue-comment--reverse .avue-comment__main:before{border-left-color:#dedede}.avue-comment--reverse .avue-comment__main:after{border-left-color:#f8f8f8;margin-right:1px;margin-left:auto}.avue-comment__avatar{width:48px;height:48px;border-radius:50%;border:1px solid transparent;box-sizing:border-box;vertical-align:middle}.avue-comment__header{padding:5px 15px;background:#f8f8f8;border-bottom:1px solid #eee;display:flex;align-items:center;justify-content:space-between}.avue-comment__author{font-weight:700;font-size:14px;color:#999}.avue-comment__main{flex:1;margin:0 20px;position:relative;border:1px solid #dedede;border-radius:2px}.avue-comment__main:before,.avue-comment__main:after{position:absolute;top:10px;left:-8px;right:100%;width:0;height:0;display:block;content:" ";border-color:transparent;border-style:solid solid outset;border-width:8px 8px 8px 0;pointer-events:none}.avue-comment__main:before{border-right-color:#dedede;z-index:1}.avue-comment__main:after{border-right-color:#f8f8f8;margin-left:1px;z-index:2}.avue-comment__body{padding:15px;overflow:hidden;background:#fff;font-family:Segoe UI,Lucida Grande,Helvetica,Arial,Microsoft YaHei,FreeSans,Arimo,Droid Sans,wenquanyi micro hei,Hiragino Sans GB,Hiragino Sans GB W3,FontAwesome,sans-serif;color:#333;font-size:14px}.avue-comment blockquote{margin:0;font-family:Georgia,Times New Roman,Times,Kai,Kaiti SC,KaiTi,BiauKai,FontAwesome,serif;padding:1px 0 1px 15px;border-left:4px solid #ddd}