detection-user/pages/index/index.vue

167 lines
3.2 KiB
Vue
Raw Normal View History

2024-09-01 18:16:43 +08:00
<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>