修复: remark强制渲染(醒目黄框内联样式) + 画布高度坍塌修复(100%撑满)

This commit is contained in:
2026-08-05 17:02:48 +08:00
parent 1d759f3e8c
commit 16762a8628

View File

@ -111,9 +111,10 @@
<text class="fc-name">{{ lockedTask.task_name }}</text>
<!-- 📌 交接/接收备注 -->
<view v-if="lockedTask.remark" class="fc-remark">
<text class="fc-remark-label">📌 交接/接收备注</text>
<text class="fc-remark-text">{{ lockedTask.remark }}</text>
<!-- 📌 交接/接收备注强制渲染极其醒目 -->
<view v-if="lockedTask.remark" style="margin-top:20rpx;padding:20rpx;background:#FFFBE8;border-left:8rpx solid #FADB14;border-radius:12rpx;">
<text style="font-size:26rpx;color:#8C6A00;font-weight:bold;">📌 初始/交接备注</text>
<view style="font-size:28rpx;color:#333;margin-top:10rpx;">{{ lockedTask.remark }}</view>
</view>
<view v-if="lockedTask.parent_task_id && parentTaskOf(lockedTask)" class="fc-link fc-up">
@ -159,8 +160,8 @@
<text class="zero-text">该产品暂无流转任务</text>
</view>
<view v-else class="canvas-hint">🖐 上下滑动看流程 · 左右滑动看分支</view>
<scroll-view v-else scroll-x scroll-y class="tree-canvas" :style="{ width: '100%', height: canvasHeight + 'px' }">
<view class="canvas-inner" :style="{ width: canvasWidth + 'px', height: canvasHeight + 'px' }">
<scroll-view v-else scroll-x scroll-y class="tree-canvas" style="width:100%;height:100%;">
<view class="canvas-inner" :style="{ width: Math.max(canvasWidth, 600) + 'px', height: Math.max(canvasHeight, 600) + 'px', padding: '40px' }">
<!-- 节点 -->
<view v-for="node in treeNodes" :key="node.id"
class="canvas-node" :class="statusColor(node.status)"
@ -1042,10 +1043,10 @@ export default {
.fc-time { font-size: 11px; color: #9ca3af; margin-top: auto; padding-top: 8px; border-top: 1px solid #f3f4f6; }
/* 流转树 2D 画布 */
.tree-area { flex: 1; overflow: hidden; min-height: 0; position: relative; }
.tree-area { flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden; background: #f5f6f8; }
.canvas-hint { font-size: 11px; color: #9ca3af; text-align: center; padding: 4px 0; flex-shrink: 0; }
.tree-canvas { flex: 1; min-height: 0; }
.canvas-inner { position: relative; }
.canvas-inner { position: relative; min-width: 200%; min-height: 200%; }
.canvas-node { position: absolute; width: 180px; min-height: 100px; background: #fff; border-radius: 10px; padding: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); border-top: 4px solid #3b82f6; }
.canvas-node.s-yellow { border-top-color: #f59e0b; }
.canvas-node.s-blue { border-top-color: #3b82f6; }