From 2c855b3c5495b6d0f933cd2af0cf2d9cb0a07b57 Mon Sep 17 00:00:00 2001
From: ChuShiZ <slw0830@163.com>
Date: Wed, 4 Dec 2024 21:39:18 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages-order/orderDetail/orderDetail.vue | 1001 ++++++++++++++++++-----
 1 file changed, 816 insertions(+), 185 deletions(-)

diff --git a/pages-order/orderDetail/orderDetail.vue b/pages-order/orderDetail/orderDetail.vue
index 889b4ed..1381f0b 100644
--- a/pages-order/orderDetail/orderDetail.vue
+++ b/pages-order/orderDetail/orderDetail.vue
@@ -3,6 +3,29 @@
     <view class="containerBody">
       <VNavigationBar background-color="#fff" title="工单详情" title-color="#333"></VNavigationBar>
       <view class="body" v-if="null!=ticketInfo">
+        <view class="orderInfo">
+          <view class="orderTypeInfo">
+            <text class="label">维修类别：</text>
+            <text class="value">{{ '维修保养' }}</text>
+          </view>
+          <view class="orderStateInfo">
+            <text>当前工单状态：</text>
+            <text>{{ ticketInfo.ticketsStatus == '02' ? '已完成' : ticketInfo.statusStr }}</text>
+          </view>
+          <view class="orderDateInfo">
+            <text class="label">车辆进厂时间：</text>
+            <text class="value">{{ '2024-11-20 12:00' }}</text>
+          </view>
+          <view class="orderDateInfo">
+            <text class="label">预计竣工时间：</text>
+            <text class="value">{{ '2024-11-21 12:00' }}</text>
+          </view>
+          <view class="orderDateInfo">
+            <text class="label">实际竣工时间：</text>
+            <text class="value">{{ '2024-11-21 12:00' }}</text>
+          </view>
+        </view>
+
         <view class="card cardInfo carCard">
           <view :class="{'end': ticketInfo.ticketsStatus == '02'}" class="orderFlag">
             <template>
@@ -22,7 +45,7 @@
 <!--            <text class="messageText">当前项目有待审批的配件申请单！</text>-->
 <!--            <u-icon color="#E8A321" name="arrow-right" size="14"></u-icon>-->
 <!--          </view>-->
-          <view class="carTitle">车辆信息</view>
+<!--          <view class="carTitle">车辆信息</view>-->
           <view class="carDetail">
             <view class="carHeader">
               <image v-show="ticketInfo.carInfo.logoImg" :src="imgUrlPrex + ticketInfo.carInfo.logoImg" class="carImage" mode="aspectFit"></image>
@@ -31,167 +54,254 @@
                 <text class="carType">{{ ticketInfo.carBrandName+"  " }} <text v-if="ticketInfo.carInfo && ticketInfo.carInfo.carModel"> - {{ticketInfo.carInfo.carModel}}</text></text>
               </view>
             </view>
+            <view class="line"></view>
             <view class="carBody">
-              <view style="display: flex;align-items: center">
-                <view class="infoItem" style="flex: 1">
+              <view style="display: flex;flex-direction: column;row-gap: 40rpx">
+                <view class="infoItem">
+                  <view class="label">车主</view>
+                  <view class="value">{{ ticketInfo.userName }}</view>
+                </view>
+                <view class="infoItem">
+                  <text class="label">联系方式</text>
+                  <text class="value">{{ ticketInfo.userMobile }}</text>
+                </view>
+                <view class="infoItem">
+                  <text class="label">性别</text>
+                  <text class="value">{{ ticketInfo.customerInfo.sex === '1' ? '女' : '男' }}</text>
+                </view>
+                <view class="infoItem">
+                  <text class="label">经办人</text>
+                  <text class="value">{{ ticketInfo.handleName }}</text>
+                </view>
+                <view class="infoItem">
+                  <text class="label">经办人电话</text>
+                  <text class="value">{{ ticketInfo.handleMobile }}</text>
+                </view>
+                <view class="line"></view>
+                <view class="infoItem">
                   <view class="label">车架号</view>
                   <view class="value">{{ ticketInfo.carVin }}</view>
                 </view>
-<!--                <view class="infoItem" style="flex: 1">-->
-<!--                  <view class="label">发动机号</view>-->
-<!--                  <view class="value">{{ ticketInfo.fdjNo }}</view>-->
-<!--                </view>-->
+                <view class="infoItem">
+                  <view class="label">发动机号</view>
+                  <view class="value">{{ ticketInfo.fdjNo }}</view>
+                </view>
+                <view class="infoItem">
+                  <view class="label">年检到期时间</view>
+                  <view class="value">{{ ticketInfo.nextInspectionDate}}</view>
+                </view>
+                <view class="infoItem">
+                  <view class="label">保险到期时间</view>
+                  <view class="value">{{ ticketInfo.insuranceExpiryDate}}</view>
+                </view>
                 <view class="infoItem" style="flex: 1">
                   <view class="label">注册日期</view>
                   <view class="value">{{ ticketInfo.carRegisterDate }}</view>
                 </view>
               </view>
-              <template v-if="carInfo.showAll">
-                <view style="display: flex;align-items: center">
-                  <view class="infoItem" style="flex: 1">
-                    <view class="label">年检到期时间</view>
-                    <view class="value">{{ ticketInfo.nextInspectionDate}}</view>
-                  </view>
-                  <view class="infoItem" style="flex: 1">
-                    <view class="label">保险到期时间</view>
-                    <view class="value">{{ ticketInfo.insuranceExpiryDate}}</view>
-                  </view>
-                </view>
+              <!--<template v-if="carInfo.showAll">-->
+              <!--  <view style="display: flex;align-items: center">-->
+                  <!--<view class="infoItem" style="flex: 1">-->
+                  <!--  <view class="label">年检到期时间</view>-->
+                  <!--  <view class="value">{{ ticketInfo.nextInspectionDate}}</view>-->
+                  <!--</view>-->
+                  <!--<view class="infoItem" style="flex: 1">-->
+                  <!--  <view class="label">保险到期时间</view>-->
+                  <!--  <view class="value">{{ ticketInfo.insuranceExpiryDate}}</view>-->
+                  <!--</view>-->
+                <!--</view>-->
 
-              </template>
-            </view>
-            <view class="carFoot">
-              <template v-if="!carInfo.showAll">
-                <text @click="() => $set(carInfo, 'showAll', true)">展开</text>
-                <image mode="aspectFit" src="/static/icons/bottom.png" style="width: 28rpx;height: 28rpx"></image>
-              </template>
-              <template v-else>
-                <text @click="() => carInfo.showAll = false">收起</text>
-                <!--<image mode="aspectFit" src="/static/icons/bottom.png" style="width: 28rpx;height: 28rpx"></image>-->
-              </template>
+              <!--</template>-->
             </view>
+            <!--<view class="carFoot">-->
+            <!--  <template v-if="!carInfo.showAll">-->
+            <!--    <text @click="() => $set(carInfo, 'showAll', true)">展开</text>-->
+            <!--    <image mode="aspectFit" src="/static/icons/bottom.png" style="width: 28rpx;height: 28rpx"></image>-->
+            <!--  </template>-->
+            <!--  <template v-else>-->
+            <!--    <text @click="() => carInfo.showAll = false">收起</text>-->
+            <!--    &lt;!&ndash;<image mode="aspectFit" src="/static/icons/bottom.png" style="width: 28rpx;height: 28rpx"></image>&ndash;&gt;-->
+            <!--  </template>-->
+            <!--</view>-->
           </view>
         </view>
-        <view class="card cardInfo userCard">
-          <view class="userTitle">客户信息</view>
-          <view class="userContainer">
-            <view style="display: flex;align-items: center">
-              <view class="infoItem" style="flex: 1">
-                <text class="label">姓名</text>
-                <text class="value">{{ ticketInfo.userName }}</text>
-              </view>
-              <view class="infoItem" style="flex: 1">
-                <text class="label">性别</text>
-                <text class="value">{{ ticketInfo.customerInfo.sex === '1' ? '女' : '男' }}</text>
-              </view>
-            </view>
-            <view v-if="ticketInfo.userName!=ticketInfo.handleName" style="display: flex;align-items: center">
-              <view class="infoItem" style="flex: 1">
-                <text class="label">经办人姓名</text>
-                <text class="value">{{ ticketInfo.handleName }}</text>
-              </view>
-              <view class="infoItem" style="flex: 1">
-                <text class="label">经办人电话</text>
-                <text class="value">{{ ticketInfo.handleMobile }}</text>
-              </view>
-            </view>
-            <template v-if="userInfo.showAll">
-              <view style="display: flex;align-items: center">
-                <view class="infoItem" style="flex: 1">
-                  <text class="label">联系方式</text>
-                  <text class="value">{{ ticketInfo.userMobile }}</text>
-                </view>
-                <view class="infoItem" style="flex: 1">
-                  <text class="label">生日</text>
-                  <text class="value">{{ ticketInfo.birthday }}</text>
-                </view>
-              </view>
-              <view class="infoItem">
-                <text class="label">联系地址</text>
-                <text class="value">
-                  {{ ticketInfo.customerInfo.address }}
-                </text>
-              </view>
-            </template>
-          </view>
-          <view v-if="loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')" class="userFoot">
-            <template v-if="!userInfo.showAll">
-              <text @click="() => $set(userInfo, 'showAll', true)">展开</text>
-              <image mode="aspectFit" src="/static/icons/bottom.png" style="width: 28rpx;height: 28rpx"></image>
-            </template>
-            <template v-else>
-              <text @click="() => userInfo.showAll = false">收起</text>
-              <!--<image mode="aspectFit" src="/static/icons/bottom.png" style="width: 28rpx;height: 28rpx"></image>-->
-            </template>
-          </view>
-        </view>
-        <view v-if="ticketInfo.projects && ticketInfo.projects.length > 0" class="card cardInfo projCard">
+        <!--<view class="card cardInfo userCard">-->
+        <!--  <view class="userTitle">客户信息</view>-->
+        <!--  <view class="userContainer">-->
+        <!--    <view style="display: flex;align-items: center">-->
+        <!--      &lt;!&ndash;<view class="infoItem" style="flex: 1">&ndash;&gt;-->
+        <!--      &lt;!&ndash;  <text class="label">姓名</text>&ndash;&gt;-->
+        <!--      &lt;!&ndash;  <text class="value">{{ ticketInfo.userName }}</text>&ndash;&gt;-->
+        <!--      &lt;!&ndash;</view>&ndash;&gt;-->
+        <!--      &lt;!&ndash;<view class="infoItem" style="flex: 1">&ndash;&gt;-->
+        <!--      &lt;!&ndash;  <text class="label">性别</text>&ndash;&gt;-->
+        <!--      &lt;!&ndash;  <text class="value">{{ ticketInfo.customerInfo.sex === '1' ? '女' : '男' }}</text>&ndash;&gt;-->
+        <!--      &lt;!&ndash;</view>&ndash;&gt;-->
+        <!--    </view>-->
+        <!--    <view v-if="ticketInfo.userName!=ticketInfo.handleName" style="display: flex;align-items: center">-->
+        <!--      &lt;!&ndash;<view class="infoItem" style="flex: 1">&ndash;&gt;-->
+        <!--      &lt;!&ndash;  <text class="label">经办人姓名</text>&ndash;&gt;-->
+        <!--      &lt;!&ndash;  <text class="value">{{ ticketInfo.handleName }}</text>&ndash;&gt;-->
+        <!--      &lt;!&ndash;</view>&ndash;&gt;-->
+        <!--      &lt;!&ndash;<view class="infoItem" style="flex: 1">&ndash;&gt;-->
+        <!--      &lt;!&ndash;  <text class="label">经办人电话</text>&ndash;&gt;-->
+        <!--      &lt;!&ndash;  <text class="value">{{ ticketInfo.handleMobile }}</text>&ndash;&gt;-->
+        <!--      &lt;!&ndash;</view>&ndash;&gt;-->
+        <!--    </view>-->
+        <!--    <template v-if="userInfo.showAll">-->
+        <!--      <view style="display: flex;align-items: center">-->
+        <!--        &lt;!&ndash;<view class="infoItem" style="flex: 1">&ndash;&gt;-->
+        <!--        &lt;!&ndash;  <text class="label">联系方式</text>&ndash;&gt;-->
+        <!--        &lt;!&ndash;  <text class="value">{{ ticketInfo.userMobile }}</text>&ndash;&gt;-->
+        <!--        &lt;!&ndash;</view>&ndash;&gt;-->
+        <!--        <view class="infoItem" style="flex: 1">-->
+        <!--          <text class="label">生日</text>-->
+        <!--          <text class="value">{{ ticketInfo.birthday }}</text>-->
+        <!--        </view>-->
+        <!--      </view>-->
+        <!--      <view class="infoItem">-->
+        <!--        <text class="label">联系地址</text>-->
+        <!--        <text class="value">-->
+        <!--          {{ ticketInfo.customerInfo.address }}-->
+        <!--        </text>-->
+        <!--      </view>-->
+        <!--    </template>-->
+        <!--  </view>-->
+        <!--  <view v-if="loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')" class="userFoot">-->
+        <!--    <template v-if="!userInfo.showAll">-->
+        <!--      <text @click="() => $set(userInfo, 'showAll', true)">展开</text>-->
+        <!--      <image mode="aspectFit" src="/static/icons/bottom.png" style="width: 28rpx;height: 28rpx"></image>-->
+        <!--    </template>-->
+        <!--    <template v-else>-->
+        <!--      <text @click="() => userInfo.showAll = false">收起</text>-->
+        <!--      &lt;!&ndash;<image mode="aspectFit" src="/static/icons/bottom.png" style="width: 28rpx;height: 28rpx"></image>&ndash;&gt;-->
+        <!--    </template>-->
+        <!--  </view>-->
+        <!--</view>-->
+
+        <view class="card projDateCard" v-if="projTabList && projTabList.length > 0">
           <view class="projTitle">维修工时项目</view>
+          <view class="projTabs">
+            <view @click="chooseProjTab(index)" v-for="(item, index) in projTabList" :key="item.id" class="projTabItem" :class="{ active: index === activeProjTabKey }">
+              {{ item.name }}
+              <view v-if="index === activeProjTabKey" class="activeLine"></view>
+            </view>
+          </view>
+          <view class="projTabsBottomLine"></view>
+          <view class="workPerson">
+            <text>服务顾问：曾婷</text>
+            <text>施工人员：王雕、李志</text>
+          </view>
           <view class="projList">
-            <template>
-              <view v-for="(item,index) in ticketInfo.projects" :key="item.id" class="projEditItem">
-                <view v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'" class="del-proj-box" @click="delProj(item.id,index)"><uni-icons type="trash" size="25" style="color: #0174F6"></uni-icons></view>
-                <view class="projEditLine1">
-                  <text>{{ item.itemName }}</text>
-                  <text v-if="canSeeMoney"  class="projAmount">￥{{ item.itemMoney }}</text>
-                </view>
-                <view  class="projBaseInfo" v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'" >
-                    <!-- 可编辑-->
-                    <view v-if="canSeeMoney">售价：<input class="edit-proj-input" @input="onKeyInput('sj',item)" type="decimal" placeholder="请输入售价" v-model="item.itemPrice" /></view>
-                    <view>数量：<input class="edit-proj-input" @input="onKeyInput('sl',item)" type="number" placeholder="请输入数量" v-model="item.itemCount" /></view>
-                    <!--                  <view>单位：{{ item.itemUnit}}</view>-->
-                    <view v-if="canSeeMoney">折扣：<input class="edit-proj-input" @input="onKeyInput('zk',item)" type="decimal" placeholder="请输入折扣（0-1）" v-model="item.itemDiscount" /></view>
-                    <view v-if="canSeeMoney">金额：<input  type="number" disabled placeholder="请输入售价" v-model="item.itemMoney" /></view>
-                </view>
-                <view v-else class="projBaseInfo" >
-                    <!-- 只读 -->
-                    <view v-if="canSeeMoney">售价：{{ item.itemPrice || "" }}</view>
-                    <view>数量：{{ item.itemCount || "" }}</view>
-                    <!--                  <view>单位：{{ item.itemUnit}}</view>-->
-                    <view v-if="canSeeMoney">折扣：{{ item.itemDiscount || "" }}</view>
-                    <view v-if="canSeeMoney">金额：{{ item.itemMoney || "" }}</view>
-                </view>
-                <view class="projEditFoot">
-                  <view class="block1">
-                    <template>
-                      <view class="editPeople">
-                        <view class="editForm">
-                          <text class="label">服务顾问</text>
-                          <text >{{item.saleName || ""}}
-                          </text>
-                        </view>
-                        <image v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'" src="/static/icons/edit.png" style="width: 28rpx;height: 28rpx"
-                               @click="editPeople('xs', item)"></image>
-                      </view>
-                    </template>
-                    <template v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'">
-                      <image @click="editPeople('xs', item)"src="/pages-order/static/addIcon.png" style="width: 28rpx;height: 28rpx"></image>
-<!--                      <text class="addText" @click="editPeople('xs', item)">添加服务顾问</text>-->
-                    </template>
-                  </view>
-                  <view class="line"></view>
-                  <view class="block2">
-                    <template>
-                      <view class="editPeople">
-                        <view class="editForm">
-                          <text class="label">施工人员</text>
-                          <text >{{ item.repairNames || ""}}</text>
-                        </view>
-                        <image v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'" src="/static/icons/edit.png" style="width: 28rpx;height: 28rpx"
-                               @click="editPeople('sg', item)"></image>
-                      </view>
-                    </template>
-                    <template v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'">
-                      <image @click="editPeople('sg', item)" src="/pages-order/static/addIcon.png" style="width: 28rpx;height: 28rpx"></image>
-<!--                      <text class="addText" @click="editPeople('sg', item)">添加施工人员</text>-->
-                    </template>
-
-                  </view>
-                </view>
-              </view>
-            </template>
+            <view class="projItem" v-for="(item, index) in projTabList[activeProjTabKey].projList.slice(0, 5)" :key="item.id">
+              <text class="projSeq">{{ index + 1 }}</text>
+              <text class="projName">{{ item.name }}</text>
+            </view>
+            <view v-if="projTabList[activeProjTabKey].showAll" class="projItem" v-for="(item, index) in projTabList[activeProjTabKey].projList.slice(5, projTabList[activeProjTabKey].projList.length)" :key="item.id">
+              <text class="projSeq">{{ 6 + index }}</text>
+              <text class="projName">{{ item.name }}</text>
+            </view>
+          </view>
+          <view v-if="projTabList[activeProjTabKey].projList.length > 5" class="action" @click="() => $set(projTabList[activeProjTabKey], 'showAll', !projTabList[activeProjTabKey].showAll)">
+            <text>{{ projTabList[activeProjTabKey].showAll ? '收起' : '展开' }}</text>
+            <uni-icons :type="projTabList[activeProjTabKey].showAll ? 'top' : 'bottom'" color="#0174f6"></uni-icons>
           </view>
         </view>
+
+        <view class="card partCard" v-if="partTabList && partTabList.length > 0">
+          <view class="projTitle">更换配件清单</view>
+          <view class="projTabs">
+            <view @click="choosePartTab(index)" v-for="(item, index) in partTabList" :key="item.id" class="projTabItem" :class="{ active: index === activePartTabKey }">
+              {{ item.name }}
+              <view v-if="index === activePartTabKey" class="activeLine"></view>
+            </view>
+          </view>
+          <view class="projTabsBottomLine" style="margin-bottom: 0"></view>
+          <view class="projList">
+            <view class="projItem" v-for="(item, index) in partTabList[activePartTabKey].detailList.slice(0, 5)" :key="item.id">
+              <text class="projSeq">{{ index + 1 }}</text>
+              <text class="projName">{{ item.name }}</text>
+              <text style="color: #636C8C;font-size: 32rpx;">x2</text>
+            </view>
+            <view v-if="partTabList[activePartTabKey].showAll" class="projItem" v-for="(item, index) in partTabList[activePartTabKey].detailList.slice(5, partTabList[activePartTabKey].detailList.length)" :key="item.id">
+              <text class="projSeq">{{ 6 + index }}</text>
+              <text class="projName">{{ item.name }}</text>
+              <text style="color: #636C8C;font-size: 32rpx;">x2</text>
+            </view>
+          </view>
+          <view v-if="partTabList[activePartTabKey].detailList.length > 5" class="action" @click="() => $set(partTabList[activePartTabKey], 'showAll', !partTabList[activePartTabKey].showAll)">
+            <text>{{ partTabList[activePartTabKey].showAll ? '收起' : '展开' }}</text>
+            <uni-icons :type="partTabList[activePartTabKey].showAll ? 'top' : 'bottom'" color="#0174f6"></uni-icons>
+          </view>
+        </view>
+
+<!--        <view v-if="ticketInfo.projects && ticketInfo.projects.length > 0" class="card cardInfo projCard">-->
+<!--          <view class="projTitle">维修工时项目</view>-->
+<!--          <view class="projList">-->
+<!--            <template>-->
+<!--              <view v-for="(item,index) in ticketInfo.projects" :key="item.id" class="projEditItem">-->
+<!--                <view v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'" class="del-proj-box" @click="delProj(item.id,index)"><uni-icons type="trash" size="25" style="color: #0174F6"></uni-icons></view>-->
+<!--                <view class="projEditLine1">-->
+<!--                  <text>{{ item.itemName }}</text>-->
+<!--                  <text v-if="canSeeMoney"  class="projAmount">￥{{ item.itemMoney }}</text>-->
+<!--                </view>-->
+<!--                <view  class="projBaseInfo" v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'" >-->
+<!--                    &lt;!&ndash; 可编辑&ndash;&gt;-->
+<!--                    <view v-if="canSeeMoney">售价：<input class="edit-proj-input" @input="onKeyInput('sj',item)" type="decimal" placeholder="请输入售价" v-model="item.itemPrice" /></view>-->
+<!--                    <view>数量：<input class="edit-proj-input" @input="onKeyInput('sl',item)" type="number" placeholder="请输入数量" v-model="item.itemCount" /></view>-->
+<!--                    &lt;!&ndash;                  <view>单位：{{ item.itemUnit}}</view>&ndash;&gt;-->
+<!--                    <view v-if="canSeeMoney">折扣：<input class="edit-proj-input" @input="onKeyInput('zk',item)" type="decimal" placeholder="请输入折扣（0-1）" v-model="item.itemDiscount" /></view>-->
+<!--                    <view v-if="canSeeMoney">金额：<input  type="number" disabled placeholder="请输入售价" v-model="item.itemMoney" /></view>-->
+<!--                </view>-->
+<!--                <view v-else class="projBaseInfo" >-->
+<!--                    &lt;!&ndash; 只读 &ndash;&gt;-->
+<!--                    <view v-if="canSeeMoney">售价：{{ item.itemPrice || "" }}</view>-->
+<!--                    <view>数量：{{ item.itemCount || "" }}</view>-->
+<!--                    &lt;!&ndash;                  <view>单位：{{ item.itemUnit}}</view>&ndash;&gt;-->
+<!--                    <view v-if="canSeeMoney">折扣：{{ item.itemDiscount || "" }}</view>-->
+<!--                    <view v-if="canSeeMoney">金额：{{ item.itemMoney || "" }}</view>-->
+<!--                </view>-->
+<!--                <view class="projEditFoot">-->
+<!--                  <view class="block1">-->
+<!--                    <template>-->
+<!--                      <view class="editPeople">-->
+<!--                        <view class="editForm">-->
+<!--                          <text class="label">服务顾问</text>-->
+<!--                          <text >{{item.saleName || ""}}-->
+<!--                          </text>-->
+<!--                        </view>-->
+<!--                        <image v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'" src="/static/icons/edit.png" style="width: 28rpx;height: 28rpx"-->
+<!--                               @click="editPeople('xs', item)"></image>-->
+<!--                      </view>-->
+<!--                    </template>-->
+<!--                    <template v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'">-->
+<!--                      <image @click="editPeople('xs', item)"src="/pages-order/static/addIcon.png" style="width: 28rpx;height: 28rpx"></image>-->
+<!--&lt;!&ndash;                      <text class="addText" @click="editPeople('xs', item)">添加服务顾问</text>&ndash;&gt;-->
+<!--                    </template>-->
+<!--                  </view>-->
+<!--                  <view class="line"></view>-->
+<!--                  <view class="block2">-->
+<!--                    <template>-->
+<!--                      <view class="editPeople">-->
+<!--                        <view class="editForm">-->
+<!--                          <text class="label">施工人员</text>-->
+<!--                          <text >{{ item.repairNames || ""}}</text>-->
+<!--                        </view>-->
+<!--                        <image v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'" src="/static/icons/edit.png" style="width: 28rpx;height: 28rpx"-->
+<!--                               @click="editPeople('sg', item)"></image>-->
+<!--                      </view>-->
+<!--                    </template>-->
+<!--                    <template v-if="(loginUser.roleCodes.includes('weixiu') || loginUser.roleCodes.includes('service_advisor')||loginUser.roleCodes.includes('general_inspection')) && isDetail == '0'">-->
+<!--                      <image @click="editPeople('sg', item)" src="/pages-order/static/addIcon.png" style="width: 28rpx;height: 28rpx"></image>-->
+<!--&lt;!&ndash;                      <text class="addText" @click="editPeople('sg', item)">添加施工人员</text>&ndash;&gt;-->
+<!--                    </template>-->
+
+<!--                  </view>-->
+<!--                </view>-->
+<!--              </view>-->
+<!--            </template>-->
+<!--          </view>-->
+<!--        </view>-->
         <view v-if="ticketInfo.waresGroupList && ticketInfo.waresGroupList.length > 0" class="card cardInfo projCard">
           <view class="projTitle">更换配件清单 <view class="dl-ifcus" v-if="canOpenCus"><text>是否开放给客户</text><switch :checked="ticketInfo.partShow == '1'" style="transform:scale(0.7)" @change="toPartShow" /></view></view>
           <view class="projList">
@@ -226,33 +336,62 @@
             </uni-collapse>
           </view>
         </view>
-        <view v-if="isDetail == '1'" class="card cardInfo projCard">
+
+        <view class="card processCard">
           <view class="projTitle">维修进度记录表</view>
-          <view class="projList">
-            <view class="tushi-box">
-              <view class="tushi-item" style="color: #B7BDC6">待维修  </view>
-              <view class="tushi-item" style="color: #E8A321">维修中  </view>
-              <view class="tushi-item" style="color: #2979FF;">已完成</view>
+          <view class="tushi-box">
+            <view class="tushi-item" style="color: #B7BDC6">待维修  </view>
+            <view class="tushi-item" style="color: #E8A321">维修中  </view>
+            <view class="tushi-item" style="color: #2979FF;">已完成</view>
+          </view>
+          <view class="processList">
+            <view class="processItem" v-for="(item, index) in processList.length" :key="item">
+              <view class="left">
+                <text class="processSeq">{{ index + 1 }}</text>
+                <view v-if="index < processList.length - 1" class="line"></view>
+              </view>
+              <view class="right">
+                <text class="processName">{{ '日韩系国六零公里匠心0W-20' }}</text>
+                <text class="processDate">{{ '2024-11-28 12:00:00' }}</text>
+                <view class="processImgList">
+                  <image class="processImgItem" src=""></image>
+                </view>
+                <view class="processSendUser">
+                  <image mode="aspectFit" src="/static/icons/send.png" style="width: 28rpx;height: 28rpx"></image>
+                  发送给客户
+                </view>
+              </view>
             </view>
-            <uni-steps :canOpenCus="canOpenCus" :options="list2" active-color="#007AFF" :active="active" :doingActive="doingActive" direction="column" @prviewImage="prviewImage" @sendCusImgManage="sendCusImgManage"/>
-<!--            <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>-->
           </view>
         </view>
+
+<!--        <view v-if="isDetail == '1'" class="card cardInfo projCard">-->
+<!--          <view class="projTitle">维修进度记录表</view>-->
+<!--          <view class="projList">-->
+<!--            <view class="tushi-box">-->
+<!--              <view class="tushi-item" style="color: #B7BDC6">待维修  </view>-->
+<!--              <view class="tushi-item" style="color: #E8A321">维修中  </view>-->
+<!--              <view class="tushi-item" style="color: #2979FF;">已完成</view>-->
+<!--            </view>-->
+<!--            <uni-steps :canOpenCus="canOpenCus" :options="list2" active-color="#007AFF" :active="active" :doingActive="doingActive" direction="column" @prviewImage="prviewImage" @sendCusImgManage="sendCusImgManage"/>-->
+<!--&lt;!&ndash;            <uni-table ref="table" :loading="false" border stripe  emptyText="暂无数据">&ndash;&gt;-->
+<!--&lt;!&ndash;              <uni-tr>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-th width="50" align="center">序号</uni-th>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-th align="center">维修项目</uni-th>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-th width="30" align="center" >-</uni-th>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-th width="30" align="center" >○</uni-th>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-th width="30" align="center" >√</uni-th>&ndash;&gt;-->
+<!--&lt;!&ndash;              </uni-tr>&ndash;&gt;-->
+<!--&lt;!&ndash;              <uni-tr v-for="(item, index) in tableData" :key="index">&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-td align="center">{{ index+1 }}</uni-td>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-td>{{ item.itemName }}</uni-td>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-td align="center"><text v-if="item.itemStatus=='01'">-</text></uni-td>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-td align="center"><text v-if="item.itemStatus=='02'" style="color: #E8A321">○</text></uni-td>&ndash;&gt;-->
+<!--&lt;!&ndash;                <uni-td align="center"><text v-if="item.itemStatus=='03'" style="color: #17DBB1;">√</text></uni-td>&ndash;&gt;-->
+<!--&lt;!&ndash;              </uni-tr>&ndash;&gt;-->
+<!--&lt;!&ndash;            </uni-table>&ndash;&gt;-->
+<!--          </view>-->
+<!--        </view>-->
         <view v-if="isDetail == '1'" class="card cardInfo projCard">
           <view class="projTitle">维修记录</view>
           <view class="projList">
@@ -410,6 +549,292 @@ export default {
       },
       //删除的项目id、配件id
       delProjId:[],
+      projTabList: [
+        {
+          id: '01',
+          name: '机电类',
+          showAll: false,
+          projList: [
+            {
+              id: '1',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '2',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '3',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '4',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '5',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '6',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '7',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '8',
+              name: '日韩系国六零公里匠心0W-20'
+            }
+          ]
+        },
+        {
+          id: '02',
+          name: '机电类',
+          showAll: false,
+          projList: [
+            {
+              id: '1',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '2',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '3',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '4',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '5',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '6',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '7',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '8',
+              name: '日韩系国六零公里匠心0W-20'
+            }
+          ]
+        },
+        {
+          id: '03',
+          name: '机电类',
+          showAll: false,
+          projList: [
+            {
+              id: '1',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '2',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '3',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '4',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '5',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '6',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '7',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '8',
+              name: '日韩系国六零公里匠心0W-20'
+            }
+          ]
+        },
+        {
+          id: '04',
+          name: '机电类',
+          showAll: false,
+          projList: [
+            {
+              id: '1',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '2',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '3',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '4',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '5',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '6',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '7',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '8',
+              name: '日韩系国六零公里匠心0W-20'
+            }
+          ]
+        },
+        {
+          id: '05',
+          name: '机电类',
+          showAll: false,
+          projList: [
+            {
+              id: '1',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '2',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '3',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '4',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '5',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '6',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '7',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '8',
+              name: '日韩系国六零公里匠心0W-20'
+            }
+          ]
+        },
+        {
+          id: '06',
+          name: '机电类',
+          showAll: false,
+          projList: [
+            {
+              id: '1',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '2',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '3',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '4',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '5',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '6',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '7',
+              name: '日韩系国六零公里匠心0W-20'
+            },
+            {
+              id: '8',
+              name: '日韩系国六零公里匠心0W-20'
+            }
+          ]
+        }
+      ],
+      activeProjTabKey: 0,
+      partTabList: [
+        {
+          id: '1',
+          name: '机电类',
+          detailList: [
+            {
+              id: '1',
+              name: '铜铆钉/ALL'
+            },
+            {
+              id: '2',
+              name: '铜铆钉/ALL'
+            },
+            {
+              id: '3',
+              name: '铜铆钉/ALL'
+            },
+            {
+              id: '4',
+              name: '铜铆钉/ALL'
+            },
+            {
+              id: '5',
+              name: '铜铆钉/ALL'
+            },
+            {
+              id: '6',
+              name: '铜铆钉/ALL'
+            }
+          ]
+        },
+        {
+          id: '2',
+          name: '机电类',
+          detailList: []
+        },
+        {
+          id: '3',
+          name: '机电类',
+          detailList: []
+        },
+        {
+          id: '4',
+          name: '机电类',
+          detailList: []
+        }
+      ],
+      activePartTabKey: 0,
+      processList: [{}, {}]
     };
   },
   watch: {
@@ -443,6 +868,12 @@ export default {
   },
 
   methods: {
+    chooseProjTab(index) {
+      this.activeProjTabKey = index
+    },
+    choosePartTab(index) {
+      this.activePartTabKey = index
+    },
     /**
      * 刷新数据通用方法
      */
@@ -1207,6 +1638,9 @@ export default {
     flex: 1;
     height: 0;
     overflow: auto;
+    position: relative;
+    background-size: 100% 600rpx;
+    background: linear-gradient(180deg, #CEE5FF 0%, rgba(206, 229, 255, 0) 100%) no-repeat;
   }
 
   .card {
@@ -1266,6 +1700,7 @@ export default {
   }
 
   .cardInfo {
+    overflow: hidden;
     .noReviewPart {
       padding: 10rpx 36rpx 10rpx 36rpx;
       display: flex;
@@ -1315,7 +1750,7 @@ export default {
   .projTitle, .userTitle, .carTitle {
     padding: 30rpx;
     font-weight: bold;
-    font-size: 32rpx;
+    font-size: 36rpx;
     color: #333333;
   }
 
@@ -1358,7 +1793,7 @@ export default {
 
     .carDetail {
       background-size: 100% 184rpx;
-      padding: 0 30rpx;
+      padding: 30rpx 30rpx;
 
       .carHeader {
         border-radius: 8rpx 8rpx 8rpx 8rpx;
@@ -1391,13 +1826,15 @@ export default {
           }
         }
       }
-
+      .line {
+        height: 1rpx;
+        background-color: #ddd;
+      }
       .carBody {
         display: flex;
         flex-direction: column;
         row-gap: 30rpx;
         padding-top: 30rpx;
-        border-top: 1rpx solid #DDDDDD;
       }
 
       .carFoot {
@@ -1410,7 +1847,7 @@ export default {
     padding-bottom: 30rpx;
 
     .projList {
-      padding: 0 30rpx;
+      padding: 0 20rpx;
       display: flex;
       flex-direction: column;
       //gap: 20rpx;
@@ -1428,19 +1865,19 @@ export default {
 
       .projItem {
         background: #FFFFFF;
-        border-radius: 4rpx 4rpx 4rpx 4rpx;
-        border: 2rpx solid #DDDDDD;
+        border-radius: 8rpx 8rpx 8rpx 8rpx;
+        border: 1rpx solid #DDDDDD;
         padding: 0 20rpx;
         margin-bottom: 10rpx;
 
         .projTop {
           padding: 20rpx 0;
-          border-bottom: 1rpx solid #DDDDDD;
+          border-bottom: 1rpx solid #eee;
           display: flex;
           align-items: center;
           justify-content: space-between;
           font-weight: 500;
-          font-size: 28rpx;
+          font-size: 32rpx;
           color: #333333;
 
           .projAmount {
@@ -1455,7 +1892,7 @@ export default {
           .projDate {
             font-weight: 500;
             font-size: 28rpx;
-            color: #858BA0;
+            color: #636C8C;
 
             display: flex;
             align-items: center;
@@ -1466,7 +1903,7 @@ export default {
 
           .projDesc {
             font-weight: 500;
-            font-size: 28rpx;
+            font-size: 30rpx;
             color: #858BA0;
           }
 
@@ -1592,6 +2029,99 @@ export default {
     }
   }
 
+  .projDateCard, .partCard {
+    line-height: 1;
+    .projTabs {
+      display: flex;
+      overflow: scroll;
+      .projTabItem {
+        padding: 10rpx 20rpx 30rpx;
+        flex-shrink: 0;
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #636C8C;
+        &.active {
+          font-weight: bold;
+          color: #0174F6;
+          position: relative;
+        }
+        .activeLine {
+          position: absolute;
+          bottom: 0;
+          left: 50%;
+          transform: translateX(-50%);
+          width: 36rpx;
+          height: 8rpx;
+          background: #0174F6;
+          border-radius: 4rpx 4rpx 4rpx 4rpx;
+        }
+      }
+    }
+    .projTabsBottomLine {
+      width: 686rpx;
+      height: 1rpx;
+      background-color: #eee;
+      margin-bottom: 20rpx;
+    }
+    .workPerson {
+      width: 646rpx;
+      margin: 0 auto;
+      padding: 30rpx 20rpx;
+      background: #F3F5F7;
+      border-radius: 6rpx 6rpx 6rpx 6rpx;
+
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      flex-wrap: wrap;
+
+      font-weight: 500;
+      font-size: 30rpx;
+      color: #636C8C;
+    }
+
+    .projList {
+      padding: 0 20rpx;
+      .projItem {
+        padding: 40rpx 0;
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #333333;
+        border-bottom: 1rpx solid #EEEEEE;
+        display: flex;
+        column-gap: 10rpx;
+      }
+      .projSeq {
+        width: 32rpx;
+        height: 32rpx;
+        background: #0174F6;
+        border-radius: 18rpx 18rpx 18rpx 18rpx;
+        display: inline-block;
+        text-align: center;
+        line-height: 32rpx;
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #FFFFFF;
+      }
+      .projName {
+        flex: 1;
+        width: 0;
+        word-break: break-all;
+      }
+      .projItem:last-child {
+        border-bottom: none;
+      }
+    }
+
+    .action {
+      font-weight: 500;
+      font-size: 30rpx;
+      color: #0174F6;
+      text-align: center;
+      padding-bottom: 30rpx;
+    }
+  }
+
   .userCard {
     .userContainer {
       display: flex;
@@ -1604,17 +2134,16 @@ export default {
 
   .infoItem {
     display: flex;
-    flex-direction: column;
+    justify-content: space-between;
+    font-weight: 500;
+    font-size: 32rpx;
+    line-height: 1;
 
     .label {
-      font-weight: 500;
-      font-size: 28rpx;
-      color: #858BA0;
+      color: #636C8C;
     }
 
     .value {
-      font-weight: 500;
-      font-size: 28rpx;
       color: #333333;
     }
   }
@@ -1671,4 +2200,106 @@ export default {
     border-radius: 5px;
   }
 }
+.orderInfo {
+  padding: 0 32rpx;
+  margin: 40rpx 0;
+  line-height: 1;
+  display: flex;
+  flex-direction: column;
+  row-gap: 20rpx;
+  .orderTypeInfo {
+    font-weight: bold;
+    font-size: 40rpx;
+    color: #333333;
+  }
+  .orderStateInfo {
+    font-weight: 500;
+    font-size: 32rpx;
+    color: #666666;
+  }
+  .orderDateInfo {
+    font-weight: 500;
+    font-size: 32rpx;
+    color: #0174F6;
+  }
+}
+.processCard {
+  line-height: 1;
+  .tushi-box {
+    display: flex;
+    align-items: center;
+    column-gap: 40rpx;
+    justify-content: center;
+    padding-bottom: 30rpx;
+    font-weight: 500;
+    font-size: 28rpx;
+  }
+  .processList {
+    padding: 0 20rpx;
+  }
+  .processItem {
+    display: flex;
+    column-gap: 14rpx;
+    margin-bottom: 20rpx;
+    display: flex;
+    align-items: stretch;
+    .left {
+      padding-bottom: 24rpx;
+      display: flex;
+      flex-direction: column;
+      row-gap: 8rpx;
+      .processSeq {
+        width: 32rpx;
+        height: 32rpx;
+        background: #0174F6;
+        border-radius: 18rpx 18rpx 18rpx 18rpx;
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #FFFFFF;
+        line-height: 32rpx;
+        text-align: center;
+      }
+      .line {
+        flex: 1;
+        height: 0;
+        width: 2rpx;
+        background-color: #0174f6;
+        margin: 0 auto;
+      }
+    }
+    .right {
+      padding-bottom: 20rpx;
+      border-bottom: 1rpx solid #eee;
+      display: flex;
+      flex-direction: column;
+      row-gap: 20rpx;
+      .processName {
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #333333;
+      }
+      .processDate {
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #858BA0;
+      }
+      .processImgList {
+        display: flex;
+        gap: 10rpx;
+      }
+      .processImgItem {
+        width: 120rpx;
+        height: 120rpx;
+        background-color: #eee;
+      }
+      .processSendUser {
+        display: flex;
+        column-gap: 10rpx;
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #0174F6;
+      }
+    }
+  }
+}
 </style>