2751

package_A/pages/report/index.js

@@ -182,15 +182,7 @@ Page({
     getCurrentData(e) {
         return e.currentTarget.dataset.current;
     },
-    /* 取消 */
-    returnLastPage() {
-        this.setData({
-            form: {}
-        })
-        wx.navigateBack({
-          delta: 1,
-        })
-    },
+
     /**
      * 选择位置
      */

package_A/pages/report/index.json

@@ -1,4 +1,7 @@
 {
   "usingComponents": {},
-  "navigationBarTitleText": "上报问题"
+  "navigationBarTitleText": "问题上报",
+  "navigationBarTextStyle": "white",
+  "navigationBarBackgroundColor": "#008CFF"
+
 }

package_A/pages/report/index.wxml

@@ -1,68 +1,75 @@
 <!--package_A/work/index.wxml-->
 <view class="upload_container">
-    <image class="head_img" mode="widthFix" src="../../../assets/img/upload_head.png"></image>
+    <image class="head_img" mode="widthFix" src="../../img/report_bg.png"></image>
     <view class="form_container">
-        <view class="form_item">
-            <text><text style="color: red;">*</text>选择河道：</text>
-            <view class="value_box disable_class">
-                <text class="picker_text">{{form.streamName}}</text>
-            </view>
-        </view>
-        <view class="form_item {{formRules.location.warning ? 'warning' : ''}}">
-            <text><text style="color: red;">*</text>问题位置：</text>
-            <view class="value_box">
-                <text class="picker_text" wx:if="{{form.location}}">{{form.location}}</text>
-                <text style="color: #a6a6a6;font-size: 24rpx;" wx:else>请选择问题位置</text>
-                <image src="../../../assets/img/location.png" style="width:60rpx;height:60rpx;position: absolute;right: 0rpx;top: 2rpx;z-index: 99;" bindtap="selectLocation"></image>
-            </view>
-            <text class="tips">请选择问题位置</text>
-        </view>
-        <view class="use_purpose {{formRules.feedbackDesc.warning ? 'warning' : ''}}">
-            <text><text style="color: red;">*</text>问题描述：</text>
-            <view class="value_box">
-                <textarea maxlength="200" style="width:500rpx; height: 160rpx;padding-top: 10rpx;" type="text" adjust-position="{{true}}" placeholder="请输入问题描述" placeholder-style="font-size: 24rpx; color: #A6A6A6;" value="{{form.feedbackDesc}}" data-name="feedbackDesc" name="feedbackDesc" bindblur="bindValue" />
+        <!-- 河道信息 -->
+        <view class="info_box">
+            <view class="box_title">河道信息</view>
+            <view class="form_item">
+                <text><text style="color: red;">* </text>选择河道</text>
+                <view class="value_box disable_class">
+                    <text class="picker_text">{{form.streamName}}</text>
+                </view>
             </view>
-            <text class="tips">请输入问题描述</text>
-        </view>
-        <view class="form_item {{formRules.feedbackName.warning ? 'warning' : ''}}">
-            <text><text style="color: red;">*</text>姓名：</text>
-            <view class="value_box">
-                <input style="width: 100%;height: 100%;" type="text" maxlength="100" placeholder="请输入您的姓名" placeholder-style="font-size: 24rpx; color: #A6A6A6;" adjust-position="{{true}}" value="{{form.feedbackName}}" data-name="feedbackName" name="feedbackName" bindblur="bindValue" />
+            <view class="form_item {{formRules.location.warning ? 'warning' : ''}}">
+                <text><text style="color: red;">* </text>问题位置</text>
+                <view class="value_box">
+                    <text class="picker_text" wx:if="{{form.location}}">{{form.location}}</text>
+                    <text style="color: #a6a6a6;font-size: 28rpx;" wx:else>请选择问题位置</text>
+                    <image src="../../../assets/img/location.png" style="width:54rpx;height:54rpx;position: absolute;right: 0rpx;top: 7rpx;z-index: 99;" bindtap="selectLocation"></image>
+                </view>
+                <text class="tips">请选择问题位置</text>
             </view>
-            <text class="tips">请输入您的姓名</text>
-        </view>
-        <view class="form_item {{formRules.feedbackPhone.warning ? 'warning' : ''}}">
-            <text><text style="color: red;">*</text>电话号码：</text>
-            <view class="value_box">
-                <input style="width: 100%;height: 100%;" maxlength="11" type="text" placeholder="请输入您的电话号码" placeholder-style="font-size: 24rpx; color: #A6A6A6;" adjust-position="{{true}}" value="{{form.feedbackPhone}}" data-name="feedbackPhone" name="feedbackPhone" bindblur="bindValue" />
+            <view class="use_purpose {{formRules.feedbackDesc.warning ? 'warning' : ''}}">
+                <text><text style="color: red;">* </text>问题描述</text>
+                    <textarea maxlength="200" style="width:620rpx; height: 120rpx;padding: 20rpx;" type="text" adjust-position="{{true}}" placeholder="请输入问题描述" placeholder-style="font-size: 28rpx; color: #A6A6A6;" value="{{form.feedbackDesc}}" data-name="feedbackDesc" name="feedbackDesc" bindblur="bindValue" />
+                <text class="tips">请输入问题描述</text>
             </view>
-            <text class="tips">请输入正确格式的电话号码</text>
+            <view class="upload_images {{formRules.imageList.warning? 'warning': ''}}">
+                <text><text style="color: red;">* </text>上传图片</text>
+                <view class="image_list">
+                    <view class="image_preview" wx:for="{{imagePreviewList}}" wx:key="index">
+                        <image class="image_item" src="{{item}}" mode="aspectFill" data-item="{{item}}">
+                        </image>
+                        <div class="close" data-current="{{index}}" catchtap="deleteImage"></div>
+                    </view>
+                    <view class="upload_image" bindtap="uploadImage" wx:if="{{imageList.length<5}}">
+                        <image style="height: 53rpx;width: 53rpx;margin-bottom: 27rpx;" mode="widthFix" src="../../../assets/img/open_upload.png"></image>
+                        <text style="font-size: 28rpx;">上传图片</text>
+                    </view>
+                </view>
+                <text class="tips">请上传图片</text>
+            </view> 
         </view>
-        <view class="upload_images {{formRules.imageList.warning? 'warning': ''}}">
-            <text><text style="color: red;">*</text>上传照片：</text>
-            <view class="image_list">
-                <view class="image_preview" wx:for="{{imagePreviewList}}" wx:key="index">
-                    <image class="image_item" src="{{item}}" mode="aspectFill" data-item="{{item}}">
-                    </image>
-                    <div class="close" data-current="{{index}}" catchtap="deleteImage"></div>
+
+        <!-- 个人信息 -->
+        <view class="info_box">
+            <view class="box_title">个人信息</view>
+            <view class="form_item {{formRules.feedbackName.warning ? 'warning' : ''}}">
+                <text><text style="color: red;">* </text>姓名</text>
+                <view class="value_box">
+                    <input style="width: 100%;height: 100%;" type="text" maxlength="100" placeholder="请输入您的姓名" placeholder-style="font-size: 28rpx; color: #A6A6A6;" adjust-position="{{true}}" value="{{form.feedbackName}}" data-name="feedbackName" name="feedbackName" bindblur="bindValue" />
                 </view>
-                <view class="upload_image" bindtap="uploadImage" wx:if="{{imageList.length<5}}">
-                    <image style="height: 56rpx;width: 56rpx;" mode="widthFix" src="../../../assets/img/upload.png"></image>
+                <text class="tips">请输入您的姓名</text>
+            </view>
+            <view class="form_item {{formRules.feedbackPhone.warning ? 'warning' : ''}}">
+                <text><text style="color: red;">* </text>电话号码</text>
+                <view class="value_box">
+                    <input style="width: 100%;height: 100%;" maxlength="11" type="text" placeholder="请输入您的电话号码" placeholder-style="font-size: 28rpx; color: #A6A6A6;" adjust-position="{{true}}" value="{{form.feedbackPhone}}" data-name="feedbackPhone" name="feedbackPhone" bindblur="bindValue" />
                 </view>
+                <text class="tips">请输入正确格式的电话号码</text>
             </view>
-            <text class="tips">请上传图片</text>
         </view>
+        
+        <view class="safe_box">
+            <label class="checkbox" bindtap="checkBoxChange">
+                <checkbox value="{{checkAgree}}" /><text>同意</text>
+            </label>
+            <text style="color: #2a82e4;" bindtap="showAgree">《用户服务协议》</text>和<text style="color: #2a82e4;" bindtap="showConceal">《隐私政策》</text>
+        </view>
+        <!-- 按钮 -->
+        <button disabled="{{!checkAgree}}" style="width: 690rpx;" class="btn_item submit_btn" bindtap="submit">确定</button>
     </view>
 
-    <view class="safe_box">
-        <label class="checkbox" bindtap="checkBoxChange">
-            <checkbox value="{{checkAgree}}" /><text>同意</text>
-        </label>
-        <text style="color: #2a82e4;" bindtap="showAgree">《用户服务协议》</text>和<text style="color: #2a82e4;" bindtap="showConceal">《隐私政策》</text>
-    </view>
 
-    <view class="btn_list">
-        <button class="btn_item cancel_btn" bindtap="returnLastPage">取消</button>
-        <button disabled="{{!checkAgree}}" class="btn_item submit_btn" bindtap="submit">确认</button>
-    </view>
 </view>

package_A/pages/report/index.wxss

@@ -1,54 +1,83 @@
 /* package_A/work/index.wxss */
 .upload_container {
     width: 100%;
+    min-height: 100vh;
     display: flex;
     flex-direction: column;
     justify-content: flex-start;
     align-items: flex-start;
+    position: relative;
+    background-color: #f8f8f8;
 }
 .head_img {
     width: 100vw;
 }
 .form_container {
     width: 100%;
+    margin-top: -300rpx;
     padding: 30rpx;
     display: flex;
     flex-direction: column;
     justify-content: flex-start;
     align-items: flex-start;
+    
 }
-.form_item {
+.info_box {
+    width: 100%;
+    padding: 30rpx 27rpx;
+    margin-bottom: 40rpx;
+    background-color: #FFFFFF;
+    border-radius: 20rpx;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: flex-start;
+    font-size: 28rpx;
+    color: #6F6F6F;
+}
+.box_title {
     width: 100%;
     margin-bottom: 30rpx;
+    font-size: 30rpx;
+    color: #000000;
+    font-weight: bold;
+}
+.form_item {
+    width: 100%;
+    padding: 15rpx 0;
+    /* margin-bottom: 30rpx; */
     display: flex;
     justify-content: space-between;
     align-items: center;
     position: relative;
     font-size: 28rpx;
     color: #666666;
+    border-top: 1rpx solid #EDEDED;
 }
 .use_purpose {
     width: 100%;
-    margin-bottom: 30rpx;
+    padding: 25rpx 0;
     display: flex;
-    justify-content: space-between;
+    flex-direction: column;
+    justify-content: flex-start;
     align-items: flex-start;
     position: relative;
     font-size: 28rpx;
     color: #666666;
+    border-top: 1rpx solid #EDEDED;
 }
 .value_box {
-    width: 500rpx;
+    width: 460rpx;
     min-height: 68rpx;
-    padding: 0 55rpx 0 10rpx;
+    padding: 0 50rpx 0 10rpx;
     display: flex;
-    justify-content: flex-start;
+    justify-content: flex-end;
     align-items: center;
-    border: 1rpx solid #A6A6A6;
     border-radius: 4rpx;
     position: relative;
     color: #333333;
-    font-size: 24rpx;
+    font-size: 28rpx;
+    text-align: end;
 }
 .picker_text {
     width: 100%;
@@ -58,7 +87,7 @@
 }
 .disable_class {
     border: none;
-    background-color: #EFEFEF;
+    color: #006DF7;
 }
 .tips{
     position: absolute;
@@ -76,17 +105,19 @@
   /* 上传图片 */
   .upload_images {
     width: 100%;
-    margin-bottom: 30rpx;
+    padding: 25rpx 0;
     display: flex;
-    justify-content: space-between;
+    flex-direction: column;
+    justify-content: flex-start;
     align-items: flex-start;
     font-size: 28rpx;
     color: #666666;
     position: relative;
+    border-top: 1rpx solid #EDEDED;
 }
 .image_list {
     width: 500rpx;
-    margin-top: 20rpx;
+    margin-top: 30rpx;
     display: flex;
     flex-wrap: wrap;
     justify-content: flex-start;
@@ -103,6 +134,8 @@
   height:100%;
   width: 100%;
   margin-bottom: 20rpx;
+  margin-right: 30rpx;
+  border-radius: 10rpx;
 }
 .close{
   position: absolute;
@@ -125,7 +158,6 @@
   left:50%;
   background:rgb(124, 124, 124);
   transform-origin: center;
-  /* transform: ; */
   transform: translate(-50%,-50%) rotate(45deg);
 }
 .close::after{
@@ -138,7 +170,6 @@
   left:50%;
   background:rgb(124, 124, 124);
   transform-origin: center;
-  /* transform: ; */
   transform: translate(-50%,-50%) rotate(-45deg);
 }
 .upload_image {
@@ -148,8 +179,9 @@
   flex-direction: column;
   align-items: center;
   justify-content: center;
-  border: 1rpx dashed #A6A6A6;
   border-radius: 10rpx;
+  background-color: #FBFBFB;
+  border: 1px dashed #CECECE;
 }
 
 .upload_image text {
@@ -163,24 +195,16 @@
 }
 
 /* 按钮区 */
-.btn_list {
-    width: 100%;
-    padding: 10rpx 30rpx;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-}
 .btn_item {
-    width: 320rpx;
     height: 80rpx;
+    margin-top: 110rpx;
     border-radius: 40rpx;
     text-align: center;
-    font-size: 28rpx;
-}
-.cancel_btn {
-    color: #333333;
-    border: 1rpx solid #E6E6E6;
+    font-size: 32rpx;
+    color: #6F6F6F;
+    background-color: #4b4545;
 }
+
 .submit_btn {
     color: #ffffff;
     background-color: #2a82e4;
@@ -188,12 +212,12 @@
 /* 用户协议确认框 */
 .safe_box {
     width: 100%;
-    padding: 0 30rpx;
     margin-bottom: 30rpx;
     display: flex;
     justify-content: flex-start;
     align-items: center;
-    font-size: 28rpx;
+    font-size: 26rpx;
+    color: #959595;
 }
 .checkbox {
     display: flex;

package_first/pages/uploadBeauty/index.wxml

@@ -19,7 +19,7 @@
                     <div class="close" data-current="{{index}}" catchtap="deleteImage"></div>
                 </view>
                 <view class="upload_image" bindtap="uploadImage" wx:if="{{imageList.length<5}}">
-                    <image style="height: 53rpx;width: 53rpx;margin-bottom: 27rpx;" mode="widthFix" src="../../img/open_upload.png"></image>
+                    <image style="height: 53rpx;width: 53rpx;margin-bottom: 27rpx;" mode="widthFix" src="../../../assets/img/open_upload.png"></image>
                     <text style="font-size: 28rpx;">上传图片</text>
                 </view>
             </view>

package_first/pages/uploadBeauty/index.wxss

@@ -139,8 +139,8 @@ picker {
 .image_item {
   height:100%;
   width: 100%;
-  margin-right: 30rpx;
   margin-bottom: 20rpx;
+  margin-right: 30rpx;
   border-radius: 10rpx;
 }
 .close{