Browse Source

样式修改

lilei 3 years ago
parent
commit
bf90cfeb50
2 changed files with 57 additions and 17 deletions
  1. 1 1
      src/layouts/BasicLayout.vue
  2. 56 16
      src/views/Home.vue

+ 1 - 1
src/layouts/BasicLayout.vue

@@ -197,7 +197,7 @@ export default {
     this.collapsed = !this.sidebarOpened
     this.$store.dispatch('ToggleMultiTab', true)
     // light
-	  this.$store.dispatch('ToggleColor', '#2a86f4')
+	  // this.$store.dispatch('ToggleColor', '#2a86f4')
     // this.$store.dispatch('ToggleTheme', 'light')
     // dark
     // this.$store.dispatch('ToggleColor', '#f30f30')

+ 56 - 16
src/views/Home.vue

@@ -17,14 +17,26 @@
           <div class="page-data-module">
             <div class="page-data-con">
               <p class="page-data-tit">今日总单量(个)/总销售金额(元)</p>
-              <h3 class="page-data-num main-color">{{ bizData&&bizData.sales&&(bizData.sales.dayTotalQty || bizData.sales.dayTotalQty==0) ? bizData.sales.dayTotalQty : 0 }}/{{ bizData&&bizData.sales&&(bizData.sales.dayTotalAmount || bizData.sales.dayTotalAmount==0) ? bizData.sales.dayTotalAmount : 0 }}</h3>
+              <h3 class="page-data-num main-color">
+                <a-statistic :valueStyle="{fontSize:'30px',color:'#e70012'}" :value="bizData&&bizData.sales&&(bizData.sales.dayTotalQty || bizData.sales.dayTotalQty==0) ? bizData.sales.dayTotalQty : 0" />
+                /
+                <a-statistic :precision="2" :valueStyle="{fontSize:'30px',color:'#e70012'}" :value="bizData&&bizData.sales&&(bizData.sales.dayTotalAmount || bizData.sales.dayTotalAmount==0) ? bizData.sales.dayTotalAmount : 0" />
+              </h3>
               <p class="page-data-item">
                 <span class="page-data-itemText">本周</span>
-                <span class="page-data-itemText">{{ bizData&&bizData.sales&&(bizData.sales.weekSalesQty || bizData.sales.weekSalesQty==0) ? bizData.sales.weekSalesQty : 0 }}/{{ bizData&&bizData.sales&&(bizData.sales.weekSalesAmount || bizData.sales.weekSalesAmount==0) ? bizData.sales.weekSalesAmount : 0 }}</span>
+                <span class="page-data-itemText">
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :value="bizData&&bizData.sales&&(bizData.sales.weekSalesQty || bizData.sales.weekSalesQty==0) ? bizData.sales.weekSalesQty : 0" />
+                  /
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :precision="2" :value="bizData&&bizData.sales&&(bizData.sales.weekSalesAmount || bizData.sales.weekSalesAmount==0) ? bizData.sales.weekSalesAmount : 0" />
+                </span>
               </p>
               <p class="page-data-item">
                 <span class="page-data-itemText">本月</span>
-                <span class="page-data-itemText">{{ bizData&&bizData.sales&&(bizData.sales.monthSalesQty || bizData.sales.monthSalesQty==0) ? bizData.sales.monthSalesQty : 0 }}/{{ bizData&&bizData.sales&&(bizData.sales.monthSalesAmount || bizData.sales.monthSalesAmount==0) ? bizData.sales.monthSalesAmount : 0 }}</span>
+                <span class="page-data-itemText">
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :value="bizData&&bizData.sales&&(bizData.sales.monthSalesQty || bizData.sales.monthSalesQty==0) ? bizData.sales.monthSalesQty : 0" />
+                  /
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :precision="2" :value="bizData&&bizData.sales&&(bizData.sales.monthSalesAmount || bizData.sales.monthSalesAmount==0) ? bizData.sales.monthSalesAmount : 0" />
+                </span>
               </p>
             </div>
             <span class="page-data-line"></span>
@@ -34,14 +46,26 @@
           <div class="page-data-module">
             <div class="page-data-con">
               <p class="page-data-tit">今日总采购单量(个)/总采购金额(元)</p>
-              <h3 class="page-data-num">{{ bizData&&bizData.purchaseBill&&(bizData.purchaseBill.dayTotalQty || bizData.purchaseBill.dayTotalQty==0) ? bizData.purchaseBill.dayTotalQty : 0 }}/{{ bizData&&bizData.purchaseBill&&(bizData.purchaseBill.dayDiscountedAmount || bizData.purchaseBill.dayDiscountedAmount==0) ? bizData.purchaseBill.dayDiscountedAmount : 0 }}</h3>
+              <h3 class="page-data-num">
+                <a-statistic :valueStyle="{fontSize:'30px'}" :value="bizData&&bizData.purchaseBill&&(bizData.purchaseBill.dayTotalQty || bizData.purchaseBill.dayTotalQty==0) ? bizData.purchaseBill.dayTotalQty : 0" />
+                /
+                <a-statistic :precision="2" :valueStyle="{fontSize:'30px'}" :value="bizData&&bizData.purchaseBill&&(bizData.purchaseBill.dayDiscountedAmount || bizData.purchaseBill.dayDiscountedAmount==0) ? bizData.purchaseBill.dayDiscountedAmount : 0" />
+              </h3>
               <p class="page-data-item">
                 <span class="page-data-itemText">本周</span>
-                <span class="page-data-itemText">{{ bizData&&bizData.purchaseBill&&(bizData.purchaseBill.weekPurchaseQty || bizData.purchaseBill.weekPurchaseQty==0) ? bizData.purchaseBill.weekPurchaseQty : 0 }}/{{ bizData&&bizData.purchaseBill&&(bizData.purchaseBill.weekDiscountedAmount || bizData.purchaseBill.weekDiscountedAmount==0) ? bizData.purchaseBill.weekDiscountedAmount : 0 }}</span>
+                <span class="page-data-itemText">
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :value="bizData&&bizData.purchaseBill&&(bizData.purchaseBill.weekPurchaseQty || bizData.purchaseBill.weekPurchaseQty==0) ? bizData.purchaseBill.weekPurchaseQty : 0" />
+                  /
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :precision="2" :value="bizData&&bizData.purchaseBill&&(bizData.purchaseBill.weekDiscountedAmount || bizData.purchaseBill.weekDiscountedAmount==0) ? bizData.purchaseBill.weekDiscountedAmount : 0" />
+                </span>
               </p>
               <p class="page-data-item">
                 <span class="page-data-itemText">本月</span>
-                <span class="page-data-itemText">{{ bizData&&bizData.purchaseBill&&(bizData.purchaseBill.monthPurchaseQty || bizData.purchaseBill.monthPurchaseQty==0) ? bizData.purchaseBill.monthPurchaseQty : 0 }}/{{ bizData&&bizData.purchaseBill&&(bizData.purchaseBill.monthDiscountedAmount || bizData.purchaseBill.monthDiscountedAmount==0) ? bizData.purchaseBill.monthDiscountedAmount : 0 }}</span>
+                <span class="page-data-itemText">
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :value="bizData&&bizData.purchaseBill&&(bizData.purchaseBill.monthPurchaseQty || bizData.purchaseBill.monthPurchaseQty==0) ? bizData.purchaseBill.monthPurchaseQty : 0" />
+                  /
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :precision="2" :value="bizData&&bizData.purchaseBill&&(bizData.purchaseBill.monthDiscountedAmount || bizData.purchaseBill.monthDiscountedAmount==0) ? bizData.purchaseBill.monthDiscountedAmount : 0" />
+                </span>
               </p>
             </div>
             <span class="page-data-line"></span>
@@ -51,14 +75,20 @@
           <div class="page-data-module">
             <div class="page-data-con">
               <p class="page-data-tit">客户总数(个)</p>
-              <h3 class="page-data-num">{{ bizData&&bizData.customer&&(bizData.customer.custCount || bizData.customer.custCount==0) ? bizData.customer.custCount : 0 }}</h3>
+              <h3 class="page-data-num">
+                <a-statistic :valueStyle="{fontSize:'30px'}" :value="bizData&&bizData.customer&&(bizData.customer.custCount || bizData.customer.custCount==0) ? bizData.customer.custCount : 0 " />
+              </h3>
               <p class="page-data-item">
                 <span class="page-data-itemText">本周新增</span>
-                <span class="page-data-itemText">{{ bizData&&bizData.customer&&(bizData.customer.addCurrentWeekCustCount || bizData.customer.addCurrentWeekCustCount==0) ? bizData.customer.addCurrentWeekCustCount : 0 }}</span>
+                <span class="page-data-itemText">
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :value="bizData&&bizData.customer&&(bizData.customer.addCurrentWeekCustCount || bizData.customer.addCurrentWeekCustCount==0) ? bizData.customer.addCurrentWeekCustCount : 0" />
+                </span>
               </p>
               <p class="page-data-item">
                 <span class="page-data-itemText">30天内采购客户</span>
-                <span class="page-data-itemText">{{ bizData&&bizData.customer&&(bizData.customer.salesThirtyDayCustCount || bizData.customer.salesThirtyDayCustCount==0) ? bizData.customer.salesThirtyDayCustCount : 0 }}</span>
+                <span class="page-data-itemText">
+                  <a-statistic :valueStyle="{fontSize:'14px'}" :value="bizData&&bizData.customer&&(bizData.customer.salesThirtyDayCustCount || bizData.customer.salesThirtyDayCustCount==0) ? bizData.customer.salesThirtyDayCustCount : 0" />
+                </span>
               </p>
             </div>
             <span class="page-data-line"></span>
@@ -68,9 +98,13 @@
           <div class="page-data-module">
             <div class="page-data-con">
               <p class="page-data-tit">总库存(个)</p>
-              <h3 class="page-data-num" style="line-height: 36px;">{{ bizData&&bizData.stock&&(bizData.stock.totalCurrentStockQty || bizData.stock.totalCurrentStockQty==0) ? bizData.stock.totalCurrentStockQty : 0 }}</h3>
+              <h3 class="page-data-num" style="line-height: 36px;">
+                <a-statistic :valueStyle="{fontSize:'30px'}" :value="bizData&&bizData.stock&&(bizData.stock.totalCurrentStockQty || bizData.stock.totalCurrentStockQty==0) ? bizData.stock.totalCurrentStockQty : 0" />
+              </h3>
               <p class="page-data-tit">库存总金额(元)</p>
-              <h3 class="page-data-num" style="line-height: 36px;margin: 0;">{{ bizData&&bizData.stock&&(bizData.stock.totalCurrentStockCost || bizData.stock.totalCurrentStockCost==0) ? bizData.stock.totalCurrentStockCost : 0 }}</h3>
+              <h3 class="page-data-num" style="line-height: 36px;margin: 0;">
+                <a-statistic :precision="2" :valueStyle="{fontSize:'30px'}" :value="bizData&&bizData.stock&&(bizData.stock.totalCurrentStockCost || bizData.stock.totalCurrentStockCost==0) ? bizData.stock.totalCurrentStockCost : 0" />
+              </h3>
             </div>
           </div>
         </a-col>
@@ -679,12 +713,14 @@ export default {
       })
     }
   },
+  activated () {
+    // 请求导航指引合计
+    this.getNavCount()
+    this.getBizData()
+    this.getMerchantData()
+  },
   beforeRouteEnter (to, from, next) {
     next(vm => {
-      // 请求导航指引合计
-      vm.getNavCount()
-      vm.getBizData()
-      vm.getMerchantData()
       //  判断登录用户是否重置过密码(首次登陆需强制重置密码)
       if (vm.mustChangePwd == 0) {
         vm.openResetPwd = false
@@ -739,10 +775,12 @@ export default {
             margin: 0;
           }
           .page-data-num{
-            font-size: 30px;
+            font-size: 28px;
             font-family: PingFang SC;
             color: #000000;
             margin-bottom: 5px;
+            display: flex;
+            align-items: center;
           }
           .main-color{
             color: rgba(231, 0, 18, 1);
@@ -755,6 +793,8 @@ export default {
             .page-data-itemText{
               font-size: 14px;
               color: rgba(0, 0, 0);
+              display: flex;
+              align-items: center;
             }
           }
         }