使用css实现工单处理进度流程图

最新推荐文章于 2025-04-15 15:57:35 发布

krico233

最新推荐文章于 2025-04-15 15:57:35 发布

阅读量1.6k

点赞数 1

分类专栏：我的开发笔记

本文链接：https://blog.csdn.net/krico233/article/details/119342122

版权

该流程图已经过多设备兼容测试，针对不同大小的屏幕并不会出样式错乱问题
在这里插入图片描述
下面是项目代码

	  <div class="box7">
        <div class="title">处理进度</div>
        <div class="box7-content">
          <div class="line-box">
            <div class="line1">
              <div 
              :class="box1Info.dqhjbh === '0101' ? 'now' : box1Info.dqhjbh > '0101' ? 'finishedIcon' : ''" class="item"><div class="icon"></div><span>省公司下发</span></div>
              <div :class="box1Info.dqhjbh > '0101' ? 'finishedLine' : ''" class="xiafa">下发</div>
              <div :class="box1Info.dqhjbh === '0102' ? 'now' : box1Info.dqhjbh > '0102' ? 'finishedIcon' : ''" class="item"><div class="icon"></div><span>地市局下发</span></div>
              <div :class="box1Info.dqhj

最低0.47元/天解锁文章