1

miniprogram/pages/reportRepair/repair/case/case.js

@@ -7,6 +7,18 @@ Page({
      */
     data: {
         IMG_NAME: app.IMG_NAME,
+        statusList : [
+            {
+                name : '已解决',
+                status : 1,
+                isSelect: true,
+            },
+            {
+                name : '未解决',
+                status : 2,
+                isSelect: false,
+            }
+        ]
     },
 
     /**

miniprogram/pages/reportRepair/repair/case/case.json

@@ -1,4 +1,10 @@
 {
     "navigationBarTitleText": "工单详情",
-    "usingComponents": {}
+    "usingComponents": {
+        "van-icon": "@vant/weapp/icon/index",
+        "van-field": "@vant/weapp/field/index",
+        "van-uploader": "@vant/weapp/uploader/index",
+        "van-checkbox": "@vant/weapp/checkbox/index",
+        "van-checkbox-group": "@vant/weapp/checkbox-group/index"
+    }
 }

miniprogram/pages/reportRepair/repair/case/case.wxml

@@ -4,10 +4,12 @@
         <view class="progressView">
             <view class="point">
                 <view class="msgView">派单信息</view>
+                <view class="time">2022-11-15 10:25:23</view>
             </view>
             <view class="line"></view>
             <view class="point">
                 <view class="msgView">派单信息</view>
+                <view class="time">2022-11-15 10:25:23</view>
             </view>
             <view class="line"></view>
             <view class="point activity">
@@ -65,4 +67,48 @@
         </view>
     </view>
 
+    <view class="step2">
+        <view class="itemView">
+            <view class="title">分析原因</view>
+            <view class="content">
+                <van-field model:value="{{ value }}" type="textarea" placeholder="请输入用户名" maxlength="{{100}}" show-word-limit border="{{true}}" autosize input-class="selfTextarea" />
+            </view>
+        </view>
+        <view class="itemView">
+            <view class="title">解决方案</view>
+            <view class="content">
+                <van-field model:value="{{ value }}" type="textarea" placeholder="请输入用户名" maxlength="{{100}}" show-word-limit border="{{true}}" autosize input-class="selfTextarea" />
+            </view>
+        </view>
+        <view class="itemView">
+            <view class="title">图片</view>
+            <view class="content">
+                <!-- 上传图片 -->
+                <view class="uploadImgView">
+                    <van-uploader file-list="{{ fileList }}" upload-text="点击上传照片" use-before-read bind:before-read="beforeRead" bind:after-read="afterRead" deletable="{{ true }}" bind:delete="deleteImg" max-count="1" />
+                </view>
+            </view>
+        </view>
+        <view class="itemView">
+            <view class="title">是否解决</view>
+            <view class="content">
+                <view class="checkItemView"  wx:for="{{statusList}}" wx:key="*this">
+                    <van-checkbox value="{{ item.isSelect }}" data-id="{{item.status}}" shape="square" icon-size="36rpx" bind:tap="checkBoxClick"></van-checkbox>
+                    <view class="name" data-id="{{item.status}}" bind:tap="checkBoxClick">{{item.name}}</view>
+                </view>
+            </view>
+        </view>
+        <view class="btn">提交反馈</view>
+    </view>
+
+    <view class="step3">
+        <view class="mainView">
+            <van-icon name="success" color="#4e96f8" size="180rpx"/>
+            <view class="label1">处理成功</view>
+            <view class="label2">您已提交成功</view>
+        </view>
+        <view class="btn">查看工单</view>
+        <view class="btn back">返回首页</view>
+    </view>
+
 </view>

miniprogram/pages/reportRepair/repair/case/case.wxss

@@ -154,12 +154,129 @@
 
 .step1 .bottomView .btn {
     border-radius: 8rpx;
-    padding: 14rpx 90rpx;
+    padding: 18rpx 110rpx;
-    font-size: 26rpx;
+    font-size: 28rpx;
     color: white;
     background: #4e96f8;
 }
 
 .step1 .bottomView .btn.oragen {
     background: #ebae77;
+}
+
+
+.step2 {
+    border: 1rpx solid transparent;
+    margin-top: 4rpx;
+    padding: 0 0 100rpx;
+    background: white;
+}
+
+.step2 .itemView {
+    box-shadow: rgba(150, 150, 150, 0.3) 0 0 4px 0px;
+    border-radius: 6rpx;
+    position: relative;
+    margin: 30rpx 40rpx;
+    padding: 30rpx;
+}
+
+.step2 .itemView::after {
+    display: block;
+    content: '';
+    position: absolute;
+    left: 0;
+    top: 0;
+    height: 100%;
+    width: 6rpx;
+    background: #4e96f8;
+}
+
+.step2 .itemView .title {
+    font-size: 26rpx;
+    color: black;
+}
+
+.step2 .itemView .content {
+    margin-top: 30rpx;
+}
+
+.step2 .itemView .content .checkItemView {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    margin: 0 20rpx;
+    padding: 20rpx;
+    border-bottom: 1rpx solid rgb(126, 126, 126, 0.2);
+}
+
+.step2 .itemView .content .checkItemView .name {
+    font-size: 28rpx;
+    margin-left: 10rpx;
+}
+
+.step2 .btn {
+    box-sizing: border-box;
+    width: 600rpx;
+    border-radius: 10rpx;
+    padding: 20rpx;
+    background: #4e96f8;
+    color: white;
+    font-size: 30rpx;
+    text-align: center;
+    margin: 100rpx auto;
+}
+
+.selfTextarea {
+    min-height: 100rpx !important;
+    max-height: 100rpx !important;
+}
+
+.uploadImgView {
+    border: 1rpx dashed #c9c9c9;
+    padding: 20rpx 40rpx;
+    background-color: #ffffff;
+}
+
+.step3 {
+    border: 1rpx solid transparent;
+    margin-top: 4rpx;
+    padding: 0 0 100rpx;
+    background: white;
+}
+
+.step3 .mainView {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    padding: 160rpx 0;
+}
+
+.step3 .mainView .label1 {
+    font-size: 40rpx;
+    font-weight: bold;
+}
+
+.step3 .mainView .label2 {
+    margin-top: 10rpx;
+    font-size: 30rpx;
+    color: #979797;
+}
+
+.step3 .btn {
+    box-sizing: border-box;
+    width: 600rpx;
+    border-radius: 10rpx;
+    padding: 20rpx;
+    background: #4e96f8;
+    color: white;
+    font-size: 30rpx;
+    text-align: center;
+    margin: 20rpx auto;
+}
+
+.step3 .btn.back {
+    border: 1px solid #4e96f8;
+    background: white;
+    color: #4e96f8;
 }