首页排名柱形图

ruoyi-admin-vue/src/components/rukuRankChart.vue

@@ -94,6 +94,7 @@ export default {
         grid: {
             left: '3%',
             right: '4%',
+            top: '3%',
             bottom: '3%',
             containLabel: true
         },
@@ -130,12 +131,12 @@ export default {
         series: [{
             name: '标准化',
             type: 'bar',
-            barWidth: 16, // 柱子宽度
+            barWidth: '15', // 柱子宽度
             label: {
                 show: true,
                 position: 'right', // 位置
                 color: 'rgba(102, 102, 102, 1)',
-                fontSize: 14,
+                fontSize: 12,
                 fontWeight: 'bold', // 加粗
                 distance: 5 // 距离
             }, // 柱子上方的数值

ruoyi-admin-vue/src/views/index.vue

@@ -63,7 +63,7 @@
 
       <div class="card-container-flex chart-container shadow flex1">
         <div class="tip-title">
-          <div class="title-text">本月入库排名前10物料</div>
+          <div class="title-text">本月入库排名前5物料</div>
           <el-radio-group v-model="rukuRankType" size="mini" @change="rukuRankTypeChange">
             <el-radio-button label="count">按数量</el-radio-button>
             <el-radio-button label="money">按金额</el-radio-button>
@@ -75,7 +75,7 @@
       </div>
       <div class="card-container-flex chart-container shadow flex1 two">
         <div class="tip-title">
-          <div class="title-text">本月出库排名前10物料</div>
+          <div class="title-text">本月出库排名前5物料</div>
            <el-radio-group v-model="cukuRankType" size="mini" @change="cukuRankTypeChange">
             <el-radio-button label="count">按数量</el-radio-button>
             <el-radio-button label="money">按金额</el-radio-button>
@@ -186,7 +186,7 @@ export default {
           this.rukuList = data.map(item =>({
             value:item.totalQuantity,
             name:item.materialName
-          }))
+          })).splice(0,5).reverse()
         })
       }
       if(this.rukuRankType === 'money'){
@@ -196,7 +196,7 @@ export default {
           this.rukuList = data.map(item =>({
             value:item.totalMoney,
             name:item.materialName
-          }))
+          })).splice(0,5).reverse()
         })
       }
     },
@@ -234,14 +234,14 @@ export default {
         outboundOrdersTopTenByQuantity().then(res=>{
           let data = res.rows
           if(!data) return
-          this.cukuList = data
+          this.cukuList = data.splice(0,5).reverse()
         })
       }
       if(this.cukuRankType === 'money'){
         outboundOrdersTopTenByAmount().then(res=>{
           let data = res.rows
           if(!data) return
-          this.cukuList = data
+          this.cukuList = data.splice(0,5).reverse()
         })
       }
     }