解决bug-573： 扫描记录查询 界面优化

src/views/emis/emisTmsScanRecord/scanRecordQuery.vue

@@ -1,9 +1,10 @@
 <template>
   <div class="app-container">
-    <el-row :gutter="20">
+    <el-form ref="queryForm" size="mini"  :model="queryParams" :rules="rules" label-width="100px">
-      <search-form  :model="queryParams" ref="queryForm"   size="small" :maxShow="8"  label-width="68px" v-show="showSearch" @search="handleQuery" @reset="resetQuery">
+    <!-- <search-form  :model="queryParams" ref="queryForm"   size="small" :maxShow="8"  label-width="100px" v-show="showSearch" @search="handleQuery" @reset="resetQuery"> -->
+      <el-row :gutter="0">
         <el-col :span="8">
-          <el-form-item prop="applySeq">
+          <!-- <el-form-item prop="applySeq">
             <el-col :span="8">
               <el-select v-model="queryParams.queryType" >
                 <el-option :label="$t('运单号')" value="1"></el-option>
@@ -20,11 +21,25 @@
                 @keyup.enter.native="handleQuery"
               />
             </el-col>
+          </el-form-item> -->
+          <el-form-item label="" prop="billCode">
+            <div slot="label">
+              <el-radio-group class="query-label" v-model="queryParams.queryType">
+                <el-radio label="1">运单号</el-radio>
+                <el-radio label="0">订单号</el-radio>
+              </el-radio-group>
+            </div>
+            <el-input
+              v-model="queryParams.billCode"
+              :placeholder="$t('多个流水号逗号或换行隔开')"
+              clearable
+              type="textarea"
+              rows="2"
+            />
           </el-form-item>
         </el-col>
-        <el-col :span="16">
         <el-col :span="8">
-            <el-form-item :label="$t('扫描类型')" prop="scanType">
+          <el-form-item :label="$t('扫描类型')" prop="scanType" label-width="100px">
             <el-select
                 style="width:100%"
                 filterable
@@ -36,37 +51,40 @@
           </el-form-item>
         </el-col>
         <el-col :span="8">
-            <el-form-item :label="$t('扫描网点')" prop="scanSiteCode" label-width="70px">
+          <el-form-item :label="$t('扫描网点')" prop="scanSiteCode" label-width="100px">
             <EmisSiteSimplePicker v-model="queryParams.scanSiteCode"  @onChange="onScanSiteSelect"  ></EmisSiteSimplePicker>
           </el-form-item>
         </el-col>
+      </el-row >
+      <el-row :gutter="0">
         <el-col :span="8">
-            <el-form-item :label="$t('单号类型')" prop="isSubBill">
+          <el-form-item :label="$t('单号类型')" prop="isSubBill" label-width="100px">
             <el-select v-model="queryParams.isSubBill" :placeholder="$t('请选择')" >
               <el-option :label="$t('主单')" value="0"></el-option>
               <el-option :label="$t('子单')" value="1"></el-option>
             </el-select>
           </el-form-item>
         </el-col>
-          <el-col :span="10">
+        <el-col :span="8">
-            <el-form-item :label="$t('上/下一网点')" prop="preOrNextStation" label-width="90px">
+          <el-form-item :label="$t('上/下一网点')" prop="preOrNextStation" label-width="100px">
             <EmisSiteSimplePicker v-model="queryParams.preOrNextStation"  @onChange="onPreOrNextSiteSelect"  ></EmisSiteSimplePicker>
           </el-form-item>
         </el-col>
         <el-col :span="8">
-            <el-form-item :label="$t('目的地')" prop="destCode" label-width="70px">
+          <el-form-item :label="$t('目的地')" prop="destCode" label-width="100px">
             <DestinationPicker v-model="queryParams.destCode"  @onChange="onDestinationSelect"  ></DestinationPicker>
           </el-form-item>
         </el-col>
-          <el-col :span="16">
+      </el-row >
+      <el-row :gutter="0">
+        <el-col :span="16" label-width="100px">
           <el-form-item label="扫描时间" prop="dateTimeRange">
             <elDateAdvPicker clearable v-model="dateTimeRange" @dateTimeChange="onDateSelect" ></elDateAdvPicker>
           </el-form-item>
         </el-col>
-        </el-col>
-
-      </search-form>
       </el-row >
+    <!-- </search-form> -->
+    </el-form>
 
     <xd-table v-loading="loading"
            border stripe
@@ -82,6 +100,22 @@
            >
       <div slot="toolbar">
         <el-row :gutter="10" class="mb8">
+              <el-col :span="1.5">
+                <el-button
+                  type="primary"
+                  plain
+                  size="mini"
+                  @click="handleQuery"
+                >查询</el-button>
+              </el-col>
+              <el-col :span="1.5">
+                <el-button
+                  type="primary"
+                  plain
+                  size="mini"
+                  @click="handleClearCode"
+                >清除单号</el-button>
+              </el-col>
               <el-col :span="1.5">
                 <el-button
                   type="danger"
@@ -277,7 +311,7 @@ export default {
         params:{},//扩展参数
 
         // scanSite:null,
-        queryType:"1",// 选择运单类型，默认为 运单号：1,订单号：2
+        queryType:"1",// 选择运单类型，默认为 运单号：1,订单号：0
         // scanType:"",
         isSubBill:"",
       },
@@ -333,7 +367,7 @@ export default {
       let queryType = this.queryParams.queryType;
       if(queryType == "1"){
         this.queryParams.orderSN=null;
-      }else if(queryType == "2"){
+      }else if(queryType == "0"){
         this.queryParams.orderSN=this.queryParams.billCode;
         this.queryParams.billCode=null;
       }
@@ -481,6 +515,9 @@ export default {
       this.queryParams.pageNum = 1;
       this.getList();
     },
+    handleClearCode(){
+      this.queryParams.billCode=null;
+    },
     handleTypeSelect(selection){
       this.sctype = selection.value;
     },
@@ -715,4 +752,12 @@ export default {
     color: #0955ee;
     cursor: pointer;
   }
+  .query-label {
+    .el-radio{
+        display: block;
+        line-height: 23px;
+        white-space: normal;
+        margin-right: 0;
+    }
+  }
 </style>