<commit_before><template>
	<view>
		<view>
			<view class="toolbar">
				<view class="iconfont icon-bold" @click="toolBarClick('bold')"></view>
				<view class="iconfont icon-italic" @click="toolBarClick('italic')"></view>
				<view class="iconfont icon-xiahuaxian1" @click="toolBarClick('header')"></view>
				<view class="iconfont icon-underline" @click="toolBarClick('underline')"></view>
				<view class="iconfont icon-strike" @click="toolBarClick('strike')"></view>
				<view class="iconfont icon-sup" @click="toolBarClick('sup')"></view>
				<view class="iconfont icon-sub" @click="toolBarClick('sub')"></view>
				<view class="iconfont icon-alignleft" @click="toolBarClick('alignleft')"></view>
				<view class="iconfont icon-aligncenter" @click="toolBarClick('aligncenter')"></view>
				<view class="iconfont icon-alignright" @click="toolBarClick('alignright')"></view>
				<view class="iconfont icon-link" @click="toolBarClick('link')"></view>
				<view class="iconfont icon-image" @click="toolBarClick('imgage')"></view>
				<view class="iconfont icon-code" @click="toolBarClick('code')"></view>
				<view class="iconfont icon-table" @click="toolBarClick('table')"></view>
				<view class="iconfont icon-qingkong" @click="toolBarClick('clear')"></view>
			</view>
			<view class="input-content">
				<textarea auto-height maxlength="-1" v-model="textareaData" @blur="getCursor"></textarea>
			</view>
		</view>
		<view class="preview" v-if="showPreview && textareaHtml">
			<scroll-view scroll-y :style="'height:'+screenHeight/2.5+'px;padding:10px;box-sizing: border-box;'">
				<wxParse :content="textareaHtml" @preview="preview" @navigate="navigate" />
			</scroll-view>
		</view>
	</view>
</template>

<script>
	import marked from '../marked'
	import wxParse from '../mpvue-wxparse/src/wxParse.vue'
	export default {
		name: "ly-markdown",
		components: {
			wxParse
		},
		data: function () {
			return {
				screenHeight: 0,
				cursor: 0
			}
		},
		props: {
			textareaData: {
				type: String,
				default: ""
			},
			textareaHtml: {
				type: String,
				default: ""
			},
			showPreview: {
				type: Boolean,
				default: false
			}
		},
		methods: {
			preview(src, e) {
				uni.previewImage({
					urls: src,
				})
			},
			navigate(href, e) {
				// 如允许点击超链接跳转，则应该打开一个新页面，并传入href，由新页面内嵌webview组件负责显示该链接内容
				// #ifdef APP-PLUS
				plus.runtime.openURL(href)
				// #endif
				// #ifdef MP-WEIXIN
				uni.setClipboardData({
					data: href,
					success: function () {
						uni.showModal({
							content: "网址已复制,请在浏览器中粘贴打开",
							showCancel: false
						})
					}
				})
				// #endif
			},
			toolBarClick(type) {
				if (type == 'bold') {
					this.textareaData += "**粗体文字** "
				} else if (type == "italic") {
					this.textareaData += "*斜体* "
				} else if (type == "header") {
					uni.showActionSheet({
						itemList: ["标题1", "标题2", "标题3", "标题4", "标题5", "标题6"],
						success: res => {
							switch (res.tapIndex) {
								case 0:
									this.textareaData += "# 标题1\r";
									return;
								case 1:
									this.textareaData += "## 标题2\r";
									return;
								case 2:
									this.textareaData += "### 标题3\r";
									return;
								case 3:
									this.textareaData += "#### 标题4\r";
									return;
								case 4:
									this.textareaData += "##### 标题5\r";
									return;
								case 5:
									this.textareaData += "###### 标题6\r";
									return;
							}
						}
					})
				} else if (type == "underline") {
					this.textareaData += "++下划线++ "
				} else if (type == "strike") {
					this.textareaData += "~~中划线~~ "
				} else if (type == "sup") {
					this.textareaData += "^上角标^ "
				} else if (type == "sub") {
					this.textareaData += "~下角标~ "
				} else if (type == "alignleft") {
					this.textareaData += "\n::: hljs-left\n\n左对齐\n\n:::\n"
				} else if (type == "aligncenter") {
					this.textareaData += "\n::: hljs-center\n\n居中对齐\n\n:::\n"
				} else if (type == "alignright") {
					this.textareaData += "\n::: hljs-right\n\n\n\n右对齐\n\n:::\n"
				} else if (type == "link") {
					this.textareaData += "[在此输入网址描述](在此输入网址) "
				} else if (type == "imgage") {
					this.textareaData += "![](在此输入图片地址) "
				} else if (type == "code") {
					this.textareaData += "\n``` 代码块 \n\n```\n"
				} else if (type == "table") {
					this.textareaData += "\n|列1|列2|列3|\n|-|-|-|\n|单元格1|单元格2|单元格3|\n"
				} else if (type == "clear") {
					uni.showModal({
						title: "提示",
						content: "确定清空?",
						success: res => {
							if (res.confirm) {
								this.textareaData = "";
							}
						}
					})
				}
			},
			getCursor(e) {
				//安卓失去焦点获取不到cursor位置,暂不使用
				//this.cursor = e.detail.cursor; 
			}
		},
		watch: {
			"textareaData": function (newValue, oldValue) {
				this.textareaHtml = marked(newValue)
				this.$emit('update:textareaData', newValue)
				this.$emit('update:textareaHtml', this.textareaHtml)
			}
		},
		mounted: function () {<commit_msg>解决md编辑器示例在H5端出现警告的问题<commit_after><template>
	<view>
		<view>
			<view class="toolbar">
				<view class="iconfont icon-bold" @click="toolBarClick('bold')"></view>
				<view class="iconfont icon-italic" @click="toolBarClick('italic')"></view>
				<view class="iconfont icon-xiahuaxian1" @click="toolBarClick('header')"></view>
				<view class="iconfont icon-underline" @click="toolBarClick('underline')"></view>
				<view class="iconfont icon-strike" @click="toolBarClick('strike')"></view>
				<view class="iconfont icon-sup" @click="toolBarClick('sup')"></view>
				<view class="iconfont icon-sub" @click="toolBarClick('sub')"></view>
				<view class="iconfont icon-alignleft" @click="toolBarClick('alignleft')"></view>
				<view class="iconfont icon-aligncenter" @click="toolBarClick('aligncenter')"></view>
				<view class="iconfont icon-alignright" @click="toolBarClick('alignright')"></view>
				<view class="iconfont icon-link" @click="toolBarClick('link')"></view>
				<view class="iconfont icon-image" @click="toolBarClick('imgage')"></view>
				<view class="iconfont icon-code" @click="toolBarClick('code')"></view>
				<view class="iconfont icon-table" @click="toolBarClick('table')"></view>
				<view class="iconfont icon-qingkong" @click="toolBarClick('clear')"></view>
			</view>
			<view class="input-content">
				<textarea auto-height maxlength="-1" v-model="textareaDataSync" @blur="getCursor"></textarea>
			</view>
		</view>
		<view class="preview" v-if="showPreview && textareaHtmlSync">
			<scroll-view scroll-y :style="'height:'+screenHeight/2.5+'px;padding:10px;box-sizing: border-box;'">
				<wxParse :content="textareaHtmlSync" @preview="preview" @navigate="navigate" />
			</scroll-view>
		</view>
	</view>
</template>

<script>
	import marked from '../marked'
	import wxParse from '../mpvue-wxparse/src/wxParse.vue'
	export default {
		name: "ly-markdown",
		components: {
			wxParse
		},
		data: function () {
			return {
				screenHeight: 0,
				cursor: 0,
                textareaDataSync:this.textareaData,
                textareaHtmlSync:this.textareaHtml
			}
		},
		props: {
			textareaData: {
				type: String,
				default: ""
			},
			textareaHtml: {
				type: String,
				default: ""
			},
			showPreview: {
				type: Boolean,
				default: false
			}
		},
		methods: {
			preview(src, e) {
				uni.previewImage({
					urls: src,
				})
			},
			navigate(href, e) {
				// 如允许点击超链接跳转，则应该打开一个新页面，并传入href，由新页面内嵌webview组件负责显示该链接内容
				// #ifdef APP-PLUS
				plus.runtime.openURL(href)
				// #endif
				// #ifdef MP-WEIXIN
				uni.setClipboardData({
					data: href,
					success: function () {
						uni.showModal({
							content: "网址已复制,请在浏览器中粘贴打开",
							showCancel: false
						})
					}
				})
				// #endif
			},
			toolBarClick(type) {
				if (type == 'bold') {
					this.textareaDataSync += "**粗体文字** "
				} else if (type == "italic") {
					this.textareaDataSync += "*斜体* "
				} else if (type == "header") {
					uni.showActionSheet({
						itemList: ["标题1", "标题2", "标题3", "标题4", "标题5", "标题6"],
						success: res => {
							switch (res.tapIndex) {
								case 0:
									this.textareaDataSync += "# 标题1\r";
									return;
								case 1:
									this.textareaDataSync += "## 标题2\r";
									return;
								case 2:
									this.textareaDataSync += "### 标题3\r";
									return;
								case 3:
									this.textareaDataSync += "#### 标题4\r";
									return;
								case 4:
									this.textareaDataSync += "##### 标题5\r";
									return;
								case 5:
									this.textareaDataSync += "###### 标题6\r";
									return;
							}
						}
					})
				} else if (type == "underline") {
					this.textareaDataSync += "++下划线++ "
				} else if (type == "strike") {
					this.textareaDataSync += "~~中划线~~ "
				} else if (type == "sup") {
					this.textareaDataSync += "^上角标^ "
				} else if (type == "sub") {
					this.textareaDataSync += "~下角标~ "
				} else if (type == "alignleft") {
					this.textareaDataSync += "\n::: hljs-left\n\n左对齐\n\n:::\n"
				} else if (type == "aligncenter") {
					this.textareaDataSync += "\n::: hljs-center\n\n居中对齐\n\n:::\n"
				} else if (type == "alignright") {
					this.textareaDataSync += "\n::: hljs-right\n\n\n\n右对齐\n\n:::\n"
				} else if (type == "link") {
					this.textareaDataSync += "[在此输入网址描述](在此输入网址) "
				} else if (type == "imgage") {
					this.textareaDataSync += "![](在此输入图片地址) "
				} else if (type == "code") {
					this.textareaDataSync += "\n``` 代码块 \n\n```\n"
				} else if (type == "table") {
					this.textareaDataSync += "\n|列1|列2|列3|\n|-|-|-|\n|单元格1|单元格2|单元格3|\n"
				} else if (type == "clear") {
					uni.showModal({
						title: "提示",
						content: "确定清空?",
						success: res => {
							if (res.confirm) {
								this.textareaDataSync = "";
							}
						}
					})
				}
			},
			getCursor(e) {
				//安卓失去焦点获取不到cursor位置,暂不使用
				//this.cursor = e.detail.cursor; 
			}
		},
		watch: {
			"textareaDataSync": function (newValue, oldValue) {
				this.textareaHtmlSync = marked(newValue)
				this.$emit('update:textareaData', newValue)
				this.$emit('update:textareaHtml', this.textareaHtmlSync)
			}
		},
		mounted: function () {
{'fraction_non_alphanumeric': 0.1943480416460089, 'fraction_numerical': 0.006445215666831929, 'mean_word_length': 2.7960105382009783, 'pattern_counts': {'":': 2, '<': 99, '<?xml version=': 0, '>': 103, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4821834', 'n_tokens_mistral': 4907, 'n_tokens_neox': 3843, 'n_words': 628}