@xysfe/actui2 0.0.1

package/lib/RecordRuleLayer/index.mjs

@@ -0,0 +1,541 @@
+import _typeof from "@babel/runtime-corejs3/helpers/typeof";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js/instance/for-each";
+import _Object$defineProperty from "@babel/runtime-corejs3/core-js/object/define-property";
+import _Array$from from "@babel/runtime-corejs3/core-js/array/from";
+import { c as create } from "../utils/create/index.mjs";
+import { A as ActGoldLayer } from "../common/goldlayer/index.mjs";
+import { s as svgIcon } from "../common/svgicon/index.mjs";
+import BScroll from "better-scroll";
+import { t as throttle } from "../utils/helpers/index.mjs";
+import __$_require_4441fdae__ from "../assets/icon-close2.9490.png";
+import { n as normalizeComponent } from "../common/index.mjs";
+import './style.css';var _sfc_main = {
+  name: "ActRecordRuleLayer",
+  props: {
+    ruleData: {
+      type: Object,
+      default: function _default() {
+        return [];
+      }
+    },
+    brandColor: {
+      type: String,
+      default: "#A69DFF"
+    },
+    btnColor: {
+      type: String,
+      default: "#ff5a6e"
+    },
+    title: {
+      type: String,
+      default: "双录规则"
+    }
+  },
+  components: {
+    ActGoldLayer,
+    svgIcon
+  },
+  data: function data() {
+    return {
+      isVisible: false,
+      scroller: null,
+      isFulleScreen: false,
+      content: "",
+      isShowMoreDialog: false,
+      isShowRecordTipDialog: false,
+      recordTips: [],
+      rightTitleScroller: null,
+      tableScroller: null,
+      rightTableScroller: null,
+      isShowRecordCitysDialog: false,
+      recordCitys: []
+    };
+  },
+  computed: {
+    ruleList: function ruleList() {
+      if (Array.isArray(this.ruleData)) {
+        return this.ruleData;
+      }
+      if (_typeof(this.ruleData) === "object") {
+        var list = [];
+        for (var key in this.ruleData) {
+          list.push({
+            areaName: key,
+            doubleRecordDetailArea: this.ruleData[key].doubleRecordDetailArea
+          });
+        }
+        return list;
+      }
+      return [];
+    }
+  },
+  methods: {
+    show: function show() {
+      this.isVisible = true;
+      this.refreshScroll();
+    },
+    hide: function hide() {
+      this.isVisible = false;
+    },
+    hideFullLayer: function hideFullLayer() {
+      this.isFulleScreen = false;
+    },
+    close: function close() {
+      this.isVisible = false;
+    },
+    refreshScroll: function refreshScroll() {
+      var _this = this;
+      if (this.scroller) {
+        this.$nextTick(function() {
+          _this.scroller.refresh();
+        });
+      }
+    },
+    scrollSuc: function scrollSuc(scroll) {
+      this.scroller = scroll;
+      this.refreshScroll();
+    },
+    showFullScreen: function showFullScreen() {
+      this.isFulleScreen = true;
+    },
+    getRuleRows: function getRuleRows(rowData) {
+      var _context;
+      var ruleObj = {};
+      _forEachInstanceProperty(_context = rowData.doubleRecordDetailArea || []).call(_context, function(item) {
+        if (ruleObj[item.dr_detail_id]) {
+          ruleObj[item.dr_detail_id].citys.push(item.city_name);
+        } else {
+          ruleObj[item.dr_detail_id] = {
+            dr_detail_id: item.dr_detail_id,
+            citys: [item.city_name],
+            range: item.range,
+            age_limit: item.age_limit,
+            dr_sigle: item.dr_sigle,
+            dr_mix: item.dr_mix,
+            dr_way: item.dr_way,
+            dr_role: item.dr_role,
+            remark: item.remark
+          };
+        }
+      });
+      _Object$defineProperty(ruleObj, "areaName", {
+        value: rowData.areaName,
+        enumerable: false
+      });
+      return ruleObj;
+    },
+    handleRemark: function handleRemark(remark) {
+      if (remark.length > 30) {
+        return remark.substring(0, 30);
+      }
+      return remark;
+    },
+    showMoreDialog: function showMoreDialog(content) {
+      this.content = content;
+      this.isShowMoreDialog = true;
+    },
+    getRecordTips: function getRecordTips(item) {
+      var recordTips = [];
+      if (~~item.age_limit === 1) {
+        recordTips.push("投保人年龄大于等于60周岁");
+      }
+      if (~~item.dr_sigle === 1) {
+        recordTips.push("自保件全面双录");
+      }
+      if (~~item.dr_mix === 1) {
+        recordTips.push("互保件全面双录");
+      }
+      return recordTips;
+    },
+    showRecordTipDialog: function showRecordTipDialog(item) {
+      this.recordTips = this.getRecordTips(item);
+      this.isShowRecordTipDialog = true;
+    },
+    showRecordCitysDialog: function showRecordCitysDialog(item) {
+      this.recordCitys = item.citys;
+      this.isShowRecordCitysDialog = true;
+    },
+    getRightTableContent: function getRightTableContent() {
+      var _context2, _this2 = this;
+      var arr = [];
+      _forEachInstanceProperty(_context2 = this.ruleList).call(_context2, function(rule) {
+        var ruleObj = _this2.getRuleRows(rule);
+        arr.push(ruleObj);
+      });
+      return arr;
+    },
+    calcHeight: function calcHeight() {
+      var bodyItemDom = document.querySelector(".act-gold-record-table").querySelectorAll(".body-item-right");
+      var rightTableDom = document.querySelector(".act-gold-record-table").querySelectorAll(".right-table-body-item");
+      var leftArr = _Array$from(bodyItemDom);
+      var rightArr = _Array$from(rightTableDom);
+      for (var i = 0; i < leftArr.length; i++) {
+        var cityDom = leftArr[i].querySelectorAll(".right-row-city");
+        var itemDom = rightArr[i].querySelectorAll(".right-row-item");
+        var cityArr = _Array$from(cityDom);
+        var itemArr = _Array$from(itemDom);
+        for (var j = 0; j < cityArr.length; j++) {
+          var height = Math.max(cityArr[j].clientHeight, itemArr[j].clientHeight);
+          cityArr[j].style.height = height + "px";
+          itemArr[j].style.height = height + "px";
+        }
+      }
+    },
+    initScroll: function initScroll() {
+      var _this3 = this;
+      var rightTitle = this.$refs.rightTitle;
+      var tableWrapper = this.$refs.tableWrapper;
+      var rightTable = this.$refs.rightTable;
+      if (rightTitle) {
+        this.$nextTick(function() {
+          if (!_this3.rightTitleScroller) {
+            _this3.rightTitleScroller = new BScroll(rightTitle, {
+              scrollX: true,
+              scrolly: false,
+              bounce: false,
+              probeType: 3,
+              momentum: false
+            });
+            _this3.rightTitleScroller.on("scroll", function(_ref) {
+              var x = _ref.x, y = _ref.y;
+              throttle(_this3.rightTableScroller.scrollTo(x, y, 0));
+            });
+          } else {
+            _this3.rightTitleScroller.refresh();
+          }
+        });
+      }
+      if (tableWrapper) {
+        this.$nextTick(function() {
+          if (!_this3.tableScroller) {
+            _this3.tableScroller = new BScroll(tableWrapper, {
+              scrollY: true,
+              scrollX: false,
+              bounce: false,
+              click: true
+            });
+          } else {
+            _this3.tableScroller.refresh();
+          }
+        });
+      }
+      if (rightTable) {
+        this.$nextTick(function() {
+          if (!_this3.rightTableScroller) {
+            _this3.rightTableScroller = new BScroll(rightTable, {
+              // scrollY: true,
+              scrollX: true,
+              bounce: false,
+              probeType: 2,
+              momentum: false,
+              click: true
+            });
+            _this3.rightTableScroller.on("scroll", function(_ref2) {
+              var x = _ref2.x, y = _ref2.y;
+              _this3.rightTitleScroller.scrollTo(x, y, 0);
+            });
+          } else {
+            _this3.rightTableScroller.refresh();
+          }
+        });
+      }
+    }
+  },
+  watch: {
+    isFulleScreen: function isFulleScreen(newVal) {
+      if (newVal) {
+        this.preOverflowValue = document && document.body && document.body.style && document.body.style.overflow;
+        document.documentElement.style.overflow = "hidden";
+      } else {
+        document.documentElement.style.overflow = this.preOverflowValue || "visible";
+      }
+    },
+    isVisible: function isVisible(val) {
+      var _this4 = this;
+      if (val) {
+        this.$nextTick(function() {
+          _this4.calcHeight();
+          _this4.initScroll();
+        });
+      }
+    }
+  }
+};
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", [_c("act-gold-layer", {
+    ref: "recordRuleLayer",
+    attrs: {
+      "title": _vm.title,
+      "center": false,
+      "visible": _vm.isVisible,
+      "zIndex": 100
+    },
+    on: {
+      "close": _vm.close
+    }
+  }, [_c("div", {
+    staticClass: "gradual-color"
+  }), _c("div", {
+    staticClass: "record-rule-wrapper"
+  }, [_c("div", {
+    staticClass: "content"
+  }, [_c("p", {
+    staticClass: "description"
+  }, [_vm._v(" *实际以双录页面展示的规则为准 ")]), _c("div", {
+    staticClass: "record-rule-content"
+  }, [_c("div", {
+    staticClass: "table-title"
+  }, [_c("div", {
+    ref: "rightTitle",
+    staticClass: "right-title"
+  }, [_c("div", {
+    staticClass: "right-title-wrapper"
+  }, [_c("div", {
+    staticClass: "header-item"
+  }, [_vm._v(" 双录地区 ")]), _c("div", {
+    staticClass: "header-item"
+  }, [_vm._v(" 双录范围 ")]), _c("div", {
+    staticClass: "header-item"
+  }, [_vm._v(" 方式 ")]), _c("div", {
+    staticClass: "header-item"
+  }, [_vm._v(" 双录角色 ")])])])]), _c("div", {
+    ref: "tableWrapper",
+    staticClass: "table-wrapper"
+  }, [_c("div", {
+    staticClass: "record-table act-gold-record-table"
+  }, [_c("div", {
+    ref: "rightTable",
+    staticClass: "right-table"
+  }, [_c("div", {
+    staticClass: "right-table-wrapper"
+  }, _vm._l(_vm.getRightTableContent(), function(r) {
+    return _c("div", {
+      key: r.areaName,
+      staticClass: "right-table-body-item"
+    }, _vm._l(r, function(item, index) {
+      return _c("div", {
+        key: index,
+        ref: "rowitem" + index,
+        refInFor: true,
+        staticClass: "right-row-item"
+      }, [_c("div", {
+        staticClass: "right-row-range row-citem"
+      }, [_vm._v(" " + _vm._s(r.areaName) + " "), _c("p", [_c("span", [_vm._v(_vm._s(item.citys[0]))]), item.citys.length > 1 ? [_vm._v(" 等地区 "), _c("i", {
+        staticClass: "icon",
+        on: {
+          "click": function click($event) {
+            $event.stopPropagation();
+            return _vm.showRecordCitysDialog(item);
+          }
+        }
+      }, [_c("svg-icon", {
+        staticClass: "icon-question",
+        style: {
+          color: _vm.btnColor
+        },
+        attrs: {
+          "iconClass": "icon-question"
+        }
+      })], 1)] : _vm._e()], 2)]), _c("div", {
+        staticClass: "right-row-range row-citem"
+      }, [_c("p", {
+        staticClass: "row-citem-content"
+      }, [_c("span", [_vm._v(_vm._s(~~item.range === 1 ? "部分双录" : "全面双录"))]), ~~item.range === 1 ? _c("i", {
+        staticClass: "icon",
+        on: {
+          "click": function click($event) {
+            $event.stopPropagation();
+            return _vm.showRecordTipDialog(item);
+          }
+        }
+      }, [_c("svg-icon", {
+        staticClass: "icon-question",
+        style: {
+          color: _vm.btnColor
+        },
+        attrs: {
+          "iconClass": "icon-question"
+        }
+      })], 1) : _vm._e()])]), _c("div", {
+        staticClass: "right-row-way row-citem"
+      }, _vm._l(item.dr_way, function(way) {
+        return _c("p", {
+          key: way
+        }, [_vm._v(" " + _vm._s(way) + " ")]);
+      }), 0), _c("div", {
+        staticClass: "right-row-role row-citem"
+      }, _vm._l(item.dr_role, function(roleItem, cindex) {
+        return _c("p", {
+          key: "role_".concat(cindex)
+        }, [_vm._v(" " + _vm._s(roleItem.role) + "(" + _vm._s(roleItem.limit) + ") ")]);
+      }), 0)]);
+    }), 0);
+  }), 0)])])])])]), _c("div", {
+    staticClass: "iphonex_margin submit-btn"
+  }, [_c("div", {
+    staticClass: "full-screen-btn",
+    style: {
+      "background": _vm.btnColor
+    },
+    on: {
+      "click": _vm.showFullScreen
+    }
+  }, [_vm._v(" 全屏展示 ")])])])]), _c("div", {
+    directives: [{
+      name: "show",
+      rawName: "v-show",
+      value: _vm.isFulleScreen,
+      expression: "isFulleScreen"
+    }],
+    staticClass: "bg-wrap fullScreen",
+    on: {
+      "touchmove": function touchmove($event) {
+        $event.stopPropagation();
+        return (function() {
+        }).apply(null, arguments);
+      }
+    }
+  }, [_c("div", {
+    staticClass: "full-record-rule-wrapper"
+  }, [_c("div", {
+    staticClass: "title"
+  }, [_c("span", [_vm._v(_vm._s(_vm.title))]), _c("p", {
+    staticClass: "close"
+  }, [_c("img", {
+    attrs: {
+      "src": __$_require_4441fdae__
+    },
+    on: {
+      "click": _vm.hideFullLayer
+    }
+  })])]), _vm._m(0), _c("div", {
+    staticClass: "record-rule-content"
+  }, [_vm._m(1), _c("div", {
+    staticClass: "table-body"
+  }, _vm._l(_vm.ruleList, function(rowData) {
+    return _c("div", {
+      key: rowData.areaName,
+      staticClass: "table-body-item"
+    }, [_c("div", {
+      staticClass: "body-item-left"
+    }, [_vm._v(" " + _vm._s(rowData.areaName) + " ")]), _c("div", {
+      staticClass: "body-item-right"
+    }, _vm._l(_vm.getRuleRows(rowData), function(item, index) {
+      return _c("div", {
+        key: index,
+        staticClass: "right-row-item"
+      }, [_c("div", {
+        staticClass: "right-row-city row-citem"
+      }, _vm._l(item.citys, function(city) {
+        return _c("p", {
+          key: city
+        }, [_vm._v(" " + _vm._s(city) + " ")]);
+      }), 0), _c("div", {
+        staticClass: "right-row-range row-citem"
+      }, [_c("p", {
+        staticClass: "row-citem-content"
+      }, [_c("span", [_vm._v(_vm._s(~~item.range === 1 ? "部分双录" : "全面双录"))])]), ~~item.range === 1 ? [_c("p", {
+        staticStyle: {
+          "color": "#FF5A6E"
+        }
+      }, [_vm._v(" 满足以下任一条件会触发双录 ")]), _vm._l(_vm.getRecordTips(item), function(citem) {
+        return _c("p", {
+          key: citem,
+          staticClass: "range-tip"
+        }, [_vm._v(" " + _vm._s(citem) + " ")]);
+      })] : _vm._e()], 2), _c("div", {
+        staticClass: "right-row-way row-citem"
+      }, _vm._l(item.dr_way, function(way) {
+        return _c("p", {
+          key: way
+        }, [_vm._v(" " + _vm._s(way) + " ")]);
+      }), 0), _c("div", {
+        staticClass: "right-row-role row-citem"
+      }, _vm._l(item.dr_role, function(roleItem, cindex) {
+        return _c("p", {
+          key: "role_".concat(cindex)
+        }, [_vm._v(" " + _vm._s(roleItem.role) + "(" + _vm._s(roleItem.limit) + ") ")]);
+      }), 0)]);
+    }), 0)]);
+  }), 0)])])]), _vm.isShowMoreDialog ? _c("div", {
+    staticClass: "dialog-mask",
+    on: {
+      "click": function click($event) {
+        _vm.isShowMoreDialog = false;
+      }
+    }
+  }, [_c("div", {
+    staticClass: "content"
+  }, [_vm._v(" " + _vm._s(_vm.content) + " ")])]) : _vm._e(), _vm.isShowRecordTipDialog ? _c("div", {
+    staticClass: "dialog-mask",
+    on: {
+      "click": function click($event) {
+        _vm.isShowRecordTipDialog = false;
+      },
+      "touchmove": function touchmove($event) {
+        $event.stopPropagation();
+      }
+    }
+  }, [_c("div", {
+    staticClass: "content"
+  }, [_c("div", {
+    staticClass: "record-content"
+  }, [_c("span", [_vm._v("需双录的情况：")]), _c("div", _vm._l(_vm.recordTips, function(item) {
+    return _c("p", {
+      key: item,
+      staticClass: "content-item"
+    }, [_vm._v(" " + _vm._s(item) + " ")]);
+  }), 0)])])]) : _vm._e(), _vm.isShowRecordCitysDialog ? _c("div", {
+    staticClass: "dialog-mask",
+    on: {
+      "click": function click($event) {
+        _vm.isShowRecordCitysDialog = false;
+      },
+      "touchmove": function touchmove($event) {
+        $event.stopPropagation();
+      }
+    }
+  }, [_c("div", {
+    staticClass: "content"
+  }, [_c("div", {
+    staticClass: "record-content"
+  }, [_c("div", {
+    staticClass: "record-citys"
+  }, _vm._l(_vm.recordCitys, function(item) {
+    return _c("p", {
+      key: item,
+      staticClass: "content-item"
+    }, [_vm._v(" " + _vm._s(item) + " ")]);
+  }), 0)])])]) : _vm._e()], 1);
+};
+var _sfc_staticRenderFns = [function() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("p", {
+    staticClass: "description"
+  }, [_c("span", {
+    staticClass: "special-desc"
+  }, [_vm._v(" 特别说明： ")]), _vm._v(" *实际以双录页面展示的规则为准，未展示的投保地区无需双录 ")]);
+}, function() {
+  var _vm = this, _c = _vm._self._c;
+  return _c("div", {
+    staticClass: "table-header"
+  }, [_c("div", {
+    staticClass: "header-item"
+  }, [_vm._v(" 双录地区 ")]), _c("div", {
+    staticClass: "header-item"
+  }, [_vm._v(" 双录范围 ")]), _c("div", {
+    staticClass: "header-item"
+  }, [_vm._v(" 方式 ")]), _c("div", {
+    staticClass: "header-item"
+  }, [_vm._v(" 双录角色 ")])]);
+}];
+var __component__ = /* @__PURE__ */ normalizeComponent(_sfc_main, _sfc_render, _sfc_staticRenderFns, false, null, "1a83cd36");
+var RecordRuleLayer = __component__.exports;
+RecordRuleLayer.install = function(Vue) {
+  Vue.component(RecordRuleLayer.name, RecordRuleLayer);
+  Vue.prototype["$createRecordRuleLayer"] = create(RecordRuleLayer, Vue);
+};
+export {
+  RecordRuleLayer as R
+};

package/lib/RecordRuleLayer/style.css

@@ -0,0 +1 @@
+.gradual-color[data-v-1a83cd36]{height:2.2rem;background:-webkit-linear-gradient(bottom,#F7F8FC 0%,#FFFFFF 100%);background:linear-gradient(0deg,#F7F8FC 0%,#FFFFFF 100%)}.record-rule-wrapper[data-v-1a83cd36]{position:relative;line-height:22px;font-size:13px;height:61vh;background:#F7F8FC}.record-rule-wrapper .content[data-v-1a83cd36]{border-radius:1.2rem;position:absolute;top:-0.8rem;right:0;width:100%;max-height:50rem;background:#F7F8FC}.record-rule-wrapper .special-description[data-v-1a83cd36]{margin:0 30px 0 14px;color:#333;font-size:14px}.record-rule-wrapper .description[data-v-1a83cd36]{margin:0 30px 0 14px;color:#666}.record-rule-wrapper .record-rule-content[data-v-1a83cd36]{margin-top:4px;padding:0 14px;padding-bottom:15px;position:relative;width:100%;overflow:hidden;-webkit-user-select:none;user-select:none}.record-rule-wrapper .record-rule-content[data-v-1a83cd36] .scroll-wrapper{width:100%;height:400px}.record-rule-wrapper .record-rule-content[data-v-1a83cd36] .scroll-wrapper .scroll-content{width:640px;margin:0 14px;overflow:hidden;position:relative}.record-rule-wrapper .record-rule-content .table-title[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex;width:100%;background-color:#F1F1F7;border-radius:10px 10px 0px 0px;border:1px solid #E2E5E7;border-bottom:none;height:40px;line-height:40px;text-align:center;color:#333}.record-rule-wrapper .record-rule-content .table-title .left-title[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex;width:163px}.record-rule-wrapper .record-rule-content .table-title .left-title .header-item[data-v-1a83cd36]{width:100%;border-right:1px solid #E2E5E7}.record-rule-wrapper .record-rule-content .table-title .right-title[data-v-1a83cd36]{-webkit-box-flex:1;-webkit-flex:1;flex:1;overflow:hidden}.record-rule-wrapper .record-rule-content .table-title .right-title .right-title-wrapper[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex}.record-rule-wrapper .record-rule-content .table-title .right-title .right-title-wrapper .header-item[data-v-1a83cd36]:first-child{width:120px;border-right:1px solid #E2E5E7}.record-rule-wrapper .record-rule-content .table-title .right-title .right-title-wrapper .header-item[data-v-1a83cd36]:nth-child(2){width:100px;border-right:1px solid #E2E5E7}.record-rule-wrapper .record-rule-content .table-title .right-title .right-title-wrapper .header-item[data-v-1a83cd36]:nth-child(3){width:66px;border-right:1px solid #E2E5E7}.record-rule-wrapper .record-rule-content .table-title .right-title .right-title-wrapper .header-item[data-v-1a83cd36]:nth-child(4){-webkit-box-flex:1;-webkit-flex:1;flex:1}.record-rule-wrapper .record-rule-content .table-wrapper[data-v-1a83cd36]{height:41vh;overflow:hidden;background:#fff;border-radius:0 0 10px 10px;border-bottom:1px solid #E2E5E7;box-shadow:0px 3px 10px 0px rgba(179,179,179,0.1)}.record-rule-wrapper .record-rule-content .table-wrapper .record-table[data-v-1a83cd36]{border-radius:0 0 10px 10px;border:1px solid #E2E5E7;display:-webkit-box;display:-webkit-flex;display:flex}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .left-table[data-v-1a83cd36]{width:163px}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .left-table .left-table-body-item:last-child .body-item-left[data-v-1a83cd36]{border-bottom:none}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .left-table .left-table-body-item:last-child .body-item-right .right-row-city[data-v-1a83cd36]:last-child{border-bottom:none}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .left-table .left-table-body-item .body-item-left[data-v-1a83cd36]{width:60px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;border-right:1px solid #E2E5E7;-webkit-box-align:center;-webkit-align-items:center;align-items:center;border-bottom:1px solid #E2E5E7}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .left-table .left-table-body-item .body-item-right[data-v-1a83cd36]{-webkit-box-flex:1;-webkit-flex:1;flex:1}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .left-table .left-table-body-item .body-item-right .right-row-city[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex;padding:8px;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-webkit-align-items:center;align-items:center;border-bottom:1px solid #E2E5E7;border-right:1px solid #E2E5E7}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .left-table .left-table-body-item .body-item-right .right-row-city p[data-v-1a83cd36]{padding:1.5px}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .right-table[data-v-1a83cd36]{-webkit-box-flex:1;-webkit-flex:1;flex:1;overflow:hidden}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .right-table .right-table-body-item:last-child .right-row-item .row-citem[data-v-1a83cd36]{border-bottom:none}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .right-table .right-table-body-item .right-row-item[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .right-table .right-table-body-item .right-row-item .row-citem[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center;padding:8px;border-right:1px solid #E2E5E7;border-bottom:1px solid #E2E5E7}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .right-table .right-table-body-item .right-row-item .row-citem[data-v-1a83cd36]:nth-child(1){width:120px}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .right-table .right-table-body-item .right-row-item .row-citem[data-v-1a83cd36]:nth-child(2){width:100px}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .right-table .right-table-body-item .right-row-item .row-citem[data-v-1a83cd36]:nth-child(3){width:66px}.record-rule-wrapper .record-rule-content .table-wrapper .record-table .right-table .right-table-body-item .right-row-item .row-citem[data-v-1a83cd36]:nth-child(4){border-right:none;-webkit-box-flex:1;-webkit-flex:1;flex:1}.record-rule-wrapper .submit-btn[data-v-1a83cd36]{position:absolute;bottom:0;left:0;width:100%;margin-top:10px;padding:10px;border-top:1px solid #F5F5F5}.record-rule-wrapper .submit-btn .full-screen-btn[data-v-1a83cd36]{height:4rem;border-radius:2.2rem;background:-webkit-linear-gradient(left,#B6ADFB 0%,#9589F4 100%);background:linear-gradient(90deg,#B6ADFB 0%,#9589F4 100%);text-align:center;line-height:4rem;font-size:1.6rem;font-family:SourceHanSansSC-Regular,SourceHanSansSC;font-weight:400;color:#FFFFFF}.bg-wrap[data-v-1a83cd36]{position:fixed;width:100vw;height:100vh;top:0;left:0;z-index:9999;background:#fff}.bg-wrap .full-record-rule-wrapper[data-v-1a83cd36]{-webkit-transform:rotate(90deg);transform:rotate(90deg);position:absolute;left:100%;top:0;width:100vh;height:100vw;overflow:auto;-webkit-transform-origin:top left;transform-origin:top left}.bg-wrap .full-record-rule-wrapper .title[data-v-1a83cd36]{position:relative;font-size:20px;padding-top:12px;color:#333;font-weight:bold;text-align:center}.bg-wrap .full-record-rule-wrapper .title .close[data-v-1a83cd36]{position:absolute;top:1rem;right:1rem}.bg-wrap .full-record-rule-wrapper .title .close img[data-v-1a83cd36]{width:3.2rem;height:3.2rm;pointer-events:auto!important}.bg-wrap .full-record-rule-wrapper .description[data-v-1a83cd36]{text-align:center;margin-top:15px;font-size:14px;color:#666}.bg-wrap .full-record-rule-wrapper .description .special-desc[data-v-1a83cd36]{color:#333333}.bg-wrap .full-record-rule-wrapper .record-rule-content[data-v-1a83cd36]{margin-top:12px;padding:0 14px;position:relative;width:100%;overflow:hidden;-webkit-user-select:none;user-select:none}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-header[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex;background-color:#F1F1F7;border-radius:10px 10px 0px 0px;border:1px solid #E2E5E7;border-bottom:none;height:40px;line-height:40px;text-align:center;color:#333}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-header .header-item[data-v-1a83cd36]:first-child{width:255px;border-right:1px solid #E2E5E7}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-header .header-item[data-v-1a83cd36]:nth-child(2){width:120px;border-right:1px solid #E2E5E7}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-header .header-item[data-v-1a83cd36]:nth-child(3){width:50px;border-right:1px solid #E2E5E7}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-header .header-item[data-v-1a83cd36]:nth-child(4){-webkit-box-flex:1;-webkit-flex:1;flex:1}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body[data-v-1a83cd36]{border-radius:0 0 10px 10px;max-height:230px;overflow:auto;border:1px solid #E2E5E7}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex;border-bottom:1px solid #E2E5E7}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item[data-v-1a83cd36]:last-child{border-radius:0 0 10px 10px;border-bottom:none}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-left[data-v-1a83cd36]{width:75px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;border-right:1px solid #E2E5E7;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right[data-v-1a83cd36]{-webkit-box-flex:1;-webkit-flex:1;flex:1}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex;border-bottom:1px solid #E2E5E7}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item[data-v-1a83cd36]:last-child{border-bottom:none}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item .row-citem[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;padding:8px;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center;border-right:1px solid #E2E5E7}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item .row-citem p[data-v-1a83cd36]{padding:1.5px}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item .row-citem[data-v-1a83cd36]:first-child{width:180px}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item .row-citem[data-v-1a83cd36]:nth-child(2){width:120px}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item .row-citem:nth-child(2) .range-tip[data-v-1a83cd36]{width:100%}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item .row-citem[data-v-1a83cd36]:nth-child(3){width:50px}.bg-wrap .full-record-rule-wrapper .record-rule-content .table-body .table-body-item .body-item-right .right-row-item .row-citem[data-v-1a83cd36]:nth-child(4){border-right:none;-webkit-box-flex:1;-webkit-flex:1;flex:1}.dialog-mask[data-v-1a83cd36]{position:fixed;top:0;left:0;width:100%;height:100%;z-index:300;background:rgba(0,0,0,0.5)}.dialog-mask .content[data-v-1a83cd36]{position:absolute;top:50%;width:334px;left:50%;padding:15px 12px;max-height:260px;overflow-y:auto;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background-color:#fff;border-radius:13px;font-size:13px;line-height:18px;color:#333}.dialog-mask .content .record-content[data-v-1a83cd36]{display:-webkit-box;display:-webkit-flex;display:flex}.dialog-mask .content .record-content .record-citys[data-v-1a83cd36]{-webkit-box-flex:1;-webkit-flex:1;flex:1;text-align:center}

package/lib/ReplayLayer/index.js

@@ -0,0 +1 @@
+"use strict";require('./style.css');var _Promise=require("@babel/runtime-corejs3/core-js/promise");var utils_create=require("../utils/create/index.js");var mixins_visible=require("../mixins/visible/index.js");var common_goldlayer=require("../common/goldlayer/index.js");var GoldReadTerms=require("../GoldReadTerms/index.js");var Loading=require("../Loading/index.js");var utils_post=require("../utils/post/index.js");var __$_require_1d5aae7b__=require("../assets/reminder-cpsbg.ee48.png");var __$_require_5da6807a__=require("../assets/reminder-bg.556f.png");var common=require("../common/index.js");var _sfc_main={name:"ActReplayLayer",mixins:[mixins_visible.visibleMixin],components:{ActGoldLayer:common_goldlayer.ActGoldLayer,Loading:Loading.Loading,ActGoldReadTerms:GoldReadTerms.GoldReadTerms},data:function data(){return{showLoading:false,toast:null,info:{},docs:[],readTerms:[],readTermTitle:""}},props:{brandColor:{type:String,default:"#8c7fee"},isCps:{type:Boolean,default:false},initUrl:{type:String,default:"/OfflineBuy/initBuyReplay"},initParams:{type:Object,default:function _default(){return{}}},agressUrl:{type:String,default:"/OfflineBuy/submitReplay"},agressParams:{type:Object,default:function _default2(){return{}}},forceShow:{type:Boolean,default:false},confirmText:{type:String,default:"同意并继续"}},computed:{btnBackgroundColor:function btnBackgroundColor(){if(this.isCps){return{background:this.brandColor}}return{background:"linear-gradient(90deg,#ff738d, #ff465e) !important"}}},methods:{agress:function agress(){var _this=this;this.$emit("agress");this.showLoading=true;utils_post.fetch(this.agressUrl,this.agressParams||{}).then(function(res){_this.showLoading=false;if(+res.data.ret===0){_this.agressSuccess({needPopup:1})}else{return _Promise.reject(res.data.errmsg)}}).catch(function(e){_this.showLoading=false;_this.onError({sence:"agressError",errmsg:e})})},agressSuccess:function agressSuccess(){var option=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};this.readTermsRefHide();this.hide();this.$emit("agressSuccess",option)},onError:function onError(){var option=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};this.$emit("error",option)},initReplay:function initReplay(){var _this2=this;this.showLoading=true;utils_post.fetch(this.initUrl,this.initParams||{}).then(function(res){_this2.showLoading=false;if(+res.data.ret===0){var _ref=res.data.data||{},popup=_ref.popup,authbuyAvailability=_ref.authbuyAvailability,docs=_ref.docs;var _ref2=authbuyAvailability||{},avilability=_ref2.avilability;if(_this2.forceShow||~~popup===1&&~~avilability===1&&!_this2.isVisible){_this2.$emit("initReplay",res.data.data);_this2.info=authbuyAvailability||{};_this2.docs=docs||[];_this2.show()}else{_this2.agressSuccess({needPopup:0})}}else{return _Promise.reject(res.data.errmsg)}}).catch(function(e){_this2.showLoading=false;_this2.hide();_this2.onError({sence:"initReplayError",errmsg:e})})},docClick:function docClick(doc){var _ref3=doc||{},_ref3$content=_ref3.content,content=_ref3$content===void 0?"":_ref3$content,_ref3$title=_ref3.title,title=_ref3$title===void 0?"":_ref3$title,_ref3$type=_ref3.type,type=_ref3$type===void 0?1:_ref3$type,_ref3$urls=_ref3.urls,urls=_ref3$urls===void 0?[]:_ref3$urls;this.readTermTitle=title;if(~~type===1){this.readTerms=[{title,type:3,innerHTML:content}]}else if(~~type===2){this.readTerms=[{title,type,urls}]}this.readTermsRefShow()},readTermsRefShow:function readTermsRefShow(){this.$refs.readTermsRef&&this.$refs.readTermsRef.show()},readTermsRefHide:function readTermsRefHide(){this.$refs.readTermsRef&&this.$refs.readTermsRef.hide()}}};var _sfc_render=function render(){var _vm=this,_c=_vm._self._c;return _c("div",{staticClass:"act-replay-layer"},[_c("act-gold-layer",{staticClass:"insure-notice-dialog",attrs:{"visible":_vm.isVisible,"center":false}},[_vm.isCps?_c("img",{staticClass:"bg",attrs:{"src":__$_require_1d5aae7b__,"alt":""}}):_c("img",{staticClass:"bg",attrs:{"src":__$_require_5da6807a__,"alt":""}}),_c("div",{staticClass:"wrap act-column act-items-center"},[!_vm.isCps&&_vm.info.companypicurl&&_vm.info.xiaoyusanlogo?_c("div",{staticClass:"logos act-row act-items-center"},[_c("img",{staticClass:"xiaoyusanlogo",attrs:{"src":_vm.info.xiaoyusanlogo,"alt":""}}),_c("span",{},[_vm._v("x")]),_c("img",{staticClass:"companylogo",attrs:{"src":_vm.info.companypicurl,"alt":""}})]):_vm._e(),_c("div",{staticClass:"tip",class:{"tip-margin":_vm.isCps||!(_vm.info.companypicurl&&_vm.info.xiaoyusanlogo)}},[_vm._v(" 温馨提示，您已进入投保流程 ")]),_vm.info.dutycompany?_c("div",{staticClass:"sub-tip"},[_vm._v(" "+_vm._s(_vm.info.dutycompany)+" ")]):_vm._e(),_vm.info.entrustnotice?_c("div",{staticClass:"entrust-tip"},[_vm._v(" "+_vm._s(_vm.info.entrustnotice)+" ")]):_vm._e(),_c("div",{staticClass:"desc"},[_vm.info.replayGuidText?_c("div",[_vm._v(" "+_vm._s(_vm.info.replayGuidText)+" ")]):_c("div",[_vm._v(" 请仔细阅读保险条款、重要提示及责任免除等内容。为保障您的合法权益，您的投保操作将被安全记录并同步保险公司。 ")]),_vm._l(_vm.docs,function(doc,index){return[_c("a",{key:index,style:{"color":_vm.brandColor},attrs:{"href":"javascript:;"},on:{"click":function click($event){$event.stopPropagation();return _vm.docClick(doc)}}},[_vm._v(" 《"+_vm._s(doc.title)+"》 ")])]})],2),_c("div",{staticClass:"agress-btn",style:_vm.btnBackgroundColor,on:{"click":_vm.agress}},[_vm._v(" "+_vm._s(_vm.confirmText)+" ")])])]),_c("act-gold-read-terms",{ref:"readTermsRef",attrs:{"readTerms":_vm.readTerms}},[_c("div",{attrs:{"slot":"myheader"},slot:"myheader"},[_c("div",{staticClass:"popup-hd"},[_c("h3",[_vm._v(" "+_vm._s(_vm.readTermTitle))]),_c("i",{staticClass:"act-gold-popup-icon-close",on:{"click":function click($event){return _vm.$refs.readTermsRef.hide()}}})])]),_c("div",{staticClass:"readTerms-footer",style:_vm.btnBackgroundColor,attrs:{"slot":"footer"},on:{"click":_vm.agress},slot:"footer"},[_vm._v(" "+_vm._s(_vm.confirmText)+" ")])]),_c("Loading",{directives:[{name:"show",rawName:"v-show",value:_vm.showLoading,expression:"showLoading"}],attrs:{"type":"cir4","color":_vm.brandColor,"size":20}})],1)};var _sfc_staticRenderFns=[];var __component__=common.normalizeComponent(_sfc_main,_sfc_render,_sfc_staticRenderFns,false,null,"50ae1454");var ReplayLayer=__component__.exports;ReplayLayer.install=function(Vue){Vue.component(ReplayLayer.name,ReplayLayer);Vue.prototype["$createReplayLayer"]=utils_create.create(ReplayLayer,Vue)};exports.ReplayLayer=ReplayLayer;