<template>
	<view class="content">

		<view class="text-area" @click="gologin()">
			<view class=""> 点击跳转测试登录</view>
		</view>
		<view class="text-area" @click="godljy()">
			<view class=""> 点击跳转测试道路救援</view>
		</view>
		<view class="text-area" @click="goqcjc()">
			<view class=""> 点击跳转测试汽车检测</view>
		</view>
		<Rboy-editor ref="RboyEditor" @uploadFile="uploadFile" :count="6"></Rboy-editor>
		<button @click="get_content">获取内容</button>
		<button @click="set_content">设置内容</button>

		<!-- 	<view class="w-box">
				  <mEditor v-model="content" ids="content"></mEditor>
			</view>
	      -->


	</view>
</template>



<script>
	import RboyEditor from "@/components/Rboy-editor/Rboy-editor"
	export default {
		data() {
			return {
				title: 'user',
				placeholder: '开始输入...',
				detail: "<p>Rboy 设置的内容</p>",
				items: [
					'1',
					'2',
					'3',
					'4',
					'5',
					'6',
					// ...
				],
				showScroll: true,
				scrollDuration: 3000 // 滚动间隔时间，单位为毫秒
			}
		},

		components: {
			RboyEditor,
		},
		methods: {
			// 设置内容
			async set_content() {
				this.$refs.RboyEditor.editor_setContents(this.detail)
			},
			// 获取内容
			async get_content() {
				let detail = await this.$refs.RboyEditor.editor_getcontents()
				console.log(detail)
			},
			// 上传图片
			async uploadFile(event) {
				// event 选择的图片
				// for (var item in event.tempFilePaths) {
				//     // uploadFileApi  为上传到服务端的接口 count大于1 使用 await 
				//     let src = await uploadFileApi(event.tempFilePaths[item])
				//     // src.url 是服务端返回的图片地址
				//     // this.$refs.RboyEditor(Object) 方法是往富文本设置图片内容  src 图片地址
				//     this.$refs.RboyEditor.editor_insertImage({
				//         src: src.url,
				//         alt: "图像",
				//     })
				// }
			},
			gologin() {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			},
			godljy() {
				uni.navigateTo({
					url: '/pages/rescue/rescue'
				})
			},
			goqcjc() {
				uni.navigateTo({
					url: '/pages/detection/detection'
				})
			},
			startScrolling() {
				this.showScroll = true;
				setInterval(() => {
					this.scrollItems();
				}, this.scrollDuration);
			},
			scrollItems() {
				this.items.push(this.items.shift());
			}
		}
	}
</script>

<style>
	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		margin-top: 50px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: cornflowerblue;
		color: white;
		padding: 5px;

	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}

	.container {
		width: 100%;
		height: 300px;
	}

	.content {
		width: 100%;
		height: 100%;
		white-space: nowrap;
		overflow: hidden;
		box-sizing: 20px;
		padding: 10px;
	}

	.item {
		/* display: inline-block; */
		margin: 0 10px;
		font-size: 16px;
	}

	.w-box {
		width: 400px;
		box-sizing: border-box;
		padding: 10px;

	}

	#editor {
		width: 100%;
		height: 300px;
		background-color: #CCCCCC;
	}

	button {
		margin-top: 10px;
	}
</style>