入库流程对接完毕

2026-04-03 08:38:34 +08:00
parent dde27ed688
commit ce6d5e5d6e
42 changed files with 3028 additions and 936 deletions
--- a/pages/components/LineSteps.vue
+++ b/pages/components/LineSteps.vue
@@ -0,0 +1,97 @@
+<template>
+  <view class="step-container">
+    <view class="step-item" :class="{ done: index < current, active: index == current }"
+      v-for="(item, index) in stepList" :key="index">
+      <!-- 节点圆圈 -->
+      <view class="step-circle">{{ index + 1 }}</view>
+      <!-- 文字 -->
+      <view class="step-text">{{ item }}</view>
+      <!-- 连接线（最后一个不显示） -->
+      <view class="step-line" v-if="index !== stepList.length - 1"></view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+
+// 步骤列表
+const stepList = ref(['创建', '审核', '绑定', '完成'])
+// 当前进度（0开始）
+const current = ref(2)
+</script>
+
+<style scoped>
+/* 整体容器 */
+.step-container {
+  display: flex;
+  padding: 30rpx;
+  background: #fff;
+  border-radius: 16rpx;
+}
+
+/* 单个步骤 */
+.step-item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: relative;
+}
+
+/* 节点圆圈 */
+.step-circle {
+  width: 40rpx;
+  height: 40rpx;
+  border-radius: 50%;
+  background: #cdd4e0;
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 24rpx;
+  z-index: 10;
+}
+
+/* 文字 */
+.step-text {
+  margin-top: 12rpx;
+  font-size: 24rpx;
+  color: #999;
+}
+
+/* 连接线 */
+.step-line {
+  position: absolute;
+  top: 20rpx;
+  left: 50%;
+  width: 100%;
+  height: 4rpx;
+  background: #cdd4e0;
+  z-index: 1;
+}
+
+/* ============= 状态样式 ============= */
+/* 已完成 */
+.step-item.done .step-circle {
+  background: #07c160;
+}
+
+.step-item.done .step-line {
+  background: #07c160;
+}
+
+.step-item.done .step-text {
+  color: #07c160;
+}
+
+/* 当前激活 */
+.step-item.active .step-circle {
+  background: #465bfd;
+}
+
+.step-item.active .step-text {
+  color: #465bfd;
+  font-weight: bold;
+}
+</style>