chore(组件): 将diy组件独立出来

components-diy/diy-rich-text.vue

@@ -0,0 +1,64 @@
+<template>
+	<view data-component-name="diy-rich-text" class="rich-text-box" :style="richTextWarpCss">
+		<rich-text :nodes="html" @click="handlerClick" @tap="handlerClick"></rich-text>
+	</view>
+</template>
+
+<script>
+// 富文本
+import htmlParser from '@/common/js/html-parser';
+import DiyMinx from './minx.js'
+export default {
+	name: 'diy-rich-text',
+	props: {
+		value: {
+			type: Object
+		}
+	},
+	data() {
+		return {
+			html: ''
+		};
+	},
+	created() {
+		this.html = htmlParser(this.value.html);
+	},
+	mixins: [DiyMinx],
+	watch: {
+		// 组件刷新监听
+		componentRefresh: function(nval) {}
+	},
+	computed: {
+		richTextWarpCss: function() {
+			var obj = '';
+			obj += 'background-color:' + this.value.componentBgColor + ';';
+			if (this.value.componentAngle == 'round') {
+				obj += 'border-top-left-radius:' + this.value.topAroundRadius * 2 + 'rpx;';
+				obj += 'border-top-right-radius:' + this.value.topAroundRadius * 2 + 'rpx;';
+				obj += 'border-bottom-left-radius:' + this.value.bottomAroundRadius * 2 + 'rpx;';
+				obj += 'border-bottom-right-radius:' + this.value.bottomAroundRadius * 2 + 'rpx;';
+			}
+			return obj;
+		}
+	},
+	mounted() {},
+	methods: {
+		async handlerClick(item) {
+			await this.__$emitEvent({eventName: 'rich-text-tap', data: item, promiseCallback: (event, handler, awaitedResult) => {
+				if (!awaitedResult) return;
+			}})
+		}
+	}
+};
+</script>
+
+<style lang="scss">
+.rich-text-box {
+	padding: $padding;
+	box-sizing: border-box;
+	height: auto;
+	line-height: 1.5;
+	white-space: pre-wrap;
+	word-break: break-all;
+}
+</style>