调整页面布局（初稿）

jshERP-web/src/views/financial/dialog/DebtBillList.vue

@@ -1,76 +1,81 @@
 <template>
-  <a-modal
-    :title="title"
-    :width="1300"
-    :visible="visible"
-    @ok="handleOk"
-    @cancel="handleCancel"
-    cancelText="关闭"
-    wrapClassName="ant-modal-cust-warp"
-    style="top:5%;height: 100%;overflow-y: hidden">
-    <!-- 查询区域 -->
-    <div class="table-page-search-wrapper">
-      <!-- 搜索区域 -->
-      <a-form layout="inline" @keyup.enter.native="searchQuery">
-        <a-row :gutter="24">
-          <a-col :md="6" :sm="24">
-            <a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
-              <a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :md="6" :sm="24">
-            <a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
-              <a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
-            </a-form-item>
-          </a-col>
-          <a-col :md="6" :sm="24">
-            <a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
-              <a-range-picker
-                style="width: 100%"
-                v-model="queryParam.createTimeRange"
-                format="YYYY-MM-DD"
-                :placeholder="['开始时间', '结束时间']"
-                @change="onDateChange"
-                @ok="onDateOk"
-              />
-            </a-form-item>
-          </a-col>
-          <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+  <div ref="container">
+    <a-modal
+      :title="title"
+      :width="1300"
+      :visible="visible"
+      :getContainer="() => $refs.container"
+      :maskStyle="{'top':'101px','left':'151px'}"
+      :maskClosable="false"
+      @ok="handleOk"
+      @cancel="handleCancel"
+      cancelText="关闭"
+      wrapClassName="ant-modal-cust-warp"
+      style="top:5%;height: 100%;overflow-y: hidden">
+      <!-- 查询区域 -->
+      <div class="table-page-search-wrapper">
+        <!-- 搜索区域 -->
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row :gutter="24">
             <a-col :md="6" :sm="24">
-              <a-button type="primary" @click="searchQuery">查询</a-button>
-              <a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
+              <a-form-item label="单据编号" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
+                <a-input placeholder="请输入单据编号查询" v-model="queryParam.number"></a-input>
+              </a-form-item>
             </a-col>
-          </span>
-        </a-row>
-      </a-form>
-    </div>
-    <!-- table区域-begin -->
-    <a-table
-      bordered
-      ref="table"
-      size="middle"
-      rowKey="id"
-      :columns="columns"
-      :dataSource="dataSource"
-      :pagination="ipagination"
-      :loading="loading"
-      :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: getType}"
-      :customRow="rowAction"
-      @change="handleTableChange">
-      <span slot="numberCustomRender" slot-scope="text, record">
-        <a @click="myHandleDetail(record)">{{record.number}}</a>
-      </span>
-      <span slot="customTitle">
-        实际欠款
-        <a-tooltip title="实际欠款=本单欠款-退货单欠款（主要针对存在退货的情况）">
-          <a-icon type="question-circle" />
-        </a-tooltip>
-      </span>
-    </a-table>
-    <!-- table区域-end -->
-    <!-- 表单区域 -->
-    <bill-detail ref="modalDetail"></bill-detail>
-  </a-modal>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="商品信息" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
+                <a-input placeholder="请输入名称、规格、型号" v-model="queryParam.materialParam"></a-input>
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="单据日期" :labelCol="labelCol" :wrapperCol="wrapperCol">
+                <a-range-picker
+                  style="width: 100%"
+                  v-model="queryParam.createTimeRange"
+                  format="YYYY-MM-DD"
+                  :placeholder="['开始时间', '结束时间']"
+                  @change="onDateChange"
+                  @ok="onDateOk"
+                />
+              </a-form-item>
+            </a-col>
+            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
+              <a-col :md="6" :sm="24">
+                <a-button type="primary" @click="searchQuery">查询</a-button>
+                <a-button style="margin-left: 8px" @click="searchReset">重置</a-button>
+              </a-col>
+            </span>
+          </a-row>
+        </a-form>
+      </div>
+      <!-- table区域-begin -->
+      <a-table
+        bordered
+        ref="table"
+        size="middle"
+        rowKey="id"
+        :columns="columns"
+        :dataSource="dataSource"
+        :pagination="ipagination"
+        :loading="loading"
+        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange, type: getType}"
+        :customRow="rowAction"
+        @change="handleTableChange">
+        <span slot="numberCustomRender" slot-scope="text, record">
+          <a @click="myHandleDetail(record)">{{record.number}}</a>
+        </span>
+        <span slot="customTitle">
+          实际欠款
+          <a-tooltip title="实际欠款=本单欠款-退货单欠款（主要针对存在退货的情况）">
+            <a-icon type="question-circle" />
+          </a-tooltip>
+        </span>
+      </a-table>
+      <!-- table区域-end -->
+      <!-- 表单区域 -->
+      <bill-detail ref="modalDetail"></bill-detail>
+    </a-modal>
+  </div>
 </template>
 
 <script>

jshERP-web/src/views/financial/modules/AdvanceInModal.vue

@@ -10,7 +10,7 @@
     switchFullscreen
     @cancel="handleCancel"
     wrapClassName="ant-modal-cust-warp"
-    style="top:5%;height: 100%;overflow-y: hidden">
+    style="top:20px;height: 95%;overflow-y: hidden">
     <template slot="footer">
       <a-button @click="handleCancel">取消</a-button>
       <a-button v-if="isCanCheck" @click="handleOkAndCheck">保存并审核</a-button>

jshERP-web/src/views/financial/modules/GiroModal.vue

@@ -10,7 +10,7 @@
     switchFullscreen
     @cancel="handleCancel"
     wrapClassName="ant-modal-cust-warp"
-    style="top:5%;height: 100%;overflow-y: hidden">
+    style="top:20px;height: 95%;overflow-y: hidden">
     <template slot="footer">
       <a-button @click="handleCancel">取消</a-button>
       <a-button v-if="isCanCheck" @click="handleOkAndCheck">保存并审核</a-button>

jshERP-web/src/views/financial/modules/ItemInModal.vue

@@ -10,7 +10,7 @@
     switchFullscreen
     @cancel="handleCancel"
     wrapClassName="ant-modal-cust-warp"
-    style="top:5%;height: 100%;overflow-y: hidden">
+    style="top:20px;height: 95%;overflow-y: hidden">
     <template slot="footer">
       <a-button @click="handleCancel">取消</a-button>
       <a-button v-if="isCanCheck" @click="handleOkAndCheck">保存并审核</a-button>

jshERP-web/src/views/financial/modules/ItemOutModal.vue

@@ -10,7 +10,7 @@
     switchFullscreen
     @cancel="handleCancel"
     wrapClassName="ant-modal-cust-warp"
-    style="top:5%;height: 100%;overflow-y: hidden">
+    style="top:20px;height: 95%;overflow-y: hidden">
     <template slot="footer">
       <a-button @click="handleCancel">取消</a-button>
       <a-button v-if="isCanCheck" @click="handleOkAndCheck">保存并审核</a-button>

jshERP-web/src/views/financial/modules/MoneyInModal.vue

@@ -10,7 +10,7 @@
     switchFullscreen
     @cancel="handleCancel"
     wrapClassName="ant-modal-cust-warp"
-    style="top:5%;height: 100%;overflow-y: hidden">
+    style="top:20px;height: 95%;overflow-y: hidden">
     <template slot="footer">
       <a-button @click="handleCancel">取消</a-button>
       <a-button v-if="isCanCheck" @click="handleOkAndCheck">保存并审核</a-button>

jshERP-web/src/views/financial/modules/MoneyOutModal.vue

@@ -10,7 +10,7 @@
     switchFullscreen
     @cancel="handleCancel"
     wrapClassName="ant-modal-cust-warp"
-    style="top:5%;height: 100%;overflow-y: hidden">
+    style="top:20px;height: 95%;overflow-y: hidden">
     <template slot="footer">
       <a-button @click="handleCancel">取消</a-button>
       <a-button v-if="isCanCheck" @click="handleOkAndCheck">保存并审核</a-button>