GuangYuYuan-shanghu/src/pages/my/dynamic/dynamicDetail.vue

<template>
  <view class="dynamic-detail">
    <!-- 滚动容器 -->
    <scroll-view scroll-y class="scroll-wrap">
      <view class="page-content">
        <!-- 审核驳回区域 -->
        <view class="reject-card">
          <view class="reject-head">
            <u-icon name="close-circle" size="38" color="#999"></u-icon>
            <text class="reject-title">审核驳回</text>
            <text>审核中</text>
          </view>
          <view class="reject-text">
            审核结果将会在X-X个工作日通知您
          </view>
        </view>

        <!-- 文章标题 -->
        <view class="article-title">
          业财对账总对不平？先搞清楚你对的是「业务账」还是「资金账」
        </view>

        <!-- 发布信息 -->
        <view class="info-bar">
          <text>娜娜</text>
          <text>2025.12.25 16:23:25</text>
          <text>252已读</text>
        </view>

        <!-- 正文内容 -->
        <view class="article-body">
          「业务账」是什么：业务账是从业务视角算出来的「该收多少、该付多少」，订单、支付、退款、手续费、调账，按业务规则轧差后的结果。例如：某商户今日订单100万、退款5万、手续费2万，业务上净应收93万。数据来源是业务系统：交易、清结算、账务等，不涉及「银行/渠道实际到没到账」。「资金账」是什么：资金账是从资金视角看到的「实际到账多少、实际划出多少」，渠道给我们的到账、我们给商户的划付、银行流水。例如：某日渠道实际到账92万、我们实际划给商户90万，资金上就是这两笔数。数据来源是渠道对账文件、银行流水、划付记录，是「钱真的动了」的那部分。
        </view>

        <!-- 图片/视频占位 -->
        <view class="media-placeholder">
          <text>视频/图片</text>
        </view>
      </view>
    </scroll-view>
  </view>
</template>

<script>
export default {
  name: 'DynamicDetail',
  data() {
    return {}
  }
}
</script>

<style lang="scss"  scoped>
/* 滚动区域高度：扣除导航栏高度 */
.scroll-wrap {
  height: calc(100vh - var(--u-navbar-height));
}
/* 页面整体内边距 */
.page-content {
  padding: 32rpx;
}
/* 驳回卡片样式 */
.reject-card {
  border: 1rpx solid #eeeeee;
  border-radius: 12rpx;
  padding: 28rpx;
  margin-bottom: 36rpx;
}
.reject-head {
  display: flex;
  align-items: center;
  gap: 18rpx;
  margin-bottom: 16rpx;
}
.reject-title {
  font-size: 32rpx;
  font-weight: 500;
  color: #333333;
}
.reject-text {
  font-size: 28rpx;
  color: #666666;
  line-height: 1.6;
}
/* 文章标题 */
.article-title {
  font-size: 34rpx;
  font-weight: 500;
  line-height: 1.5;
  color: #222;
  margin-bottom: 22rpx;
}
/* 发布信息栏 */
.info-bar {
  display: flex;
  gap: 32rpx;
  font-size: 26rpx;
  color: #888888;
  margin-bottom: 32rpx;
}
/* 正文 */
.article-body {
  font-size: 30rpx;
  color: #333333;
  line-height: 1.7;
  margin-bottom: 42rpx;
}
/* 媒体占位框 */
.media-placeholder {
  width: 300rpx;
  height: 300rpx;
  background-color: #eeeeee;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30rpx;
  color: #666666;
}
</style>