@10yun/cv-mobile-ui 0.5.9 → 0.5.10

package/ui-uni/uParse/src/components/wxParseTemplate8.vue

@@ -0,0 +1,88 @@
+<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>

package/ui-uni/uParse/src/components/wxParseTemplate9.vue

@@ -0,0 +1,88 @@
+<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>

package/ui-uni/uParse/src/components/wxParseVideo.vue

@@ -0,0 +1,15 @@
+<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>

package/ui-uni/uParse/src/editor.css

@@ -0,0 +1,495 @@
+.ql-container {
+	display: block;
+	position: relative;
+	box-sizing: border-box;
+	-webkit-user-select: text;
+	user-select: text;
+	outline: none;
+	overflow: hidden;
+	width: 100%;
+	height: auto;
+	min-height: 30px;
+}
+
+.ql-container[hidden] {
+	display: none;
+}
+
+.ql-container .ql-editor {
+	position: relative;
+	font-size: inherit;
+	line-height: inherit;
+	font-family: inherit;
+	min-height: inherit;
+	width: 100%;
+	height: 100%;
+	padding: 0;
+	overflow-x: hidden;
+	overflow-y: auto;
+	-webkit-tap-highlight-color: transparent;
+	-webkit-touch-callout: none;
+	-webkit-overflow-scrolling: touch;
+}
+
+.ql-container .ql-editor::-webkit-scrollbar {
+	width: 0 !important;
+}
+
+.ql-container .ql-editor.scroll-disabled {
+	overflow: hidden;
+}
+
+.ql-container .ql-image-overlay {
+	display: flex;
+	position: absolute;
+	box-sizing: border-box;
+	border: 1px dashed #ccc;
+	justify-content: center;
+	align-items: center;
+	-webkit-user-select: none;
+	user-select: none;
+}
+
+.ql-container .ql-image-overlay .ql-image-size {
+	position: absolute;
+	padding: 4px 8px;
+	text-align: center;
+	background-color: #fff;
+	color: #888;
+	border: 1px solid #ccc;
+	box-sizing: border-box;
+	opacity: 0.8;
+	right: 4px;
+	top: 4px;
+	font-size: 12px;
+	display: inline-block;
+	width: auto;
+}
+
+.ql-container .ql-image-overlay .ql-image-toolbar {
+	position: relative;
+	text-align: center;
+	box-sizing: border-box;
+	background: #000;
+	border-radius: 5px;
+	color: #fff;
+	font-size: 0;
+	min-height: 24px;
+	z-index: 100;
+}
+
+.ql-container .ql-image-overlay .ql-image-toolbar span {
+	display: inline-block;
+	cursor: pointer;
+	padding: 5px;
+	font-size: 12px;
+	border-right: 1px solid #fff;
+}
+
+.ql-container .ql-image-overlay .ql-image-toolbar span:last-child {
+	border-right: 0;
+}
+
+.ql-container .ql-image-overlay .ql-image-toolbar span.triangle-up {
+	padding: 0;
+	position: absolute;
+	top: -12px;
+	left: 50%;
+	transform: translatex(-50%);
+	width: 0;
+	height: 0;
+	border-width: 6px;
+	border-style: solid;
+	border-color: transparent transparent black transparent;
+}
+
+.ql-container .ql-image-overlay .ql-image-handle {
+	position: absolute;
+	height: 12px;
+	width: 12px;
+	border-radius: 50%;
+	border: 1px solid #ccc;
+	box-sizing: border-box;
+	background: #fff;
+}
+
+.ql-container img {
+	display: inline-block;
+	max-width: 100%;
+}
+
+.ql-container .img {
+	display: inline-block;
+	max-width: 100%;
+}
+
+.ql-clipboard p {
+	margin: 0;
+	padding: 0;
+}
+
+.ql-editor {
+	box-sizing: border-box;
+	height: 100%;
+	outline: none;
+	overflow-y: auto;
+	tab-size: 4;
+	-moz-tab-size: 4;
+	text-align: left;
+	white-space: pre-wrap;
+	word-wrap: break-word;
+}
+
+.ql-editor>* {
+	cursor: text;
+}
+
+.ql-editor p,
+.ql-editor ol,
+.ql-editor ul,
+.ql-editor pre,
+.ql-editor blockquote,
+.ql-editor h1,
+.ql-editor h2,
+.ql-editor h3,
+.ql-editor h4,
+.ql-editor h5,
+.ql-editor h6 {
+	margin: 0;
+	padding: 0;
+	counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
+}
+
+.ql-editor ol>li,
+.ql-editor ul>li {
+	list-style-type: none;
+}
+
+.ql-editor ul>li::before {
+	content: '\2022';
+}
+
+.ql-editor ul[data-checked=true],
+.ql-editor ul[data-checked=false] {
+	pointer-events: none;
+}
+
+.ql-editor ul[data-checked=true]>li *,
+.ql-editor ul[data-checked=false]>li * {
+	pointer-events: all;
+}
+
+.ql-editor ul[data-checked=true]>li::before,
+.ql-editor ul[data-checked=false]>li::before {
+	color: #777;
+	cursor: pointer;
+	pointer-events: all;
+}
+
+.ql-editor ul[data-checked=true]>li::before {
+	content: '\2611';
+}
+
+.ql-editor ul[data-checked=false]>li::before {
+	content: '\2610';
+}
+
+.ql-editor li::before {
+	display: inline-block;
+	white-space: nowrap;
+	width: 2em;
+}
+
+.ql-editor ol li {
+	counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
+	counter-increment: list-0;
+}
+
+.ql-editor ol li:before {
+	content: counter(list-0, decimal) '. ';
+}
+
+.ql-editor ol li.ql-indent-1 {
+	counter-increment: list-1;
+}
+
+.ql-editor ol li.ql-indent-1:before {
+	content: counter(list-1, lower-alpha) '. ';
+}
+
+.ql-editor ol li.ql-indent-1 {
+	counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
+}
+
+.ql-editor ol li.ql-indent-2 {
+	counter-increment: list-2;
+}
+
+.ql-editor ol li.ql-indent-2:before {
+	content: counter(list-2, lower-roman) '. ';
+}
+
+.ql-editor ol li.ql-indent-2 {
+	counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
+}
+
+.ql-editor ol li.ql-indent-3 {
+	counter-increment: list-3;
+}
+
+.ql-editor ol li.ql-indent-3:before {
+	content: counter(list-3, decimal) '. ';
+}
+
+.ql-editor ol li.ql-indent-3 {
+	counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
+}
+
+.ql-editor ol li.ql-indent-4 {
+	counter-increment: list-4;
+}
+
+.ql-editor ol li.ql-indent-4:before {
+	content: counter(list-4, lower-alpha) '. ';
+}
+
+.ql-editor ol li.ql-indent-4 {
+	counter-reset: list-5 list-6 list-7 list-8 list-9;
+}
+
+.ql-editor ol li.ql-indent-5 {
+	counter-increment: list-5;
+}
+
+.ql-editor ol li.ql-indent-5:before {
+	content: counter(list-5, lower-roman) '. ';
+}
+
+.ql-editor ol li.ql-indent-5 {
+	counter-reset: list-6 list-7 list-8 list-9;
+}
+
+.ql-editor ol li.ql-indent-6 {
+	counter-increment: list-6;
+}
+
+.ql-editor ol li.ql-indent-6:before {
+	content: counter(list-6, decimal) '. ';
+}
+
+.ql-editor ol li.ql-indent-6 {
+	counter-reset: list-7 list-8 list-9;
+}
+
+.ql-editor ol li.ql-indent-7 {
+	counter-increment: list-7;
+}
+
+.ql-editor ol li.ql-indent-7:before {
+	content: counter(list-7, lower-alpha) '. ';
+}
+
+.ql-editor ol li.ql-indent-7 {
+	counter-reset: list-8 list-9;
+}
+
+.ql-editor ol li.ql-indent-8 {
+	counter-increment: list-8;
+}
+
+.ql-editor ol li.ql-indent-8:before {
+	content: counter(list-8, lower-roman) '. ';
+}
+
+.ql-editor ol li.ql-indent-8 {
+	counter-reset: list-9;
+}
+
+.ql-editor ol li.ql-indent-9 {
+	counter-increment: list-9;
+}
+
+.ql-editor ol li.ql-indent-9:before {
+	content: counter(list-9, decimal) '. ';
+}
+
+.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
+	padding-left: 2em;
+}
+
+.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
+	padding-left: 2em;
+}
+
+.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
+	padding-right: 2em;
+}
+
+.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
+	padding-right: 2em;
+}
+
+.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
+	padding-left: 4em;
+}
+
+.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
+	padding-left: 4em;
+}
+
+.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
+	padding-right: 4em;
+}
+
+.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
+	padding-right: 4em;
+}
+
+.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
+	padding-left: 6em;
+}
+
+.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
+	padding-left: 6em;
+}
+
+.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
+	padding-right: 6em;
+}
+
+.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
+	padding-right: 6em;
+}
+
+.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
+	padding-left: 8em;
+}
+
+.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
+	padding-left: 8em;
+}
+
+.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
+	padding-right: 8em;
+}
+
+.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
+	padding-right: 8em;
+}
+
+.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
+	padding-left: 10em;
+}
+
+.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
+	padding-left: 10em;
+}
+
+.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
+	padding-right: 10em;
+}
+
+.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
+	padding-right: 10em;
+}
+
+.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
+	padding-left: 12em;
+}
+
+.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
+	padding-left: 12em;
+}
+
+.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
+	padding-right: 12em;
+}
+
+.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
+	padding-right: 12em;
+}
+
+.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
+	padding-left: 14em;
+}
+
+.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
+	padding-left: 14em;
+}
+
+.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
+	padding-right: 14em;
+}
+
+.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
+	padding-right: 14em;
+}
+
+.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
+	padding-left: 16em;
+}
+
+.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
+	padding-left: 16em;
+}
+
+.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
+	padding-right: 16em;
+}
+
+.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
+	padding-right: 16em;
+}
+
+.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
+	padding-left: 18em;
+}
+
+.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
+	padding-left: 18em;
+}
+
+.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
+	padding-right: 18em;
+}
+
+.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
+	padding-right: 18em;
+}
+
+.ql-editor .ql-direction-rtl {
+	direction: rtl;
+	text-align: inherit;
+}
+
+.ql-editor .ql-align-center {
+	text-align: center;
+}
+
+.ql-editor .ql-align-justify {
+	text-align: justify;
+}
+
+.ql-editor .ql-align-right {
+	text-align: right;
+}
+
+.ql-editor.ql-blank::before {
+	color: rgba(0, 0, 0, 0.6);
+	content: attr(data-placeholder);
+	font-style: italic;
+	pointer-events: none;
+	position: absolute;
+}
+
+.ql-container.ql-disabled .ql-editor ul[data-checked]>li::before {
+	pointer-events: none;
+}
+
+.ql-clipboard {
+	left: -100000px;
+	height: 1px;
+	overflow-y: hidden;
+	position: absolute;
+	top: 50%;
+}