Browse Source

样式修改

lilei 4 years ago
parent
commit
bcebc73a39
1 changed files with 33 additions and 46 deletions
  1. 33 46
      src/views/releaseRecord/releaseRecordList.vue

+ 33 - 46
src/views/releaseRecord/releaseRecordList.vue

@@ -1,10 +1,10 @@
 <template>
   <a-card :bordered="false" class="shopOrder-table-page-search-wrapper">
-    <div class="shopOrder-searchForm">
+    <div class="shopOrder-searchForm table-page-search-wrapper">
       <a-form layout="inline" @keyup.enter.native="refresh">
         <a-row :gutter="24">
-          <a-col :xs="24" :sm="12" :md="8" :lg="5">
-            <a-form-item label="投放时间:" :label-col="{ span: 7 }" :wrapper-col="{ span: 17}">
+          <a-col :lg="6" :md="8" :xs="24" :sm="12">
+            <a-form-item label="投放时间:">
               <a-range-picker
                 style="width:100%"
                 id="releaseRecordList-queryOrderDate"
@@ -14,38 +14,38 @@
                 :placeholder="['开始时间', '结束时间']" />
             </a-form-item>
           </a-col>
-          <a-col :xs="24" :sm="12" :md="8" :lg="5">
-            <a-form-item label="用户账号" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="5" :md="8" :xs="24" :sm="12">
+            <a-form-item label="用户账号">
               <a-input id="releaseRecordList-customerMobile" allowClear :maxLength="11" v-model=" queryParam.customerMobile" placeholder="请输入用户账号" />
             </a-form-item>
           </a-col>
-          <a-col :xs="24" :sm="12" :md="8" :lg="5">
-            <a-form-item label="投放类型" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="4" :md="8" :xs="24" :sm="12">
+            <a-form-item label="投放类型">
               <v-select code="RUBBISH_TYPE" v-model="queryParam.rubbishType" allowClear placeholder="请选择投放类型" id="releaseRecordList-rubbishType"></v-select>
             </a-form-item>
           </a-col>
-          <a-col :xs="24" :sm="12" :md="8" :lg="5">
-            <a-form-item label="兑换乐豆" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="5" :md="8" :xs="24" :sm="12">
+            <a-form-item label="兑换乐豆">
               <div class="input-number">
                 <a-input-number id="releaseRecordList-inputNumber" v-model="queryParam.goldNumStart" :max="999999999" @change="onChange" />-
                 <a-input-number id="inputNumber" v-model="queryParam.goldNumEnd" :max="999999999" @change="onChange" />
               </div>
             </a-form-item>
           </a-col>
-          <a-col :xs="24" :sm="12" :md="8" :lg="4">
-            <a-form-item label="设备类型" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="4" :md="8" :xs="24" :sm="12">
+            <a-form-item label="设备类型">
               <v-select code="DEVICE_TYPE" v-model="queryParam.deviceType" allowClear placeholder="请选择设备类型" id="releaseRecordList-deviceType"></v-select>
             </a-form-item>
           </a-col>
         </a-row>
         <a-row :gutter="24">
-          <a-col :xs="24" :sm="12" :md="8" :lg="5">
-            <a-form-item label="设备编号" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="6" :md="8" :xs="24" :sm="12">
+            <a-form-item label="设备编号">
               <a-input id="releaseRecordList-srcDeviceCode" allowClear :maxLength="120" v-model=" queryParam.srcDeviceCode " placeholder="请输入设备编号" />
             </a-form-item>
           </a-col>
-          <a-col :xs="24" :sm="12" :md="8" :lg="5">
-            <a-form-item label="网点名称" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="5" :md="8" :xs="24" :sm="12">
+            <a-form-item label="网点名称">
               <a-select
                 id="releaseRecordList-stationNo"
                 placeholder="请选择网点名称"
@@ -59,8 +59,8 @@
               </a-select>
             </a-form-item>
           </a-col>
-          <a-col :xs="24" :sm="12" :md="8" :lg="5">
-            <a-form-item label="称重值" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="4" :md="8" :xs="24" :sm="12">
+            <a-form-item label="称重值">
               <v-select
                 code="DEVICE_WEIGHT_TAG"
                 mode="multiple"
@@ -70,25 +70,33 @@
                 id="releaseRecordList-weightTagList"></v-select>
             </a-form-item>
           </a-col>
-          <a-col :xs="24" :sm="12" :md="8" :lg="5">
-            <a-form-item label="投放重量" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="5" :md="8" :xs="24" :sm="12">
+            <a-form-item label="投放重量">
               <div class="input-number">
                 <a-input-number id="releaseRecordList-inputNumber" v-model="queryParam.rubbishWeightStart" :max="999999999" @change="onChange" />-
                 <a-input-number id="inputNumber" v-model="queryParam.rubbishWeightEnd" :max="999999999" @change="onChange" />
               </div>
             </a-form-item>
           </a-col>
-          <a-col :xs="24" :sm="12" :md="8" :lg="4">
-            <a-form-item label="投放方式" :label-col="{ span:7 }" :wrapper-col="{ span:17}">
+          <a-col :lg="4" :md="8" :xs="24" :sm="12">
+            <a-form-item label="投放方式">
               <v-select code="DELIVERY_WAY" v-model="queryParam.deliveryWay" allowClear placeholder="请选择投放方式" id="releaseRecordList-deliveryWay"></v-select>
             </a-form-item>
           </a-col>
         </a-row>
         <a-row :gutter="24">
-          <a-col :offset="20">
-            <a-button class="handle-btn serach-btn" id="releaseRecordList-serach" type="primary" @click="refresh">查询</a-button>
-            <a-button class="handle-btn serach-btn" type="" id="releaseRecordList-reset" @click="handleReset">重置</a-button>
-            <a-button class="export-btn" id="releaseRecordList-export" v-hasPermission="'B_exportDeliveryLog'" :loading="loading" @click="handleExport">导出</a-button>
+          <a-col :lg="24" :md="8" :xs="24" :sm="12">
+            <span class="table-page-search-submitButtons" :style="{ float: 'right', overflow: 'hidden' }">
+              <a-button class="handle-btn serach-btn" id="releaseRecordList-serach" type="primary" @click="refresh">查询</a-button>
+              <a-button class="handle-btn serach-btn" style="margin-left: 8px" id="releaseRecordList-reset" @click="handleReset">重置</a-button>
+              <a-button
+                class="export-btn"
+                id="releaseRecordList-export"
+                style="margin-left: 8px"
+                v-hasPermission="'B_exportDeliveryLog'"
+                :loading="loading"
+                @click="handleExport">导出</a-button>
+            </span>
           </a-col>
         </a-row>
       </a-form>
@@ -385,27 +393,6 @@ export default {
 </script>
 <style lang="less" scoped>
   .shopOrder-table-page-search-wrapper{
-    .shopOrder-searchForm{
-      .ant-form-inline .ant-form-item{
-        width: 100%;
-      }
-      // 搜索框的下间距
-      .ant-form-item {
-      	margin-bottom: 10px;
-      }
-      .handle-btn{
-        margin-bottom: 15px;
-		margin-top: 4px;
-      }
-      .serach-btn{
-        margin-right: 10px;
-      }
-			.flex-1 {
-				flex: 1;
-			  overflow-y: scroll;
-			  max-height: 140px;
-			}
-    }
     .export-btn{
       background-color: #ff9900;
       border-color: #ff9900;