1. 优化

src/views/distribution/personnelMr/index.vue

@@ -1,199 +1,204 @@
 <template>
-  <div class="app-container personnelMr-table">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="120px">
-      <el-form-item label="分销商名称" label-width="90px">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入分销商名称"
-          clearable
-          style="width: 240px;"
-          @keyup.enter.native="handleQuery"
-        />
-      </el-form-item>
-      <el-form-item label="分销商类型">
-        <el-select
-          v-model="queryParams.type"
-          placeholder="分销商类型"
-          clearable
-          style="width: 140px"
-        >
-          <el-option
-            v-for="dict in dict.type.distribution_type"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="分销商标签">
-        <el-select
-          v-model="queryParams.personsType"
-          placeholder="分销商标签"
-          clearable
-          style="width: 140px"
-        >
-          <el-option
-            v-for="dict in dict.type.persons_type"
-            :key="dict.value"
-            :label="dict.label"
-            :value="dict.value"
+  <div class="app-container personnelMr-table" :style="{'--q-height':qHeight}">
+    <div class="app-container-query" ref="queryFormBox">
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="120px">
+        <el-form-item label="分销商名称" label-width="90px">
+          <el-input
+            v-model="queryParams.name"
+            placeholder="请输入分销商名称"
+            clearable
+            style="width: 240px;"
+            @keyup.enter.native="handleQuery"
           />
-        </el-select>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-              type="primary"
-              plain
-              icon="el-icon-plus"
-              size="mini"
-              @click="handleAdd"
-              v-hasPermi="['personnelMr:personnelMr:add']"
-            >新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-setting"
-          size="mini"
-          @click="openSet"
-          v-hasPermi="['personnelMr:personnelMr:set']"
-        >提现设置</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-s-tools"
-          size="mini"
-          @click="codeSet"
-          v-hasPermi="['personnelMr:personnelMr:codeSet']"
-        >推广码海报设置</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-s-tools"
-          size="mini"
-          @click="openRetailRate"
-          v-hasPermi="['personnelMr:personnelMr:RetailRate']"
-        >批量设置佣金税率</el-button>
-        <el-button
-          type="primary"
-          size="mini"
-          icon="el-icon-download"
-          v-hasPermi="['personnelMr:personnelMr:downloadExcel']"
-          @click="handleExport"
-          v-loading.fullscreen.lock="handleExportLoading"
-          element-loading-text="正在拼命生成数据中..."
-          element-loading-spinner="el-icon-loading"
-          element-loading-background="rgba(0, 0, 0, 0.5)"
-        >导出excel</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
-
-    <el-table ref="tables" v-loading="loading" height="100%" :data="dataList" @selection-change="handleSelectionChange" border>
-      <el-table-column type="selection" width="55">
-    </el-table-column>
-      <el-table-column label="序号" align="center" type="index" width="50"></el-table-column>
-      <el-table-column label="分销商名称" align="center" prop="name" />
-      <el-table-column label="分销商类型" align="center" prop="type">
-        <template slot-scope="scope">
-          <dict-tag :options="dict.type.distribution_type" :value="scope.row.type"/>
-        </template>
-      </el-table-column>
-      <el-table-column label="分销商标签" align="center" prop="type">
-        <template slot-scope="scope">
-          <dict-tag :options="dict.type.persons_type" :value="scope.row.personsType"/>
-        </template>
-      </el-table-column>
-      <el-table-column label="佣金税率" align="center" prop="type">
-        <template slot-scope="scope">
-          <span>{{ scope.row.retailRate }}%</span>
-        </template>
-      </el-table-column>
-      <!-- <el-table-column label="佣金税率" align="center" prop="retailRate" /> -->
-      <el-table-column label="负责人" align="center" prop="contact" />
-      <el-table-column label="账号/联系电话" align="center" prop="mobile" />
-      <el-table-column label="被扫次数" align="center" prop="scanCounts" />
-      <el-table-column label="佣金总额" align="center" prop="brokerageTotal">
-        <template slot-scope="scope">
-          <span v-if="scope.row.brokerageTotal">￥{{ scope.row.brokerageTotal }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="待提现" align="center" prop="withdrawTotal">
-        <template slot-scope="scope">
-          <span v-if="scope.row.withdrawTotal">￥{{ scope.row.withdrawTotal }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="是否可提现" align="center" prop="allowWithdraw">
-        <template slot-scope="scope">
-          <dict-tag :options="dict.type.user_allow_withdraw" :value="scope.row.allowWithdraw"/>
-        </template>
-      </el-table-column>
-      <el-table-column label="状态" align="center">
-        <template slot-scope="scope">
-          <el-switch
-            @change="ionlineApi(scope.row)"
-            v-model="scope.row.switchValue"
-            :active-value="1"
-            active-color="#13ce66"
-            inactive-color="#ff4949">
-          </el-switch>
-        </template>
-      </el-table-column>
-      <el-table-column label="销售人员" align="center" prop="salePerson" />
-      <el-table-column label="添加时间" align="center" prop="createTime" width="160">
-        <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.createTime) }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width">
-        <template slot-scope="scope">
+        </el-form-item>
+        <el-form-item label="分销商类型">
+          <el-select
+            v-model="queryParams.type"
+            placeholder="分销商类型"
+            clearable
+            style="width: 140px"
+          >
+            <el-option
+              v-for="dict in dict.type.distribution_type"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="分销商标签">
+          <el-select
+            v-model="queryParams.personsType"
+            placeholder="分销商标签"
+            clearable
+            style="width: 140px"
+          >
+            <el-option
+              v-for="dict in dict.type.persons_type"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    
+    <div class="app-container-table-box">
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
           <el-button
+                type="primary"
+                plain
+                icon="el-icon-plus"
+                size="mini"
+                @click="handleAdd"
+                v-hasPermi="['personnelMr:personnelMr:add']"
+              >新增</el-button>
+        </el-col>
+        <el-col :span="1.5">
+          <el-button
+            type="success"
+            plain
+            icon="el-icon-setting"
             size="mini"
-            type="text"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['personnelMr:personnelMr:edit']"
-          >修改</el-button>
+            @click="openSet"
+            v-hasPermi="['personnelMr:personnelMr:set']"
+          >提现设置</el-button>
+        </el-col>
+        <el-col :span="1.5">
           <el-button
+            type="warning"
+            plain
+            icon="el-icon-s-tools"
             size="mini"
-            type="text"
-            @click="resettingApi(scope.row)"
-            v-hasPermi="['personnelMr:personnelMr:resetting']"
-          >重置密码</el-button>
+            @click="codeSet"
+            v-hasPermi="['personnelMr:personnelMr:codeSet']"
+          >推广码海报设置</el-button>
+        </el-col>
+        <el-col :span="1.5">
           <el-button
+            type="danger"
+            plain
+            icon="el-icon-s-tools"
             size="mini"
-            type="text"
-            @click="handleCode(scope.row, 'img')"
-            v-hasPermi="['personnelMr:personnelMr:code']"
-          >推广码</el-button>
+            @click="openRetailRate"
+            v-hasPermi="['personnelMr:personnelMr:RetailRate']"
+          >批量设置佣金税率</el-button>
           <el-button
+            type="primary"
             size="mini"
-            type="text"
-            @click="handleDelete(scope.row,scope.index)"
-            v-hasPermi="['personnelMr:personnelMr:delete']"
-          >删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
+            icon="el-icon-download"
+            v-hasPermi="['personnelMr:personnelMr:downloadExcel']"
+            @click="handleExport"
+            v-loading.fullscreen.lock="handleExportLoading"
+            element-loading-text="正在拼命生成数据中..."
+            element-loading-spinner="el-icon-loading"
+            element-loading-background="rgba(0, 0, 0, 0.5)"
+          >导出excel</el-button>
+        </el-col>
+        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+      <div class="app-container-table-info">
+        <el-table ref="tables" v-loading="loading" height="100%" :data="dataList" @selection-change="handleSelectionChange" border>
+          <el-table-column type="selection" width="55">
+        </el-table-column>
+          <el-table-column label="序号" align="center" type="index" width="50"></el-table-column>
+          <el-table-column label="分销商名称" align="center" prop="name" />
+          <el-table-column label="分销商类型" align="center" prop="type">
+            <template slot-scope="scope">
+              <dict-tag :options="dict.type.distribution_type" :value="scope.row.type"/>
+            </template>
+          </el-table-column>
+          <el-table-column label="分销商标签" align="center" prop="type">
+            <template slot-scope="scope">
+              <dict-tag :options="dict.type.persons_type" :value="scope.row.personsType"/>
+            </template>
+          </el-table-column>
+          <el-table-column label="佣金税率" align="center" prop="type">
+            <template slot-scope="scope">
+              <span>{{ scope.row.retailRate }}%</span>
+            </template>
+          </el-table-column>
+          <!-- <el-table-column label="佣金税率" align="center" prop="retailRate" /> -->
+          <el-table-column label="负责人" align="center" prop="contact" />
+          <el-table-column label="账号/联系电话" align="center" prop="mobile" />
+          <el-table-column label="被扫次数" align="center" prop="scanCounts" />
+          <el-table-column label="佣金总额" align="center" prop="brokerageTotal">
+            <template slot-scope="scope">
+              <span v-if="scope.row.brokerageTotal">￥{{ scope.row.brokerageTotal }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="待提现" align="center" prop="withdrawTotal">
+            <template slot-scope="scope">
+              <span v-if="scope.row.withdrawTotal">￥{{ scope.row.withdrawTotal }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="是否可提现" align="center" prop="allowWithdraw">
+            <template slot-scope="scope">
+              <dict-tag :options="dict.type.user_allow_withdraw" :value="scope.row.allowWithdraw"/>
+            </template>
+          </el-table-column>
+          <el-table-column label="状态" align="center">
+            <template slot-scope="scope">
+              <el-switch
+                @change="ionlineApi(scope.row)"
+                v-model="scope.row.switchValue"
+                :active-value="1"
+                active-color="#13ce66"
+                inactive-color="#ff4949">
+              </el-switch>
+            </template>
+          </el-table-column>
+          <el-table-column label="销售人员" align="center" prop="salePerson" />
+          <el-table-column label="添加时间" align="center" prop="createTime" width="160">
+            <template slot-scope="scope">
+              <span>{{ parseTime(scope.row.createTime) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width">
+            <template slot-scope="scope">
+              <el-button
+                size="mini"
+                type="text"
+                @click="handleUpdate(scope.row)"
+                v-hasPermi="['personnelMr:personnelMr:edit']"
+              >修改</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                @click="resettingApi(scope.row)"
+                v-hasPermi="['personnelMr:personnelMr:resetting']"
+              >重置密码</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                @click="handleCode(scope.row, 'img')"
+                v-hasPermi="['personnelMr:personnelMr:code']"
+              >推广码</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                @click="handleDelete(scope.row,scope.index)"
+                v-hasPermi="['personnelMr:personnelMr:delete']"
+              >删除</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
 
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
+        <pagination
+          v-show="total>0"
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList"
+        />
+      </div>
+    </div>
 
     <!-- 新增/编辑弹框 -->
     <add-and-edit
@@ -372,6 +377,8 @@ export default {
       }
     };
     return {
+      qHeight: '0px',
+      resizeObserver: null,
       // 遮罩层
       loading: true,
       // 选中数组
@@ -438,6 +445,15 @@ export default {
   created() {
     this.getList();
   },
+  mounted() {
+    this.resizeObserver = new ResizeObserver(entries => {
+      for (let entry of entries) {
+        const { width, height } = entry.contentRect;
+        this.qHeight = height + 'px'
+      }
+    });
+    this.resizeObserver.observe(this.$refs.queryFormBox);
+  },
   methods: {
     /** 查询列表 */
     getList() {
@@ -728,13 +744,25 @@ export default {
           this.$message.info('您已取消导出！');
         });
     },
-  }
+  },
+  beforeDestroy() {
+    this.resizeObserver.unobserve(this.$refs.queryFormBox);
+    this.resizeObserver.disconnect();
+  },
 };
 </script>
 <style lang="scss" scoped>
-.personnelMr-table {
-  ::v-deep .el-table {
-    width: 99.9% !important;
+.app-container {
+  height: calc( 100vh - 110px );
+  box-sizing: border-box;
+}
+.app-container-query {
+  
+}
+.app-container-table-box {
+  height: calc( 100% - var(--q-height) );
+  .app-container-table-info {
+    height: calc( 100% - 100px );
   }
 }
 </style>

src/views/order/groupBuyingMr/index.vue

@@ -481,8 +481,6 @@ export default {
     this.resizeObserver = new ResizeObserver(entries => {
       for (let entry of entries) {
         const { width, height } = entry.contentRect;
-        this.width = width;
-        this.height = height;
         this.qHeight = height + 'px'
       }
     });

src/views/order/orderMr/index.vue

@@ -406,8 +406,6 @@ export default {
     this.resizeObserver = new ResizeObserver(entries => {
       for (let entry of entries) {
         const { width, height } = entry.contentRect;
-        this.width = width;
-        this.height = height;
         this.qHeight = height + 'px'
       }
     });

src/views/order/viewers/index.vue

@@ -414,8 +414,6 @@ export default {
     this.resizeObserver = new ResizeObserver(entries => {
       for (let entry of entries) {
         const { width, height } = entry.contentRect;
-        this.width = width;
-        this.height = height;
         this.qHeight = height + 'px'
       }
     });

src/views/windowTicketSales/model/increaseViewers.vue

@@ -139,7 +139,7 @@
                 </el-table-column>
             </el-table>
         </div>
-        <div style="padding: 10px 0 20px;">合计：累计观影人员{{ viewerList.length }}人,应付总额￥{{ moneyAll }}(元)</div>
+        <div style="padding: 10px 0 20px;">合计：累计观影人员{{ viewerList.length }}人,应收总额￥{{ moneyAll }}(元)</div>
         <div>
             <el-form 
             :model="ruleForm"