@ -1,28 +0,0 @@ |
|||||||
<template> |
|
||||||
<!-- '<audio/>' 组件不再维护,建议使用能力更强的 'uni.createInnerAudioContext' 接口 有时间再改--> |
|
||||||
<!--增加audio标签支持--> |
|
||||||
<audio |
|
||||||
:id="node.attr.id" |
|
||||||
:class="node.classStr" |
|
||||||
:style="node.styleStr" |
|
||||||
:src="node.attr.src" |
|
||||||
:loop="node.attr.loop" |
|
||||||
:poster="node.attr.poster" |
|
||||||
:name="node.attr.name" |
|
||||||
:author="node.attr.author" |
|
||||||
controls></audio> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
export default { |
|
||||||
name: 'wxParseAudio', |
|
||||||
props: { |
|
||||||
node: { |
|
||||||
type: Object, |
|
||||||
default() { |
|
||||||
return {}; |
|
||||||
}, |
|
||||||
}, |
|
||||||
}, |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,94 +0,0 @@ |
|||||||
<template> |
|
||||||
<image |
|
||||||
:mode="node.attr.mode" |
|
||||||
:lazy-load="node.attr.lazyLoad" |
|
||||||
:class="node.classStr" |
|
||||||
:style="newStyleStr || node.styleStr" |
|
||||||
:data-src="node.attr.src" |
|
||||||
:src="node.attr.src" |
|
||||||
@tap="wxParseImgTap" |
|
||||||
@load="wxParseImgLoad" |
|
||||||
/> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
export default { |
|
||||||
name: 'wxParseImg', |
|
||||||
data() { |
|
||||||
return { |
|
||||||
newStyleStr: '', |
|
||||||
preview: true |
|
||||||
}; |
|
||||||
}, |
|
||||||
inject: ['parseWidth'], |
|
||||||
mounted() {}, |
|
||||||
props: { |
|
||||||
node: { |
|
||||||
type: Object, |
|
||||||
default() { |
|
||||||
return {}; |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
|
|
||||||
methods: { |
|
||||||
wxParseImgTap(e) { |
|
||||||
if (!this.preview) return; |
|
||||||
const { src } = e.currentTarget.dataset; |
|
||||||
if (!src) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while (!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
// TODO 遍历获取父节点执行方法 |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.preview(src, e); |
|
||||||
}, |
|
||||||
// 图片视觉宽高计算函数区 |
|
||||||
wxParseImgLoad(e) { |
|
||||||
const { src } = e.currentTarget.dataset; |
|
||||||
if (!src) return; |
|
||||||
let { width, height } = e.mp.detail; |
|
||||||
|
|
||||||
const recal = this.wxAutoImageCal(width, height); |
|
||||||
|
|
||||||
const { imageheight, imageWidth } = recal; |
|
||||||
const { padding, mode } = this.node.attr;//删除padding |
|
||||||
// const { mode } = this.node.attr; |
|
||||||
|
|
||||||
const { styleStr } = this.node; |
|
||||||
const imageHeightStyle = mode === 'widthFix' ? '' : `height: ${imageheight}px;`; |
|
||||||
|
|
||||||
this.newStyleStr = `${styleStr}; ${imageHeightStyle}; width: ${imageWidth}px; padding: 0 ${+padding}px;`;//删除padding |
|
||||||
// this.newStyleStr = `${styleStr}; ${imageHeightStyle}; width: ${imageWidth}px;`; |
|
||||||
}, |
|
||||||
// 计算视觉优先的图片宽高 |
|
||||||
wxAutoImageCal(originalWidth, originalHeight) { |
|
||||||
// 获取图片的原始长宽 |
|
||||||
const windowWidth = this.parseWidth.value; |
|
||||||
const results = {}; |
|
||||||
|
|
||||||
if (originalWidth < 60 || originalHeight < 60) { |
|
||||||
const { src } = this.node.attr; |
|
||||||
let parent = this.$parent; |
|
||||||
while (!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.removeImageUrl(src); |
|
||||||
this.preview = false; |
|
||||||
} |
|
||||||
|
|
||||||
// 判断按照那种方式进行缩放 |
|
||||||
if (originalWidth > windowWidth) { |
|
||||||
// 在图片width大于手机屏幕width时候 |
|
||||||
results.imageWidth = windowWidth; |
|
||||||
results.imageheight = windowWidth * (originalHeight / originalWidth); |
|
||||||
} else { |
|
||||||
// 否则展示原来的数据 |
|
||||||
results.imageWidth = originalWidth; |
|
||||||
results.imageheight = originalHeight; |
|
||||||
} |
|
||||||
return results; |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,55 +0,0 @@ |
|||||||
<template> |
|
||||||
<div class='tablebox'> |
|
||||||
<rich-text :nodes="nodes" :class="node.classStr" :style="'user-select:' + parseSelect"></rich-text> |
|
||||||
</div> |
|
||||||
</template> |
|
||||||
<script> |
|
||||||
export default { |
|
||||||
name: 'wxParseTable', |
|
||||||
props: { |
|
||||||
node: { |
|
||||||
type: Object, |
|
||||||
default() { |
|
||||||
return {}; |
|
||||||
}, |
|
||||||
}, |
|
||||||
}, |
|
||||||
inject: ['parseSelect'], |
|
||||||
data() { |
|
||||||
return { |
|
||||||
nodes:[] |
|
||||||
}; |
|
||||||
}, |
|
||||||
mounted() { |
|
||||||
this.nodes=this.loadNode([this.node]); |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
loadNode(node) { |
|
||||||
let obj = []; |
|
||||||
for (let children of node) { |
|
||||||
if (children.node=='element') { |
|
||||||
let t = { |
|
||||||
name:children.tag, |
|
||||||
attrs: { |
|
||||||
class: children.classStr, |
|
||||||
// style: children.styleStr, |
|
||||||
}, |
|
||||||
children: children.nodes?this.loadNode(children.nodes):[] |
|
||||||
} |
|
||||||
|
|
||||||
obj.push(t) |
|
||||||
} else if(children.node=='text'){ |
|
||||||
obj.push({ |
|
||||||
type: 'text', |
|
||||||
text: children.text |
|
||||||
}) |
|
||||||
} |
|
||||||
} |
|
||||||
return obj |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
||||||
<style> |
|
||||||
@import url("../parse.css"); |
|
||||||
</style> |
|
@ -1,98 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node"/> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text'">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
// #ifdef APP-PLUS | H5 |
|
||||||
import wxParseTemplate from './wxParseTemplate0'; |
|
||||||
// #endif |
|
||||||
// #ifdef MP |
|
||||||
import wxParseTemplate from './wxParseTemplate1'; |
|
||||||
// #endif |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
// #ifdef APP-PLUS | H5 |
|
||||||
name: 'wxParseTemplate', |
|
||||||
// #endif |
|
||||||
// #ifdef MP |
|
||||||
name: 'wxParseTemplate0', |
|
||||||
// #endif |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset;// TODO currentTarget才有dataset |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') {// TODO 遍历获取父节点执行方法 |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text'">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate2'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate1', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate11'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate10', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,86 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<rich-text :nodes="node" :class="node.classStr" :style="'user-select:' + parseSelect"></rich-text> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<rich-text :nodes="node" :class="node.classStr" :style="'user-select:' + parseSelect"></rich-text> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<rich-text :nodes="node" :class="node.classStr" :style="'user-select:' + parseSelect"></rich-text> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<rich-text :nodes="node" :class="node.classStr" :style="'user-select:' + parseSelect"></rich-text> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate11', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text'">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate3'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate2', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate4'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate3', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate5'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate4', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate6'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate5', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate7'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate6', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate8'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate7', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate9'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate8', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,88 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--判断是否是标签节点--> |
|
||||||
<block v-if="node.node == 'element'"> |
|
||||||
<!--button类型--> |
|
||||||
<button v-if="node.tag == 'button'" type="default" size="mini" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</button> |
|
||||||
|
|
||||||
<!--a类型--> |
|
||||||
<view v-else-if="node.tag == 'a'" @click="wxParseATap(node.attr,$event)" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--li类型--> |
|
||||||
<view v-else-if="node.tag == 'li'" :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
|
|
||||||
<!--table类型--> |
|
||||||
<wx-parse-table v-else-if="node.tag == 'table'" :class="node.classStr" :style="node.styleStr" :node="node" /> |
|
||||||
|
|
||||||
<!--br类型--> |
|
||||||
<!-- #ifndef H5 --> |
|
||||||
<text v-else-if="node.tag == 'br'">\n</text> |
|
||||||
<!-- #endif --> |
|
||||||
<!-- #ifdef H5 --> |
|
||||||
<br v-else-if="node.tag == 'br'"> |
|
||||||
<!-- #endif --> |
|
||||||
|
|
||||||
<!--video类型--> |
|
||||||
<wx-parse-video :node="node" v-else-if="node.tag == 'video'"/> |
|
||||||
|
|
||||||
<!--audio类型--> |
|
||||||
<wx-parse-audio :node="node" v-else-if="node.tag == 'audio'"/> |
|
||||||
|
|
||||||
<!--img类型--> |
|
||||||
<wx-parse-img :node="node" v-else-if="node.tag == 'img'" :style="node.styleStr"/> |
|
||||||
|
|
||||||
<!--其他标签--> |
|
||||||
<view v-else :class="node.classStr" :style="node.styleStr"> |
|
||||||
<block v-for="(node, index) of node.nodes" :key="index"> |
|
||||||
<wx-parse-template :node="node" /> |
|
||||||
</block> |
|
||||||
</view> |
|
||||||
</block> |
|
||||||
|
|
||||||
<!--判断是否是文本节点--> |
|
||||||
<block v-else-if="node.node == 'text' ">{{node.text}}</block> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import wxParseTemplate from './wxParseTemplate10'; |
|
||||||
import wxParseImg from './wxParseImg'; |
|
||||||
import wxParseVideo from './wxParseVideo'; |
|
||||||
import wxParseAudio from './wxParseAudio'; |
|
||||||
import wxParseTable from './wxParseTable'; |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParseTemplate9', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate, |
|
||||||
wxParseImg, |
|
||||||
wxParseVideo, |
|
||||||
wxParseAudio, |
|
||||||
wxParseTable |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
wxParseATap(attr,e) { |
|
||||||
const { |
|
||||||
href |
|
||||||
} = e.currentTarget.dataset; |
|
||||||
if (!href) return; |
|
||||||
let parent = this.$parent; |
|
||||||
while(!parent.preview || typeof parent.preview !== 'function') { |
|
||||||
parent = parent.$parent; |
|
||||||
} |
|
||||||
parent.navigate(href, e, attr); |
|
||||||
} |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,15 +0,0 @@ |
|||||||
<template> |
|
||||||
<!--增加video标签支持,并循环添加--> |
|
||||||
<view :class="node.classStr" :style="node.styleStr"> |
|
||||||
<video :class="node.classStr" :style="node.styleStr" class="video-video" :src="node.attr.src"></video> |
|
||||||
</view> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
export default { |
|
||||||
name: 'wxParseVideo', |
|
||||||
props: { |
|
||||||
node: {}, |
|
||||||
}, |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,261 +0,0 @@ |
|||||||
/** |
|
||||||
* html2Json 改造来自: https://github.com/Jxck/html2json
|
|
||||||
* |
|
||||||
* |
|
||||||
* author: Di (微信小程序开发工程师) |
|
||||||
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
|
|
||||||
* 垂直微信小程序开发交流社区 |
|
||||||
* |
|
||||||
* github地址: https://github.com/icindy/wxParse
|
|
||||||
* |
|
||||||
* for: 微信小程序富文本解析 |
|
||||||
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
|
|
||||||
*/ |
|
||||||
|
|
||||||
import wxDiscode from './wxDiscode'; |
|
||||||
import HTMLParser from './htmlparser'; |
|
||||||
|
|
||||||
function makeMap(str) { |
|
||||||
const obj = {}; |
|
||||||
const items = str.split(','); |
|
||||||
for (let i = 0; i < items.length; i += 1) obj[items[i]] = true; |
|
||||||
return obj; |
|
||||||
} |
|
||||||
|
|
||||||
// Block Elements - HTML 5
|
|
||||||
const block = makeMap('br,code,address,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,ins,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video'); |
|
||||||
|
|
||||||
// Inline Elements - HTML 5
|
|
||||||
const inline = makeMap('a,abbr,acronym,applet,b,basefont,bdo,big,button,cite,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var'); |
|
||||||
|
|
||||||
// Elements that you can, intentionally, leave open
|
|
||||||
// (and which close themselves)
|
|
||||||
const closeSelf = makeMap('colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr'); |
|
||||||
|
|
||||||
function removeDOCTYPE(html) { |
|
||||||
const isDocument = /<body.*>([^]*)<\/body>/.test(html); |
|
||||||
return isDocument ? RegExp.$1 : html; |
|
||||||
} |
|
||||||
|
|
||||||
function trimHtml(html) { |
|
||||||
return html |
|
||||||
.replace(/<!--.*?-->/gi, '') |
|
||||||
.replace(/\/\*.*?\*\//gi, '') |
|
||||||
.replace(/[ ]+</gi, '<') |
|
||||||
.replace(/<script[^]*<\/script>/gi, '') |
|
||||||
.replace(/<style[^]*<\/style>/gi, ''); |
|
||||||
} |
|
||||||
|
|
||||||
function getScreenInfo() { |
|
||||||
const screen = {}; |
|
||||||
wx.getSystemInfo({ |
|
||||||
success: (res) => { |
|
||||||
screen.width = res.windowWidth; |
|
||||||
screen.height = res.windowHeight; |
|
||||||
}, |
|
||||||
}); |
|
||||||
return screen; |
|
||||||
} |
|
||||||
|
|
||||||
function html2json(html, customHandler, imageProp, host) { |
|
||||||
// 处理字符串
|
|
||||||
html = removeDOCTYPE(html); |
|
||||||
html = trimHtml(html); |
|
||||||
html = wxDiscode.strDiscode(html); |
|
||||||
// 生成node节点
|
|
||||||
const bufArray = []; |
|
||||||
const results = { |
|
||||||
nodes: [], |
|
||||||
imageUrls: [], |
|
||||||
}; |
|
||||||
|
|
||||||
const screen = getScreenInfo(); |
|
||||||
function Node(tag) { |
|
||||||
this.node = 'element'; |
|
||||||
this.tag = tag; |
|
||||||
|
|
||||||
this.$screen = screen; |
|
||||||
} |
|
||||||
|
|
||||||
HTMLParser(html, { |
|
||||||
start(tag, attrs, unary) { |
|
||||||
// node for this element
|
|
||||||
const node = new Node(tag); |
|
||||||
|
|
||||||
if (bufArray.length !== 0) { |
|
||||||
const parent = bufArray[0]; |
|
||||||
if (parent.nodes === undefined) { |
|
||||||
parent.nodes = []; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
if (block[tag]) { |
|
||||||
node.tagType = 'block'; |
|
||||||
} else if (inline[tag]) { |
|
||||||
node.tagType = 'inline'; |
|
||||||
} else if (closeSelf[tag]) { |
|
||||||
node.tagType = 'closeSelf'; |
|
||||||
} |
|
||||||
|
|
||||||
node.attr = attrs.reduce((pre, attr) => { |
|
||||||
const { name } = attr; |
|
||||||
let { value } = attr; |
|
||||||
if (name === 'class') { |
|
||||||
node.classStr = value; |
|
||||||
} |
|
||||||
// has multi attibutes
|
|
||||||
// make it array of attribute
|
|
||||||
if (name === 'style') { |
|
||||||
node.styleStr = value; |
|
||||||
} |
|
||||||
if (value.match(/ /)) { |
|
||||||
value = value.split(' '); |
|
||||||
} |
|
||||||
|
|
||||||
// if attr already exists
|
|
||||||
// merge it
|
|
||||||
if (pre[name]) { |
|
||||||
if (Array.isArray(pre[name])) { |
|
||||||
// already array, push to last
|
|
||||||
pre[name].push(value); |
|
||||||
} else { |
|
||||||
// single value, make it array
|
|
||||||
pre[name] = [pre[name], value]; |
|
||||||
} |
|
||||||
} else { |
|
||||||
// not exist, put it
|
|
||||||
pre[name] = value; |
|
||||||
} |
|
||||||
|
|
||||||
return pre; |
|
||||||
}, {}); |
|
||||||
|
|
||||||
// 优化样式相关属性
|
|
||||||
if (node.classStr) { |
|
||||||
node.classStr += ` ${node.tag}`; |
|
||||||
} else { |
|
||||||
node.classStr = node.tag; |
|
||||||
} |
|
||||||
if (node.tagType === 'inline') { |
|
||||||
node.classStr += ' inline'; |
|
||||||
} |
|
||||||
|
|
||||||
// 对img添加额外数据
|
|
||||||
if (node.tag === 'img') { |
|
||||||
let imgUrl = node.attr.src; |
|
||||||
imgUrl = wxDiscode.urlToHttpUrl(imgUrl, imageProp.domain); |
|
||||||
Object.assign(node.attr, imageProp, { |
|
||||||
src: imgUrl || '', |
|
||||||
}); |
|
||||||
if (imgUrl) { |
|
||||||
results.imageUrls.push(imgUrl); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
// 处理a标签属性
|
|
||||||
if (node.tag === 'a') { |
|
||||||
node.attr.href = node.attr.href || ''; |
|
||||||
} |
|
||||||
|
|
||||||
// 处理font标签样式属性
|
|
||||||
if (node.tag === 'font') { |
|
||||||
const fontSize = [ |
|
||||||
'x-small', |
|
||||||
'small', |
|
||||||
'medium', |
|
||||||
'large', |
|
||||||
'x-large', |
|
||||||
'xx-large', |
|
||||||
'-webkit-xxx-large', |
|
||||||
]; |
|
||||||
const styleAttrs = { |
|
||||||
color: 'color', |
|
||||||
face: 'font-family', |
|
||||||
size: 'font-size', |
|
||||||
}; |
|
||||||
if (!node.styleStr) node.styleStr = ''; |
|
||||||
Object.keys(styleAttrs).forEach((key) => { |
|
||||||
if (node.attr[key]) { |
|
||||||
const value = key === 'size' ? fontSize[node.attr[key] - 1] : node.attr[key]; |
|
||||||
node.styleStr += `${styleAttrs[key]}: ${value};`; |
|
||||||
} |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
// 临时记录source资源
|
|
||||||
if (node.tag === 'source') { |
|
||||||
results.source = node.attr.src; |
|
||||||
} |
|
||||||
|
|
||||||
if (customHandler.start) { |
|
||||||
customHandler.start(node, results); |
|
||||||
} |
|
||||||
|
|
||||||
if (unary) { |
|
||||||
// if this tag doesn't have end tag
|
|
||||||
// like <img src="hoge.png"/>
|
|
||||||
// add to parents
|
|
||||||
const parent = bufArray[0] || results; |
|
||||||
if (parent.nodes === undefined) { |
|
||||||
parent.nodes = []; |
|
||||||
} |
|
||||||
parent.nodes.push(node); |
|
||||||
} else { |
|
||||||
bufArray.unshift(node); |
|
||||||
} |
|
||||||
}, |
|
||||||
end(tag) { |
|
||||||
// merge into parent tag
|
|
||||||
const node = bufArray.shift(); |
|
||||||
if (node.tag !== tag) { |
|
||||||
console.error('invalid state: mismatch end tag'); |
|
||||||
} |
|
||||||
|
|
||||||
// 当有缓存source资源时于于video补上src资源
|
|
||||||
if (node.tag === 'video' && results.source) { |
|
||||||
node.attr.src = results.source; |
|
||||||
delete results.source; |
|
||||||
} |
|
||||||
|
|
||||||
if (customHandler.end) { |
|
||||||
customHandler.end(node, results); |
|
||||||
} |
|
||||||
|
|
||||||
if (bufArray.length === 0) { |
|
||||||
results.nodes.push(node); |
|
||||||
} else { |
|
||||||
const parent = bufArray[0]; |
|
||||||
if (!parent.nodes) { |
|
||||||
parent.nodes = []; |
|
||||||
} |
|
||||||
parent.nodes.push(node); |
|
||||||
} |
|
||||||
}, |
|
||||||
chars(text) { |
|
||||||
if (!text.trim()) return; |
|
||||||
|
|
||||||
const node = { |
|
||||||
node: 'text', |
|
||||||
text, |
|
||||||
}; |
|
||||||
|
|
||||||
if (customHandler.chars) { |
|
||||||
customHandler.chars(node, results); |
|
||||||
} |
|
||||||
|
|
||||||
if (bufArray.length === 0) { |
|
||||||
results.nodes.push(node); |
|
||||||
} else { |
|
||||||
const parent = bufArray[0]; |
|
||||||
if (parent.nodes === undefined) { |
|
||||||
parent.nodes = []; |
|
||||||
} |
|
||||||
parent.nodes.push(node); |
|
||||||
} |
|
||||||
}, |
|
||||||
}); |
|
||||||
|
|
||||||
return results; |
|
||||||
} |
|
||||||
|
|
||||||
export default html2json; |
|
@ -1,156 +0,0 @@ |
|||||||
/** |
|
||||||
* |
|
||||||
* htmlParser改造自: https://github.com/blowsie/Pure-JavaScript-HTML5-Parser
|
|
||||||
* |
|
||||||
* author: Di (微信小程序开发工程师) |
|
||||||
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
|
|
||||||
* 垂直微信小程序开发交流社区 |
|
||||||
* |
|
||||||
* github地址: https://github.com/icindy/wxParse
|
|
||||||
* |
|
||||||
* for: 微信小程序富文本解析 |
|
||||||
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
|
|
||||||
*/ |
|
||||||
// Regular Expressions for parsing tags and attributes
|
|
||||||
|
|
||||||
const startTag = /^<([-A-Za-z0-9_]+)((?:\s+[a-zA-Z0-9_:][-a-zA-Z0-9_:.]*(?:\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|[^>\s]+))?)*)\s*(\/?)>/; |
|
||||||
const endTag = /^<\/([-A-Za-z0-9_]+)[^>]*>/; |
|
||||||
const attr = /([a-zA-Z0-9_:][-a-zA-Z0-9_:.]*)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|([^>\s]+)))?/g; |
|
||||||
|
|
||||||
function makeMap(str) { |
|
||||||
const obj = {}; |
|
||||||
const items = str.split(','); |
|
||||||
for (let i = 0; i < items.length; i += 1) obj[items[i]] = true; |
|
||||||
return obj; |
|
||||||
} |
|
||||||
|
|
||||||
// Empty Elements - HTML 5
|
|
||||||
const empty = makeMap('area,base,basefont,br,col,frame,hr,img,input,link,meta,param,embed,command,keygen,source,track,wbr'); |
|
||||||
|
|
||||||
// Block Elements - HTML 5
|
|
||||||
const block = makeMap('address,code,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,ins,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video'); |
|
||||||
|
|
||||||
// Inline Elements - HTML 5
|
|
||||||
const inline = makeMap('a,abbr,acronym,applet,b,basefont,bdo,big,br,button,cite,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var'); |
|
||||||
|
|
||||||
// Elements that you can, intentionally, leave open
|
|
||||||
// (and which close themselves)
|
|
||||||
const closeSelf = makeMap('colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr'); |
|
||||||
|
|
||||||
// Attributes that have their values filled in disabled="disabled"
|
|
||||||
const fillAttrs = makeMap('checked,compact,declare,defer,disabled,ismap,multiple,nohref,noresize,noshade,nowrap,readonly,selected'); |
|
||||||
|
|
||||||
function HTMLParser(html, handler) { |
|
||||||
let index; |
|
||||||
let chars; |
|
||||||
let match; |
|
||||||
let last = html; |
|
||||||
const stack = []; |
|
||||||
|
|
||||||
stack.last = () => stack[stack.length - 1]; |
|
||||||
|
|
||||||
function parseEndTag(tag, tagName) { |
|
||||||
// If no tag name is provided, clean shop
|
|
||||||
let pos; |
|
||||||
if (!tagName) { |
|
||||||
pos = 0; |
|
||||||
} else { |
|
||||||
// Find the closest opened tag of the same type
|
|
||||||
tagName = tagName.toLowerCase(); |
|
||||||
for (pos = stack.length - 1; pos >= 0; pos -= 1) { |
|
||||||
if (stack[pos] === tagName) break; |
|
||||||
} |
|
||||||
} |
|
||||||
if (pos >= 0) { |
|
||||||
// Close all the open elements, up the stack
|
|
||||||
for (let i = stack.length - 1; i >= pos; i -= 1) { |
|
||||||
if (handler.end) handler.end(stack[i]); |
|
||||||
} |
|
||||||
|
|
||||||
// Remove the open elements from the stack
|
|
||||||
stack.length = pos; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
function parseStartTag(tag, tagName, rest, unary) { |
|
||||||
tagName = tagName.toLowerCase(); |
|
||||||
|
|
||||||
if (block[tagName]) { |
|
||||||
while (stack.last() && inline[stack.last()]) { |
|
||||||
parseEndTag('', stack.last()); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
if (closeSelf[tagName] && stack.last() === tagName) { |
|
||||||
parseEndTag('', tagName); |
|
||||||
} |
|
||||||
|
|
||||||
unary = empty[tagName] || !!unary; |
|
||||||
|
|
||||||
if (!unary) stack.push(tagName); |
|
||||||
|
|
||||||
if (handler.start) { |
|
||||||
const attrs = []; |
|
||||||
|
|
||||||
rest.replace(attr, function genAttr(matches, name) { |
|
||||||
const value = arguments[2] || arguments[3] || arguments[4] || (fillAttrs[name] ? name : ''); |
|
||||||
|
|
||||||
attrs.push({ |
|
||||||
name, |
|
||||||
value, |
|
||||||
escaped: value.replace(/(^|[^\\])"/g, '$1\\"'), // "
|
|
||||||
}); |
|
||||||
}); |
|
||||||
|
|
||||||
if (handler.start) { |
|
||||||
handler.start(tagName, attrs, unary); |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
while (html) { |
|
||||||
chars = true; |
|
||||||
|
|
||||||
if (html.indexOf('</') === 0) { |
|
||||||
match = html.match(endTag); |
|
||||||
|
|
||||||
if (match) { |
|
||||||
html = html.substring(match[0].length); |
|
||||||
match[0].replace(endTag, parseEndTag); |
|
||||||
chars = false; |
|
||||||
} |
|
||||||
|
|
||||||
// start tag
|
|
||||||
} else if (html.indexOf('<') === 0) { |
|
||||||
match = html.match(startTag); |
|
||||||
|
|
||||||
if (match) { |
|
||||||
html = html.substring(match[0].length); |
|
||||||
match[0].replace(startTag, parseStartTag); |
|
||||||
chars = false; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
if (chars) { |
|
||||||
index = html.indexOf('<'); |
|
||||||
let text = ''; |
|
||||||
while (index === 0) { |
|
||||||
text += '<'; |
|
||||||
html = html.substring(1); |
|
||||||
index = html.indexOf('<'); |
|
||||||
} |
|
||||||
text += index < 0 ? html : html.substring(0, index); |
|
||||||
html = index < 0 ? '' : html.substring(index); |
|
||||||
|
|
||||||
if (handler.chars) handler.chars(text); |
|
||||||
} |
|
||||||
|
|
||||||
if (html === last) throw new Error(`Parse Error: ${html}`); |
|
||||||
last = html; |
|
||||||
} |
|
||||||
|
|
||||||
// Clean up any remaining tags
|
|
||||||
parseEndTag(); |
|
||||||
} |
|
||||||
|
|
||||||
export default HTMLParser; |
|
@ -1,258 +0,0 @@ |
|||||||
/** |
|
||||||
* author: Di (微信小程序开发工程师) |
|
||||||
* organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com) |
|
||||||
* 垂直微信小程序开发交流社区 |
|
||||||
* |
|
||||||
* github地址: https://github.com/icindy/wxParse |
|
||||||
* |
|
||||||
* for: 微信小程序富文本解析 |
|
||||||
* detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184 |
|
||||||
*/ |
|
||||||
/** |
|
||||||
* 请在全局下引入该文件,@import '/static/wxParse.css'; |
|
||||||
*/ |
|
||||||
.wxParse { |
|
||||||
user-select:none; |
|
||||||
width: 100%; |
|
||||||
font-family: Helvetica, "PingFangSC", 'Microsoft Yahei', '微软雅黑', Arial, sans-serif; |
|
||||||
color: #333; |
|
||||||
line-height: 1.5; |
|
||||||
font-size: 1em; |
|
||||||
text-align:justify;/* //左右两端对齐 */ |
|
||||||
} |
|
||||||
.wxParse view ,.wxParse uni-view{ |
|
||||||
word-break: break-word; |
|
||||||
} |
|
||||||
.wxParse .p { |
|
||||||
padding-bottom: 0.5em; |
|
||||||
clear: both; |
|
||||||
/* letter-spacing: 0;//字间距 */ |
|
||||||
} |
|
||||||
.wxParse .inline { |
|
||||||
display: inline; |
|
||||||
margin: 0; |
|
||||||
padding: 0; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .div { |
|
||||||
margin: 0; |
|
||||||
padding: 0; |
|
||||||
display: block; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .h1{ |
|
||||||
font-size: 2em; |
|
||||||
line-height: 1.2em; |
|
||||||
margin: 0.67em 0; |
|
||||||
} |
|
||||||
.wxParse .h2{ |
|
||||||
font-size: 1.5em; |
|
||||||
margin: 0.83em 0; |
|
||||||
} |
|
||||||
.wxParse .h3{ |
|
||||||
font-size: 1.17em; |
|
||||||
margin: 1em 0; |
|
||||||
} |
|
||||||
.wxParse .h4{ |
|
||||||
margin: 1.33em 0; |
|
||||||
} |
|
||||||
.wxParse .h5{ |
|
||||||
font-size: 0.83em; |
|
||||||
margin: 1.67em 0; |
|
||||||
} |
|
||||||
.wxParse .h6{ |
|
||||||
font-size: 0.83em; |
|
||||||
margin: 1.67em 0; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .h1, |
|
||||||
.wxParse .h2, |
|
||||||
.wxParse .h3, |
|
||||||
.wxParse .h4, |
|
||||||
.wxParse .h5, |
|
||||||
.wxParse .h6, |
|
||||||
.wxParse .b, |
|
||||||
.wxParse .strong{ |
|
||||||
font-weight: bolder; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .i, |
|
||||||
.wxParse .cite, |
|
||||||
.wxParse .em, |
|
||||||
.wxParse .var, |
|
||||||
.wxParse .address { |
|
||||||
font-style: italic; |
|
||||||
} |
|
||||||
.wxParse .spaceshow{ |
|
||||||
white-space: pre; |
|
||||||
} |
|
||||||
.wxParse .pre, |
|
||||||
.wxParse .tt, |
|
||||||
.wxParse .code, |
|
||||||
.wxParse .kbd, |
|
||||||
.wxParse .samp { |
|
||||||
font-family: monospace; |
|
||||||
} |
|
||||||
.wxParse .pre { |
|
||||||
overflow: auto; |
|
||||||
background: #f5f5f5; |
|
||||||
padding: 16upx; |
|
||||||
white-space: pre; |
|
||||||
margin: 1em 0upx; |
|
||||||
font-size: 24upx; |
|
||||||
} |
|
||||||
.wxParse .code { |
|
||||||
overflow: auto; |
|
||||||
padding: 16upx; |
|
||||||
white-space: pre; |
|
||||||
margin: 1em 0upx; |
|
||||||
background: #f5f5f5; |
|
||||||
font-size: 24upx; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .big { |
|
||||||
font-size: 1.17em; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .small, |
|
||||||
.wxParse .sub, |
|
||||||
.wxParse .sup { |
|
||||||
font-size: 0.83em; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .sub { |
|
||||||
vertical-align: sub; |
|
||||||
} |
|
||||||
.wxParse .sup { |
|
||||||
vertical-align: super; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .s, |
|
||||||
.wxParse .strike, |
|
||||||
.wxParse .del { |
|
||||||
text-decoration: line-through; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .strong, |
|
||||||
.wxParse .text, |
|
||||||
.wxParse .span, |
|
||||||
.wxParse .s { |
|
||||||
display: inline; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .a { |
|
||||||
color: deepskyblue; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .video { |
|
||||||
text-align: center; |
|
||||||
margin: 22upx 0; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .video-video { |
|
||||||
width: 100%; |
|
||||||
} |
|
||||||
.wxParse .uni-image{ |
|
||||||
max-width: 100%; |
|
||||||
} |
|
||||||
.wxParse .img { |
|
||||||
display: block; |
|
||||||
max-width: 100%; |
|
||||||
margin-bottom: 0em;/* //与p标签底部padding同时修改 */ |
|
||||||
overflow: hidden; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .blockquote { |
|
||||||
margin: 10upx 0; |
|
||||||
padding: 22upx 0 22upx 22upx; |
|
||||||
font-family: Courier, Calibri, "宋体"; |
|
||||||
background: #f5f5f5; |
|
||||||
border-left: 6upx solid #dbdbdb; |
|
||||||
} |
|
||||||
.wxParse .blockquote .p { |
|
||||||
margin: 0; |
|
||||||
} |
|
||||||
.wxParse .ul, .wxParse .ol { |
|
||||||
display: block; |
|
||||||
margin: 1em 0; |
|
||||||
padding-left: 2em; |
|
||||||
} |
|
||||||
.wxParse .ol { |
|
||||||
list-style-type: disc; |
|
||||||
} |
|
||||||
.wxParse .ol { |
|
||||||
list-style-type: decimal; |
|
||||||
} |
|
||||||
.wxParse .ol>weixin-parse-template,.wxParse .ul>weixin-parse-template { |
|
||||||
display: list-item; |
|
||||||
align-items: baseline; |
|
||||||
text-align: match-parent; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .ol>.li,.wxParse .ul>.li { |
|
||||||
display: list-item; |
|
||||||
align-items: baseline; |
|
||||||
text-align: match-parent; |
|
||||||
} |
|
||||||
.wxParse .ul .ul, .wxParse .ol .ul { |
|
||||||
list-style-type: circle; |
|
||||||
} |
|
||||||
.wxParse .ol .ol .ul, .wxParse .ol .ul .ul, .wxParse .ul .ol .ul, .wxParse .ul .ul .ul { |
|
||||||
list-style-type: square; |
|
||||||
} |
|
||||||
|
|
||||||
.wxParse .u { |
|
||||||
text-decoration: underline; |
|
||||||
} |
|
||||||
.wxParse .hide { |
|
||||||
display: none; |
|
||||||
} |
|
||||||
.wxParse .del { |
|
||||||
display: inline; |
|
||||||
} |
|
||||||
.wxParse .figure { |
|
||||||
overflow: hidden; |
|
||||||
} |
|
||||||
.wxParse .tablebox{ |
|
||||||
overflow: auto; |
|
||||||
background-color: #f5f5f5; |
|
||||||
background: #f5f5f5; |
|
||||||
font-size: 13px; |
|
||||||
padding: 8px; |
|
||||||
} |
|
||||||
.wxParse .table .table,.wxParse .table{ |
|
||||||
border-collapse:collapse; |
|
||||||
box-sizing: border-box; |
|
||||||
/* 内边框 */ |
|
||||||
/* width: 100%; */ |
|
||||||
overflow: auto; |
|
||||||
white-space: pre; |
|
||||||
} |
|
||||||
.wxParse .tbody{ |
|
||||||
border-collapse:collapse; |
|
||||||
box-sizing: border-box; |
|
||||||
/* 内边框 */ |
|
||||||
border: 1px solid #dadada; |
|
||||||
} |
|
||||||
.wxParse .table .thead, .wxParse .table .tfoot, .wxParse .table .th{ |
|
||||||
border-collapse:collapse; |
|
||||||
box-sizing: border-box; |
|
||||||
background: #ececec; |
|
||||||
font-weight: 40; |
|
||||||
} |
|
||||||
.wxParse .table .tr { |
|
||||||
border-collapse:collapse; |
|
||||||
box-sizing: border-box; |
|
||||||
/* border: 2px solid #F0AD4E; */ |
|
||||||
overflow:auto; |
|
||||||
} |
|
||||||
.wxParse .table .th, |
|
||||||
.wxParse .table .td{ |
|
||||||
border-collapse:collapse; |
|
||||||
box-sizing: border-box; |
|
||||||
border: 2upx solid #dadada; |
|
||||||
overflow:auto; |
|
||||||
} |
|
||||||
.wxParse .audio, .wxParse .uni-audio-default{ |
|
||||||
display: block; |
|
||||||
} |
|
@ -1,228 +0,0 @@ |
|||||||
<!--** |
|
||||||
* forked from:https://github.com/F-loat/mpvue-wxParse |
|
||||||
* |
|
||||||
* github地址: https://github.com/dcloudio/uParse |
|
||||||
* |
|
||||||
* for: uni-app框架下 富文本解析 |
|
||||||
* |
|
||||||
* 优化 by gaoyia@qq.com https://github.com/gaoyia/parse |
|
||||||
*/--> |
|
||||||
|
|
||||||
<template> |
|
||||||
|
|
||||||
<!--基础元素--> |
|
||||||
<div class="wxParse" :class="className" :style="'user-select:' + userSelect"> |
|
||||||
<block v-for="(node, index) of nodes" :key="index" v-if="!loading"> |
|
||||||
<wxParseTemplate :node="node" /> |
|
||||||
</block> |
|
||||||
</div> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import HtmlToJson from './libs/html2json'; |
|
||||||
import wxParseTemplate from './components/wxParseTemplate0'; |
|
||||||
|
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'wxParse', |
|
||||||
props: { |
|
||||||
// user-select:none; |
|
||||||
userSelect: { |
|
||||||
type: String, |
|
||||||
default: 'text' //none |text| all | element |
|
||||||
}, |
|
||||||
imgOptions: { |
|
||||||
type: [Object, Boolean], |
|
||||||
default: function() { |
|
||||||
return { |
|
||||||
loop: false, |
|
||||||
indicator: 'number', |
|
||||||
longPressActions: false |
|
||||||
// longPressActions: { |
|
||||||
// itemList: ['发送给朋友', '保存图片', '收藏'], |
|
||||||
// success: function (res) { |
|
||||||
// console.log('选中了第' + (res.tapIndex + 1) + '个按钮'); |
|
||||||
// }, |
|
||||||
// fail: function (res) { |
|
||||||
// console.log(res.errMsg); |
|
||||||
// } |
|
||||||
// } |
|
||||||
// } |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
loading: { |
|
||||||
type: Boolean, |
|
||||||
default: false |
|
||||||
}, |
|
||||||
className: { |
|
||||||
type: String, |
|
||||||
default: '' |
|
||||||
}, |
|
||||||
content: { |
|
||||||
type: String, |
|
||||||
default: '' |
|
||||||
}, |
|
||||||
noData: { |
|
||||||
type: String, |
|
||||||
default: '<div style="color: red;">数据不能为空</div>' |
|
||||||
}, |
|
||||||
startHandler: { |
|
||||||
type: Function, |
|
||||||
default () { |
|
||||||
return node => { |
|
||||||
node.attr.class = null; |
|
||||||
node.attr.style = null; |
|
||||||
}; |
|
||||||
} |
|
||||||
}, |
|
||||||
endHandler: { |
|
||||||
type: Function, |
|
||||||
default: null |
|
||||||
}, |
|
||||||
charsHandler: { |
|
||||||
type: Function, |
|
||||||
default: null |
|
||||||
}, |
|
||||||
imageProp: { |
|
||||||
type: Object, |
|
||||||
default () { |
|
||||||
return { |
|
||||||
mode: 'aspectFit', |
|
||||||
padding: 0, |
|
||||||
lazyLoad: false, |
|
||||||
domain: '' |
|
||||||
}; |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
components: { |
|
||||||
wxParseTemplate |
|
||||||
}, |
|
||||||
data() { |
|
||||||
return { |
|
||||||
nodes: {}, |
|
||||||
imageUrls: [], |
|
||||||
wxParseWidth: { |
|
||||||
value: 0 |
|
||||||
} |
|
||||||
}; |
|
||||||
}, |
|
||||||
computed: {}, |
|
||||||
mounted() { |
|
||||||
this.setHtml() |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
setHtml() { |
|
||||||
this.getWidth().then((data) => { |
|
||||||
this.wxParseWidth.value = data; |
|
||||||
}) |
|
||||||
let { |
|
||||||
content, |
|
||||||
noData, |
|
||||||
imageProp, |
|
||||||
startHandler, |
|
||||||
endHandler, |
|
||||||
charsHandler |
|
||||||
} = this; |
|
||||||
let parseData = content || noData; |
|
||||||
let customHandler = { |
|
||||||
start: startHandler, |
|
||||||
end: endHandler, |
|
||||||
chars: charsHandler |
|
||||||
}; |
|
||||||
let results = HtmlToJson(parseData, customHandler, imageProp, this); |
|
||||||
|
|
||||||
this.imageUrls = results.imageUrls; |
|
||||||
// this.nodes = results.nodes; |
|
||||||
|
|
||||||
|
|
||||||
this.nodes = []; |
|
||||||
results.nodes.forEach((item) => { |
|
||||||
setTimeout(() => { |
|
||||||
this.nodes.push(item) |
|
||||||
}, 0); |
|
||||||
}) |
|
||||||
}, |
|
||||||
getWidth() { |
|
||||||
return new Promise((res, rej) => { |
|
||||||
// #ifndef MP-ALIPAY || MP-BAIDU |
|
||||||
uni.createSelectorQuery() |
|
||||||
.in(this) |
|
||||||
.select('.wxParse') |
|
||||||
.fields({ |
|
||||||
size: true, |
|
||||||
scrollOffset: true |
|
||||||
}, |
|
||||||
data => { |
|
||||||
res(data.width); |
|
||||||
} |
|
||||||
).exec(); |
|
||||||
// #endif |
|
||||||
// #ifdef MP-BAIDU |
|
||||||
const query = swan.createSelectorQuery(); |
|
||||||
query.select('.wxParse').boundingClientRect(); |
|
||||||
query.exec(obj => { |
|
||||||
const rect = obj[0] |
|
||||||
if (rect) { |
|
||||||
res(rect.width); |
|
||||||
} |
|
||||||
}); |
|
||||||
// #endif |
|
||||||
// #ifdef MP-ALIPAY |
|
||||||
my.createSelectorQuery() |
|
||||||
.select('.wxParse') |
|
||||||
.boundingClientRect().exec((ret) => { |
|
||||||
res(ret[0].width); |
|
||||||
}); |
|
||||||
// #endif |
|
||||||
}); |
|
||||||
}, |
|
||||||
navigate(href, $event, attr) { |
|
||||||
console.log(href, attr); |
|
||||||
this.$emit('navigate', href, $event); |
|
||||||
}, |
|
||||||
preview(src, $event) { |
|
||||||
if (!this.imageUrls.length || typeof this.imgOptions === 'boolean') { |
|
||||||
|
|
||||||
} else { |
|
||||||
uni.previewImage({ |
|
||||||
current: src, |
|
||||||
urls: this.imageUrls, |
|
||||||
loop: this.imgOptions.loop, |
|
||||||
indicator: this.imgOptions.indicator, |
|
||||||
longPressActions: this.imgOptions.longPressActions |
|
||||||
}); |
|
||||||
} |
|
||||||
this.$emit('preview', src, $event); |
|
||||||
}, |
|
||||||
removeImageUrl(src) { |
|
||||||
const { |
|
||||||
imageUrls |
|
||||||
} = this; |
|
||||||
imageUrls.splice(imageUrls.indexOf(src), 1); |
|
||||||
} |
|
||||||
}, |
|
||||||
// 父组件中提供 |
|
||||||
provide() { |
|
||||||
return { |
|
||||||
parseWidth: this.wxParseWidth, |
|
||||||
parseSelect: this.userSelect |
|
||||||
// 提示:provide 和 inject 绑定并不是可响应的。这是刻意为之的。然而,如果你传入了一个可监听的对象,那么其对象的属性还是可响应的。 |
|
||||||
}; |
|
||||||
}, |
|
||||||
watch: { |
|
||||||
content(){ |
|
||||||
this.setHtml() |
|
||||||
} |
|
||||||
// content: { |
|
||||||
// handler: function(newVal, oldVal) { |
|
||||||
// if (newVal !== oldVal) { |
|
||||||
// |
|
||||||
// } |
|
||||||
// }, |
|
||||||
// deep: true |
|
||||||
// } |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
@ -1,140 +0,0 @@ |
|||||||
<template> |
|
||||||
<view class="uni-section"> |
|
||||||
<view class="uni-section-header" nvue> |
|
||||||
<view v-if="type" class="uni-section__head"> |
|
||||||
<view :class="type" class="uni-section__head-tag"/> |
|
||||||
</view> |
|
||||||
<view class="uni-section__content"> |
|
||||||
<text :class="{'distraction':!subTitle}" :style="{color:color}" class="uni-section__content-title">{{ title }}</text> |
|
||||||
<text v-if="subTitle" class="uni-section__content-sub">{{ subTitle }}</text> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
<view :style="{padding: padding ? '10px' : ''}"> |
|
||||||
<slot/> |
|
||||||
</view> |
|
||||||
</view> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
|
|
||||||
/** |
|
||||||
* Section 标题栏 |
|
||||||
* @description 标题栏 |
|
||||||
* @property {String} type = [line|circle] 标题装饰类型 |
|
||||||
* @value line 竖线 |
|
||||||
* @value circle 圆形 |
|
||||||
* @property {String} title 主标题 |
|
||||||
* @property {String} subTitle 副标题 |
|
||||||
*/ |
|
||||||
|
|
||||||
export default { |
|
||||||
name: 'UniSection', |
|
||||||
emits:['click'], |
|
||||||
props: { |
|
||||||
type: { |
|
||||||
type: String, |
|
||||||
default: '' |
|
||||||
}, |
|
||||||
title: { |
|
||||||
type: String, |
|
||||||
default: '' |
|
||||||
}, |
|
||||||
color:{ |
|
||||||
type: String, |
|
||||||
default: '#333' |
|
||||||
}, |
|
||||||
subTitle: { |
|
||||||
type: String, |
|
||||||
default: '' |
|
||||||
}, |
|
||||||
padding: { |
|
||||||
type: Boolean, |
|
||||||
default: false |
|
||||||
} |
|
||||||
}, |
|
||||||
data() { |
|
||||||
return {} |
|
||||||
}, |
|
||||||
watch: { |
|
||||||
title(newVal) { |
|
||||||
if (uni.report && newVal !== '') { |
|
||||||
uni.report('title', newVal) |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
onClick() { |
|
||||||
this.$emit('click') |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
</script> |
|
||||||
<style lang="scss" > |
|
||||||
$uni-primary: #2979ff !default; |
|
||||||
|
|
||||||
.uni-section { |
|
||||||
background-color: #fff; |
|
||||||
// overflow: hidden; |
|
||||||
margin-top: 10px; |
|
||||||
} |
|
||||||
.uni-section-header { |
|
||||||
position: relative; |
|
||||||
/* #ifndef APP-NVUE */ |
|
||||||
display: flex; |
|
||||||
/* #endif */ |
|
||||||
flex-direction: row; |
|
||||||
align-items: center; |
|
||||||
padding: 12px 10px; |
|
||||||
// height: 50px; |
|
||||||
font-weight: normal; |
|
||||||
} |
|
||||||
.uni-section__head { |
|
||||||
flex-direction: row; |
|
||||||
justify-content: center; |
|
||||||
align-items: center; |
|
||||||
margin-right: 10px; |
|
||||||
} |
|
||||||
|
|
||||||
.line { |
|
||||||
height: 12px; |
|
||||||
background-color: $uni-primary; |
|
||||||
border-radius: 10px; |
|
||||||
width: 4px; |
|
||||||
} |
|
||||||
|
|
||||||
.circle { |
|
||||||
width: 8px; |
|
||||||
height: 8px; |
|
||||||
border-top-right-radius: 50px; |
|
||||||
border-top-left-radius: 50px; |
|
||||||
border-bottom-left-radius: 50px; |
|
||||||
border-bottom-right-radius: 50px; |
|
||||||
background-color: $uni-primary; |
|
||||||
} |
|
||||||
|
|
||||||
.uni-section__content { |
|
||||||
/* #ifndef APP-NVUE */ |
|
||||||
display: flex; |
|
||||||
/* #endif */ |
|
||||||
flex-direction: column; |
|
||||||
flex: 1; |
|
||||||
color: #333; |
|
||||||
} |
|
||||||
|
|
||||||
.uni-section__content-title { |
|
||||||
font-size: 14px; |
|
||||||
color: $uni-primary; |
|
||||||
} |
|
||||||
|
|
||||||
.distraction { |
|
||||||
flex-direction: row; |
|
||||||
align-items: center; |
|
||||||
} |
|
||||||
|
|
||||||
.uni-section__content-sub { |
|
||||||
font-size: 12px; |
|
||||||
color: #999; |
|
||||||
line-height: 16px; |
|
||||||
margin-top: 2px; |
|
||||||
} |
|
||||||
</style> |
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 775 B |
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 599 B |
Before Width: | Height: | Size: 783 B After Width: | Height: | Size: 439 B |
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 518 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 522 B |
After Width: | Height: | Size: 31 KiB |
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 21 KiB |
Before Width: | Height: | Size: 82 KiB After Width: | Height: | Size: 28 KiB |
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 9.0 KiB |
Before Width: | Height: | Size: 5.0 KiB After Width: | Height: | Size: 4.5 KiB |
Before Width: | Height: | Size: 4.7 KiB After Width: | Height: | Size: 4.4 KiB |
Before Width: | Height: | Size: 7.7 KiB After Width: | Height: | Size: 7.5 KiB |
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 26 KiB |
Before Width: | Height: | Size: 572 B After Width: | Height: | Size: 528 B |
Before Width: | Height: | Size: 654 B After Width: | Height: | Size: 620 B |
Before Width: | Height: | Size: 640 B After Width: | Height: | Size: 382 B |
Before Width: | Height: | Size: 969 B After Width: | Height: | Size: 537 B |
Before Width: | Height: | Size: 557 B After Width: | Height: | Size: 514 B |
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 689 B |
Before Width: | Height: | Size: 937 B After Width: | Height: | Size: 519 B |
Before Width: | Height: | Size: 860 B After Width: | Height: | Size: 457 B |
Before Width: | Height: | Size: 490 B After Width: | Height: | Size: 270 B |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 734 B |
Before Width: | Height: | Size: 657 B After Width: | Height: | Size: 372 B |
Before Width: | Height: | Size: 313 B After Width: | Height: | Size: 302 B |
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 3.5 KiB |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 483 B |
Before Width: | Height: | Size: 988 B After Width: | Height: | Size: 434 B |
Before Width: | Height: | Size: 513 B After Width: | Height: | Size: 298 B |
Before Width: | Height: | Size: 581 B After Width: | Height: | Size: 351 B |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 641 B |
Before Width: | Height: | Size: 427 B After Width: | Height: | Size: 251 B |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 480 B |
Before Width: | Height: | Size: 848 B After Width: | Height: | Size: 440 B |
Before Width: | Height: | Size: 644 B After Width: | Height: | Size: 347 B |
Before Width: | Height: | Size: 791 B After Width: | Height: | Size: 473 B |
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 578 B |
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 502 B |
Before Width: | Height: | Size: 296 B After Width: | Height: | Size: 282 B |
Before Width: | Height: | Size: 55 KiB After Width: | Height: | Size: 48 KiB |
Before Width: | Height: | Size: 892 B After Width: | Height: | Size: 434 B |
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 239 B |
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 265 B |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 440 B |
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 246 B |
Before Width: | Height: | Size: 880 B After Width: | Height: | Size: 377 B |
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 229 B |
Before Width: | Height: | Size: 1018 B After Width: | Height: | Size: 468 B |
Before Width: | Height: | Size: 416 B After Width: | Height: | Size: 373 B |
Before Width: | Height: | Size: 287 B After Width: | Height: | Size: 197 B |
Before Width: | Height: | Size: 552 B After Width: | Height: | Size: 525 B |
Before Width: | Height: | Size: 136 KiB After Width: | Height: | Size: 38 KiB |
Before Width: | Height: | Size: 230 B After Width: | Height: | Size: 221 B |
After Width: | Height: | Size: 1.3 KiB |
After Width: | Height: | Size: 457 B |
Before Width: | Height: | Size: 72 KiB After Width: | Height: | Size: 68 KiB |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 974 B |
Before Width: | Height: | Size: 840 B After Width: | Height: | Size: 760 B |
Before Width: | Height: | Size: 319 B After Width: | Height: | Size: 310 B |
Before Width: | Height: | Size: 727 B After Width: | Height: | Size: 654 B |
Before Width: | Height: | Size: 295 B After Width: | Height: | Size: 283 B |
Before Width: | Height: | Size: 844 B After Width: | Height: | Size: 773 B |
Before Width: | Height: | Size: 672 B After Width: | Height: | Size: 624 B |