高级搜索 修改为输入框

src/views/myOrder/components/HighSearch.vue

@@ -7,7 +7,31 @@
         :style="{ width: '75%',height: '100%', overflow: 'hidden' }">
         <div class="title font-bold font-16">下单时间</div>
         <time-choose :startTime="moreSearchInfo.time.start" :endTime="moreSearchInfo.time.end" @confirm="timeConfirm"></time-choose>
-        <van-cell-group class="high-info">
+        <div class="high-info-list">
+          <div class="high-info" @click="showPost('consignor')">
+            <div class="title font-bold font-16">货主</div>
+            <!-- <textarea :value="consignor" class="inputInfo" type="text"></textarea> -->
+            <div contenteditable="true" class="inputInfo">{{consignor}}</div>
+          </div>
+          <div class="high-info">
+            <div class="title font-bold font-16">请输入订单号</div>
+            <!-- <div contenteditable="true" class="inputInfo">{{orderNo}}</div> -->
+            <textarea :value="orderNo" class="input" type="text"></textarea>
+          </div>
+          <div class="high-info" @click="showPost('supplier')">
+            <div class="title font-bold font-16">供应商</div>
+            <div contenteditable="true" class="inputInfo">{{supplier}}</div>
+          </div>
+          <div class="high-info" @click="showPost('goods')">
+            <div class="title font-bold font-16">商品</div>
+            <div contenteditable="true" class="inputInfo">{{goods}}</div>
+          </div>
+          <div class="high-info" @click="showPost('client')">
+            <div class="title font-bold font-16">客户</div>
+            <div contenteditable="true" class="inputInfo">{{client}}</div>
+          </div>
+        </div>
+        <!-- <van-cell-group class="high-info">
           <van-cell class="flex4" is-link
             :value="consignor"
             @click="showPost('consignor')">
@@ -41,7 +65,7 @@
               <span type="danger" class="font-bold">客户</span>
             </template>
           </van-cell>
-        </van-cell-group>
+        </van-cell-group> -->
         <div class="action-bottom">
           <van-button type="default" @click="onCleanClick">重置</van-button>
           <van-button type="info" class="submit" @click="onSearchClick">查询</van-button>
@@ -112,6 +136,7 @@ export default {
         consignor: '', // 货主
         goods: '', // 商品
         client: '', // 客户
+        orderNo: '', // 订单号
         time: {
           start: getFormateDate(new Date(), 'yyyy-MM-dd'),
           end: getFormateDate(new Date(), 'yyyy-MM-dd')
@@ -155,6 +180,14 @@ export default {
       } else {
         return ''
       }
+    },
+    // 订单号
+    orderNo () {
+      if (this.moreSearchInfo.orderNo) {
+        return !this.moreSearchInfo.orderNo ? '' : this.moreSearchInfo.orderNo
+      } else {
+        return ''
+      }
     }
   },
   props: {
@@ -191,13 +224,15 @@ export default {
         consignor: '', // 货主
         goods: '', // 商品
         client: '', // 客户
+        orderNo: '',
         time: {
           start: getFormateDate(new Date(), 'yyyy-MM-dd'),
           end: getFormateDate(new Date(), 'yyyy-MM-dd')
         },
       }
-      this.moreSearchShow = false
-      this.$emit('onsearch', this.moreSearchInfo)
+      console.log(this.moreSearchInfo)
+      // this.moreSearchShow = false
+      // this.$emit('onsearch', this.moreSearchInfo)
     },
     
     showPost(type) {
@@ -246,10 +281,55 @@ export default {
   }
   .more-search {
     .title {
-      margin: 30px 0 0 15px
+      margin: 30PX 0 0 15PX
+    }
+    .high-info-list{
+      height: calc(100vh - 156px);
+      overflow-x: hidden;
+      overflow-y: auto;
+      .high-info{
+        margin: 0PX 15PX;
+        font-size: 14PX;
+        .title {
+          margin: auto
+        }
+        .inputInfo {
+          color: #666666;
+          width: 100%;
+          max-height: 100%;
+          // height: 40PX;
+          margin: 10PX auto;
+          border-radius: 5PX;
+          border:0.5px solid #bbbbbb;
+          min-height: 40PX;
+          line-height: 24px;
+          outline: 0;
+          word-wrap: break-word;
+          overflow-x: hidden;
+          overflow-y: auto;
+          padding: 5PX;
         }
+        .input {
+          color: #666666;
+          width: 100%;
+          max-height: 100%;
+          // height: 40PX;
+          margin: 10PX auto;
+          border-radius: 5PX;
+          border:0.5px solid #bbbbbb;
+          min-height: 40PX;
+          line-height: 16PX;
+          outline: 0;
+          word-wrap: break-word;
+          overflow-x: hidden;
+          overflow-y: auto;
+          padding: 5PX;
+        }
+      }
+    }
+    
     .search-value {
-      margin-top: 45px;
+      margin-top: 45PX;
     }
     .flex4 {
       /deep/ .van-cell__title {

src/views/myOrder/index.vue

@@ -82,6 +82,7 @@ export default {
       leftArrow: true,
       rightIcon: true,
       title: '我的订单',
+      leftText: '',
       leftClick: this.closeAppPage,
       rightClick: this.onMoreSearch
     })