mp-html.js 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265
  1. "use strict";
  2. var common_vendor = require("../../common/vendor.js");
  3. var uni_modules_mpHtml_parser = require("./parser.js");
  4. var uni_modules_mpHtml_editable_index = require("./editable/index.js");
  5. require("./editable/config.js");
  6. const node = () => "./node/node.js";
  7. const plugins = [uni_modules_mpHtml_editable_index.Editable];
  8. const _sfc_main = {
  9. name: "mp-html",
  10. data() {
  11. return {
  12. tooltip: null,
  13. slider: null,
  14. nodes: []
  15. };
  16. },
  17. props: {
  18. editable: Boolean,
  19. placeholder: String,
  20. containerStyle: {
  21. type: String,
  22. default: ""
  23. },
  24. content: {
  25. type: String,
  26. default: ""
  27. },
  28. copyLink: {
  29. type: [Boolean, String],
  30. default: true
  31. },
  32. domain: String,
  33. errorImg: {
  34. type: String,
  35. default: ""
  36. },
  37. lazyLoad: {
  38. type: [Boolean, String],
  39. default: false
  40. },
  41. loadingImg: {
  42. type: String,
  43. default: ""
  44. },
  45. pauseVideo: {
  46. type: [Boolean, String],
  47. default: true
  48. },
  49. previewImg: {
  50. type: [Boolean, String],
  51. default: true
  52. },
  53. scrollTable: [Boolean, String],
  54. selectable: [Boolean, String],
  55. setTitle: {
  56. type: [Boolean, String],
  57. default: true
  58. },
  59. showImgMenu: {
  60. type: [Boolean, String],
  61. default: true
  62. },
  63. tagStyle: Object,
  64. useAnchor: [Boolean, Number]
  65. },
  66. emits: ["load", "ready", "imgtap", "linktap", "play", "error"],
  67. components: {
  68. node
  69. },
  70. watch: {
  71. editable(val) {
  72. this.setContent(val ? this.content : this.getContent());
  73. if (!val)
  74. this._maskTap();
  75. },
  76. content(content) {
  77. this.setContent(content);
  78. }
  79. },
  80. created() {
  81. this.plugins = [];
  82. for (let i = plugins.length; i--; ) {
  83. this.plugins.push(new plugins[i](this));
  84. }
  85. },
  86. mounted() {
  87. if ((this.content || this.editable) && !this.nodes.length) {
  88. this.setContent(this.content);
  89. }
  90. },
  91. beforeDestroy() {
  92. this._hook("onDetached");
  93. clearInterval(this._timer);
  94. },
  95. methods: {
  96. _containTap() {
  97. if (!this._lock && !this.slider) {
  98. this._edit = void 0;
  99. this._maskTap();
  100. }
  101. },
  102. _tooltipTap(e) {
  103. this._tooltipcb(e.currentTarget.dataset.i);
  104. this.$set(this, "tooltip", null);
  105. },
  106. _sliderChanging(e) {
  107. this._slideringcb(e.detail.value);
  108. },
  109. _sliderChange(e) {
  110. this._slidercb(e.detail.value);
  111. },
  112. in(page, selector, scrollTop) {
  113. if (page && selector && scrollTop) {
  114. this._in = {
  115. page,
  116. selector,
  117. scrollTop
  118. };
  119. }
  120. },
  121. navigateTo(id, offset) {
  122. return new Promise((resolve, reject) => {
  123. if (!this.useAnchor) {
  124. reject(Error("Anchor is disabled"));
  125. return;
  126. }
  127. offset = offset || parseInt(this.useAnchor) || 0;
  128. let deep = " ";
  129. deep = ">>>";
  130. const selector = common_vendor.index.createSelectorQuery().in(this._in ? this._in.page : this).select((this._in ? this._in.selector : "._root") + (id ? `${deep}#${id}` : "")).boundingClientRect();
  131. if (this._in) {
  132. selector.select(this._in.selector).scrollOffset().select(this._in.selector).boundingClientRect();
  133. } else {
  134. selector.selectViewport().scrollOffset();
  135. }
  136. selector.exec((res) => {
  137. if (!res[0]) {
  138. reject(Error("Label not found"));
  139. return;
  140. }
  141. const scrollTop = res[1].scrollTop + res[0].top - (res[2] ? res[2].top : 0) + offset;
  142. if (this._in) {
  143. this._in.page[this._in.scrollTop] = scrollTop;
  144. } else {
  145. common_vendor.index.pageScrollTo({
  146. scrollTop,
  147. duration: 300
  148. });
  149. }
  150. resolve();
  151. });
  152. });
  153. },
  154. getText(nodes) {
  155. let text = "";
  156. (function traversal(nodes2) {
  157. for (let i = 0; i < nodes2.length; i++) {
  158. const node2 = nodes2[i];
  159. if (node2.type === "text") {
  160. text += node2.text.replace(/&amp;/g, "&");
  161. } else if (node2.name === "br") {
  162. text += "\n";
  163. } else {
  164. const isBlock = node2.name === "p" || node2.name === "div" || node2.name === "tr" || node2.name === "li" || node2.name[0] === "h" && node2.name[1] > "0" && node2.name[1] < "7";
  165. if (isBlock && text && text[text.length - 1] !== "\n") {
  166. text += "\n";
  167. }
  168. if (node2.children) {
  169. traversal(node2.children);
  170. }
  171. if (isBlock && text[text.length - 1] !== "\n") {
  172. text += "\n";
  173. } else if (node2.name === "td" || node2.name === "th") {
  174. text += " ";
  175. }
  176. }
  177. }
  178. })(nodes || this.nodes);
  179. return text;
  180. },
  181. getRect() {
  182. return new Promise((resolve, reject) => {
  183. common_vendor.index.createSelectorQuery().in(this).select("#_root").boundingClientRect().exec((res) => res[0] ? resolve(res[0]) : reject(Error("Root label not found")));
  184. });
  185. },
  186. pauseMedia() {
  187. for (let i = (this._videos || []).length; i--; ) {
  188. this._videos[i].pause();
  189. }
  190. },
  191. setContent(content, append) {
  192. if (!append || !this.imgList) {
  193. this.imgList = [];
  194. }
  195. const nodes = new uni_modules_mpHtml_parser.Parser(this).parse(content);
  196. this.$set(this, "nodes", append ? (this.nodes || []).concat(nodes) : nodes);
  197. this._videos = [];
  198. this.$nextTick(() => {
  199. this._hook("onLoad");
  200. this.$emit("load");
  201. });
  202. let height;
  203. clearInterval(this._timer);
  204. this._timer = setInterval(() => {
  205. this.getRect().then((rect) => {
  206. if (rect.height === height) {
  207. this.$emit("ready", rect);
  208. clearInterval(this._timer);
  209. }
  210. height = rect.height;
  211. }).catch(() => {
  212. });
  213. }, 350);
  214. },
  215. _hook(name) {
  216. for (let i = plugins.length; i--; ) {
  217. if (this.plugins[i][name]) {
  218. this.plugins[i][name]();
  219. }
  220. }
  221. }
  222. }
  223. };
  224. if (!Array) {
  225. const _component_node = common_vendor.resolveComponent("node");
  226. _component_node();
  227. }
  228. function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  229. return common_vendor.e({
  230. a: !$data.nodes[0]
  231. }, !$data.nodes[0] ? {} : {
  232. b: common_vendor.p({
  233. childs: $data.nodes,
  234. opts: [$props.lazyLoad, $props.loadingImg, $props.errorImg, $props.showImgMenu, $props.selectable, $props.editable, $props.placeholder, "nodes"],
  235. name: "span"
  236. })
  237. }, {
  238. c: $data.tooltip
  239. }, $data.tooltip ? {
  240. d: common_vendor.f($data.tooltip.items, (item, index, i0) => {
  241. return {
  242. a: common_vendor.t(item),
  243. b: index,
  244. c: index,
  245. d: common_vendor.o((...args) => $options._tooltipTap && $options._tooltipTap(...args), index)
  246. };
  247. }),
  248. e: common_vendor.s("top:" + $data.tooltip.top + "px")
  249. } : {}, {
  250. f: $data.slider
  251. }, $data.slider ? {
  252. g: $data.slider.value,
  253. h: $data.slider.min,
  254. i: $data.slider.max,
  255. j: common_vendor.o((...args) => $options._sliderChanging && $options._sliderChanging(...args)),
  256. k: common_vendor.o((...args) => $options._sliderChange && $options._sliderChange(...args)),
  257. l: common_vendor.s("top:" + $data.slider.top + "px")
  258. } : {}, {
  259. m: common_vendor.n(($props.selectable ? "_select " : "") + "_root"),
  260. n: common_vendor.s(($props.editable ? "min-height:200px;" : "") + $props.containerStyle),
  261. o: common_vendor.o((...args) => $options._containTap && $options._containTap(...args))
  262. });
  263. }
  264. var Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "E:/Project/2023/\u95EE\u8BCA\u5E73\u53F0/his_user_miniapp/uni_modules/mp-html/mp-html.vue"]]);
  265. wx.createComponent(Component);