Explorar el Código

安装了v-horizontal-scroll并添加了全局,然后用这个给页面加上了窗口底部横拉条。

DongZ hace 1 año
padre
commit
4cb839069b

+ 1 - 0
package.json

@@ -45,6 +45,7 @@
     "clipboard": "2.0.8",
     "core-js": "^3.25.3",
     "echarts": "^5.4.0",
+    "el-table-horizontal-scroll": "^1.2.5",
     "el-table-infinite-scroll": "^2.0.0",
     "element-ui": "2.15.12",
     "file-saver": "2.0.5",

+ 3 - 0
src/main.js

@@ -61,6 +61,8 @@ import Print from "vue-print-nb";
 // 引入umy-ui
 import UmyUi from 'umy-ui'
 import 'umy-ui/lib/theme-chalk/index.css';// 引入样式
+//底部横拉条
+import horizontalScroll from 'el-table-horizontal-scroll';
 
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts;
@@ -97,6 +99,7 @@ Vue.use(plugins);
 Vue.use(VueMeta);
 Vue.use(Print); //注册
 Vue.use(UmyUi);
+Vue.use(horizontalScroll);//底部横拉条
 DictData.install();
 
 // el-table无限滚动解决页面渲染卡死

+ 1 - 0
src/views/business/spd/bo/plan/add.vue

@@ -131,6 +131,7 @@
           fit
           height="460"
           style="font-size: 12px;"
+          v-horizontal-scroll
           @selection-change="handleSelectionChange"
         >
           <el-table-column type="selection" align="center"/>

+ 2 - 1
src/views/business/spd/bo/plan/index.vue

@@ -169,8 +169,9 @@
         <el-table 
         :data="tableList" 
         fit
-        height="560"
+        max-height="560"
         style="font-size: 12px;"
+        v-horizontal-scroll
         @selection-change="handleSelectionChange"
         :row-class-name="tableRowClassName"
         @row-dblclick="getEmpDetail"

+ 2 - 2
src/views/business/spd/goal_management/AnnualSaleGoal.vue

@@ -170,7 +170,7 @@
       </el-col>
     </el-row>
 
-    <el-table v-loading="loading" :data="annualSaleGoalList" @selection-change="handleSelectionChange">
+    <el-table v-loading="loading" :data="annualSaleGoalList" @selection-change="handleSelectionChange" v-horizontal-scroll>
       <el-table-column type="selection" width="55" align="center" fixed/>
       <el-table-column label="编码" align="center" prop="code" width="180"/>
       <el-table-column label="目标名称" align="center" prop="goalName" width="180"/>
@@ -317,7 +317,7 @@
         </el-row>
         <el-tabs v-model="activeName">
           <el-tab-pane label="年销售目标填报明细" name="annualSaleGoalDetails">
-            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="annualSaleGoalDetailsList" @selection-change="handleSelectionChange">
+            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="annualSaleGoalDetailsList" @selection-change="handleSelectionChange" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="70" align="center" fixed />
               <el-table-column label="销售组织" align="center" width="180" :render-header="(h, obj) => addRedStar(h, obj, '0')">
                 <template slot-scope="scope">

+ 4 - 4
src/views/business/spd/goal_management/AnnualSaleGoalMerge.vue

@@ -183,7 +183,7 @@
       </el-col>
     </el-row>
 
-    <el-table v-loading="loading" :data="annualSaleGoalMergeList" @selection-change="handleSelectionChange">
+    <el-table v-loading="loading" :data="annualSaleGoalMergeList" @selection-change="handleSelectionChange" v-horizontal-scroll>
       <el-table-column type="selection" width="55" align="center"/>
       <el-table-column label="编码" align="center" prop="code" width="180"/>
       <el-table-column label="目标名称" align="center" prop="goalName" width="180"/>
@@ -344,7 +344,7 @@
         </el-row>
         <el-tabs v-model="activeName" @tab-click="getNewTwoArray">
           <el-tab-pane label="年销售目标合并明细" name="annualSaleGoalMergeDetails">
-            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="annualSaleGoalMergeDetailsList">
+            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="annualSaleGoalMergeDetailsList" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="70" align="center" fixed />
               <el-table-column label="销售组织" align="center" width="180">
                 <template slot-scope="scope">
@@ -468,7 +468,7 @@
             </el-table>
           </el-tab-pane>
           <el-tab-pane label="区域目标汇总(年)" name="zoneGoalSum(year)">
-            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="areaDetailList">
+            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="areaDetailList" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="70" align="center" fixed />
               <el-table-column label="销售组织" align="center" width="180">
                 <template slot-scope="scope">
@@ -565,7 +565,7 @@
             </el-table>
           </el-tab-pane>
           <el-tab-pane label="客户目标汇总(年)" name="customerGoalSum(year)">
-            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="customerDetailList">
+            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="customerDetailList" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="70" align="center" fixed />
               <el-table-column label="销售组织" align="center" width="180">
                 <template slot-scope="scope">

+ 4 - 4
src/views/business/spd/goal_management/MonthGoalMerge.vue

@@ -196,7 +196,7 @@
       </el-col>
     </el-row>
 
-    <el-table v-loading="loading" :data="monthGoalMergeList" @selection-change="handleSelectionChange">
+    <el-table v-loading="loading" :data="monthGoalMergeList" @selection-change="handleSelectionChange" v-horizontal-scroll>
       <el-table-column type="selection" width="55" align="center"/>
       <el-table-column label="编码" align="center" prop="code"/>
       <el-table-column label="目标名称" align="center" prop="goalName"/>
@@ -377,7 +377,7 @@
         </el-row>
         <el-tabs v-model="activeName" @tab-click="getNewTwoArray">
           <el-tab-pane label="月销售目标合并明细" name="monthGoalMergeDetails">
-            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="monthGoalMergeDetailsList" @selection-change="handleSelectionChange">
+            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="monthGoalMergeDetailsList" @selection-change="handleSelectionChange" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="70" align="center" fixed />
               <el-table-column label="销售组织" align="center" prop="saleOrg" width="180">
                 <template slot-scope="scope">
@@ -470,7 +470,7 @@
             </el-table>
           </el-tab-pane>
           <el-tab-pane label="区域目标汇总(月)" name="zoneGoalSum" v-if="this.form.goalCategory == '销售区域'">
-            <el-table max-height="300" :data="zoneGoalSumList">
+            <el-table max-height="300" :data="zoneGoalSumList" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="55" align="center" fixed />
               <el-table-column label="销售组织" align="center" prop="saleOrg" width="180">
                 <template slot-scope="scope">
@@ -504,7 +504,7 @@
             </el-table>
           </el-tab-pane>
           <el-tab-pane label="客户目标汇总(月)" name="customGoalSum" v-if="this.form.goalCategory == '销售区域'">
-            <el-table max-height="300" :data="customGoalSumList">
+            <el-table max-height="300" :data="customGoalSumList" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="55" align="center" fixed />
               <el-table-column label="销售组织" align="center" prop="saleOrg" width="180">
                 <template slot-scope="scope">

+ 2 - 2
src/views/business/spd/goal_management/MonthReturnGoal.vue

@@ -167,7 +167,7 @@
         </el-dropdown>
       </el-col>
     </el-row>
-    <el-table v-loading="loading" :data="monthReturnGoalList" @selection-change="handleSelectionChange">
+    <el-table v-loading="loading" :data="monthReturnGoalList" @selection-change="handleSelectionChange" v-horizontal-scroll>
       <el-table-column type="selection" width="55" align="center"/>
       <el-table-column label="编码" align="center" prop="code"/>
       <el-table-column label="目标名称" align="center" prop="goalName"/>
@@ -322,7 +322,7 @@
         </el-row>
         <el-tabs v-model="activeName">
           <el-tab-pane label="月回款目标明细" name="monthReturnGoalDetails">
-            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="monthReturnGoalDetailsList" @selection-change="handleSelectionChange">
+            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="monthReturnGoalDetailsList" @selection-change="handleSelectionChange" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="70" align="center" fixed />
               <el-table-column label="销售组织" align="center" width="180" :render-header="addRedStar">
                 <template slot-scope="scope">

+ 3 - 3
src/views/business/spd/goal_management/MonthReturnMerge.vue

@@ -171,7 +171,7 @@
       </el-dropdown>
     </el-col>
   </el-row>
-  <el-table v-loading="loading" :data="monthReturnMergeList" @selection-change="handleSelectionChange">
+  <el-table v-loading="loading" :data="monthReturnMergeList" @selection-change="handleSelectionChange" v-horizontal-scroll>
     <el-table-column type="selection" width="55" align="center"/>
     <el-table-column label="编码" align="center" prop="code" width="180"/>
     <el-table-column label="目标名称" align="center" prop="goalName" width="180"/>
@@ -334,7 +334,7 @@
       </el-row>
       <el-tabs v-model="activeName" @tab-click="getNewTwoArray">
         <el-tab-pane label="月回款目标合并明细" name="monthReturnMergeDetails">
-          <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="monthReturnMergeDetailsList">
+          <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="monthReturnMergeDetailsList" v-horizontal-scroll>
             <el-table-column label="序号" type="index" width="55" align="center" fixed />
             <el-table-column label="销售组织" align="center" width="180">
               <template slot-scope="scope">
@@ -395,7 +395,7 @@
           </el-table>
         </el-tab-pane>
         <el-tab-pane label="区域目标汇总(月回款)" name="zoneGoalSum(monthReturn)">
-          <el-table max-height="300" show-summary :summary-method="getSummaries" :data="zoneGoalSumList">
+          <el-table max-height="300" show-summary :summary-method="getSummaries" :data="zoneGoalSumList" v-horizontal-scroll>
             <el-table-column label="序号" type="index" width="55" align="center" fixed />
             <el-table-column label="销售组织" align="center" width="180">
               <template slot-scope="scope">

+ 2 - 2
src/views/business/spd/goal_management/MonthSaleGoal.vue

@@ -169,7 +169,7 @@
       </el-col>
     </el-row>
 
-    <el-table v-loading="loading" :data="monthSaleGoalList" @selection-change="handleSelectionChange">
+    <el-table v-loading="loading" :data="monthSaleGoalList" @selection-change="handleSelectionChange" v-horizontal-scroll>
       <el-table-column type="selection" width="55" align="center"/>
       <el-table-column label="编码" align="center" prop="code"/>
       <el-table-column label="目标名称" align="center" prop="goalName"/>
@@ -324,7 +324,7 @@
         </el-row>
         <el-tabs v-model="activeName">
           <el-tab-pane label="月销售目标明细" name="monthSaleGoalDetails">
-            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="monthSaleGoalDetailsList" @selection-change="handleSelectionChange">
+            <el-table max-height="300" show-summary :summary-method="getSummaries" v-loading="loading" :data="monthSaleGoalDetailsList" @selection-change="handleSelectionChange" v-horizontal-scroll>
               <el-table-column label="序号" type="index" width="70" align="center" fixed />
               <el-table-column label="销售组织" align="center" width="180" :render-header="addRedStar">
                 <template slot-scope="scope">