|
|
|
@ -83,13 +83,22 @@ |
|
|
|
</view> |
|
|
|
<view class="form-item"> |
|
|
|
<uv-form-item label="文章内容" prop="description" labelPosition="top"> |
|
|
|
<view style="margin-top: 32rpx;"> |
|
|
|
<view class="editor__view" style="margin-top: 32rpx;"> |
|
|
|
<editor id="editor" class="editor" |
|
|
|
placeholder="请输入你的文章内容" |
|
|
|
@ready="onEditorReady" |
|
|
|
@input="onEditroInput" |
|
|
|
></editor> |
|
|
|
<button @click="insertImage" class="btn-insert-image"> |
|
|
|
<uv-icon name="plus" color="#707070" size="48rpx"></uv-icon> |
|
|
|
</button> |
|
|
|
<view class="flex editor-tools"> |
|
|
|
<view style="flex: 1;"> |
|
|
|
<button @click="insertImage" plain class="btn-simple" style="float: left; font-size: 0;"> |
|
|
|
<image src="../static/record/icon-add.png" style="width: 126rpx; height: 126rpx;" ></image> |
|
|
|
</button> |
|
|
|
</view> |
|
|
|
<view style="flex: 1; text-align: right;"> |
|
|
|
<text class="editor-count">{{ `${descLen}/${descLengthLimit}` }}</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</uv-form-item> |
|
|
|
</view> |
|
|
|
@ -129,6 +138,8 @@ |
|
|
|
// todo |
|
|
|
}, |
|
|
|
editorCtx: null, |
|
|
|
descLen: 0, |
|
|
|
descLengthLimit: 1000, |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
@ -137,23 +148,57 @@ |
|
|
|
this.editorCtx = res.context |
|
|
|
}).exec() |
|
|
|
}, |
|
|
|
onEditroInput(e) { |
|
|
|
const { text } = e.detail |
|
|
|
|
|
|
|
this.descLen = text?.length || 0 |
|
|
|
}, |
|
|
|
insertImage() { |
|
|
|
uni.chooseImage({ |
|
|
|
count: 1, |
|
|
|
success: (res) => { |
|
|
|
this.editorCtx.insertImage({ |
|
|
|
src: res.tempFilePaths[0], |
|
|
|
alt: '图像', |
|
|
|
}) |
|
|
|
// this.editorCtx.insertImage({ |
|
|
|
// src: res.tempFilePaths[0], |
|
|
|
// alt: '图像', |
|
|
|
// }) |
|
|
|
|
|
|
|
// todo: check |
|
|
|
this.$Oss.ossUpload(res.tempFilePaths[0]).then(url => { |
|
|
|
this.editorCtx.insertImage({ |
|
|
|
src: url, |
|
|
|
alt: '图像', |
|
|
|
}) |
|
|
|
}) |
|
|
|
} |
|
|
|
}) |
|
|
|
}, |
|
|
|
onSubmit() { |
|
|
|
// todo |
|
|
|
getEditroContents() { |
|
|
|
return new Promise((resolve, reject) => { |
|
|
|
this.editorCtx.getContents({ |
|
|
|
success: (e) => { |
|
|
|
const { html, text } = e |
|
|
|
resolve({ html, text }) |
|
|
|
}, |
|
|
|
fail: () => { |
|
|
|
reject() |
|
|
|
} |
|
|
|
}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
async onSubmit() { |
|
|
|
try { |
|
|
|
|
|
|
|
const description = (await this.getEditroContents())?.html |
|
|
|
// todo: decode? |
|
|
|
|
|
|
|
const params = { ...this.form } |
|
|
|
const params = { ...this.form, description } |
|
|
|
|
|
|
|
this.$api('submitPersonalSharing', params) |
|
|
|
// todo |
|
|
|
|
|
|
|
this.$api('submitPersonalSharing', params) |
|
|
|
} catch (err) { |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
} |
|
|
|
} |
|
|
|
@ -163,8 +208,24 @@ |
|
|
|
<style scoped lang="scss"> |
|
|
|
@import '../styles/pageForm.scss'; |
|
|
|
|
|
|
|
.editor__view { |
|
|
|
background-color: #F3F3F3; |
|
|
|
border-radius: 12rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.editor { |
|
|
|
height: 411rpx; |
|
|
|
height: 253rpx; |
|
|
|
padding: 20rpx; |
|
|
|
|
|
|
|
&-tools { |
|
|
|
align-items: flex-end; |
|
|
|
padding: 0 20rpx 16rpx 14rpx; |
|
|
|
} |
|
|
|
|
|
|
|
&-count { |
|
|
|
color: #999999; |
|
|
|
font-size: 28rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.btn-simple { |
|
|
|
@ -173,14 +234,7 @@ |
|
|
|
border: none; |
|
|
|
box-shadow: none; |
|
|
|
padding: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.button-submit { |
|
|
|
margin: 0; |
|
|
|
position: fixed; |
|
|
|
bottom: 138rpx; |
|
|
|
left: 20rpx; |
|
|
|
width: calc(100% - 40rpx); |
|
|
|
height: 90rpx; |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
