报备修改

src/views/report/components/report-list-item.vue

@@ -2,7 +2,7 @@
   <div class="bottom_wrap">
     <div class="report_item" v-for="(item, index) in reportList" @click="goReportHandler(item)" :key="index">
       <img class="report_icon" :src="item?.iconUrl" alt="">
-      <div class="report_title">{{item.name}}</div>
+<!--      <div class="report_title">{{item.name}}</div>-->
     </div>
   </div>
 </template>

src/views/report/reportIndex.vue

@@ -57,7 +57,7 @@
         </div>
       </div>
       <report-list-item :report-list.sync="reportList" @getReport="getReportHandler" />
-      <van-popup ref="addReportModal" v-model="addReportShow" :close-on-click-overlay="false" closeable duration="0" round position="bottom">
+      <van-popup ref="addReportModal" v-model="addReportShow" :close-on-click-overlay="false" closeable duration="0" round position="bottom" :style="{ paddingBottom: keyboardHeight + 'px' }">
         <div class="dialog_wrap">
           <img class="add_report_bg" src="@/assets/report/add_report_bg.png" alt="">
           <div class="report_content">
@@ -116,6 +116,7 @@
           v-model="appointTime"
           type="datetime"
           :min-date="minDate"
+          :filter="filter"
           @confirm="onConfirm"
           @cancel="showDatetime = false"
         />
@@ -137,6 +138,8 @@
     mixins: [myMixins],
     data() {
       return {
+        keyboardHeight: 0,
+        isKeyboardShow: false,
         addReportShow: false,
         remark: '',
         showDatetime: false,
@@ -167,6 +170,10 @@
       await this.getDetail();
       await this.getRecordList();
       await this.scrollToBottom();
+      window.addEventListener('resize', this.handleResize);
+    },
+    beforeDestroy() {
+      window.removeEventListener('resize', this.handleResize);
     },
     activated() {
       let addressSession = sessionStorage.getItem('reportAddress');
@@ -179,6 +186,36 @@
       }
     },
     methods: {
+      handleResize() {
+        const windowHeight = window.innerHeight;
+        const docHeight = document.documentElement.clientHeight;
+        const diff = docHeight - windowHeight;
+        if (diff > 100) {
+          this.keyboardHeight = diff + 20;
+          this.isKeyboardShow = true;
+          this.scrollToTextarea();
+        } else {
+          this.keyboardHeight = 0;
+          this.isKeyboardShow = false;
+        }
+      },
+      scrollToTextarea() {
+        this.$nextTick(() => {
+          const textarea = document.querySelector('.report_textarea');
+          if (textarea && this.isKeyboardShow) {
+            textarea.scrollIntoView({
+              behavior: 'smooth',
+              block: 'center'
+            });
+          }
+        });
+      },
+      filter(type, options) {
+        if (type === 'minute') {
+          return options.filter((option) => option % 5 === 0);
+        }
+        return options;
+      },
       onRefreshHandler() {
         setTimeout(async () => {
           try {
@@ -268,15 +305,21 @@
         this.remark = '';
       },
       addReportHandler(data) {  // 点击添加报备弹框
+        console.log('currentInfocurrentInfo', data)
         this.currentInfo = data;
+        this.remark = '';
         this.addReportShow = true
       },
       getReportHandler(data) {  // 点击获取当前报备信息
+        console.log('dadadada', data.child)
         this.recordList.push({
           messageType: 4,
           content: data.child
         })
         this.scrollToBottom();
+        if( data.child?.length == 1 ) {
+          this.addReportHandler(data.child[0])
+        }
       },
       async getDetail(){  // 订单详情
         if(this.userOrderId) {
@@ -537,7 +580,7 @@
       }
       .report_common_content {
         margin-bottom: 27px;
-        .report_textarea {
+        /*.report_textarea {
           width: 100%;
           box-sizing: border-box;
           background: #F8FAFC;
@@ -546,6 +589,23 @@
           border: 1px solid #E2EAF6;
           padding: 10px;
           font-size: 13px;
+        }*/
+        .report_textarea {
+          width: 100%;
+          box-sizing: border-box;
+          background: #F8FAFC;
+          border-radius: 6px;
+          min-height: 95px;
+          border: 1px solid #E2EAF6;
+          padding: 15px;
+          font-size: 14px;
+          line-height: 1.6;
+          resize: none;
+          outline: none;
+          &:focus {
+            border-color: #267EF0;
+            box-shadow: 0 0 0 2px rgba(38, 126, 240, 0.1);
+          }
         }
       }
     }
@@ -565,4 +625,14 @@
   ::v-deep .van-popup__close-icon {
     color: #0F458E;
   }
+  ::v-deep .van-popup--bottom {
+    position: fixed !important;
+    bottom: 0 !important;
+    left: 0 !important;
+    right: 0 !important;
+    transform: none !important;
+    max-height: 80vh !important;
+    overflow-y: auto;
+    -webkit-overflow-scrolling: touch;
+  }
 </style>