diff --git a/pages-order/orderDetail/orderDetail.vue b/pages-order/orderDetail/orderDetail.vue
index 3d3e99f..2ba4804 100644
--- a/pages-order/orderDetail/orderDetail.vue
+++ b/pages-order/orderDetail/orderDetail.vue
@@ -175,27 +175,7 @@
         <view class="card cardInfo projCard">
           <view class="projTitle">维修进度记录表</view>
           <view class="projList">
-            <view class="tushi-box">
-              <view class="tushi-item">- 待维修  </view>
-              <view class="tushi-item" style="color: #E8A321">○ 维修中  </view>
-              <view class="tushi-item" style="color: #17DBB1;">√ 已完成</view>
-            </view>
-            <uni-table ref="table" :loading="false" border stripe  emptyText="暂无数据">
-              <uni-tr>
-                <uni-th width="50" align="center">序号</uni-th>
-                <uni-th align="center">维修项目</uni-th>
-                <uni-th width="30" align="center" >-</uni-th>
-                <uni-th width="30" align="center" >○</uni-th>
-                <uni-th width="30" align="center" >√</uni-th>
-              </uni-tr>
-              <uni-tr v-for="(item, index) in tableData" :key="index">
-                <uni-td align="center">{{ index+1 }}</uni-td>
-                <uni-td>{{ item.itemName }}</uni-td>
-                <uni-td align="center"><text v-if="item.itemStatus=='01'">-</text></uni-td>
-                <uni-td align="center"><text v-if="item.itemStatus=='02'" style="color: #E8A321">○</text></uni-td>
-                <uni-td align="center"><text v-if="item.itemStatus=='03'" style="color: #17DBB1;">√</text></uni-td>
-              </uni-tr>
-            </uni-table>
+            <uni-steps :options="list2" active-color="#007AFF" :active="active" direction="column" />
           </view>
         </view>
         <view class="card cardInfo projCard">
@@ -258,6 +238,8 @@
         imgUrlPrex:config.baseImageUrl,
         //维修项目进度记录表
         tableData:[],
+        active: 1,
+        list2: [],
 			};
 		},
     onLoad(data){
@@ -316,7 +298,21 @@
           tenantIdFlag:false
         }).then((res)=>{
           if(res.code==200){
-            this.tableData =  res.data
+            this.list2 = []
+            //当前在修的项目
+            let endIndex = -1
+            for (let i = 0; i < res.data.length; i++) {
+              let thisObj = res.data[i]
+              thisObj.title = thisObj.itemName
+              if(thisObj.itemStatus=='03'){
+                //这个项目已处理完毕,维修完成的项目设置为这个
+                endIndex = i
+                thisObj.desc = formatTimestamp(thisObj.updateTime)
+              }
+              this.list2.push(thisObj)
+            }
+            this.active = endIndex
+            console.log(this.list2,"thisObj.itemStatus=='02'")
           }
         })
       },
diff --git a/uni_modules/uni-steps/components/uni-steps/uni-steps.vue b/uni_modules/uni-steps/components/uni-steps/uni-steps.vue
new file mode 100644
index 0000000..11fb29c
--- /dev/null
+++ b/uni_modules/uni-steps/components/uni-steps/uni-steps.vue
@@ -0,0 +1,280 @@
+<template>
+	<view class="uni-steps">
+		<view :class="[direction==='column'?'uni-steps__column':'uni-steps__row']">
+			<view :class="[direction==='column'?'uni-steps__column-text-container':'uni-steps__row-text-container']">
+				<view v-for="(item,index) in options" :key="index"
+					:class="[direction==='column'?'uni-steps__column-text':'uni-steps__row-text']">
+					<text :style="{color:index === active?activeColor:deactiveColor}"
+						:class="[direction==='column'?'uni-steps__column-title':'uni-steps__row-title']">{{item.title}}</text>
+					<text v-if="item.desc" :style="{color: deactiveColor}"
+						:class="[direction==='column'?'uni-steps__column-desc':'uni-steps__row-desc']">{{item.desc}}</text>
+				</view>
+			</view>
+			<view :class="[direction==='column'?'uni-steps__column-container':'uni-steps__row-container']">
+				<view :class="[direction==='column'?'uni-steps__column-line-item':'uni-steps__row-line-item']"
+					v-for="(item,index) in options" :key="index" :style="{height: direction === 'column'?heightArr[index]+'px':'14px'}">
+					<view
+						:class="[direction==='column'?'uni-steps__column-line':'uni-steps__row-line',direction==='column'?'uni-steps__column-line--before':'uni-steps__row-line--before']"
+						:style="{backgroundColor:index<=active&&index!==0?activeColor:index===0?'transparent':deactiveColor}">
+					</view>
+					<view :class="[direction==='column'?'uni-steps__column-check':'uni-steps__row-check']"
+						v-if="index === active">
+						<uni-icons :color="activeColor" :type="activeIcon" size="20" />
+					</view>
+					<view v-else :class="[direction==='column'?'uni-steps__column-circle':'uni-steps__row-circle']"
+						:style="{backgroundColor:index<active?activeColor:deactiveColor}" />
+					<view
+						:class="[direction==='column'?'uni-steps__column-line':'uni-steps__row-line',direction==='column'?'uni-steps__column-line--after':'uni-steps__row-line--after']"
+						:style="{backgroundColor:index<active&&index!==options.length-1?activeColor:index===options.length-1?'transparent':deactiveColor}" />
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	/**
+	 * Steps 步骤条
+	 * @description 评分组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=34
+	 * @property {Number} active 当前步骤
+	 * @property {String} direction = [row|column] 当前步骤
+	 * 	@value row 横向
+	 * 	@value column 纵向
+	 * @property {String} activeColor 选中状态的颜色
+	 * @property {Array} options 数据源，格式为：[{title:'xxx',desc:'xxx'},{title:'xxx',desc:'xxx'}]
+	 */
+
+	export default {
+		name: 'UniSteps',
+		props: {
+			direction: {
+				// 排列方向 row column
+				type: String,
+				default: 'row'
+			},
+			activeColor: {
+				// 激活状态颜色
+				type: String,
+				default: '#2979FF'
+			},
+			deactiveColor: {
+				// 未激活状态颜色
+				type: String,
+				default: '#B7BDC6'
+			},
+			active: {
+				// 当前步骤
+				type: Number,
+				default: 0
+			},
+			activeIcon: {
+				// 当前步骤
+				type: String,
+				default: 'checkbox-filled'
+			},
+			options: {
+				type: Array,
+				default () {
+					return []
+				}
+			} // 数据
+		},
+		data() {
+			return {
+				heightArr: [],
+			}
+		},
+		mounted() {
+			//根据内容设置步骤条的长度
+			if (this.direction === 'column') {
+				let that = this;
+				//只能用类选择器，用id选择器所获取的元素信息不准确
+				uni.createSelectorQuery().in(this).selectAll('.uni-steps__column-text').boundingClientRect(data => {
+					that.heightArr = data.map(item => item.height + 1);
+				}).exec()
+			}
+		},
+	}
+</script>
+
+<style lang="scss">
+	$uni-primary: #2979ff !default;
+	$uni-border-color: #EDEDED;
+
+	.uni-steps {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		width: 100%;
+		/* #endif */
+		/* #ifdef APP-NVUE */
+		flex: 1;
+		/* #endif */
+		flex-direction: column;
+	}
+
+	.uni-steps__row {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: column;
+	}
+
+	.uni-steps__column {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row-reverse;
+	}
+
+	.uni-steps__row-text-container {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+		align-items: flex-end;
+		margin-bottom: 8px;
+	}
+
+	.uni-steps__column-text-container {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: column;
+		flex: 1;
+	}
+
+	.uni-steps__row-text {
+		/* #ifndef APP-NVUE */
+		display: inline-flex;
+		/* #endif */
+		flex: 1;
+		flex-direction: column;
+	}
+
+	.uni-steps__column-text {
+		padding: 6px 0px;
+		border-bottom-style: solid;
+		border-bottom-width: 1px;
+		border-bottom-color: $uni-border-color;
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: column;
+	}
+
+	.uni-steps__row-title {
+		font-size: 14px;
+		line-height: 16px;
+		text-align: center;
+	}
+
+	.uni-steps__column-title {
+		font-size: 18px;
+		text-align: left;
+		line-height: 24px;
+	}
+
+	.uni-steps__row-desc {
+		font-size: 12px;
+		line-height: 14px;
+		text-align: center;
+	}
+
+	.uni-steps__column-desc {
+		font-size: 16px;
+		text-align: left;
+		line-height: 20px;
+	}
+
+	.uni-steps__row-container {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: row;
+	}
+
+	.uni-steps__column-container {
+		/* #ifndef APP-NVUE */
+		display: inline-flex;
+		/* #endif */
+		width: 30px;
+		flex-direction: column;
+	}
+
+	.uni-steps__row-line-item {
+		/* #ifndef APP-NVUE */
+		display: inline-flex;
+		/* #endif */
+		flex-direction: row;
+		flex: 1;
+		height: 14px;
+		line-height: 14px;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.uni-steps__column-line-item {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+	}
+
+	.uni-steps__row-line {
+		flex: 1;
+		height: 1px;
+		background-color: #B7BDC6;
+	}
+
+	.uni-steps__column-line {
+		width: 1px;
+		background-color: #B7BDC6;
+	}
+
+	.uni-steps__row-line--after {
+		transform: translateX(1px);
+	}
+
+	.uni-steps__column-line--after {
+		flex: 1;
+		transform: translate(0px, 1px);
+	}
+
+	.uni-steps__row-line--before {
+		transform: translateX(-1px);
+	}
+
+	.uni-steps__column-line--before {
+		height: 6px;
+		transform: translate(0px, -13px);
+	}
+
+	.uni-steps__row-circle {
+		width: 15px;
+		height: 15px;
+		border-radius: 50%;
+		background-color: #B7BDC6;
+		margin: 0px 3px;
+	}
+
+	.uni-steps__column-circle {
+		width: 15px;
+		height: 15px;
+		border-radius: 50%;
+		background-color: #B7BDC6;
+		margin: 4px 0px 5px 0px;
+	}
+
+	.uni-steps__row-check {
+		margin: 0px 6px;
+	}
+
+	.uni-steps__column-check {
+		height: 14px;
+		line-height: 14px;
+		margin: 2px 0px;
+	}
+</style>