feat(eccs-2837): 相应表格区域固定，不产生额外滚动条

src/App.vue

@@ -5,11 +5,11 @@
 </template>
 
 <style lang="less">
-.flex{
+.flex {
   display: flex;
   align-items: center;
 }
-.borderBox{
+.borderBox {
   box-sizing: border-box;
 }
 .ellipsis {
@@ -17,11 +17,11 @@
   white-space: nowrap;
   overflow: hidden;
 }
-.white_bg{
+.white_bg {
   background: #fff;
 }
-.burt-container{
-	.pa(30, 36, 50, 39);
+.burt-container {
+  .pa(30, 36, 10, 39);
 }
 .none-label {
   text-align: right;

src/components/Customers/pagation/index.vue

@@ -23,23 +23,23 @@ export default {
   props: {
     //分页器
     pagination: {
-      default: {},
-    },
+      default: {}
+    }
   },
   data() {
     return {
       //跳转到第几页
-      jumpPage: "",
-    };
+      jumpPage: ''
+    }
   },
   methods: {
     //自定义分页
     itemRender(current, type, originalElement) {
-      if (type === "prev") {
-        return <li class="page pre">上一页</li>;
-      } else if (type === "next") {
-        return <li class="page next">下一页</li>;
-      } else if (type === "page") {
+      if (type === 'prev') {
+        return <li class="page pre">上一页</li>
+      } else if (type === 'next') {
+        return <li class="page next">下一页</li>
+      } else if (type === 'page') {
         //当前页面
         if (current == this.pagination.pageNum) {
           return (
@@ -49,39 +49,39 @@ export default {
                 {Math.ceil(this.pagination.total / this.pagination.pageSize)}
               </span>
             </div>
-          );
+          )
         } else {
-          return null;
+          return null
         }
-      } else if (type == "jump-prev") {
-        return null;
-      } else if (type == "jump-next") {
-        return null;
+      } else if (type == 'jump-prev') {
+        return null
+      } else if (type == 'jump-next') {
+        return null
       }
-      return originalElement;
+      return originalElement
     },
     //跳转页面
     inputPageChange() {
-      this.jumpPage = parseInt(this.jumpPage);
-      let pages = Math.ceil(this.pagination.total / this.pagination.pageSize);
-      this.jumpPage = this.jumpPage < 0 ? 0 : this.jumpPage;
-      this.jumpPage = this.jumpPage > pages ? pages : this.jumpPage;
-      this.pagination.pageNum = this.jumpPage;
-      this.$emit("pageChange", { pageNum: this.jumpPage });
+      this.jumpPage = parseInt(this.jumpPage)
+      let pages = Math.ceil(this.pagination.total / this.pagination.pageSize)
+      this.jumpPage = this.jumpPage < 0 ? 0 : this.jumpPage
+      this.jumpPage = this.jumpPage > pages ? pages : this.jumpPage
+      this.pagination.pageNum = this.jumpPage
+      this.$emit('pageChange', { pageNum: this.jumpPage })
     },
     //改变分页
     pageChange(pager) {
-      this.pagination.pageNum = pager;
-      this.$emit("pageChange", { pageNum: pager });
-    },
-  },
-};
+      this.pagination.pageNum = pager
+      this.$emit('pageChange', { pageNum: pager })
+    }
+  }
+}
 </script>
 
 <style lang="less" scoped>
 .my-pagination {
   justify-content: flex-end;
-  margin-top: 33px;
+  margin-top: 10px;
   .page {
     width: 80px;
     height: 36px;

src/views/charge-query/index.vue

@@ -2,9 +2,14 @@
   <!-- 收费查询-账单查询 -->
   <div class="white_bg burt-container custom-info">
     <!-- form -->
-    <a-form-model ref="form" layout="vertical" :model="form">
+    <a-form-model
+      ref="form"
+      :model="form"
+      :label-col="labelCol"
+      :wrapper-col="wrapperCol"
+    >
       <a-row :gutter="30">
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="病历号">
             <a-input
               v-model="form.mrnNo"
@@ -13,7 +18,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="客户姓名">
             <a-input
               v-model="form.patientName"
@@ -22,7 +27,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="就诊日期">
             <a-range-picker
               format="YYYY-MM-DD"
@@ -32,7 +37,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="保险公司">
             <a-select
               v-model="form.payorIds"
@@ -54,7 +59,7 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="看诊医生">
             <a-select
               v-model="form.doctorCode"
@@ -71,7 +76,7 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="收费时间">
             <a-range-picker
               format="YYYY-MM-DD"
@@ -81,7 +86,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="是否已关联寄送单">
             <a-select
               v-model="form.isSend"
@@ -93,7 +98,7 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="是否已回款">
             <a-select
               v-model="form.isEobBack"
@@ -105,7 +110,7 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="账单类型">
             <a-select
               v-model="form.receiptType"
@@ -122,7 +127,7 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="账单编号">
             <a-input
               v-model="form.receiptNo"
@@ -131,7 +136,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="状态">
             <a-select v-model="form.status" placeholder="请选择状态" allowClear>
               <a-select-option
@@ -144,11 +149,12 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-        <a-col :xl="6" :lg="3" :sm="3" class="none-label">
-          <a-form-model-item label="button">
-            <!-- <a-button>更新数据</a-button> -->
-            <!-- <a-button class="mar-left10" type="primary" @click="addNewCharge">
-              <Icon name="ssiadd" :size="14" />新建预授权</a-button> -->
+        <a-col :xxl="6" :xl="8" :sm="3" class="none-label">
+          <a-form-model-item
+            label=""
+            :labelCol="{ span: 0 }"
+            :wrapperCol="{ span: 24 }"
+          >
             <a-button class="mar-left10" type="primary" @click="handlerReset">
               <Icon name="ssireset" :size="14" />重置
             </a-button>
@@ -181,40 +187,42 @@
     </a-form-model>
 
     <!-- table -->
-    <a-table
-      :columns="columns"
-      :data-source="dataList"
-      :scroll="{ x: true }"
-      :pagination="false"
-    >
-      <template slot="index" slot-scope="text, record, index">
-        {{ index + 1 }}
-      </template>
-      <template slot="operation" slot-scope="record">
-        <a-button type="link" class="success" @click.stop="detailEvt(record)"
-          >查看</a-button
-        >
-      </template>
-      <template slot="isSend" slot-scope="text">
-        {{ text == 'Y' ? '是' : text == 'N' ? '否' : '' }}
-      </template>
-      <template slot="isEob" slot-scope="text">
-        {{ text == 'Y' ? '是' : text == 'N' ? '否' : '' }}
-      </template>
-      <template slot="isEobBack" slot-scope="text">
-        {{ text == 'Y' ? '是' : text == 'N' ? '否' : '' }}
-      </template>
-      <template slot="status" slot-scope="text">
-        <span :style="{ color: text == 2 ? 'red' : '' }">{{
-          text == 1 ? '有效' : text == 2 ? '无效' : ''
-        }}</span>
-      </template>
-      <template slot="redText" slot-scope="text">
-        <span style="color: red">{{ text }}</span>
-      </template>
-    </a-table>
-    <!--分页-->
-    <BurtPagination :pagination="pagination" @pageChange="_getChargeList" />
+    <div class="scroll-table">
+      <a-table
+        :columns="columns"
+        :data-source="dataList"
+        :scroll="{ x: true }"
+        :pagination="false"
+      >
+        <template slot="index" slot-scope="text, record, index">
+          {{ index + 1 }}
+        </template>
+        <template slot="operation" slot-scope="record">
+          <a-button type="link" class="success" @click.stop="detailEvt(record)"
+            >查看</a-button
+          >
+        </template>
+        <template slot="isSend" slot-scope="text">
+          {{ text == 'Y' ? '是' : text == 'N' ? '否' : '' }}
+        </template>
+        <template slot="isEob" slot-scope="text">
+          {{ text == 'Y' ? '是' : text == 'N' ? '否' : '' }}
+        </template>
+        <template slot="isEobBack" slot-scope="text">
+          {{ text == 'Y' ? '是' : text == 'N' ? '否' : '' }}
+        </template>
+        <template slot="status" slot-scope="text">
+          <span :style="{ color: text == 2 ? 'red' : '' }">{{
+            text == 1 ? '有效' : text == 2 ? '无效' : ''
+          }}</span>
+        </template>
+        <template slot="redText" slot-scope="text">
+          <span style="color: red">{{ text }}</span>
+        </template>
+      </a-table>
+      <!--分页-->
+      <BurtPagination :pagination="pagination" @pageChange="_getChargeList" />
+    </div>
   </div>
 </template>
 
@@ -308,6 +316,8 @@ export default {
       }
     ]
     return {
+      labelCol: { span: 8 },
+      wrapperCol: { span: 16 },
       columns,
       receiptTypeOptions,
       form: {},
@@ -554,7 +564,15 @@ export default {
 .residue-amount {
   color: rgba(0, 0, 0, 0.65);
   font-size: 14px;
-  // .mg-t(48);
   margin: 0 0 10px;
 }
+.scroll-table {
+  height: calc(100vh - 355px);
+  overflow: scroll;
+}
+@media screen and (min-width: 1920px) {
+  .scroll-table {
+    height: calc(100vh - 342px);
+  }
+}
 </style>

src/views/charge-query/lpjManage.vue

@@ -2,9 +2,14 @@
   <!-- 收费查询-账单查询 -->
   <div class="white_bg burt-container custom-info">
     <!-- form -->
-    <a-form-model ref="form" layout="vertical" :model="form">
+    <a-form-model
+      ref="form"
+      :model="form"
+      :label-col="labelCol"
+      :wrapper-col="wrapperCol"
+    >
       <a-row :gutter="30">
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="就诊日期">
             <a-range-picker
               format="YYYY-MM-DD"
@@ -13,7 +18,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="账单日期">
             <a-range-picker
               format="YYYY-MM-DD"
@@ -23,7 +28,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="保险公司">
             <a-select
               v-model="form.payorCode"
@@ -43,7 +48,7 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="寄送状态">
             <a-select
               v-model="form.sendSts"
@@ -55,9 +60,7 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-      </a-row>
-      <a-row :gutter="30">
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="快递公司">
             <a-select
               v-model="form.sendCompany"
@@ -74,7 +77,7 @@
             </a-select>
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="快递单号">
             <a-input
               v-model="form.trackingNo"
@@ -83,7 +86,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="寄送批号">
             <a-input
               v-model="form.sendBatchNo"
@@ -92,7 +95,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="账单编号">
             <a-input
               v-model="form.receiptNo"
@@ -101,7 +104,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="病案号">
             <a-input
               v-model="form.mrnNo"
@@ -110,7 +113,7 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :lg="6" :sm="12">
+        <a-col :xxl="6" :xl="8" :sm="12">
           <a-form-model-item label="客户名称">
             <a-input
               v-model="form.patientName"
@@ -119,10 +122,14 @@
             />
           </a-form-model-item>
         </a-col>
-        <a-col :sm="24" class="none-label">
+        <a-col :xxl="12" :xl="16" :sm="24" class="none-label">
           <div class="btn-div flex">
             <span></span>
-            <a-form-model-item label="button">
+            <a-form-model-item
+              label=""
+              :labelCol="{ span: 0 }"
+              :wrapperCol="{ span: 24 }"
+            >
               <a-button
                 class="mar-left10"
                 type="primary"
@@ -143,32 +150,34 @@
     </a-form-model>
 
     <!-- table -->
-    <a-table
-      :columns="columns"
-      :data-source="dataList"
-      :scroll="{ x: true }"
-      :pagination="false"
-    >
-      <template slot="sendDate" slot-scope="text">
-        {{ text ? moment(text).format('YYYY-MM-DD') : '' }}
-      </template>
-      <template slot="sendSts" slot-scope="text">
-        {{ text == 1 ? '已寄送' : '未寄送' }}
-      </template>
-      <template slot="operation" slot-scope="text, record, index">
-        <a-button type="link" @click.stop="editEvt(record, true)"
-          >编辑</a-button
-        >
-        <a-button type="link" class="success" @click.stop="editEvt(record)"
-          >查看</a-button
-        >
-        <a-button type="link" class="danger" @click.stop="delRecord(index)"
-          >删除</a-button
-        >
-      </template>
-    </a-table>
-    <!--分页-->
-    <BurtPagination :pagination="pagination" @pageChange="getData" />
+    <div class="scroll-table">
+      <a-table
+        :columns="columns"
+        :data-source="dataList"
+        :scroll="{ x: true }"
+        :pagination="false"
+      >
+        <template slot="sendDate" slot-scope="text">
+          {{ text ? moment(text).format('YYYY-MM-DD') : '' }}
+        </template>
+        <template slot="sendSts" slot-scope="text">
+          {{ text == 1 ? '已寄送' : '未寄送' }}
+        </template>
+        <template slot="operation" slot-scope="text, record, index">
+          <a-button type="link" @click.stop="editEvt(record, true)"
+            >编辑</a-button
+          >
+          <a-button type="link" class="success" @click.stop="editEvt(record)"
+            >查看</a-button
+          >
+          <a-button type="link" class="danger" @click.stop="delRecord(index)"
+            >删除</a-button
+          >
+        </template>
+      </a-table>
+      <!--分页-->
+      <BurtPagination :pagination="pagination" @pageChange="getData" />
+    </div>
   </div>
 </template>
 
@@ -210,16 +219,18 @@ export default {
       }
     ]
     return {
+      labelCol: { span: 5 },
+      wrapperCol: { span: 19 },
       loading: false,
       columns,
       form: {
         dateRange: [],
         billDate: [],
-        payorCode: '',
+        payorCode: undefined,
         sendBatchNo: '',
-        sendCompany: '',
+        sendCompany: undefined,
         trackingNo: '',
-        sendSts: ''
+        sendSts: undefined
       },
       companyOptions: [], //保险公司
       expressList: [], //快递列表
@@ -360,9 +371,6 @@ export default {
 <style lang="less" scoped>
 .none-label {
   text-align: right;
-  .ant-form-item-label {
-    opacity: 0;
-  }
 }
 .ant-btn .icon-class {
   .mg-r(10);
@@ -370,4 +378,13 @@ export default {
 .btn-div {
   justify-content: space-between;
 }
+.scroll-table {
+  height: calc(100vh - 330px);
+  overflow: scroll;
+}
+@media screen and (min-width: 1920px) {
+  .scroll-table {
+    height: calc(100vh - 320px);
+  }
+}
 </style>

src/views/customer/index.vue

@@ -8,28 +8,26 @@
 <script>
 export default {
   data() {
-    return {};
+    return {}
   },
   computed: {},
   watch: {},
   methods: {
     openNotificationWithIcon(type) {
       this.$msg[type]({
-        message: "Notification Title",
+        message: 'Notification Title',
         description:
-          "This is the content of the notification. This is the content of the notification. This is the content of the notification.",
-      });
-    },
-  },
-  mounted() {
-    // console.log("this.apis", this.$apis.getUserInfo(), this.$lodash);
-  },
-};
+          'This is the content of the notification. This is the content of the notification. This is the content of the notification.'
+      })
+    }
+  }
+}
 </script>
 
 <style lang="less" scoped>
 .customer {
-  .pa(30, 36, 50, 39);
+  .pa(30, 36, 10, 39);
   background-color: #fff;
+  box-sizing: border-box;
 }
 </style>

vue.config.js

@@ -52,8 +52,8 @@ module.exports = {
     hot: true,
     proxy: {
       '^/api_bims': {
-        target: 'http://47.99.75.3:8070', // 测试
-        // target: 'http://bims.medilink-global.com.cn/api_bims', // 生产
+        // target: 'http://47.99.75.3:8070', // 测试
+        target: 'http://bims.medilink-global.com.cn/api_bims', // 生产
         pathRewrite: {
           '^/api_bims': '/'
         },