/*
* XmlDigitalTeaching v0.0.1
* Copyright ©Fri Sep 27 2024 09:50:15 GMT+0800 (中国标准时间) smile
* Released under the ISC License.
*/
import Vue from 'vue';
import crypto from 'crypto';
const rnds8Pool = new Uint8Array(256); // # of random values to pre-allocate
let poolPtr = rnds8Pool.length;
function rng() {
if (poolPtr > rnds8Pool.length - 16) {
crypto.randomFillSync(rnds8Pool);
poolPtr = 0;
}
return rnds8Pool.slice(poolPtr, poolPtr += 16);
}
var REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
function validate(uuid) {
return typeof uuid === 'string' && REGEX.test(uuid);
}
/**
* Convert array of 16 byte values to UUID string format of the form:
* XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
*/
const byteToHex = [];
for (let i = 0; i < 256; ++i) {
byteToHex.push((i + 0x100).toString(16).substr(1));
}
function stringify(arr, offset = 0) {
// Note: Be careful editing this code! It's been tuned for performance
// and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
const uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID. If this throws, it's likely due to one
// of the following:
// - One or more input array values don't map to a hex octet (leading to
// "undefined" in the uuid)
// - Invalid input values for the RFC `version` or `variant` fields
if (!validate(uuid)) {
throw TypeError('Stringified UUID is invalid');
}
return uuid;
}
function v4(options, buf, offset) {
options = options || {};
const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
rnds[6] = rnds[6] & 0x0f | 0x40;
rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
if (buf) {
offset = offset || 0;
for (let i = 0; i < 16; ++i) {
buf[offset + i] = rnds[i];
}
return buf;
}
return stringify(rnds);
}
var defaultLang = {
el: {
colorpicker: {
confirm: '确定',
clear: '清空'
},
datepicker: {
now: '此刻',
today: '今天',
cancel: '取消',
clear: '清空',
confirm: '确定',
selectDate: '选择日期',
selectTime: '选择时间',
startDate: '开始日期',
startTime: '开始时间',
endDate: '结束日期',
endTime: '结束时间',
prevYear: '前一年',
nextYear: '后一年',
prevMonth: '上个月',
nextMonth: '下个月',
year: '年',
month1: '1 月',
month2: '2 月',
month3: '3 月',
month4: '4 月',
month5: '5 月',
month6: '6 月',
month7: '7 月',
month8: '8 月',
month9: '9 月',
month10: '10 月',
month11: '11 月',
month12: '12 月',
// week: '周次',
weeks: {
sun: '日',
mon: '一',
tue: '二',
wed: '三',
thu: '四',
fri: '五',
sat: '六'
},
months: {
jan: '一月',
feb: '二月',
mar: '三月',
apr: '四月',
may: '五月',
jun: '六月',
jul: '七月',
aug: '八月',
sep: '九月',
oct: '十月',
nov: '十一月',
dec: '十二月'
}
},
select: {
loading: '加载中',
noMatch: '无匹配数据',
noData: '无数据',
placeholder: '请选择'
},
cascader: {
noMatch: '无匹配数据',
loading: '加载中',
placeholder: '请选择',
noData: '暂无数据'
},
pagination: {
goto: '前往',
pagesize: '条/页',
total: '共 {total} 条',
pageClassifier: '页'
},
messagebox: {
title: '提示',
confirm: '确定',
cancel: '取消',
error: '输入的数据不合法!'
},
upload: {
deleteTip: '按 delete 键可删除',
delete: '删除',
preview: '查看图片',
continue: '继续上传'
},
table: {
emptyText: '暂无数据',
confirmFilter: '筛选',
resetFilter: '重置',
clearFilter: '全部',
sumText: '合计'
},
tree: {
emptyText: '暂无数据'
},
transfer: {
noMatch: '无匹配数据',
noData: '无数据',
titles: ['列表 1', '列表 2'],
filterPlaceholder: '请输入搜索内容',
noCheckedFormat: '共 {total} 项',
hasCheckedFormat: '已选 {checked}/{total} 项'
},
image: {
error: '加载失败'
},
pageHeader: {
title: '返回'
},
popconfirm: {
confirmButtonText: '确定',
cancelButtonText: '取消'
},
empty: {
description: '暂无数据'
}
}
};
var isMergeableObject = function isMergeableObject(value) {
return isNonNullObject(value) && !isSpecial(value);
};
function isNonNullObject(value) {
return !!value && typeof value === 'object';
}
function isSpecial(value) {
var stringValue = Object.prototype.toString.call(value);
return stringValue === '[object RegExp]' || stringValue === '[object Date]' || isReactElement(value);
}
// see https://github.com/facebook/react/blob/b5ac963fb791d1298e7f396236383bc955f916c1/src/isomorphic/classic/element/ReactElement.js#L21-L25
var canUseSymbol = typeof Symbol === 'function' && Symbol.for;
var REACT_ELEMENT_TYPE = canUseSymbol ? Symbol.for('react.element') : 0xeac7;
function isReactElement(value) {
return value.$$typeof === REACT_ELEMENT_TYPE;
}
function emptyTarget(val) {
return Array.isArray(val) ? [] : {};
}
function cloneIfNecessary(value, optionsArgument) {
var clone = optionsArgument && optionsArgument.clone === true;
return clone && isMergeableObject(value) ? deepmerge(emptyTarget(value), value, optionsArgument) : value;
}
function defaultArrayMerge(target, source, optionsArgument) {
var destination = target.slice();
source.forEach(function (e, i) {
if (typeof destination[i] === 'undefined') {
destination[i] = cloneIfNecessary(e, optionsArgument);
} else if (isMergeableObject(e)) {
destination[i] = deepmerge(target[i], e, optionsArgument);
} else if (target.indexOf(e) === -1) {
destination.push(cloneIfNecessary(e, optionsArgument));
}
});
return destination;
}
function mergeObject(target, source, optionsArgument) {
var destination = {};
if (isMergeableObject(target)) {
Object.keys(target).forEach(function (key) {
destination[key] = cloneIfNecessary(target[key], optionsArgument);
});
}
Object.keys(source).forEach(function (key) {
if (!isMergeableObject(source[key]) || !target[key]) {
destination[key] = cloneIfNecessary(source[key], optionsArgument);
} else {
destination[key] = deepmerge(target[key], source[key], optionsArgument);
}
});
return destination;
}
function deepmerge(target, source, optionsArgument) {
var sourceIsArray = Array.isArray(source);
var targetIsArray = Array.isArray(target);
var options = optionsArgument || {
arrayMerge: defaultArrayMerge
};
var sourceAndTargetTypesMatch = sourceIsArray === targetIsArray;
if (!sourceAndTargetTypesMatch) {
return cloneIfNecessary(source, optionsArgument);
} else if (sourceIsArray) {
var arrayMerge = options.arrayMerge || defaultArrayMerge;
return arrayMerge(target, source, optionsArgument);
} else {
return mergeObject(target, source, optionsArgument);
}
}
deepmerge.all = function deepmergeAll(array, optionsArgument) {
if (!Array.isArray(array) || array.length < 2) {
throw new Error('first argument should be an array with at least two elements');
}
// we are sure there are at least 2 values, so it is safe to have no initial value
return array.reduce(function (prev, next) {
return deepmerge(prev, next, optionsArgument);
});
};
var deepmerge_1 = deepmerge;
function isString$1(obj) {
return Object.prototype.toString.call(obj) === '[object String]';
}
function isHtmlElement(node) {
return node && node.nodeType === Node.ELEMENT_NODE;
}
if (typeof /./ !== 'function' && typeof Int8Array !== 'object' && (Vue.prototype.$isServer || typeof document.childNodes !== 'function')) ;
const hasOwnProperty$2 = Object.prototype.hasOwnProperty;
function hasOwn(obj, key) {
return hasOwnProperty$2.call(obj, key);
}
const isFirefox = function () {
return !Vue.prototype.$isServer && !!window.navigator.userAgent.match(/firefox/i);
};
const RE_NARGS = /(%|)\{([0-9a-zA-Z_]+)\}/g;
/**
* String format template
* - Inspired:
* https://github.com/Matt-Esch/string-template/index.js
*/
function Format (Vue) {
/**
* template
*
* @param {String} string
* @param {Array} ...args
* @return {String}
*/
function template(string, ...args) {
if (args.length === 1 && typeof args[0] === 'object') {
args = args[0];
}
if (!args || !args.hasOwnProperty) {
args = {};
}
return string.replace(RE_NARGS, (match, prefix, i, index) => {
let result;
if (string[index - 1] === '{' && string[index + match.length] === '}') {
return i;
} else {
result = hasOwn(args, i) ? args[i] : null;
if (result === null || result === undefined) {
return '';
}
return result;
}
});
}
return template;
}
const format$2 = Format();
let lang$1 = defaultLang;
let merged = false;
let i18nHandler = function () {
const vuei18n = Object.getPrototypeOf(this || Vue).$t;
if (typeof vuei18n === 'function' && !!Vue.locale) {
if (!merged) {
merged = true;
Vue.locale(Vue.config.lang, deepmerge_1(lang$1, Vue.locale(Vue.config.lang) || {}, {
clone: true
}));
}
return vuei18n.apply(this, arguments);
}
};
const t$r = function (path, options) {
let value = i18nHandler.apply(this, arguments);
if (value !== null && value !== undefined) return value;
const array = path.split('.');
let current = lang$1;
for (let i = 0, j = array.length; i < j; i++) {
const property = array[i];
value = current[property];
if (i === j - 1) return format$2(value, options);
if (!value) return '';
current = value;
}
return '';
};
var Locale$1 = {
methods: {
t(...args) {
return t$r.apply(this, args);
}
}
};
/* istanbul ignore next */
const isServer$1 = Vue.prototype.$isServer;
const SPECIAL_CHARS_REGEXP = /([\:\-\_]+(.))/g;
const MOZ_HACK_REGEXP = /^moz([A-Z])/;
const ieVersion = isServer$1 ? 0 : Number(document.documentMode);
/* istanbul ignore next */
const trim$1 = function (string) {
return (string || '').replace(/^[\s\uFEFF]+|[\s\uFEFF]+$/g, '');
};
/* istanbul ignore next */
const camelCase$1 = function (name) {
return name.replace(SPECIAL_CHARS_REGEXP, function (_, separator, letter, offset) {
return offset ? letter.toUpperCase() : letter;
}).replace(MOZ_HACK_REGEXP, 'Moz$1');
};
/* istanbul ignore next */
const on$1 = function () {
if (!isServer$1 && document.addEventListener) {
return function (element, event, handler) {
if (element && event && handler) {
element.addEventListener(event, handler, false);
}
};
} else {
return function (element, event, handler) {
if (element && event && handler) {
element.attachEvent('on' + event, handler);
}
};
}
}();
/* istanbul ignore next */
const off$1 = function () {
if (!isServer$1 && document.removeEventListener) {
return function (element, event, handler) {
if (element && event) {
element.removeEventListener(event, handler, false);
}
};
} else {
return function (element, event, handler) {
if (element && event) {
element.detachEvent('on' + event, handler);
}
};
}
}();
/* istanbul ignore next */
function hasClass(el, cls) {
if (!el || !cls) return false;
if (cls.indexOf(' ') !== -1) throw new Error('className should not contain space.');
if (el.classList) {
return el.classList.contains(cls);
} else {
return (' ' + el.className + ' ').indexOf(' ' + cls + ' ') > -1;
}
}
/* istanbul ignore next */
function addClass(el, cls) {
if (!el) return;
var curClass = el.className;
var classes = (cls || '').split(' ');
for (var i = 0, j = classes.length; i < j; i++) {
var clsName = classes[i];
if (!clsName) continue;
if (el.classList) {
el.classList.add(clsName);
} else if (!hasClass(el, clsName)) {
curClass += ' ' + clsName;
}
}
if (!el.classList) {
el.setAttribute('class', curClass);
}
}
/* istanbul ignore next */
function removeClass(el, cls) {
if (!el || !cls) return;
var classes = cls.split(' ');
var curClass = ' ' + el.className + ' ';
for (var i = 0, j = classes.length; i < j; i++) {
var clsName = classes[i];
if (!clsName) continue;
if (el.classList) {
el.classList.remove(clsName);
} else if (hasClass(el, clsName)) {
curClass = curClass.replace(' ' + clsName + ' ', ' ');
}
}
if (!el.classList) {
el.setAttribute('class', trim$1(curClass));
}
}
/* istanbul ignore next */
const getStyle = ieVersion < 9 ? function (element, styleName) {
if (isServer$1) return;
if (!element || !styleName) return null;
styleName = camelCase$1(styleName);
if (styleName === 'float') {
styleName = 'styleFloat';
}
try {
switch (styleName) {
case 'opacity':
try {
return element.filters.item('alpha').opacity / 100;
} catch (e) {
return 1.0;
}
default:
return element.style[styleName] || element.currentStyle ? element.currentStyle[styleName] : null;
}
} catch (e) {
return element.style[styleName];
}
} : function (element, styleName) {
if (isServer$1) return;
if (!element || !styleName) return null;
styleName = camelCase$1(styleName);
if (styleName === 'float') {
styleName = 'cssFloat';
}
try {
var computed = document.defaultView.getComputedStyle(element, '');
return element.style[styleName] || computed ? computed[styleName] : null;
} catch (e) {
return element.style[styleName];
}
};
const isScroll = (el, vertical) => {
if (isServer$1) return;
const determinedDirection = vertical !== null && vertical !== undefined;
const overflow = determinedDirection ? vertical ? getStyle(el, 'overflow-y') : getStyle(el, 'overflow-x') : getStyle(el, 'overflow');
return overflow.match(/(scroll|auto|overlay)/);
};
const getScrollContainer = (el, vertical) => {
if (isServer$1) return;
let parent = el;
while (parent) {
if ([window, document, document.documentElement].includes(parent)) {
return window;
}
if (isScroll(parent, vertical)) {
return parent;
}
parent = parent.parentNode;
}
return parent;
};
const isInContainer = (el, container) => {
if (isServer$1 || !el || !container) return false;
const elRect = el.getBoundingClientRect();
let containerRect;
if ([window, document, document.documentElement, null, undefined].includes(container)) {
containerRect = {
top: 0,
right: window.innerWidth,
bottom: window.innerHeight,
left: 0
};
} else {
containerRect = container.getBoundingClientRect();
}
return elRect.top < containerRect.bottom && elRect.bottom > containerRect.top && elRect.right > containerRect.left && elRect.left < containerRect.right;
};
/* eslint-disable no-undefined,no-param-reassign,no-shadow */
/**
* Throttle execution of a function. Especially useful for rate limiting
* execution of handlers on events like resize and scroll.
*
* @param {Number} delay A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
* @param {Boolean} [noTrailing] Optional, defaults to false. If noTrailing is true, callback will only execute every `delay` milliseconds while the
* throttled-function is being called. If noTrailing is false or unspecified, callback will be executed one final time
* after the last throttled-function call. (After the throttled-function has not been called for `delay` milliseconds,
* the internal counter is reset)
* @param {Function} callback A function to be executed after delay milliseconds. The `this` context and all arguments are passed through, as-is,
* to `callback` when the throttled-function is executed.
* @param {Boolean} [debounceMode] If `debounceMode` is true (at begin), schedule `clear` to execute after `delay` ms. If `debounceMode` is false (at end),
* schedule `callback` to execute after `delay` ms.
*
* @return {Function} A new, throttled, function.
*/
var throttle$1 = function (delay, noTrailing, callback, debounceMode) {
// After wrapper has stopped being called, this timeout ensures that
// `callback` is executed at the proper times in `throttle` and `end`
// debounce modes.
var timeoutID;
// Keep track of the last time `callback` was executed.
var lastExec = 0;
// `noTrailing` defaults to falsy.
if (typeof noTrailing !== 'boolean') {
debounceMode = callback;
callback = noTrailing;
noTrailing = undefined;
}
// The `wrapper` function encapsulates all of the throttling / debouncing
// functionality and when executed will limit the rate at which `callback`
// is executed.
function wrapper() {
var self = this;
var elapsed = Number(new Date()) - lastExec;
var args = arguments;
// Execute `callback` and update the `lastExec` timestamp.
function exec() {
lastExec = Number(new Date());
callback.apply(self, args);
}
// If `debounceMode` is true (at begin) this is used to clear the flag
// to allow future `callback` executions.
function clear() {
timeoutID = undefined;
}
if (debounceMode && !timeoutID) {
// Since `wrapper` is being called for the first time and
// `debounceMode` is true (at begin), execute `callback`.
exec();
}
// Clear any existing timeout.
if (timeoutID) {
clearTimeout(timeoutID);
}
if (debounceMode === undefined && elapsed > delay) {
// In throttle mode, if `delay` time has been exceeded, execute
// `callback`.
exec();
} else if (noTrailing !== true) {
// In trailing throttle mode, since `delay` time has not been
// exceeded, schedule `callback` to execute `delay` ms after most
// recent execution.
//
// If `debounceMode` is true (at begin), schedule `clear` to execute
// after `delay` ms.
//
// If `debounceMode` is false (at end), schedule `callback` to
// execute after `delay` ms.
timeoutID = setTimeout(debounceMode ? clear : exec, debounceMode === undefined ? delay - elapsed : delay);
}
}
// Return the wrapper function.
return wrapper;
};
//
const isSupportObjectFit = () => document.documentElement.style.objectFit !== undefined;
const ObjectFit = {
NONE: 'none',
CONTAIN: 'contain',
COVER: 'cover',
FILL: 'fill',
SCALE_DOWN: 'scale-down'
};
var script$d = {
name: 'DesignPreviewImage',
mixins: [Locale$1],
inheritAttrs: false,
props: {
src: String,
fit: String,
lazy: Boolean,
mode: String,
scrollContainer: {},
previewSrcList: {
type: Array,
default: () => []
},
zIndex: {
type: Number,
default: 2000
},
currentIndex: {
type: Number,
default: -1
},
current: {
type: Number,
default: 0
},
showTitle: {
type: Boolean,
default: false
},
title: {
type: Array,
default: () => []
},
contents: {
type: Array,
default: () => []
},
self: {
type: Object,
default: () => {
}
},
titlePosition: {
type: String,
default: 'under'
},
titleAlign: {
type: String,
default: 'left'
},
clickEffect: {
type: String,
default: 'dian-ji-fang-da'
},
width: {
type: Number,
default: 100
},
pageType: {
type: String,
default: 'h5'
}
},
data() {
return {
loading: true,
error: false,
show: !this.lazy,
imageWidth: 0,
imageHeight: 0,
showViewer: false,
clientWidth: 0
};
},
computed: {
placeholderStyle() {
// console.log(this.clientWidth)
let offsetWidth = this.self?.offsetWidth || 400;
let offsetHeight = this.self?.offsetHeight || 600;
let width = this.width / 100 * this.clientWidth;
let height = width / offsetWidth * offsetHeight;
return {
width: width + 'px',
height: height + 'px'
};
},
imageStyle() {
const {
fit
} = this;
if (!this.$isServer && fit) {
return isSupportObjectFit() ? {
'object-fit': 'contain',
width: this.width + '% !important'
} : this.getImageStyle(fit);
}
return {
width: this.width + '% !important'
};
},
alignCenter() {
return !this.$isServer && !isSupportObjectFit() && this.fit !== ObjectFit.FILL;
},
preview() {
const {
previewSrcList
} = this;
return Array.isArray(previewSrcList) && previewSrcList.length > 0 && this.mode === 'preview' && (this.clickEffect === 'dian-ji-fang-da' || this.clickEffect === 'dian-ji-tiao-zhuan');
},
imageIndex() {
if (this.currentIndex !== -1) {
return this.currentIndex;
}
let previewIndex = 0;
const srcIndex = this.previewSrcList.indexOf(this.src);
if (srcIndex >= 0) {
previewIndex = srcIndex;
}
return previewIndex;
}
},
watch: {
src(val) {
this.show && this.loadImage();
},
show(val) {
val && this.loadImage();
},
title: {
handler(n, o) {
// console.log(n, o)
},
immediate: true,
deep: true
}
},
mounted() {
this.clientWidth = this.$refs.placeholder?.clientWidth;
if (this.lazy) {
this.addLazyLoadListener();
} else {
this.loadImage();
}
},
beforeDestroy() {
this.lazy && this.removeLazyLoadListener();
},
methods: {
loadImage() {
if (this.$isServer) return;
// reset status
this.loading = true;
this.error = false;
const img = new Image();
img.onload = e => this.handleLoad(e, img);
img.onerror = this.handleError.bind(this);
// bind html attrs
// so it can behave consistently
Object.keys(this.$attrs).forEach(key => {
const value = this.$attrs[key];
img.setAttribute(key, value);
});
img.src = this.src;
},
handleLoad(e, img) {
this.imageWidth = img.width;
this.imageHeight = img.height;
this.loading = false;
this.error = false;
},
handleError(e) {
this.loading = false;
this.error = true;
this.$emit('error', e);
},
handleLazyLoad() {
if (isInContainer(this.$el, this._scrollContainer)) {
this.show = true;
this.removeLazyLoadListener();
}
},
addLazyLoadListener() {
if (this.$isServer) return;
const {
scrollContainer
} = this;
let _scrollContainer = null;
if (isHtmlElement(scrollContainer)) {
_scrollContainer = scrollContainer;
} else if (isString$1(scrollContainer)) {
_scrollContainer = document.querySelector(scrollContainer);
} else {
_scrollContainer = getScrollContainer(this.$el);
}
if (_scrollContainer) {
this._scrollContainer = _scrollContainer;
this._lazyLoadHandler = throttle$1(200, this.handleLazyLoad);
on$1(_scrollContainer, 'scroll', this._lazyLoadHandler);
this.handleLazyLoad();
}
},
removeLazyLoadListener() {
const {
_scrollContainer,
_lazyLoadHandler
} = this;
if (this.$isServer || !_scrollContainer || !_lazyLoadHandler) return;
off$1(_scrollContainer, 'scroll', _lazyLoadHandler);
this._scrollContainer = null;
this._lazyLoadHandler = null;
},
/**
* simulate object-fit behavior to compatible with IE11 and other browsers which not support object-fit
*/
getImageStyle(fit) {
const {
imageWidth,
imageHeight
} = this;
const {
clientWidth: containerWidth,
clientHeight: containerHeight
} = this.$el;
if (!imageWidth || !imageHeight || !containerWidth || !containerHeight) return {};
const imageAspectRatio = imageWidth / imageHeight;
const containerAspectRatio = containerWidth / containerHeight;
if (fit === ObjectFit.SCALE_DOWN) {
const isSmaller = imageWidth < containerWidth && imageHeight < containerHeight;
fit = isSmaller ? ObjectFit.NONE : ObjectFit.CONTAIN;
}
switch (fit) {
case ObjectFit.NONE:
return {
width: this.width + '% !important',
height: 'auto'
};
case ObjectFit.CONTAIN:
return imageAspectRatio < containerAspectRatio ? {
width: this.width + '% !important'
} : {
height: 'auto',
width: this.width + '% !important'
};
case ObjectFit.COVER:
return imageAspectRatio < containerAspectRatio ? {
width: this.width + '% !important'
} : {
width: 'auto',
width: this.width + '% !important'
};
default:
return {
width: this.width + '% !important'
};
}
},
clickHandler(isByTitle) {
// don't show viewer when preview is false
if (!this.preview) {
return;
}
if (this.clickEffect === 'dian-ji-fang-da') {
let imgList = [];
this.previewSrcList.map((item, index) => {
imgList.push({
url: item,
title: this.title[index]
});
});
this.$EventBus.$emit('learningStatistics', {
type: 'image',
info: null
});
this.$xmlImgPreview({
multiple: true,
nowImgIndex: this.current,
imgList
});
}
if (isByTitle) {
this.$emit('onBottomTitleClick');
}
}
}
};
function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
if (typeof shadowMode !== 'boolean') {
createInjectorSSR = createInjector;
createInjector = shadowMode;
shadowMode = false;
}
// Vue.extend constructor export interop.
const options = typeof script === 'function' ? script.options : script;
// render functions
if (template && template.render) {
options.render = template.render;
options.staticRenderFns = template.staticRenderFns;
options._compiled = true;
// functional template
if (isFunctionalTemplate) {
options.functional = true;
}
}
// scopedId
if (scopeId) {
options._scopeId = scopeId;
}
let hook;
if (moduleIdentifier) {
// server build
hook = function (context) {
// 2.3 injection
context = context ||
// cached call
this.$vnode && this.$vnode.ssrContext ||
// stateful
this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext; // functional
// 2.2 with runInNewContext: true
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__;
}
// inject component styles
if (style) {
style.call(this, createInjectorSSR(context));
}
// register component module identifier for async chunk inference
if (context && context._registeredComponents) {
context._registeredComponents.add(moduleIdentifier);
}
};
// used by ssr in case component is cached and beforeCreate
// never gets called
options._ssrRegister = hook;
} else if (style) {
hook = shadowMode ? function (context) {
style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
} : function (context) {
style.call(this, createInjector(context));
};
}
if (hook) {
if (options.functional) {
// register for functional component in vue file
const originalRender = options.render;
options.render = function renderWithStyleInjection(h, context) {
hook.call(context);
return originalRender(h, context);
};
} else {
// inject component registration as beforeCreate hook
const existing = options.beforeCreate;
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
}
}
return script;
}
/* script */
const __vue_script__$d = script$d;
/* template */
var __vue_render__$e = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c(
"div",
{
ref: "placeholder",
staticClass: "el-image",
staticStyle: { "{\n width": "100px" },
},
[
_vm.self && _vm.self.title && _vm.showTitle && _vm.titlePosition === "on"
? _c(
"div",
{
staticClass: "xml-image-title image-title--lay image-title--on",
style: { textAlign: _vm.titleAlign || "left" },
},
[_vm._v("\n " + _vm._s(_vm.self.title) + "\n ")]
)
: _vm._e(),
_vm._v(" "),
_vm.loading
? _vm._t("placeholder", function () {
return [
_c(
"div",
{
staticStyle: {
width: "100%",
display: "flex",
"justify-content": "center",
},
},
[
_c(
"div",
{
staticClass: "el-image__placeholder",
style: _vm.placeholderStyle,
},
[_c("i", { staticClass: "el-icon-loading" })]
),
]
),
]
})
: _c(
"img",
_vm._g(
_vm._b(
{
staticClass: "el-image__inner",
class: {
"el-image__inner--center": _vm.alignCenter,
"el-image__preview": _vm.preview,
},
style: _vm.imageStyle,
attrs: { src: _vm.src },
on: { click: _vm.clickHandler },
},
"img",
_vm.$attrs,
false
),
_vm.$listeners
)
),
_vm._v(" "),
_vm.self &&
_vm.self.title &&
_vm.showTitle &&
_vm.titlePosition === "bottom"
? _c(
"div",
{
staticClass:
"xml-image-title image-title--fixed image-title--bottom",
style: { textAlign: _vm.titleAlign || "left" },
on: {
click: function ($event) {
return _vm.clickHandler(1)
},
},
},
[_vm._v("\n " + _vm._s(_vm.self.title) + "\n ")]
)
: _vm._e(),
_vm._v(" "),
_vm.self && _vm.self.title && _vm.showTitle && _vm.titlePosition === "top"
? _c(
"div",
{
staticClass:
"xml-image-title image-title--fixed image-title--top",
style: { textAlign: _vm.titleAlign || "left" },
on: {
click: function ($event) {
return _vm.clickHandler(1)
},
},
},
[_vm._v("\n " + _vm._s(_vm.self.title) + "\n ")]
)
: _vm._e(),
_vm._v(" "),
_vm.self &&
_vm.self.title &&
_vm.showTitle &&
_vm.titlePosition === "under"
? _c(
"div",
{
staticClass:
"xml-image-title image-title--lay image-title--under",
style: { textAlign: _vm.titleAlign || "left" },
},
[_vm._v("\n " + _vm._s(_vm.self.title) + "\n ")]
)
: _vm._e(),
],
2
)
};
var __vue_staticRenderFns__$d = [];
__vue_render__$e._withStripped = true;
/* style */
const __vue_inject_styles__$d = undefined;
/* scoped */
const __vue_scope_id__$d = "data-v-5aa11cb0";
/* module identifier */
const __vue_module_identifier__$d = undefined;
/* functional template */
const __vue_is_functional_template__$d = false;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__$d = /*#__PURE__*/normalizeComponent(
{ render: __vue_render__$e, staticRenderFns: __vue_staticRenderFns__$d },
__vue_inject_styles__$d,
__vue_script__$d,
__vue_scope_id__$d,
__vue_is_functional_template__$d,
__vue_module_identifier__$d,
false,
undefined,
undefined,
undefined
);
let hasModal = false;
let hasInitZIndex = false;
let zIndex;
const getModal = function () {
if (Vue.prototype.$isServer) return;
let modalDom = PopupManager.modalDom;
if (modalDom) {
hasModal = true;
} else {
hasModal = false;
modalDom = document.createElement('div');
PopupManager.modalDom = modalDom;
modalDom.addEventListener('touchmove', function (event) {
event.preventDefault();
event.stopPropagation();
});
modalDom.addEventListener('click', function () {
PopupManager.doOnModalClick && PopupManager.doOnModalClick();
});
}
return modalDom;
};
const instances = {};
const PopupManager = {
modalFade: true,
getInstance: function (id) {
return instances[id];
},
register: function (id, instance) {
if (id && instance) {
instances[id] = instance;
}
},
deregister: function (id) {
if (id) {
instances[id] = null;
delete instances[id];
}
},
nextZIndex: function () {
return PopupManager.zIndex++;
},
modalStack: [],
doOnModalClick: function () {
const topItem = PopupManager.modalStack[PopupManager.modalStack.length - 1];
if (!topItem) return;
const instance = PopupManager.getInstance(topItem.id);
if (instance && instance.closeOnClickModal) {
instance.close();
}
},
openModal: function (id, zIndex, dom, modalClass, modalFade) {
if (Vue.prototype.$isServer) return;
if (!id || zIndex === undefined) return;
this.modalFade = modalFade;
const modalStack = this.modalStack;
for (let i = 0, j = modalStack.length; i < j; i++) {
const item = modalStack[i];
if (item.id === id) {
return;
}
}
const modalDom = getModal();
addClass(modalDom, 'v-modal');
if (this.modalFade && !hasModal) {
addClass(modalDom, 'v-modal-enter');
}
if (modalClass) {
let classArr = modalClass.trim().split(/\s+/);
classArr.forEach(item => addClass(modalDom, item));
}
setTimeout(() => {
removeClass(modalDom, 'v-modal-enter');
}, 200);
if (dom && dom.parentNode && dom.parentNode.nodeType !== 11) {
dom.parentNode.appendChild(modalDom);
} else {
document.body.appendChild(modalDom);
}
if (zIndex) {
modalDom.style.zIndex = zIndex;
}
modalDom.tabIndex = 0;
modalDom.style.display = '';
this.modalStack.push({
id: id,
zIndex: zIndex,
modalClass: modalClass
});
},
closeModal: function (id) {
const modalStack = this.modalStack;
const modalDom = getModal();
if (modalStack.length > 0) {
const topItem = modalStack[modalStack.length - 1];
if (topItem.id === id) {
if (topItem.modalClass) {
let classArr = topItem.modalClass.trim().split(/\s+/);
classArr.forEach(item => removeClass(modalDom, item));
}
modalStack.pop();
if (modalStack.length > 0) {
modalDom.style.zIndex = modalStack[modalStack.length - 1].zIndex;
}
} else {
for (let i = modalStack.length - 1; i >= 0; i--) {
if (modalStack[i].id === id) {
modalStack.splice(i, 1);
break;
}
}
}
}
if (modalStack.length === 0) {
if (this.modalFade) {
addClass(modalDom, 'v-modal-leave');
}
setTimeout(() => {
if (modalStack.length === 0) {
if (modalDom.parentNode) modalDom.parentNode.removeChild(modalDom);
modalDom.style.display = 'none';
PopupManager.modalDom = undefined;
}
removeClass(modalDom, 'v-modal-leave');
}, 200);
}
}
};
Object.defineProperty(PopupManager, 'zIndex', {
configurable: true,
get() {
if (!hasInitZIndex) {
zIndex = zIndex || (Vue.prototype.$ELEMENT || {}).zIndex || 2000;
hasInitZIndex = true;
}
return zIndex;
},
set(value) {
zIndex = value;
}
});
const getTopPopup = function () {
if (Vue.prototype.$isServer) return;
if (PopupManager.modalStack.length > 0) {
const topPopup = PopupManager.modalStack[PopupManager.modalStack.length - 1];
if (!topPopup) return;
const instance = PopupManager.getInstance(topPopup.id);
return instance;
}
};
if (!Vue.prototype.$isServer) {
// handle `esc` key when the popup is shown
window.addEventListener('keydown', function (event) {
if (event.keyCode === 27) {
const topPopup = getTopPopup();
if (topPopup && topPopup.closeOnPressEscape) {
topPopup.handleClose ? topPopup.handleClose() : topPopup.handleAction ? topPopup.handleAction('cancel') : topPopup.close();
}
}
});
}
//
isFirefox() ? 'DOMMouseScroll' : 'mousewheel';
/* script */
/* template */
var __vue_render__$d = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("transition", { attrs: { name: "viewer-fade" } }, [
_c(
"div",
{
ref: "el-image-viewer__wrapper",
staticClass: "el-image-viewer__wrapper",
style: { "z-index": _vm.viewerZIndex },
attrs: { tabindex: "-1" },
},
[
_c("div", {
staticClass: "el-image-viewer__mask",
on: {
click: function ($event) {
if ($event.target !== $event.currentTarget) {
return null
}
return _vm.handleMaskClick.apply(null, arguments)
},
},
}),
_vm._v(" "),
_c(
"span",
{
staticClass: "el-image-viewer__btn el-image-viewer__close",
on: { click: _vm.hide },
},
[_c("i", { staticClass: "el-icon-close" })]
),
_vm._v(" "),
_c(
"div",
{ staticClass: "el-image-viewer__btn el-image-viewer__actions" },
[
_c("div", { staticClass: "el-image-viewer__actions__inner" }, [
!_vm.isSingle
? _c("i", {
class: [
"el-icon-arrow-left",
!_vm.infinite && _vm.isFirst ? "is-disabled" : "",
],
on: { click: _vm.prev },
})
: _vm._e(),
_vm._v(" "),
_c("i", {
staticClass: "el-icon-zoom-out",
on: {
click: function ($event) {
return _vm.handleActions("zoomOut")
},
},
}),
_vm._v(" "),
_c("i", {
staticClass: "el-icon-zoom-in",
on: {
click: function ($event) {
return _vm.handleActions("zoomIn")
},
},
}),
_vm._v(" "),
_c("i", { staticClass: "el-image-viewer__actions__divider" }),
_vm._v(" "),
_c("i", { class: _vm.mode.icon, on: { click: _vm.toggleMode } }),
_vm._v(" "),
_c("i", { staticClass: "el-image-viewer__actions__divider" }),
_vm._v(" "),
_c("i", {
staticClass: "el-icon-refresh-left",
on: {
click: function ($event) {
return _vm.handleActions("anticlocelise")
},
},
}),
_vm._v(" "),
_c("i", {
staticClass: "el-icon-refresh-right",
on: {
click: function ($event) {
return _vm.handleActions("clocelise")
},
},
}),
_vm._v(" "),
!_vm.isSingle
? _c("i", {
class: [
"el-icon-arrow-right",
!_vm.infinite && _vm.isLast ? "is-disabled" : "",
],
on: { click: _vm.next },
})
: _vm._e(),
]),
]
),
_vm._v(" "),
_vm.title.length && _vm.title[_vm.index]
? _c(
"div",
{ staticClass: "el-image-viewer__btn el-image-viewer__title" },
[
_vm._v(
"\n " +
_vm._s(_vm.title.length ? _vm.title[_vm.index] : "") +
"\n "
),
]
)
: _vm._e(),
_vm._v(" "),
_vm.contents.length && _vm.contents[_vm.index]
? _c(
"div",
{ staticClass: "el-image-viewer__btn el-image-viewer__content" },
[
_c(
"el-collapse-transition",
{ attrs: { name: "el-fade-in" } },
[
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.ellipsisReady,
expression: "ellipsisReady",
},
],
class: [
"ellipsis-box",
_vm.contentExpand ? "" : "text-ellipsis-3",
],
},
[
_vm._v(
"\n " +
_vm._s(
_vm.contents.length ? _vm.contents[_vm.index] : ""
) +
"\n "
),
]
),
]
),
_vm._v(" "),
_c(
"el-button",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.showEllipsisButton,
expression: "showEllipsisButton",
},
],
attrs: { type: "text", size: "mini" },
on: { click: _vm.toggleEllipsis },
},
[
_vm._v(_vm._s(_vm.contentExpand ? "收起" : "展开")),
_c("i", {
class: _vm.contentExpand
? "el-icon-arrow-up"
: "el-icon-arrow-down",
}),
]
),
],
1
)
: _vm._e(),
_vm._v(" "),
_c(
"div",
{ staticClass: "el-image-viewer__canvas" },
_vm._l(_vm.urlList, function (url, i) {
return i === _vm.index
? _c("img", {
key: url,
ref: "img",
refInFor: true,
staticClass: "el-image-viewer__img",
style: _vm.imgStyle,
attrs: { src: _vm.currentImg },
on: {
load: _vm.handleImgLoad,
error: _vm.handleImgError,
mousedown: _vm.handleMouseDown,
touchstart: _vm.touchstart,
touchmove: _vm.touchmove,
},
})
: _vm._e()
}),
0
),
]
),
])
};
__vue_render__$d._withStripped = true;
/* istanbul ignore next */
__vue_component__$d.install = function (Vue) {
Vue.component(__vue_component__$d.name, __vue_component__$d);
};
//
/***
* 文本块
*/
var script$c = {
name: 'XmlImageRender',
components: {
previewImageRender: __vue_component__$d
},
props: {
//模式：preview 预览 (默认)，editor 编辑
mode: {
type: String,
default: function () {
return 'editor';
}
},
pBlockData: {
type: Object,
default: function () {
return {};
}
},
//块儿数据名
blockDataName: String,
//页面类型，取值h5、pc、pad
pageType: {
type: String,
default: 'h5'
},
resourceBasisPath: {
type: String,
default: ''
},
//当前所处组的规则
currentRule: {
type: Object,
default: function () {
return {};
}
},
ruleIndex: Number,
extendParams: {
type: Object,
default: function () {
return {};
}
},
showTitle: {
type: Boolean,
default: false
}
},
data() {
return {
// image,
// noImage,
previewKey: Math.random(),
blockId: `blockId${Math.random()}`,
//当前块儿数据，一般用不到，因为一般的块儿中不会在块儿内更改数据
blockData: {
imageMode: 'dan-tu',
showEffect: 'hua-lang',
clickEffect: 'wu',
titlePosition: 'under',
// width: 100,
titleAlign: 'left',
imageList: [{
source: 'upload',
//来源：上传，素材
uploadFileUrl: '',
title: '',
content: '',
href: '' //跳转链接
}]
},
carouselActiveIndex: 0,
//属性组件名
propertyComponentsName: 'xml-image-property',
currentPreviewList: [],
carouselHeight: '',
currentIndex: -1
};
},
computed: {
blockPreviewList() {
let images = this.blockData.imageList || [],
list = [];
images.map(item => {
let src = this.resourceBasisPath ? this.resourceBasisPath + item.uploadFileUrl.split('./')[1] : item.uploadFileUrl;
list.push(src);
});
return this.blockData.imageMode == 'dan-tu' ? [list[0]] : list;
},
blockPreviewTitleList() {
let images = this.blockData.imageList || [],
list = [];
images.map(item => {
list.push(item.title);
});
return this.blockData.imageMode == 'dan-tu' ? [list[0]] : list;
},
blockPreviewContentList() {
let images = this.blockData.imageList || [],
list = [];
images.map(item => {
list.push(item.content || '');
});
return this.blockData.imageMode == 'dan-tu' ? [list[0]] : list;
},
indicatorText() {
let allNum = this.blockData.imageList.length;
return `${this.carouselActiveIndex + 1} / ${allNum}`;
},
carouselActiveTitle() {
return this.blockData.imageList[this.carouselActiveIndex].title || '';
},
carouselActiveItem() {
return this.blockData.imageList[this.carouselActiveIndex] || {};
},
allHaveNoTitle() {
let has = false;
this.blockData.imageList.forEach(item => {
if (item.title) {
has = true;
}
});
return !has;
}
},
watch: {
pBlockData: {
handler(newValue) {
this.$nextTick(() => {
this.blockData = Object.assign({}, this.blockData, newValue);
});
},
deep: true,
immediate: true
},
'blockData.showEffect': {
handler(newValue) {
if (newValue === 'lun-bo') {
this.setCarouselHeight();
}
},
deep: true,
immediate: true
}
},
updated() {},
methods: {
// 此方法必须要，用户注册块儿点击事件
blockClick() {
this.$emit('blockclick', {
blockData: this.blockData,
dataName: this.blockDataName,
propertyComponentsName: this.propertyComponentsName,
blockId: this.blockId,
ruleIndex: this.ruleIndex
});
},
imageClick({
source,
uploadFileUrl,
title,
link,
content,
href,
businessType,
linkId,
cIndex
}, imgList) {
if (this.mode === 'editor') return;
console.log('??????????????????', linkId, cIndex);
if (cIndex !== undefined) {
this.currentIndex = cIndex;
}
if (this.blockData.clickEffect === 'dian-ji-fang-da') ; else if (this.blockData.clickEffect === 'dian-ji-tiao-zhuan') {
//点击跳转
// window.href = href
if (linkId) {
// window.open(link, '_blank')
window.open(process.env.VUE_APP_TEXTBOOK_WEB + 'previewLooseLeaf?pageType=' + this.pageType + '&businessType=looseLeaf' + '&looseLeafId=' + linkId + '&uuid=' + v4() + '&styleType=' + 'B', '_blank');
} else {
this.$message.warning('获取资源链接失败，请检查链接地址');
}
}
},
setImage(image) {
let imageEle = image.path[0];
let {
naturalWidth,
naturalHeight
} = imageEle;
let renderWidth = naturalWidth / (naturalHeight / 200);
image.path[0].style.width = `${renderWidth}px`;
},
setActiveImageIndex(current) {
this.carouselActiveIndex = current;
},
setCarouselHeight() {
// 获取容器宽度以16:9计算高度并设置
let containerRect = this.$refs.carouselContainer ? this.$refs.carouselContainer.getBoundingClientRect() : {
width: 568
};
this.carouselHeight = parseInt(containerRect.width / 16 * 9) + 'px';
},
clickImg() {
this.$emit('clickImg');
}
},
mounted() {
this.setCarouselHeight();
}
};
/* script */
const __vue_script__$c = script$c;
/* template */
var __vue_render__$c = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c(
"div",
{
ref: "carouselContainer",
class:
"xml-image-container-" +
_vm.pageType +
" image-container " +
(_vm.blockData.showEffect === "hua-lang"
? "hua-lang-image-container"
: ""),
attrs: { id: _vm.blockId },
on: { click: _vm.blockClick },
},
[
_vm.blockData.imageList.length > 0
? [
_vm.blockData.imageMode == "dan-tu"
? _c(
"div",
{ staticClass: "xml-image-dan-tu" },
[
_c("preview-image-render", {
class: "xml-image-dan-tu-" + _vm.pageType,
attrs: {
src: _vm.blockData.imageList[0].uploadFileUrl
? _vm.blockData.imageList[0].uploadFileUrl.indexOf(
"./"
) != -1
? _vm.resourceBasisPath +
_vm.blockData.imageList[0].uploadFileUrl.split(
"./"
)[1]
: _vm.blockData.imageList[0].uploadFileUrl
: "",
mode: _vm.mode,
showTitle: _vm.showTitle,
pageType: _vm.pageType,
"preview-text": _vm.blockPreviewTitleList,
contents: _vm.blockPreviewContentList,
current: 0,
previewSrcList: _vm.blockPreviewList,
clickEffect: _vm.blockData.clickEffect,
width: _vm.blockData.width,
},
on: {
click: function ($event) {
return _vm.imageClick(_vm.blockData.imageList[0])
},
},
}),
],
1
)
: _vm._e(),
_vm._v(" "),
_vm.blockData.imageMode == "duo-tu"
? _c(
"div",
{
staticClass: "xml-image-duo-tu",
class: "xml-image-duo-tu " + _vm.blockData.showEffect,
},
[
_vm.blockData.showEffect === "hua-lang"
? _c(
"div",
{
class: [
"xml-image-hualang",
_vm.allHaveNoTitle ? "no-title" : "",
],
on: {
touchstart: _vm.clickImg,
mousedown: _vm.clickImg,
},
},
_vm._l(
_vm.blockData.imageList,
function (item, index) {
return _c("preview-image-render", {
directives: [
{
name: "show",
rawName: "v-show",
value:
_vm.blockData.showEffect === "hua-lang",
expression:
"blockData.showEffect === 'hua-lang'",
},
],
key: index,
class: [
"xml-image-" +
_vm.blockData.showEffect +
"-" +
_vm.pageType,
"xml-image-hua-lang xml-group-item",
],
style: {
width: _vm.blockData.width
? (290 / 100) *
Number(_vm.blockData.width) +
"px"
: "290px",
height:
(_vm.blockData.galleryHeight || 290) + "px",
},
attrs: {
src: item.uploadFileUrl
? _vm.blockData.imageList[0].uploadFileUrl.indexOf(
"./"
) != -1
? _vm.resourceBasisPath +
item.uploadFileUrl.split("./")[1]
: item.uploadFileUrl
: "",
"preview-text": _vm.blockPreviewTitleList,
previewSrcList: _vm.blockPreviewList,
showTitle: _vm.showTitle,
pageType: _vm.pageType,
current: index,
title: _vm.blockPreviewTitleList,
contents: _vm.blockPreviewContentList,
currentIndex: _vm.currentIndex,
titlePosition: _vm.blockData.titlePosition,
titleAlign: _vm.blockData.titleAlign,
mode: _vm.mode,
self: item,
clickEffect: _vm.blockData.clickEffect,
width: _vm.blockData.width,
},
on: {
click: function ($event) {
return _vm.imageClick(
Object.assign({}, item, {
cIndex: index,
}),
_vm.blockData
)
},
onBottomTitleClick: function ($event) {
return _vm.imageClick(item, _vm.blockData)
},
},
})
}
),
1
)
: _vm._e(),
_vm._v(" "),
_vm.blockData.showEffect === "ping-pu"
? _c(
"div",
{ staticClass: "xml-image-ping-pu" },
_vm._l(
_vm.blockData.imageList,
function (item, index) {
return _c("preview-image-render", {
key: index,
staticClass: "xml-group-item",
class:
"xml-image-" +
_vm.blockData.showEffect +
"-" +
_vm.pageType,
attrs: {
src: item.uploadFileUrl
? _vm.blockData.imageList[0].uploadFileUrl.indexOf(
"./"
) != -1
? _vm.resourceBasisPath +
item.uploadFileUrl.split("./")[1]
: item.uploadFileUrl
: "",
fit: "cover",
title: _vm.blockPreviewTitleList,
pageType: _vm.pageType,
contents: _vm.blockPreviewContentList,
currentIndex: _vm.currentIndex,
current: index,
showTitle: _vm.showTitle,
titlePosition: _vm.blockData.titlePosition,
titleAlign: _vm.blockData.titleAlign,
self: item,
mode: _vm.mode,
"preview-text": _vm.blockPreviewTitleList,
previewSrcList: _vm.blockPreviewList,
clickEffect: _vm.blockData.clickEffect,
width: _vm.blockData.width,
},
on: {
click: function ($event) {
return _vm.imageClick(
Object.assign({}, item, { cIndex: index })
)
},
onBottomTitleClick: function ($event) {
return _vm.imageClick(item, _vm.blockData)
},
},
})
}
),
1
)
: _vm._e(),
_vm._v(" "),
_vm.blockData.showEffect === "lun-bo"
? _c(
"div",
{ staticClass: "xml-image-lun-bo xml-group-item" },
[
_vm.showTitle &&
_vm.blockData.titlePosition === "on" &&
!_vm.allHaveNoTitle
? _c(
"div",
{
staticClass:
"image-title--lay image-title--on",
style: {
textAlign:
_vm.blockData.titleAlign || "left",
},
},
[
_vm._v(
"\n " +
_vm._s(_vm.carouselActiveTitle) +
"\n "
),
]
)
: _vm._e(),
_vm._v(" "),
_c(
"el-carousel",
{
ref: "imageCarousel",
attrs: {
height: _vm.carouselHeight,
arrow: "always",
loop: "",
"indicator-position": "none",
},
on: { change: _vm.setActiveImageIndex },
},
[
_vm._l(
_vm.blockData.imageList,
function (item, index) {
return _c(
"el-carousel-item",
{ key: index },
[
_c("img", {
style: {
width: _vm.blockData.width + "%",
},
attrs: {
src: item.uploadFileUrl
? _vm.blockData.imageList[0].uploadFileUrl.indexOf(
"./"
) != -1
? _vm.resourceBasisPath +
item.uploadFileUrl.split(
"./"
)[1]
: item.uploadFileUrl
: "",
},
on: {
click: function ($event) {
return _vm.imageClick(item)
},
},
}),
]
)
}
),
_vm._v(" "),
_c(
"div",
{
class: [
"custom-indicator",
_vm.blockData.titlePosition === "bottom"
? "withBottomTitle"
: _vm.blockData.titlePosition === "top"
? "withTopTitle"
: "",
],
},
[
_vm._v(
"\n " +
_vm._s(_vm.indicatorText) +
"\n "
),
]
),
_vm._v(" "),
_vm.showTitle &&
_vm.blockData.titlePosition === "bottom" &&
_vm.carouselActiveTitle
? _c(
"div",
{
staticClass:
"image-title--fixed image-title--bottom",
style: {
textAlign:
_vm.blockData.titleAlign || "left",
},
on: {
click: function ($event) {
return _vm.imageClick(
_vm.carouselActiveItem
)
},
},
},
[
_vm._v(
"\n " +
_vm._s(_vm.carouselActiveTitle) +
"\n "
),
]
)
: _vm._e(),
_vm._v(" "),
_vm.showTitle &&
_vm.blockData.titlePosition === "top" &&
_vm.carouselActiveTitle
? _c(
"div",
{
staticClass:
"image-title--fixed image-title--top",
style: {
textAlign:
_vm.blockData.titleAlign || "left",
},
on: {
click: function ($event) {
return _vm.imageClick(
_vm.carouselActiveItem
)
},
},
},
[
_vm._v(
"\n " +
_vm._s(_vm.carouselActiveTitle) +
"\n "
),
]
)
: _vm._e(),
],
2
),
_vm._v(" "),
_vm.showTitle &&
_vm.blockData.titlePosition === "under" &&
!_vm.allHaveNoTitle
? _c(
"div",
{
staticClass:
"xml-image-title image-title--lay image-title--under",
style: {
textAlign:
_vm.blockData.titleAlign || "left",
},
},
[
_vm._v(
"\n " +
_vm._s(_vm.carouselActiveTitle) +
"\n "
),
]
)
: _vm._e(),
],
1
)
: _vm._e(),
]
)
: _vm._e(),
]
: [
_c(
"div",
{ staticClass: "xml-noimage-container" },
[
_c("el-image", {
staticClass: "xml-noimage",
class: "xml-image-dan-tu-" + _vm.pageType,
attrs: {
src: "../../../../static/images/defaultCover/no-image.png",
fit: "cover",
},
}),
],
1
),
],
],
2
)
};
var __vue_staticRenderFns__$c = [];
__vue_render__$c._withStripped = true;
/* style */
const __vue_inject_styles__$c = undefined;
/* scoped */
const __vue_scope_id__$c = undefined;
/* module identifier */
const __vue_module_identifier__$c = undefined;
/* functional template */
const __vue_is_functional_template__$c = false;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__$c = /*#__PURE__*/normalizeComponent(
{ render: __vue_render__$c, staticRenderFns: __vue_staticRenderFns__$c },
__vue_inject_styles__$c,
__vue_script__$c,
__vue_scope_id__$c,
__vue_is_functional_template__$c,
__vue_module_identifier__$c,
false,
undefined,
undefined,
undefined
);
var singleGroupMixin = {
props: {
activeIndex: {
type: Number,
default: -1
},
location: {
type: String,
default: ''
},
islast: {
type: Boolean,
default: false
}
},
provide() {
return {
getSingleGroupLocation: () => this.location
};
},
computed: {
groupIsActive() {
return this.ruleIndex === this.activeIndex;
}
},
watch: {
pGroupData: {
handler() {
if (this.pGroupData.options?.marginTop !== undefined && this.pGroupData.options.marginTop !== -1) {
this.$nextTick(() => {
this.$el && this.$el.style.setProperty('--book-marginTop', this.pGroupData.options.marginTop + 'px');
});
}
},
deep: true,
immediate: true
}
},
created() {
if (this.pGroupData.options?.marginTop === undefined) {
let options = this.pGroupData.options ? {
...this.pGroupData.options,
marginTop: -1
} : {
marginTop: -1
};
this.$emit('updateModel', {
key: 'pGroupData',
value: {
...this.pGroupData,
options
}
});
}
},
mounted() {
if (this.islast) {
this.$nextTick(() => {
this.$EventBus.$emit('mounted_success');
});
}
},
methods: {
emitClick(e) {
this.$emit('click', e, this.ruleIndex, this.currentRule);
}
}
};
//
var script$b = {
mixins: [singleGroupMixin],
name: 'imageTextEighthRender',
isUnPrefix: true,
components: {
XmlImageRender: __vue_component__$c
},
props: {
//模式：preview 预览 (默认)，editor 编辑
mode: {
type: String,
default: function () {
return 'editor';
}
},
//必须有此属性，接收初始化值
pGroupData: {
type: Object,
default: function () {
return {};
}
},
//当前所处组的规则
currentRule: {
type: Object,
default: function () {
return {};
}
},
ruleIndex: Number,
//必须有此属性，页面类型，取值h5、pc、pad
pageType: {
type: String,
default: 'h5'
},
resourceBasisPath: {
type: String,
default: ''
},
extendParams: {
type: Object,
default: function () {
return {};
}
}
},
data() {
return {
typeText: '图文',
//定义此变量，是为了解决页面中有多个块儿的情况。
titleTextDataName: 'titleTextData',
bodyTextDataName: 'bodyTextData',
imageBlockDataName: 'imageData',
numberTextDataName: 'numberTextData',
groupData: {}
};
},
created() {
this.groupData = this.pGroupData;
},
mounted() {},
methods: {
//
/***
* 固定方法。接收固定参数
* 此方法接收块儿点击事件，事件传递块相关参数
* @param blockData 块中的data属性数据
* @param dataName 块data数据在组中时，属性key
* @param propertyComponentsName 块儿对应的属性组件名
*/
handleBlockClick({
blockData,
dataName,
propertyComponentsName,
blockId,
ruleIndex
}) {
this.$emit('blockclick', {
groupData: this.groupData,
blockData,
dataName,
propertyComponentsName,
currentRule: this.currentRule,
blockId,
ruleIndex
});
},
groupDataChange({
ruleIndex,
dataName,
data
}) {
this.$emit('groupDataChange', {
ruleIndex,
dataName,
data
});
}
}
};
/* script */
const __vue_script__$b = script$b;
/* template */
var __vue_render__$b = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c(
"div",
{
staticClass: "parent-group parent-group-mark",
class: [
"xml-text-image-eighth-" + _vm.pageType,
_vm.groupIsActive ? "active" : "",
],
on: { click: _vm.emitClick },
},
[
_c(
"xml-group-render",
{
ref: "xmlGroup",
attrs: {
"page-type": _vm.pageType,
mode: _vm.mode,
"type-text": _vm.typeText,
"rule-index": _vm.ruleIndex,
},
scopedSlots: _vm._u(
[
{
key: "action-buttons",
fn: function () {
return [_vm._t("default")]
},
proxy: true,
},
],
null,
true
),
},
[
_vm._v(" "),
_c(
"div",
{ staticClass: "iamge-bg-box" },
[
_c("xml-image-render", {
attrs: {
"p-block-data": _vm.groupData[_vm.imageBlockDataName],
"block-data-name": _vm.imageBlockDataName,
"extend-params": _vm.extendParams,
"current-rule": _vm.currentRule,
"rule-index": _vm.ruleIndex,
"container-class": "image-container",
mode: _vm.mode,
"page-type": _vm.pageType,
resourceBasisPath: _vm.resourceBasisPath,
},
on: { blockclick: _vm.handleBlockClick },
}),
],
1
),
]
),
],
1
)
};
var __vue_staticRenderFns__$b = [];
__vue_render__$b._withStripped = true;
/* style */
const __vue_inject_styles__$b = undefined;
/* scoped */
const __vue_scope_id__$b = "data-v-9094a8a8";
/* module identifier */
const __vue_module_identifier__$b = undefined;
/* functional template */
const __vue_is_functional_template__$b = false;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__$b = /*#__PURE__*/normalizeComponent(
{ render: __vue_render__$b, staticRenderFns: __vue_staticRenderFns__$b },
__vue_inject_styles__$b,
__vue_script__$b,
__vue_scope_id__$b,
__vue_is_functional_template__$b,
__vue_module_identifier__$b,
false,
undefined,
undefined,
undefined
);
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var script$a = {
name: 'XmlTextDialogRender',
props: {
content: {
type: String,
default: ''
},
textstyle: {
type: String,
default: 'A'
},
pageType: {
type: String,
default: 'h5'
},
resourceBasisPath: {
type: String,
default: ''
},
projectId: {
type: String,
default: ''
}
},
watch: {
content() {
this.show = false;
this.$nextTick(() => {
this.show = true;
});
}
},
data() {
return {
show: true,
source: ''
};
},
created() {
this.source = this.$route.query.pageType;
},
methods: {
formatImg(str) {
if (str) {
let data = str.replace(/![]()
]*src=['"]([^'"]+)[^>]*>/gi, (match, p1) => {
if (match.indexOf('style') !== -1) {
let src = this.resourceBasisPath + p1.split('./')[1];
let image = match.indexOf('http') !== -1 ? match : match.replace(p1, src);
return image.split('style="')[0] + 'style="max-width:100% !important;' + image.split('style="')[1];
} else {
return `
-1 ? p1 : this.resourceBasisPath + p1.split('./')[1]}' style="max-width:100%;" />`;
}
});
return data;
}
}
}
};
var __$_require_static_images_leaflet_icons_scroll_png__ = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAAAPCAYAAAChtYCSAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjkxMUYzODUxMkZFMTFFRThGNzY5QzE0NjRGQzZERjciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjkxMUYzODYxMkZFMTFFRThGNzY5QzE0NjRGQzZERjciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpCOTExRjM4MzEyRkUxMUVFOEY3NjlDMTQ2NEZDNkRGNyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpCOTExRjM4NDEyRkUxMUVFOEY3NjlDMTQ2NEZDNkRGNyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pgx/R5cAAAJ7SURBVHja7JpPaNNQHMe/L03TbuqUiehlKv456EE8KV5Ehn/Ag3/w4k1PXibuIljcwIKCiiAoO+lFRRARke2qKCh69KLzNIYbKG6Msbaza9o0z99LGywleYngpenvA1/ya36/95L8ml9e8hJz7Gw/dBzJvfTNa6QcKQuG6VwqpNuk/OtbZyKDTdIQaZh0ivStPSCVtnxzhJTm/DIdjrrAX1UFoonZT3pGuiNoBCmSsYZUJ82EtThx4+02zi2TFCZGB6dDXCnSlqZdNJvF4TtCiyCTXcVZZZJEnAt+nxm3N6tnNaeU6TpiF0gmywXCdGGBbNp5AFIKzE19AoQBq3cdhBAkdcclyecCroRl/Z28ki0diIBOZYtPhsRE9SVDfreujxsDTRtothlnvS4PUQT1234MQccYN7e6PsNyjojcIaCt1OxPnP//f+Quat/b2/b0bWzYdReuW/XOd8NMo2aX4dgl9A/sgZASojA/KyulRbwYGcSx4cfYvu84yoV5SNelxg7qTpVUw/rNu/hywiSGpZ9TSJkWYKS8AUEVR+/aDViYmcTz3EEcHXqIgb2HYH4eH4PZnMqdfPMEP75+gF0pwa051JaqykjTKCJx+OI9ziqTGD4+vU7ntuEViEGieyVvuVJY8PyzX95jefEX1DRvYzQStJDhg92FR985q0xieHB+6z8+pEv9naBdLnBWme57SI8baFeKnC2mKwtkmeTP4c6RfgcFOnaZ36QzSWJa41Nv0tU07pJ6BrlExmXSOdK79siT+Ve+WQV/i8UkgxrJGs+fDvPvJk2Q7qoR5H5TgTi1Fd+8SbpCynB+mQ7GRuNrXh3qo90dyvgjwAA2ZLfYDdkYOgAAAABJRU5ErkJggg==";
/* script */
const __vue_script__$a = script$a;
var __vue_render__$a = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("div", [
_vm.textstyle == "D"
? _c("div", [
_c("div", { staticClass: "style-body-boxA" }, [
_c("div", { staticClass: "style-wrapper" }, [
_c("div", { staticClass: "top-line" }),
_vm._v(" "),
_c("div", {
staticClass: "native-html-wrapper",
domProps: { innerHTML: _vm._s(_vm.formatImg(_vm.content)) },
}),
_vm._v(" "),
_c("div", { staticClass: "bottom-margin" }),
_vm._v(" "),
_c("div", { staticClass: "bottom-triangle" }),
]),
]),
])
: _vm._e(),
_vm._v(" "),
_vm.textstyle == "A"
? _c("div", [
_c("div", { staticClass: "style-body-boxA" }, [
_c("div", { staticClass: "top-bg" }),
_vm._v(" "),
_c("div", {
staticClass: "style-content-box",
domProps: { innerHTML: _vm._s(_vm.formatImg(_vm.content)) },
}),
_vm._v(" "),
_c("div", { staticClass: "paper-clip-icon" }),
_vm._v(" "),
_c("div", { staticClass: "style-content-bg" }),
]),
])
: _vm._e(),
_vm._v(" "),
_vm.textstyle == "B"
? _c("div", [
_c("div", { staticClass: "style-body-boxB" }, [
_c("div", { staticClass: "top-bg" }),
_vm._v(" "),
_c("div", {
staticClass: "style-content-box",
domProps: { innerHTML: _vm._s(_vm.formatImg(_vm.content)) },
}),
_vm._v(" "),
_c("div", { staticClass: "style-content-bg" }),
_vm._v(" "),
_vm._m(0),
]),
])
: _vm._e(),
_vm._v(" "),
_vm.textstyle == "C"
? _c("div", [
_c("div", { staticClass: "style-body-boxC" }, [
_c("div", { staticClass: "top-bg" }),
_vm._v(" "),
_c("div", {
staticClass: "style-content-box",
domProps: { innerHTML: _vm._s(_vm.formatImg(_vm.content)) },
}),
_vm._v(" "),
_c("div", { staticClass: "style-content-bg" }),
_vm._v(" "),
_vm._m(1),
]),
])
: _vm._e(),
_vm._v(" "),
_vm.textstyle == "E"
? _c("div", [
_c("div", { staticClass: "style-body-boxE" }, [
_c("div", { staticClass: "scroll-top" }, [
_c("img", {
style: _vm.pageType == "pc" ? "height:20px" : "",
attrs: {
src: __$_require_static_images_leaflet_icons_scroll_png__,
alt: "",
},
}),
]),
_vm._v(" "),
_c("div", {
staticClass: "style-content-box",
domProps: { innerHTML: _vm._s(_vm.formatImg(_vm.content)) },
}),
_vm._v(" "),
_c("div", { staticClass: "scroll-bottom" }, [
_c("img", {
style: _vm.pageType == "pc" ? "height:20px" : "",
attrs: {
src: __$_require_static_images_leaflet_icons_scroll_png__,
alt: "",
},
}),
]),
]),
])
: _vm._e(),
])
};
var __vue_staticRenderFns__$a = [
function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("div", { staticClass: "top-style-box" }, [
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
])
},
function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("div", { staticClass: "top-style-box" }, [
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
_vm._v(" "),
_c("div"),
])
},
];
__vue_render__$a._withStripped = true;
/* style */
const __vue_inject_styles__$a = undefined;
/* scoped */
const __vue_scope_id__$a = "data-v-5546d780";
/* module identifier */
const __vue_module_identifier__$a = undefined;
/* functional template */
const __vue_is_functional_template__$a = false;
/* style inject */
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__$a = /*#__PURE__*/normalizeComponent(
{ render: __vue_render__$a, staticRenderFns: __vue_staticRenderFns__$a },
__vue_inject_styles__$a,
__vue_script__$a,
__vue_scope_id__$a,
__vue_is_functional_template__$a,
__vue_module_identifier__$a,
false,
undefined,
undefined,
undefined
);
const reHtml = str => {
return str ? str.replace(/&((g|l|quo|ldquo|rdquo)t|amp|#39|nbsp);/g, function (m) {
return {
'<': '<',
'&': '&',
'"': '"',
'“': '“',
'”': '”',
'>': '>',
''': "'",
' ': ' '
}[m];
}) : '';
};
class MagicLink extends HTMLElement {
static get observedAttributes() {
return ['data-plaintext', 'data-type', 'data-title', 'data-content', 'data-isplaying'];
}
constructor() {
super();
this.createShadow();
setTimeout(() => {
this.insertContent();
});
}
createShadow() {
this.shadow = this.attachShadow({
mode: 'closed'
});
}
insertContent() {
const type = this.getAttribute('data-type');
const title = this.getAttribute('data-title');
const wrapper = document.createElement('span');
wrapper.setAttribute('class', `magic-link magic-link--${type}`);
wrapper.setAttribute('contenteditable', 'false');
wrapper.innerHTML = reHtml(title);
const style = document.createElement('style');
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF",'WCE内部样式连接',style.isConnected)
style.textContent = `
p {
margin: 0;
}
.magic-link {
display: inline;
font-size:16px;
font-weight: normal;
font-style: normal;
text-align: left;
text-indent: initial;
// color: #6883FA;
color: #00F;
transition: all 240ms ease-in-out;
cursor: pointer;
}
.magic-link span:hover {
text-decoration: underline;
}
.wifi-symbol {
display: inline-block;
width: 21px;
height: 21px;
box-sizing: border-box;
overflow: hidden;
vertical-align: text-bottom;
}
.wifi-symbol svg {
display:block;
}
.wifi-symbol.playing .play-path {
animation: fade-in 900ms cubic-bezier(0.43, 0.2, 0.56, 0.94) infinite;
}
@keyframes fadeInOut {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
`;
this.shadow.appendChild(style);
this.shadow.appendChild(wrapper);
if (type === 'audio') {
let audioExtra = document.createElement('div');
audioExtra.setAttribute('class', 'wifi-symbol');
audioExtra.innerHTML = `
`;
this.shadow.appendChild(audioExtra);
}
}
updateContent({
key,
oldValue,
newValue
}) {
let _this = this;
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF",'wce更新逻辑',[this],this.shadow)
const type = this.getAttribute('data-type');
this.getAttribute('data-title');
const content = this.getAttribute('data-content');
if (oldValue === null && newValue) {
// 首次加载
if (type === 'leaflet' && key === 'data-title') {
setTimeout(() => {
const links = this.shadow.querySelectorAll('.magic-link a');
this.shadow.querySelector('.magic-link.magic-link--leaflet');
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF",'wcce leflet', links, this.shadow)
links.forEach((elem, index) => {
elem.addEventListener('click', e => {
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF",'link内点击',e,elem)
_this.shadow.dispatchEvent(new CustomEvent('openTarget', {
detail: {
aid: elem.id,
aindex: index,
elem,
targets: content
}
}));
});
});
}, 50);
}
}
if (oldValue !== null && newValue) {
// 后续更新
if (type === 'audio') {
if (key === 'data-isplaying') {
let target = this.shadow.querySelector('.wifi-symbol');
let classNames = newValue === 'true' ? 'wifi-symbol playing' : 'wifi-symbol';
target.setAttribute('class', classNames);
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF", 'target', [target])
}
}
}
}
//生命周期 - 首次被插入文档 DOM 时
connectedCallback() {
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF",'WCE嵌入',)
// updateContent(this);
}
//生命周期 - 从文档 DOM 中删除时
disconnectedCallback() {
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF",'WCE销毁',)
}
//生命周期 - 被移动到新的文档时
adoptedCallback() {
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF",'WCE迁移',)
}
//生命周期 - 增加、删除、修改自身属性时
attributeChangedCallback(key, oldValue, newValue) {
// console.log("%c%s","font-size:2em;background: #00965E;color: #FFF",'WCE更新',{key, oldValue, newValue})
this.updateContent({
key,
oldValue,
newValue
});
}
}
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
function createCommonjsModule(fn, module) {
return module = { exports: {} }, fn(module, module.exports), module.exports;
}
var jquery = createCommonjsModule(function (module) {
/*!
* jQuery JavaScript Library v3.7.1
* https://jquery.com/
*
* Copyright OpenJS Foundation and other contributors
* Released under the MIT license
* https://jquery.org/license
*
* Date: 2023-08-28T13:37Z
*/
(function (global, factory) {
{
// For CommonJS and CommonJS-like environments where a proper `window`
// is present, execute the factory and get jQuery.
// For environments that do not have a `window` with a `document`
// (such as Node.js), expose a factory as module.exports.
// This accentuates the need for the creation of a real `window`.
// e.g. var jQuery = require("jquery")(window);
// See ticket trac-14549 for more info.
module.exports = global.document ? factory(global, true) : function (w) {
if (!w.document) {
throw new Error("jQuery requires a window with a document");
}
return factory(w);
};
}
// Pass this if window is not defined yet
})(typeof window !== "undefined" ? window : commonjsGlobal, function (window, noGlobal) {
var arr = [];
var getProto = Object.getPrototypeOf;
var slice = arr.slice;
var flat = arr.flat ? function (array) {
return arr.flat.call(array);
} : function (array) {
return arr.concat.apply([], array);
};
var push = arr.push;
var indexOf = arr.indexOf;
var class2type = {};
var toString = class2type.toString;
var hasOwn = class2type.hasOwnProperty;
var fnToString = hasOwn.toString;
var ObjectFunctionString = fnToString.call(Object);
var support = {};
var isFunction = function isFunction(obj) {
// Support: Chrome <=57, Firefox <=52
// In some browsers, typeof returns "function" for HTML