From e6acb39a2475e211f2c1decc45a95c868239c25f Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期五, 18 十月 2024 14:28:32 +0800
Subject: [PATCH] ll

---
 h5/pages/staff/vehicle/sendACarDetail.vue | 1144 ++++++++++++++++++++++++++++-----------------------------
 1 files changed, 560 insertions(+), 584 deletions(-)

diff --git a/h5/pages/staff/vehicle/sendACarDetail.vue b/h5/pages/staff/vehicle/sendACarDetail.vue
index da13b54..6e62334 100644
--- a/h5/pages/staff/vehicle/sendACarDetail.vue
+++ b/h5/pages/staff/vehicle/sendACarDetail.vue
@@ -1,538 +1,506 @@
-<template>
-  <view class="main_app">
-    <view class="status_wrap">
-      <view class="name">{{ info.memberName }}鐨勭敤杞︾敵璇�</view>
-      <view class="placeholder9">{{ info.companyName }}</view>
-			<view
-			  class="desc"
-			  :class="{
-			    gray: info.businessStatus == '2' || info.businessStatus == '3' || info.businessStatus == '4',
-			  }"
-			  >{{ infoStatus }}</view
-			>
-      <view class="status">
-        <text class="loading" :class="{
-					grr: info.status == 1 || info.status == 2 || info.status == 4,
-					error: info.status == 3
-				}" v-if="info.status == '0'">{{statusMap[info.status]}}</text>
-      </view>
-    </view>
-    <!--  -->
-    <view class="emyty"></view>
-    <view class="module_list">
-      <view class="item">
-        <view class="label">棰勮鐢ㄨ溅鏃舵</view>
-        <view class="value" v-if="info.startTime"
-          >{{ info.startTime.slice(0, 16) }}鑷硔{
-            info.endTime.slice(0, 16)
-          }}</view
-        >
-      </view>
-      <view class="item">
-        <view class="label">棰勮鍑哄彂鏃堕棿</view>
-        <view class="value">{{ info.planUseDate }}</view>
-      </view>
-      <view class="item">
-        <view class="label">涔樿溅浜哄憳</view>
-        <view class="value">{{ info.memberNames }}</view>
-      </view>
-      <view class="item">
-        <view class="label">鐩殑鍦�</view>
-        <view class="value"
-          >{{ info.type == "1" ? "甯傚" : "瀹ゅ唴" }}锛歿{ info.addr }}</view
-        >
-      </view>
-      <view class="item">
-        <view class="label">鐢ㄨ溅浜嬬敱</view>
-        <view class="value">{{ info.content }}</view>
-      </view>
-      <view class="item">
-        <view class="label">杞﹁締淇℃伅</view>
-        <view class="value">{{ info.carCode }}</view>
-      </view>
-      <view class="item">
-        <view class="label">鍙告満淇℃伅</view>
-        <view class="value">{{ info.driverName }} {{ info.driverPhone }}</view>
-      </view>
-    </view>
-    <!-- 娴佺▼ -->
-    <view class="flow_wrap">
-      <view class="flow_title">娴佺▼</view>
-      <view
-        class="list"
-        v-if="
-          info.approveDateVO != null && info.approveDateVO.approveList != null
-        "
-      >
-        <view
-          class="item"
-          v-for="(item, index) in info.approveDateVO.approveList"
-          :key="item.id"
-        >
-          <view class="separate"></view>
-          <view class="avatar">
-          	<image
-          		v-if="item.type == 1"
-          	  class="img"
-          	  src="@/static/staff/ic_chaosong@2x.png"
-          	/>
-            <image
-            	v-else-if="item.approveType == 1 || item.approveType == 0"
-              class="img"
-              src="@/static/staff/ic_shenpiren@2x.png"
-            />
-          	<span v-else class="img_name">{{item.memberName && item.memberName.slice(0,1)}}</span>
-            <image
-            	v-if="item.status == 2"
-              class="status"
-              src="@/static/staff/liucheng_success@2x.png"
-              mode="widthFix"
-            />
-            <image
-            	v-if="item.status == 3"
-              class="status"
-              src="@/static/staff/liucheng_fail@2x.png"
-              mode="widthFix"
-            />
-          </view>
-          <view class="content">
-            <view class="head">
-              <view class="event">{{ item.title }}</view>
-              <view class="time">{{ item.checkDate }}</view>
-            </view>
-            <view class="name_wrap">
-              <text
-                >{{ item.memberName
-                }}<text class="status" v-if="item.statusInfo"
-                  >({{ item.statusInfo }})</text
-                ></text
-              >
-            </view>
-            <view v-if="item.checkInfo" class="remark">{{
-              item.checkInfo
-            }}</view>
-            <!-- 鎶勯�佷汉 -->
-            <view v-if="item.approveType == 1" class="children">
-              <view
-                class="child"
-                v-for="child in item.approveList"
-                :key="child.id"
-              >
-                <image
-                  class="child_img"
-                  :src="
-                    child.faceImg
-                      ? child.faceImg
-                      : require('@/static/meeting/common/default_user@2x.png')
-                  "
-                />
-                <view>{{ child.memberName }}</view>
-              </view>
-            </view>
-          </view>
-        </view>
-      </view>
-    </view>
-    <view class="emyty"></view>
-    <view
-      class="main_footer"
-      v-if="
-        info.approveDateVO != null &&
-        info.approveDateVO.canBeApproved != null &&
-        info.approveDateVO.canBeApproved == 1
-      "
-    >
-      <template v-if="appr == '1'">
-        <view class="btn" @click="handleSub(3)">鎷掔粷</view>
-        <view class="btn agree" @click="handleSub(2)">鍚屾剰</view>
-      </template>
-      <view v-else class="btn agree" @click="isShowBack = true">鎾ら攢鐢ㄨ溅</view>
-    </view>
-
-    <!-- 鎾ら攢 -->
-    <u-popup
-      :show="isShowBack"
-      :round="10"
-      :safeAreaInsetBottom="true"
-      mode="bottom"
-      @close="isShowBack = false"
-    >
-      <view class="appr_modal">
-        <view class="title">鎾ら攢鐢ㄨ溅</view>
-        <view class="line"> 鎾ら攢璇存槑 </view>
-        <textarea
-          v-model="backParam.info"
-          placeholder="闈炲繀濉�"
-          placeholder-class="placeholder9"
-        />
-        <view class="main_footer">
-          <view class="btn agree" @click="onSubBack">鎻愪氦</view>
-        </view>
-      </view>
-    </u-popup>
-    <!--  -->
-    <u-popup
-      :show="showApprModal"
-      :round="10"
-      :safeAreaInsetBottom="true"
-      mode="bottom"
-      @close="showApprModal = false"
-    >
-      <view class="appr_modal">
-        <view class="title">{{ param.status == 2 ? "鍚屾剰" : "鎷掔粷" }}</view>
-        <view v-if="param.status == 2" class="line" @click="isShowDrive = true">
-          <text v-if="param.driverName">{{ param.driverName }}</text>
-          <text v-else class="placeholder9">娲捐溅鍙告満</text>
-          <u-icon class="ml12" name="arrow-right" color="#999999" />
-        </view>
-        <textarea
-          v-model="param.checkInfo"
-          :placeholder="
-            param.status == 2 ? '鍚屾剰璇存槑锛岄潪蹇呭~' : '鎷掔粷璇存槑锛屽繀濉�'
-          "
-          placeholder-class="placeholder9"
-        />
-        <view class="main_footer">
-          <view class="btn" @click="showApprModal = false">鍙栨秷</view>
-          <view class="btn agree" @click="onSubmit">鎻愪氦</view>
-        </view>
-      </view>
-    </u-popup>
-    <!-- 鍙告満 -->
-    <u-picker
-      keyName="name"
-      :show="isShowDrive"
-      @close="isShowDrive = false"
-      :closeOnClickOverlay="true"
-      :columns="driveList"
-      @confirm="seletedDrive"
-      @cancel="isShowDrive = false"
-    ></u-picker>
-  </view>
-</template>
-
-<script>
-import { carUseBookDetail, carUseBookAppr, driveListPost, carUseBookBack } from '@/api'
-export default {
-  data() {
-    return {
-      showApprModal: false,
-      isShowBack: false,
-      backParam: {},
-      isShowDrive: false,
-      id: '',
-      appr: '',
-			infoStatus: '',
-      info: {},
-      param: {
-        status: ''
-      },
-			statusMap: {
-			  0: '寰呭鎵�',
-			  1: '瀹℃壒涓�',
-			  2: '宸查�氳繃',
-			  3: '鎾ゅ洖鐢宠',
-			  4: '宸插彇娑�',
-			},
-      driveList: []
-
-    }
-  },
-  onLoad(option) {
-    this.id = option.id
-    this.appr = option.appr || ''
-		this.infoStatus = option.info
-    this.getDetail()
-  },
-  methods: {
-    getDetail() {
-      const { id } = this
-      carUseBookDetail(id).then(res => {
-        this.info = { ...res.data }
-      })
-    },
-    onSubBack() {
-      carUseBookBack({
-        id: this.id,
-        info: this.backParam.info
-      }).then(res => {
-        if (res.code === 200) {
-          uni.showToast({
-            title: '鎾ら攢鎴愬姛',
-            icon: 'success',
-            duration: 2000
-          })
-          this.isShowBack = false
-          setTimeout(() => {
-            uni.navigateBack()
-          }, 1000)
-        }
-      })
-    },
-    onSubmit() {
-      const { param, info } = this
-      carUseBookAppr({
-        status: param.status,
-        objType: info.type == 1 ? 4 : 3,
-        objId: this.id,
-        driverId: param.driverId,
-        checkInfo: param.checkInfo
-      }).then(res => {
-        if (res.code === 200) {
-          this.showApprModal = false
-          setTimeout(() => {
-            uni.showToast({
-              title: '鎿嶄綔鎴愬姛',
-              icon: 'success'
-            })
-          })
-          uni.navigateBack()
-        }
-      })
-    },
-    handleSub(status) {
-      // this.param.flag = 
-      this.param = {
-        status
-      }
-      this.showApprModal = true
-      if (status === 2) { // 鍚屾剰
-        this.getDriveList()
-      } else {
-
-      }
-      this.showApprModal = true
-    },
-    getDriveList() {
-      driveListPost({}).then(res => {
-        this.driveList = [res.data]
-      })
-    },
-    seletedDrive(e) {
-      console.log(e.value[0])
-      this.$set(this.param, 'driverId', e.value[0].id)
-      this.$set(this.param, 'driverName', e.value[0].name)
-      this.isShowDrive = false
-    },
-  },
-}
-</script>
-<style>
-page {
-  background-color: #f7f7f7;
-}
-</style>
-<style lang="scss">
-.main_app {
-  background-color: #fff;
-  padding-bottom: 0;
-
-  .flow_wrap {
-    padding: 30rpx 0;
-  
-    .flow_title {
-      font-weight: 600;
-      font-size: 32rpx;
-      color: #222222;
-      margin-bottom: 24rpx;
-    }
-  
-    .list {
-      .item {
-        display: flex;
-        margin-bottom: 48rpx;
-        position: relative;
-        .separate {
-          position: absolute;
-          width: 4rpx;
-          height: 100%;
-          background-color: #eeeeee;
-          left: 40rpx;
-          transform: translate(-50%, 0);
-          top: 80rpx;
-        }
-        .avatar {
-          width: 80rpx;
-          height: 80rpx;
-          position: relative;
-          margin-right: 20rpx;
-  				display: flex;
-  				align-items: center;
-  				justify-content: center;
-          .img {
-            width: 80rpx;
-            height: 80rpx;
-            border-radius: 50%;
-          }
-  				.img_name{
-  					font-size: 32rpx;
-  					color: #FFFFFF;
-  				}
-          .status {
-            width: 28rpx;
-            height: 28rpx;
-            border-radius: 50%;
-            position: absolute;
-            right: 0;
-            bottom: 0;
-          }
-        }
-  
-        .content {
-          flex: 1;
-  
-          .head {
-            display: flex;
-            justify-content: space-between;
-            margin-bottom: 4rpx;
-  
-            .event {
-              font-size: 30rpx;
-            }
-  
-            .time {
-              font-size: 26rpx;
-              color: #999999;
-            }
-          }
-  
-          .name_wrap {
-            font-size: 26rpx;
-            color: #777777;
-  
-            .status {
-              color: $uni-color-primary;
-            }
-          }
-          .children {
-            display: flex;
-            flex-wrap: wrap;
-            margin-top: 12rpx;
-            .child {
-              display: flex;
-              flex-direction: column;
-              justify-content: center;
-              align-items: center;
-              margin-right: 12rpx;
-  						font-size: 26rpx;
-  						color: #777777;
-              .child_img {
-                width: 48rpx;
-                height: 48rpx;
-                border-radius: 50%;
-  							margin-bottom: 2rpx;
-              }
-  						.child_name{
-  							margin-bottom: 2rpx;
-  							width: 48rpx;
-  							height: 48rpx;
-  							text-align: center;
-  							justify-content: center;
-  							padding-top: 4rpx;
-  							font-size: 28rpx;
-  							border-radius: 50%;
-  							color: #FFFFFF;
-  							background-color: $uni-color-primary;
-  						}
-            }
-          }
-  
-          .remark {
-            margin-top: 12rpx;
-            background-color: #f7f7f7;
-            padding: 14rpx 20rpx;
-            border-radius: 8rpx;
-            font-size: 26rpx;
-            color: #666666;
-            line-height: 36rpx;
-          }
-        }
-        .carbon {
-          display: flex;
-          width: 590rpx;
-          overflow-x: auto;
-          margin-top: 12rpx;
-          .carbon_item {
-            text-align: center;
-            flex-shrink: 0;
-            width: 100rpx;
-            image {
-              width: 60rpx;
-              height: 60rpx;
-              margin: 0 auto;
-            }
-            view {
-              font-size: 26rpx;
-              color: #777777;
-            }
-          }
-        }
-        &:nth-last-child(1) {
-          .separate {
-            height: 0;
-          }
-        }
-      }
-    }
-  }
-
-  .module_list {
-    .item {
-      padding: 30rpx 0;
-      border-bottom: 1rpx solid #e5e5e5;
-
-      .label {
-        font-size: 26rpx;
-        color: #666666;
-        margin-bottom: 20rpx;
-      }
-
-      .value {
-        font-size: 30rpx;
-        display: flex;
-        align-items: center;
-
-        .avatar {
-          margin-right: 20rpx;
-          width: 120rpx;
-          height: 120rpx;
-          border-radius: 8rpx;
-          border: 2rpx solid #e5e5e5;
-        }
-
-        .info {
-          flex: 1;
-          display: flex;
-          flex-direction: column;
-          justify-content: space-between;
-          font-size: 26rpx;
-          color: #666666;
-
-          .name {
-            font-size: 30rpx;
-            color: #333333;
-          }
-        }
-      }
-    }
-  }
-
-  .status_wrap {
+<template>
+	<view class="main_app">
+		<view class="status_wrap">
+		  <view class="name">{{ info.createMemberName }}鎻愪氦鐨勭敤杞︾敵璇�</view>
+		  <view
+		    class="desc"
+		    :class="{
+		      gray: info.status == '2' || info.status == '3' || info.status == '4',
+		    }"
+		    >{{ infoStatus }}</view
+		  >
+		  <view v-if="info.status == '0' || info.status == '1'" class="status">{{
+		    statusMap[info.status]
+		  }}</view>
+		  <image v-if="info.status == '2'" src="@/static/ic_passed@2x.png" mode="widthFix" class="status_img"></image>
+		  <image v-if="info.status == '3' || info.status == '6'" src="@/static/ic_refused@2x.png" mode="widthFix"
+		    class="status_img"></image>
+		</view>
+		<!--  -->
+		<view class="emyty"></view>
+		<view class="module_list">
+			<view class="item">
+				<view class="label">棰勮鐢ㄨ溅鏃舵</view>
+				<view class="value" v-if="info.startTime">{{ info.startTime.slice(0, 16) }}鑷硔{
+            info.endTime.slice(0, 16)
+          }}</view>
+			</view>
+			<view class="item">
+				<view class="label">棰勮鍑哄彂鏃堕棿</view>
+				<view class="value">{{ info.planUseDate }}</view>
+			</view>
+			<view class="item">
+				<view class="label">涔樿溅浜哄憳</view>
+				<view class="value">{{ info.memberNames }}</view>
+			</view>
+			<view class="item">
+				<view class="label">鐩殑鍦�</view>
+				<view class="value">{{ info.type == "1" ? "甯傚" : "甯傚唴" }}锛歿{ info.addr }}</view>
+			</view>
+			<view class="item">
+				<view class="label">鐢ㄨ溅浜嬬敱</view>
+				<view class="value">{{ info.content }}</view>
+			</view>
+			<view class="item">
+				<view class="label">杞﹁締淇℃伅</view>
+				<view class="value">{{ info.carCode }}</view>
+			</view>
+			<view class="item">
+				<view class="label">鍙告満淇℃伅</view>
+				<view class="value">{{ info.driverName }} {{ info.driverPhone }}</view>
+			</view>
+		</view>
+		<!-- 娴佺▼ -->
+		<view class="flow_wrap">
+			<view class="flow_title">娴佺▼</view>
+			<view class="list" v-if="
+			    info.approveDateVO != null && info.approveDateVO.approveList != null
+			  ">
+				<view class="item" v-for="(item, index) in info.approveDateVO.approveList" :key="item.id">
+					<view class="separate"></view>
+					<view class="avatar">
+						<image v-if="item.type == 1" class="img" src="@/static/staff/ic_chaosong@2x.png" />
+						<image v-else-if="item.approveType == 1 || item.approveType == 0" class="img"
+							src="@/static/staff/ic_shenpiren@2x.png" />
+						<image v-else-if="item.faceImg" :src="item.faceImg" class="img"></image>
+						<span v-else class="img_name">{{item.memberName && item.memberName.slice(0,1)}}</span>
+						<image v-if="item.status == 2" class="status" src="@/static/staff/liucheng_success@2x.png"
+							mode="widthFix" />
+						<image v-if="item.status == 3" class="status" src="@/static/staff/liucheng_fail@2x.png" mode="widthFix" />
+					</view>
+					<view class="content">
+						<view class="head">
+							<view class="event">{{ item.title }}</view>
+							<view class="time">{{ item.checkDate }}</view>
+						</view>
+						<view class="name_wrap">
+							<text>{{ item.memberName
+			          }}<text :class="{ status: item.statusInfo == '澶勭悊涓�' || item.status == '1'  }"
+									v-if="item.statusInfo">({{ item.statusInfo }})</text></text>
+						</view>
+						<view v-if="item.checkInfo" class="remark">{{
+			        item.checkInfo
+			      }}</view>
+						<!-- 鎶勯�佷汉 -->
+						<view v-if="item.approveType == 0 || item.type == 1 || item.approveType == 1" class="children">
+							<view class="child" v-for="child in item.approveList" :key="child.id">
+								<image v-if="child.faceImg" class="child_img" :src="child.faceImg" />
+								<view v-else class="child_name">{{ child.memberName && child.memberName.slice(0,1) }}</view>
+								<view>{{ child.memberName }}</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="emyty"></view>
+		<view class="main_footer" v-if="
+        info.approveDateVO != null &&
+        info.approveDateVO.canBeApproved != null &&
+        info.approveDateVO.canBeApproved == 1
+      ">
+			<template v-if="appr == '1'">
+				<view class="btn" @click="handleSub(3)">鎷掔粷</view>
+				<view class="btn agree" @click="handleSub(2)">鍚屾剰</view>
+			</template>
+			<view v-else class="btn agree" @click="isShowBack = true">鎾ら攢鐢ㄨ溅</view>
+		</view>
+
+		<!-- 鎾ら攢 -->
+		<u-popup :show="isShowBack" :round="10" :safeAreaInsetBottom="true" mode="bottom" @close="isShowBack = false">
+			<view class="appr_modal">
+				<view class="title">鎾ら攢鐢ㄨ溅</view>
+				<view class="line"> 鎾ら攢璇存槑 </view>
+				<textarea v-model="backParam.info" placeholder="闈炲繀濉�" placeholder-class="placeholder9" />
+				<view class="main_footer">
+					<view class="btn agree" @click="onSubBack">鎻愪氦</view>
+				</view>
+			</view>
+		</u-popup>
+		<!--  -->
+		<u-popup :show="showApprModal" :round="10" :safeAreaInsetBottom="true" mode="bottom" @close="showApprModal = false">
+			<view class="appr_modal">
+				<view class="title">{{ param.status == 2 ? "鍚屾剰" : "鎷掔粷" }}</view>
+				<view v-if="param.status == 2" class="line" @click="isShowDrive = true">
+					<text v-if="param.driverName">{{ param.driverName }}</text>
+					<text v-else class="placeholder9">娲捐溅鍙告満</text>
+					<u-icon class="ml12" name="arrow-right" color="#999999" />
+				</view>
+				<textarea v-model="param.checkInfo" :placeholder="
+            param.status == 2 ? '鍚屾剰璇存槑锛岄潪蹇呭~' : '鎷掔粷璇存槑锛屽繀濉�'
+          " placeholder-class="placeholder9" />
+				<view class="main_footer">
+					<view class="btn" @click="showApprModal = false">鍙栨秷</view>
+					<view class="btn agree" @click="onSubmit">鎻愪氦</view>
+				</view>
+			</view>
+		</u-popup>
+		<!-- 鍙告満 -->
+		<u-picker keyName="name" :show="isShowDrive" @close="isShowDrive = false" :closeOnClickOverlay="true"
+			:columns="driveList" @confirm="seletedDrive" @cancel="isShowDrive = false"></u-picker>
+	</view>
+</template>
+
+<script>
+	import {
+		carUseBookDetail,
+		carUseBookAppr,
+		driveListPost,
+		carUseBookBack
+	} from '@/api'
+	export default {
+		data() {
+			return {
+				showApprModal: false,
+				isShowBack: false,
+				backParam: {},
+				isShowDrive: false,
+				id: '',
+				appr: '',
+				infoStatus: '',
+				info: {},
+				param: {
+					status: ''
+				},
+				statusMap: {
+					0: '寰呭鎵�',
+					1: '瀹℃壒涓�',
+					2: '宸查�氳繃',
+					3: '鎾ゅ洖鐢宠',
+					4: '宸插彇娑�',
+				},
+				driveList: []
+
+			}
+		},
+		onLoad(option) {
+			this.id = option.id
+			this.appr = option.appr || ''
+			this.infoStatus = option.info
+			this.getDetail()
+		},
+		methods: {
+			getDetail() {
+				const {
+					id
+				} = this
+				carUseBookDetail(id).then(res => {
+					this.info = {
+						...res.data
+					}
+					if (this.info.approveDateVO && this.info.approveDateVO.approveList.length > 0) {
+						this.info.approveDateVO.approveList.forEach(item => {
+							if (item.approveList && item.approveList.length == 1 && item.type !== 1) {
+								item.title = item.approveList[0].title
+								item.faceImg = item.approveList[0].faceImg
+								item.memberName = item.approveList[0].memberName
+								item.statusInfo = item.approveList[0].statusInfo
+								item.status = item.approveList[0].status
+								item.approveList = []
+							}
+						})
+					}
+				})
+			},
+			onSubBack() {
+				carUseBookBack({
+					id: this.id,
+					info: this.backParam.info
+				}).then(res => {
+					if (res.code === 200) {
+						uni.showToast({
+							title: '鎾ら攢鎴愬姛',
+							icon: 'success',
+							duration: 2000
+						})
+						this.isShowBack = false
+						setTimeout(() => {
+							uni.navigateBack()
+						}, 1000)
+					}
+				})
+			},
+			onSubmit() {
+				const {
+					param,
+					info
+				} = this
+				carUseBookAppr({
+					status: param.status,
+					objType: info.type == 1 ? 4 : 3,
+					objId: this.id,
+					driverId: param.driverId,
+					checkInfo: param.checkInfo
+				}).then(res => {
+					if (res.code === 200) {
+						this.showApprModal = false
+						setTimeout(() => {
+							uni.showToast({
+								title: '鎿嶄綔鎴愬姛',
+								icon: 'success'
+							})
+						})
+						uni.navigateBack()
+					}
+				})
+			},
+			handleSub(status) {
+				// this.param.flag = 
+				this.param = {
+					status
+				}
+				this.showApprModal = true
+				if (status === 2) { // 鍚屾剰
+					this.getDriveList()
+				} else {
+
+				}
+				this.showApprModal = true
+			},
+			getDriveList() {
+				driveListPost({}).then(res => {
+					this.driveList = [res.data]
+				})
+			},
+			seletedDrive(e) {
+				console.log(e.value[0])
+				this.$set(this.param, 'driverId', e.value[0].id)
+				this.$set(this.param, 'driverName', e.value[0].name)
+				this.isShowDrive = false
+			},
+		},
+	}
+</script>
+<style>
+	page {
+		background-color: #f7f7f7;
+	}
+</style>
+<style lang="scss">
+	.main_app {
+		background-color: #fff;
+		padding-bottom: 0;
+
+		.flow_wrap {
+			padding: 30rpx 0;
+
+			.flow_title {
+				font-weight: 600;
+				font-size: 32rpx;
+				color: #222222;
+				margin-bottom: 24rpx;
+			}
+
+			.list {
+				.item {
+					display: flex;
+					margin-bottom: 48rpx;
+					position: relative;
+
+					.separate {
+						position: absolute;
+						width: 4rpx;
+						height: 100%;
+						background-color: #eeeeee;
+						left: 40rpx;
+						transform: translate(-50%, 0);
+						top: 80rpx;
+					}
+
+					.avatar {
+						width: 80rpx;
+						height: 80rpx;
+						position: relative;
+						margin-right: 20rpx;
+						display: flex;
+						align-items: center;
+						justify-content: center;
+
+						.img {
+							width: 80rpx;
+							height: 80rpx;
+							border-radius: 50%;
+						}
+
+						.img_name {
+							font-size: 32rpx;
+							color: #FFFFFF;
+						}
+
+						.status {
+							width: 28rpx;
+							height: 28rpx;
+							border-radius: 50%;
+							position: absolute;
+							right: 0;
+							bottom: 0;
+						}
+					}
+
+					.content {
+						flex: 1;
+
+						.head {
+							display: flex;
+							justify-content: space-between;
+							margin-bottom: 4rpx;
+
+							.event {
+								font-size: 30rpx;
+							}
+
+							.time {
+								font-size: 26rpx;
+								color: #999999;
+							}
+						}
+
+						.name_wrap {
+							font-size: 26rpx;
+							color: #777777;
+
+							.status {
+								color: $uni-color-primary;
+							}
+						}
+
+						.children {
+							display: flex;
+							flex-wrap: wrap;
+							margin-top: 12rpx;
+
+							.child {
+								display: flex;
+								flex-direction: column;
+								justify-content: center;
+								align-items: center;
+								margin-right: 12rpx;
+								font-size: 26rpx;
+								color: #777777;
+
+								.child_img {
+									width: 48rpx;
+									height: 48rpx;
+									border-radius: 50%;
+									margin-bottom: 2rpx;
+								}
+
+								.child_name {
+									margin-bottom: 2rpx;
+									width: 48rpx;
+									height: 48rpx;
+									text-align: center;
+									justify-content: center;
+									padding-top: 4rpx;
+									font-size: 28rpx;
+									border-radius: 50%;
+									color: #FFFFFF;
+									background-color: $uni-color-primary;
+								}
+							}
+						}
+
+						.remark {
+							margin-top: 12rpx;
+							background-color: #f7f7f7;
+							padding: 14rpx 20rpx;
+							border-radius: 8rpx;
+							font-size: 26rpx;
+							color: #666666;
+							line-height: 36rpx;
+						}
+					}
+
+					.carbon {
+						display: flex;
+						width: 590rpx;
+						overflow-x: auto;
+						margin-top: 12rpx;
+
+						.carbon_item {
+							text-align: center;
+							flex-shrink: 0;
+							width: 100rpx;
+
+							image {
+								width: 60rpx;
+								height: 60rpx;
+								margin: 0 auto;
+							}
+
+							view {
+								font-size: 26rpx;
+								color: #777777;
+							}
+						}
+					}
+
+					&:nth-last-child(1) {
+						.separate {
+							height: 0;
+						}
+					}
+				}
+			}
+		}
+
+		.module_list {
+			.item {
+				padding: 30rpx 0;
+				border-bottom: 1rpx solid #e5e5e5;
+
+				.label {
+					font-size: 26rpx;
+					color: #666666;
+					margin-bottom: 20rpx;
+				}
+
+				.value {
+					font-size: 30rpx;
+					display: flex;
+					align-items: center;
+
+					.avatar {
+						margin-right: 20rpx;
+						width: 120rpx;
+						height: 120rpx;
+						border-radius: 8rpx;
+						border: 2rpx solid #e5e5e5;
+					}
+
+					.info {
+						flex: 1;
+						display: flex;
+						flex-direction: column;
+						justify-content: space-between;
+						font-size: 26rpx;
+						color: #666666;
+
+						.name {
+							font-size: 30rpx;
+							color: #333333;
+						}
+					}
+				}
+			}
+		}
+
+ .status_wrap {
     position: relative;
     padding: 30rpx 0;
 
     .name {
       font-weight: 600;
       font-size: 32rpx;
-      margin-bottom: 16rpx;
+      margin-bottom: 20rpx;
       color: #222222;
     }
 
     .desc {
       font-size: 26rpx;
       color: #ed4545;
-			margin-top: 16rpx;
     }
+
     .gray {
       color: #999999;
     }
@@ -548,67 +516,75 @@
       background-color: #e9edff;
       color: $uni-color-primary;
     }
-  }
 
-  .main_footer {
-    padding-bottom: 64rpx;
-    display: flex;
-    justify-content: space-between;
-
-    .btn {
-      flex: 1;
-      height: 88rpx;
-      line-height: 88rpx;
-      background: #ffffff;
-      border-radius: 44rpx;
-      border: 1rpx solid #999999;
-      font-size: 32rpx;
-      text-align: center;
-      margin: 16rpx;
+    .status_img {
+      position: absolute;
+      right: 0rpx;
+      top: 20rpx;
+      width: 120rpx;
     }
-
-    .agree {
-      background: $uni-color-primary;
-      color: #fff;
-      border: 1rpx solid $uni-color-primary;
-    }
-  }
-
-  .appr_modal {
-    padding: 36rpx 30rpx 0;
-    .line {
-      height: 90rpx;
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      border-bottom: 1rpx solid #e4e4e4;
-      margin-bottom: 20rpx;
-    }
-    .title {
-      font-weight: 600;
-      font-size: 32rpx;
-      color: #222222;
-      margin-bottom: 40rpx;
-      text-align: center;
-    }
-
-    textarea {
-      box-sizing: border-box;
-      width: 690rpx;
-      background-color: #f7f7f7;
-      font-size: 28rpx;
-      color: #333333;
-      padding: 24rpx;
-      border-radius: 8rpx;
-      margin-bottom: 30rpx;
-    }
-  }
-
-  .emyty {
-    width: 750rpx;
-    height: 20rpx;
-    background-color: #f7f7f7;
-    margin: 0 -30rpx;
-  }
-}
-</style>
+  }
+		.main_footer {
+			padding-bottom: 64rpx;
+			display: flex;
+			justify-content: space-between;
+
+			.btn {
+				flex: 1;
+				height: 88rpx;
+				line-height: 88rpx;
+				background: #ffffff;
+				border-radius: 44rpx;
+				border: 1rpx solid #999999;
+				font-size: 32rpx;
+				text-align: center;
+				margin: 16rpx;
+			}
+
+			.agree {
+				background: $uni-color-primary;
+				color: #fff;
+				border: 1rpx solid $uni-color-primary;
+			}
+		}
+
+		.appr_modal {
+			padding: 36rpx 30rpx 0;
+
+			.line {
+				height: 90rpx;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				border-bottom: 1rpx solid #e4e4e4;
+				margin-bottom: 20rpx;
+			}
+
+			.title {
+				font-weight: 600;
+				font-size: 32rpx;
+				color: #222222;
+				margin-bottom: 40rpx;
+				text-align: center;
+			}
+
+			textarea {
+				box-sizing: border-box;
+				width: 690rpx;
+				background-color: #f7f7f7;
+				font-size: 28rpx;
+				color: #333333;
+				padding: 24rpx;
+				border-radius: 8rpx;
+				margin-bottom: 30rpx;
+			}
+		}
+
+		.emyty {
+			width: 750rpx;
+			height: 20rpx;
+			background-color: #f7f7f7;
+			margin: 0 -30rpx;
+		}
+	}
+</style>
\ No newline at end of file

--
Gitblit v1.9.3