This commit is contained in:
2025-08-05 09:28:17 +08:00
parent 7d2e634aca
commit b761ae562f
2 changed files with 26 additions and 18 deletions

View File

@@ -46,7 +46,7 @@
<!-- 固定的输入框部分 -->
<view style="height: calc(100% - 120rpx)">
<commonEditor :content="formData.message" placeholder="请输入文章正文内容" height="calc(100% - 120px)"></commonEditor>
<commonEditor :content="formData.message" placeholder="请输入文章正文内容" height="calc(100% - 25px)"></commonEditor>
<!-- <textarea
v-model="formData.message"

View File

@@ -5,8 +5,11 @@
<view class='wrapper' style="height: 100%;">
<PickerColor ref="colorPicker" :color="{r: 255,g: 0,b: 0,a: 0.6}" @confirm="confirm"></PickerColor>
<view class='toolbar' @tap="format">
<view :class="formats.fontSize === '24px' ? 'ql-active' : ''" class="iconfont icon-font-size"
data-name="fontSize" data-value="24px"></view>
<!-- <view class="iconfont icon-undo" @tap="undo"></view>
<view class="iconfont icon-redo" @tap="redo"></view> -->
<view class="iconfont icon-charutupian" @tap="insertImage"></view>
<!-- <view :class="formats.fontSize === '24px' ? 'ql-active' : ''" class="iconfont icon-font-size"
data-name="fontSize" data-value="24px"></view> -->
<view :class="formats.color? 'ql-active' : ''" class="iconfont icon-zitiyanse" data-name="color" :data-value="formats.color">
</view>
<view :class="formats.header === 1 ? 'ql-active' : ''" class="iconfont icon-formatheader1"
@@ -17,9 +20,9 @@
</view>
<view :class="formats.italic ? 'ql-active' : ''" class="iconfont icon-zitixieti"
data-name="italic"></view>
<view :class="formats.underline ? 'ql-active' : ''" class="iconfont icon-zitixiahuaxian"
data-name="underline"></view>
<view :class="formats.strike ? 'ql-active' : ''" class="iconfont icon-shanchuxian"
<!-- <view :class="formats.underline ? 'ql-active' : ''" class="iconfont icon-zitixiahuaxian"
data-name="underline"></view> -->
<!-- <view :class="formats.strike ? 'ql-active' : ''" class="iconfont icon-shanchuxian"
data-name="strike"></view>
<view :class="formats.align === 'left' ? 'ql-active' : ''" class="iconfont icon-zuoduiqi"
data-name="align" data-value="left"></view>
@@ -35,21 +38,20 @@
data-name="letterSpacing" data-value="2em">
</view>
<view :class="formats.marginTop ? 'ql-active' : ''" class="iconfont icon-duanqianju"
data-name="marginTop" data-value="10px"></view>
<view :class="formats.previewarginBottom ? 'ql-active' : ''" class="iconfont icon-duanhouju"
data-name="marginBottom" data-value="10px"></view>
data-name="marginTop" data-value="10px"></view> -->
<!-- <view :class="formats.previewarginBottom ? 'ql-active' : ''" class="iconfont icon-duanhouju"
data-name="marginBottom" data-value="10px"></view> -->
<!-- <view class="iconfont icon-rili4" @tap="insertDate"></view> -->
<view class="iconfont icon-checklist" data-name="list" data-value="check"></view>
<!-- <view class="iconfont icon-checklist" data-name="list" data-value="check"></view> -->
<view :class="formats.list === 'ordered' ? 'ql-active' : ''" class="iconfont icon-youxupailie"
data-name="list" data-value="ordered"></view>
<view :class="formats.list === 'bullet' ? 'ql-active' : ''" class="iconfont icon-wuxupailie"
data-name="list" data-value="bullet"></view>
<view class="iconfont icon-outdent" data-name="indent" data-value="-1"></view>
<view class="iconfont icon-indent" data-name="indent" data-value="+1"></view>
<!-- <view :class="formats.list === 'bullet' ? 'ql-active' : ''" class="iconfont icon-wuxupailie"
data-name="list" data-value="bullet"></view> -->
<!-- <view class="iconfont icon-outdent" data-name="indent" data-value="-1"></view>
<view class="iconfont icon-indent" data-name="indent" data-value="+1"></view> -->
<view class="iconfont icon-fengexian" @tap="insertDivider"></view>
<view class="iconfont icon-charutupian" @tap="insertImage"></view>
<view class="iconfont icon-undo" @tap="undo"></view>
<view class="iconfont icon-redo" @tap="redo"></view>
<view class="iconfont icon-format" @tap="clear"></view>
</view>
<editor :style="`height:${height}`" style="overflow: auto;padding: 6px;box-sizing: border-box;margin-top: 10px;background-color: transparent;" id="editor" class="editor" :placeholder="placeholder" showImgSize showImgToolbar showImgResize
@@ -391,11 +393,17 @@
.toolbar {
box-sizing: border-box;
border-bottom: 0;
margin-bottom: 10upx;
margin-bottom: 0;
position: fixed;
bottom: 10upx;
left: 0;
right: 0;
}
.ql-container {
box-sizing: border-box;
margin-top: 0px !important;
width: 100%;
min-height: 300upx;
height: auto;