fix: 功能完善。

This commit is contained in:
tianyongbao
2025-12-27 12:38:21 +08:00
parent 5c40cc4189
commit a2c69d19c4
5 changed files with 355 additions and 42 deletions

View File

@@ -22,6 +22,12 @@
>
<text>本月</text>
</view>
<view
:class="['time-filter-item', { 'active': activeTimeFilter === 'nextMonth' }]"
@click="selectTimeFilter('nextMonth')"
>
<text>下月</text>
</view>
<view
:class="['time-filter-item', { 'active': activeTimeFilter === 'threeMonth' }]"
@click="selectTimeFilter('threeMonth')"
@@ -34,12 +40,6 @@
>
<text>近6月</text>
</view>
<view
:class="['time-filter-item', { 'active': activeTimeFilter === 'oneYear' }]"
@click="selectTimeFilter('oneYear')"
>
<text>近1年</text>
</view>
</view>
</view>
<view class="search-view">
@@ -561,6 +561,13 @@ function searchSubmit() {
const firstDay = new Date(today.getFullYear(), today.getMonth(), 1)
const lastDay = new Date(today.getFullYear(), today.getMonth() + 1, 0)
startTime = dayjs(firstDay).format(formatValue)
endTime = dayjs(lastDay).format(formatValue)
} else if (type === 'nextMonth') {
// 下月下月1号到下月月底
const firstDay = new Date(today.getFullYear(), today.getMonth() + 1, 1)
const lastDay = new Date(today.getFullYear(), today.getMonth() + 2, 0)
startTime = dayjs(firstDay).format(formatValue)
endTime = dayjs(lastDay).format(formatValue)
} else if (type === 'threeMonth') {
@@ -575,13 +582,6 @@ function searchSubmit() {
const firstDay = new Date(today.getFullYear(), today.getMonth(), 1)
const lastDay = new Date(today.getFullYear(), today.getMonth() + 6, 0)
startTime = dayjs(firstDay).format(formatValue)
endTime = dayjs(lastDay).format(formatValue)
} else if (type === 'oneYear') {
// 近1年本月1号到11个月后的月底
const firstDay = new Date(today.getFullYear(), today.getMonth(), 1)
const lastDay = new Date(today.getFullYear(), today.getMonth() + 12, 0)
startTime = dayjs(firstDay).format(formatValue)
endTime = dayjs(lastDay).format(formatValue)
}
@@ -613,7 +613,9 @@ const end = new Date(today.getFullYear(), today.getMonth() + 1, 0)
function getList() {
getInstallmentHistoryAnalysis({...queryParams.value }).then(res => {
historyObj.value = { ...res.data }
listData.value = listData.value.concat(res.data.tableHistoryDetailList)
// 将获取的数据倒序排列后再添加到列表
const reversedData = res.data.tableHistoryDetailList ? [...res.data.tableHistoryDetailList].reverse() : []
listData.value = listData.value.concat(reversedData)
}).catch(() => {
})
}

View File

@@ -23,6 +23,12 @@
>
<text>本月</text>
</view>
<view
:class="['time-filter-item', { 'active': activeTimeFilter === 'nextMonth' }]"
@click="selectTimeFilter('nextMonth')"
>
<text>下月</text>
</view>
<view
:class="['time-filter-item', { 'active': activeTimeFilter === 'threeMonth' }]"
@click="selectTimeFilter('threeMonth')"
@@ -35,12 +41,6 @@
>
<text>近6月</text>
</view>
<view
:class="['time-filter-item', { 'active': activeTimeFilter === 'oneYear' }]"
@click="selectTimeFilter('oneYear')"
>
<text>近1年</text>
</view>
</view>
</view>
<view class="search-view">
@@ -563,6 +563,13 @@ function searchSubmit() {
const firstDay = new Date(today.getFullYear(), today.getMonth(), 1)
const lastDay = new Date(today.getFullYear(), today.getMonth() + 1, 0)
startTime = dayjs(firstDay).format(formatValue)
endTime = dayjs(lastDay).format(formatValue)
} else if (type === 'nextMonth') {
// 下月下月1号到下月月底
const firstDay = new Date(today.getFullYear(), today.getMonth() + 1, 1)
const lastDay = new Date(today.getFullYear(), today.getMonth() + 2, 0)
startTime = dayjs(firstDay).format(formatValue)
endTime = dayjs(lastDay).format(formatValue)
} else if (type === 'threeMonth') {
@@ -577,13 +584,6 @@ function searchSubmit() {
const firstDay = new Date(today.getFullYear(), today.getMonth(), 1)
const lastDay = new Date(today.getFullYear(), today.getMonth() + 6, 0)
startTime = dayjs(firstDay).format(formatValue)
endTime = dayjs(lastDay).format(formatValue)
} else if (type === 'oneYear') {
// 近1年本月1号到11个月后的月底
const firstDay = new Date(today.getFullYear(), today.getMonth(), 1)
const lastDay = new Date(today.getFullYear(), today.getMonth() + 12, 0)
startTime = dayjs(firstDay).format(formatValue)
endTime = dayjs(lastDay).format(formatValue)
}
@@ -616,7 +616,9 @@ function searchSubmit() {
function getList() {
getInstallmentHistoryAnalysis({...queryParams.value }).then(res => {
historyObj.value = { ...res.data }
listData.value = listData.value.concat(res.data.tableHistoryDetailList)
// 将获取的数据倒序排列后再添加到列表
const reversedData = res.data.tableHistoryDetailList ? [...res.data.tableHistoryDetailList].reverse() : []
listData.value = listData.value.concat(reversedData)
}).catch(() => {
})
}

View File

@@ -25,8 +25,55 @@
<u-icon slot="right" name="arrow-right"></u-icon>
</u-form-item>
<u-form-item label="内容" prop="remark" required labelPosition="top">
<u--textarea v-model="form.remark" placeholder="请填写内容" border="none" autoHeight count
maxlength="20000" style="padding:18rpx 0; min-height: 300rpx;"></u--textarea>
<view class="editor-container">
<view class="editor-toolbar">
<view class="toolbar-item" @click="format('bold')">
<text class="iconfont">B</text>
</view>
<view class="toolbar-item" @click="format('italic')">
<text class="iconfont italic">I</text>
</view>
<view class="toolbar-item" @click="format('underline')">
<text class="iconfont underline">U</text>
</view>
<view class="toolbar-divider"></view>
<view class="toolbar-item" @click="format('header', 'H1')">
<text class="iconfont">H1</text>
</view>
<view class="toolbar-item" @click="format('header', 'H2')">
<text class="iconfont">H2</text>
</view>
<view class="toolbar-divider"></view>
<view class="toolbar-item" @click="format('insertOrderedList')">
<text class="iconfont">1.</text>
</view>
<view class="toolbar-item" @click="format('insertUnorderedList')">
<text class="iconfont"></text>
</view>
<view class="toolbar-divider"></view>
<view class="toolbar-item" @click="undo">
<text class="iconfont"></text>
</view>
<view class="toolbar-item" @click="redo">
<text class="iconfont"></text>
</view>
</view>
<editor
id="editor"
class="editor-content"
:placeholder="'请填写内容'"
@ready="onEditorReady"
@input="onEditorInput"
@focus="editorFocus"
@blur="editorBlur"
:show-img-size="false"
:show-img-toolbar="false"
:show-img-resize="false"
></editor>
<view class="editor-counter">
<text>{{ contentLength }}/20000</text>
</view>
</view>
</u-form-item>
</u--form>
<view class="form-btn">
@@ -60,6 +107,8 @@ const datePickShow = ref(false)
const showTeam = ref(false)
const title = ref("心路历程")
const journeyTypeList = ref([])
const editorCtx = ref(null)
const contentLength = ref(0)
const data = reactive({
form: {},
rules: {
@@ -83,6 +132,68 @@ onLoad((option) => {
onReady(() => {
form.value.createTime = dayjs(new Date().getTime()).format("YYYY-MM-DD HH:mm:ss")
})
// 编辑器初始化完成
function onEditorReady() {
uni.createSelectorQuery().select('#editor').context((res) => {
editorCtx.value = res.context
// 如果是编辑模式,设置初始内容
if (form.value.remark) {
editorCtx.value.setContents({
html: form.value.remark
})
}
}).exec()
}
// 编辑器内容变化
function onEditorInput(e) {
// 获取HTML内容
editorCtx.value.getContents({
success: (res) => {
form.value.remark = res.html
// 计算内容长度去除HTML标签
const text = res.text || ''
contentLength.value = text.length
}
})
}
// 编辑器获得焦点
function editorFocus() {
// 可以添加焦点样式
}
// 编辑器失去焦点
function editorBlur() {
// 保存内容
if (editorCtx.value) {
editorCtx.value.getContents({
success: (res) => {
form.value.remark = res.html
}
})
}
}
// 格式化文本
function format(name, value) {
if (!editorCtx.value) return
editorCtx.value.format(name, value)
}
// 撤销
function undo() {
if (!editorCtx.value) return
editorCtx.value.undo()
}
// 重做
function redo() {
if (!editorCtx.value) return
editorCtx.value.redo()
}
function getDict() {
// 类型
getDicts('journey_type').then(res => {
@@ -95,7 +206,12 @@ onLoad((option) => {
getDicts('journey_type').then(result => {
form.value.typeName=dictStr(form.value.type, result.data)
})
// 如果编辑器已经初始化,设置内容
if (editorCtx.value && form.value.remark) {
editorCtx.value.setContents({
html: form.value.remark
})
}
})
}
}
@@ -135,6 +251,21 @@ onLoad((option) => {
datePickShow.value = false
}
function submit() {
// 提交前确保获取最新的编辑器内容
if (editorCtx.value) {
editorCtx.value.getContents({
success: (res) => {
form.value.remark = res.html
// 执行表单验证和提交
doSubmit()
}
})
} else {
doSubmit()
}
}
function doSubmit() {
proxy.$refs['uForm'].validate().then(() => {
if (form.value.id != null) {
updateHeartJourney(form.value).then(res => {
@@ -194,6 +325,86 @@ onLoad((option) => {
}
}
}
.editor-container {
border: 2rpx solid #e8edf3;
border-radius: 12rpx;
overflow: hidden;
background: #ffffff;
.editor-toolbar {
display: flex;
align-items: center;
padding: 12rpx;
background: #f8f9fa;
border-bottom: 2rpx solid #e8edf3;
flex-wrap: wrap;
gap: 8rpx;
.toolbar-item {
display: flex;
align-items: center;
justify-content: center;
width: 56rpx;
height: 56rpx;
background: #ffffff;
border-radius: 8rpx;
border: 2rpx solid #e8edf3;
transition: all 0.3s ease;
&:active {
transform: scale(0.95);
background: #667eea;
border-color: #667eea;
.iconfont {
color: #ffffff;
}
}
.iconfont {
font-size: 28rpx;
font-weight: 600;
color: #333333;
&.italic {
font-style: italic;
}
&.underline {
text-decoration: underline;
}
}
}
.toolbar-divider {
width: 2rpx;
height: 40rpx;
background: #e8edf3;
margin: 0 4rpx;
}
}
.editor-content {
min-height: 400rpx;
padding: 20rpx;
font-size: 28rpx;
line-height: 1.6;
background: #ffffff;
}
.editor-counter {
padding: 12rpx 20rpx;
background: #f8f9fa;
border-top: 2rpx solid #e8edf3;
text-align: right;
text {
font-size: 24rpx;
color: #999999;
}
}
}
</style>
<style lang="scss">

View File

@@ -40,7 +40,7 @@
<text>内容</text>
</view>
<view class="remark-content">
<text>{{ detailInfo.remark }}</text>
<rich-text :nodes="detailInfo.remark"></rich-text>
</view>
</view>
</view>
@@ -195,11 +195,57 @@ onLoad((option) => {
padding: 20rpx;
background: #f8f9fa;
border-radius: 8rpx;
font-size: 26rpx;
color: #2c3e50;
line-height: 1.8;
word-break: break-all;
text {
color: #2c3e50;
font-size: 26rpx;
line-height: 1.6;
// 富文本样式
:deep(p) {
margin: 12rpx 0;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
}
:deep(h1) {
font-size: 36rpx;
font-weight: 600;
margin: 20rpx 0 12rpx;
color: #1a1a1a;
}
:deep(h2) {
font-size: 32rpx;
font-weight: 600;
margin: 16rpx 0 12rpx;
color: #333333;
}
:deep(strong), :deep(b) {
font-weight: 600;
color: #1a1a1a;
}
:deep(em), :deep(i) {
font-style: italic;
}
:deep(u) {
text-decoration: underline;
}
:deep(ol), :deep(ul) {
margin: 12rpx 0;
padding-left: 40rpx;
}
:deep(li) {
margin: 8rpx 0;
line-height: 1.8;
}
}
}

View File

@@ -66,7 +66,9 @@
<view class="info-row-remark" v-if="item.remark">
<text class="info-label">内容</text>
<text class="info-value">{{ item.remark }}</text>
<view class="info-value-html">
<rich-text :nodes="item.remark"></rich-text>
</view>
</view>
</view>
@@ -541,12 +543,62 @@ page {
align-self: flex-start;
}
.info-value {
.info-value-html {
padding: 16rpx;
background: #f8f9fa;
border-radius: 8rpx;
font-size: 26rpx;
color: #666;
font-weight: 500;
line-height: 1.6;
text-align: left;
color: #2c3e50;
line-height: 1.8;
word-break: break-all;
// 富文本样式
:deep(p) {
margin: 12rpx 0;
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
}
:deep(h1) {
font-size: 34rpx;
font-weight: 600;
margin: 16rpx 0 12rpx;
color: #1a1a1a;
}
:deep(h2) {
font-size: 30rpx;
font-weight: 600;
margin: 16rpx 0 10rpx;
color: #333333;
}
:deep(strong), :deep(b) {
font-weight: 600;
color: #1a1a1a;
}
:deep(em), :deep(i) {
font-style: italic;
}
:deep(u) {
text-decoration: underline;
}
:deep(ol), :deep(ul) {
margin: 12rpx 0;
padding-left: 40rpx;
}
:deep(li) {
margin: 8rpx 0;
line-height: 1.8;
}
}
}
}