<template>
  <div class="home" :class="[fontSize]">
    <!-- <a-alert :message="message" type="info" /> -->
    <a-card size="small" :bordered="false" class="page-cont" :bodyStyle="{padding: '17px 30px 20px'}">
      <h3 class="page-tit"><span>客户信息</span></h3>
      <ul class="page-list">
        <li>商户名称：{{ $store.getters.userInfo.orgName || '--' }}</li>
        <li>商户别名：{{ dealerData&&dealerData.dealerAlias || '--' }}</li>
        <li>登录账号：{{ $store.getters.userInfo.username || '--' }}</li>
        <li>所属角色：{{ dealerData&&dealerData.dealerLevelDictValue || '--' }}</li>
      </ul>
    </a-card>
    <!-- 数据看板 -->
    <a-card
      v-if="$hasPermissions('M_homePage_data')"
      size="small"
      :bordered="false"
      class="page-cont"
      :bodyStyle="{padding: '17px 30px 0'}">
      <div style="font-size:16px;font-weight: 500;">
        <span>数据概览</span>
        <span
          :title="!hiddenBizData?'隐藏':'显示'"
          @click="hiddenBizData=!hiddenBizData"
          style="margin-left: 10px;cursor: pointer;"
        >
          <svg
            v-if="hiddenBizData"
            t="1650362667217"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="18432"
            width="16"
            height="16"><path d="M469.333333 681.386667c-36.053333-2.432-71.253333-8.533333-104.96-17.92l-69.802666 149.674666a42.368 42.368 0 0 1-56.533334 20.266667 42.666667 42.666667 0 0 1-20.821333-56.32l66.986667-143.658667a451.712 451.712 0 0 1-148.906667-112.682666 388.693333 388.693333 0 0 1-70.570667-119.338667 42.666667 42.666667 0 1 1 80.128-29.354667 303.445333 303.445333 0 0 0 55.210667 93.098667C270.634667 547.413333 383.018667 597.333333 505.728 597.333333c122.752 0 235.136-49.962667 305.706667-132.181333a303.445333 303.445333 0 0 0 55.210666-93.098667 42.666667 42.666667 0 0 1 80.128 29.354667 388.693333 388.693333 0 0 1-70.570666 119.338667 423.68 423.68 0 0 1-18.773334 20.48l104.362667 104.362666a42.666667 42.666667 0 0 1-0.298667 60.032 42.368 42.368 0 0 1-60.032 0.298667l-109.653333-109.653333c-20.48 14.08-42.24 26.581333-65.024 37.418666l66.901333 143.36a42.666667 42.666667 0 0 1-20.821333 56.362667 42.368 42.368 0 0 1-56.533333-20.266667l-69.717334-149.546666a520.533333 520.533333 0 0 1-91.946666 16.810666v130.645334A42.666667 42.666667 0 0 1 512 853.333333c-23.722667 0-42.666667-18.944-42.666667-42.24v-129.706666z" fill="#8a8a8a" p-id="18433"></path><path d="M176.128 524.373333a42.368 42.368 0 0 1 60.032 0.256 42.666667 42.666667 0 0 1 0.298667 60.074667l-121.216 121.216a42.368 42.368 0 0 1-60.074667-0.298667 42.666667 42.666667 0 0 1-0.298667-60.032l121.258667-121.258666z" fill="#8a8a8a" p-id="18434"></path></svg>
          <svg
            v-else
            t="1650362825006"
            class="icon"
            viewBox="0 0 1024 1024"
            version="1.1"
            xmlns="http://www.w3.org/2000/svg"
            p-id="21815"
            width="16"
            height="16"><path d="M512 209.403241c-201.731514 0-374.009206 125.476783-443.808922 302.596759 69.798692 177.119977 242.077408 302.596759 443.808922 302.596759 201.933105 0 374.010229-125.476783 443.808922-302.596759C886.009206 334.880023 713.933105 209.403241 512 209.403241zM512 713.731514c-111.355157 0-201.731514-90.375334-201.731514-201.731514s90.375334-201.731514 201.731514-201.731514 201.731514 90.375334 201.731514 201.731514S623.355157 713.731514 512 713.731514zM512 390.961296c-66.772776 0-121.038704 54.265928-121.038704 121.038704s54.265928 121.038704 121.038704 121.038704 121.038704-54.265928 121.038704-121.038704S578.772776 390.961296 512 390.961296z" p-id="21816" fill="#8a8a8a"></path></svg>
        </span>
      </div>
      <a-row v-if="!hiddenBizData">
        <a-col :span="6">
          <div class="page-data-module">
            <div class="page-data-con">
              <p class="page-data-tit">今日总单量(个)/总销售金额(元)</p>
              <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">
                  <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">
                  <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>
          </div>
        </a-col>
        <a-col :span="6">
          <div class="page-data-module">
            <div class="page-data-con">
              <p class="page-data-tit">今日总采购单量(个)/总采购金额(元)</p>
              <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">
                  <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">
                  <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>
          </div>
        </a-col>
        <a-col :span="6">
          <div class="page-data-module">
            <div class="page-data-con">
              <p class="page-data-tit">客户总数(个)</p>
              <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">
                  <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">
                  <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>
          </div>
        </a-col>
        <a-col :span="6">
          <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;">
                <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;">
                <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>
      </a-row>
      <a-row v-else>
        <a-col :span="6">
          <div class="page-data-module">
            <div class="page-data-con">
              <p class="page-data-tit">今日总单量(个)/总销售金额(元)</p>
              <h3 class="page-data-num main-color">
                ****
              </h3>
              <p class="page-data-item">
                <span class="page-data-itemText">本周</span>
                <span class="page-data-itemText">
                  ****
                </span>
              </p>
              <p class="page-data-item">
                <span class="page-data-itemText">本月</span>
                <span class="page-data-itemText">
                  ****
                </span>
              </p>
            </div>
            <span class="page-data-line"></span>
          </div>
        </a-col>
        <a-col :span="6">
          <div class="page-data-module">
            <div class="page-data-con">
              <p class="page-data-tit">今日总采购单量(个)/总采购金额(元)</p>
              <h3 class="page-data-num">
                ****
              </h3>
              <p class="page-data-item">
                <span class="page-data-itemText">本周</span>
                <span class="page-data-itemText">
                  ****
                </span>
              </p>
              <p class="page-data-item">
                <span class="page-data-itemText">本月</span>
                <span class="page-data-itemText">
                  ****
                </span>
              </p>
            </div>
            <span class="page-data-line"></span>
          </div>
        </a-col>
        <a-col :span="6">
          <div class="page-data-module">
            <div class="page-data-con">
              <p class="page-data-tit">客户总数(个)</p>
              <h3 class="page-data-num">
                ****
              </h3>
              <p class="page-data-item">
                <span class="page-data-itemText">本周新增</span>
                <span class="page-data-itemText">
                  ****
                </span>
              </p>
              <p class="page-data-item">
                <span class="page-data-itemText">30天内采购客户</span>
                <span class="page-data-itemText">
                  ****
                </span>
              </p>
            </div>
            <span class="page-data-line"></span>
          </div>
        </a-col>
        <a-col :span="6">
          <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;">
                ****
              </h3>
              <p class="page-data-tit">库存总金额(元)</p>
              <h3 class="page-data-num" style="line-height: 36px;margin: 0;">
                ****
              </h3>
            </div>
          </div>
        </a-col>
      </a-row>
    </a-card>
    <div>
      <a-row>
        <a-col :span="16">
          <a-spin :spinning="spinning" tip="Loading...">
            <a-card size="small" :bordered="false" class="page-cont" :bodyStyle="{padding: '17px 30px 20px'}">
              <h3 class="page-tit">
                <span>销售/采购/调拨指引</span>
                <a-radio-group v-model="curDate" @change="onDateChange">
                  <!-- <a-radio-button value="6">
                  最近半年
                </a-radio-button> -->
                  <a-radio-button value="12">
                    最近一年
                  </a-radio-button>
                  <a-radio-button value="0">
                    全部
                  </a-radio-button>
                </a-radio-group>
              </h3>
              <div class="page-nav-main">
                <!-- 导航指引  start -->
                <div class="page-nav-con" v-for="(item, index) in navList" :key="index">
                  <div class="page-nav-box" v-for="(subItem, subInd) in item" :key="subInd">
                    <a-badge
                      :count="countData&&unitItem.permission&&unitItem.orderNum&&$hasPermissions(unitItem.permission) ? countData[unitItem.orderNum] : 0"
                      class="page-nav-badge"
                      v-for="(unitItem, unitInd) in subItem"
                      :key="unitInd"
                      @click="unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission) ? goPage(unitItem,subInd) : null"
                      :style="{cursor: unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission)?'pointer': 'initial'}">
                      <div :class="['page-nav-item', unitItem.styleC]">
                        <div class="page-nav-n">
                          <img v-show="unitItem.icon" :src="unitItem.icon" width="16" height="16" />
                          <span>{{ unitItem.name }}</span>
                        </div>
                        <a-icon type="caret-right" v-show="unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission)" style="color: #BBBBBB;" />
                      </div>
                    </a-badge>
                  </div>
                </div>
              <!-- 导航指引  end -->
              </div>
            </a-card>
          </a-spin>
        </a-col>
        <a-col :span="8">
          <a-card size="small" :bordered="false" class="page-cont right-con" :bodyStyle="{padding: '17px 30px 20px'}">
            <h3 class="page-tit"><span>财务指引</span></h3>
            <!-- 财务指引  start -->
            <div class="page-nav-con" v-for="(item, index) in navFinancialList" :key="index">
              <div class="page-nav-box" v-for="(subItem, subInd) in item" :key="subInd" style="width: 50%;">
                <div class="page-nav-badge" v-for="(unitItem, unitInd) in subItem" :key="unitInd" @click="unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission) ? goPage(unitItem) : null" :style="{cursor: unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission)?'pointer': 'initial'}">
                  <div :class="['page-nav-item', unitItem.styleC]">
                    <div class="page-nav-n">
                      <img v-show="unitItem.icon" :src="unitItem.icon" width="16" height="16" />
                      <span>{{ unitItem.name }}</span>
                    </div>
                    <a-icon type="caret-right" v-show="unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission)" style="color: #BBBBBB;" />
                  </div>
                </div>
              </div>
            </div>
            <!-- 财务指引  end -->
          </a-card>
          <a-card size="small" :bordered="false" class="page-cont right-con" :bodyStyle="{padding: '17px 30px 20px'}">
            <h3 class="page-tit"><span>其他指引</span></h3>
            <!-- 其他指引  start -->
            <div class="page-nav-con" v-for="(item, index) in navOtherList" :key="index">
              <div class="page-nav-box" v-for="(subItem, subInd) in item" :key="subInd" style="width: 50%;">
                <div class="page-nav-badge" v-for="(unitItem, unitInd) in subItem" :key="unitInd" @click="unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission) ? goPage(unitItem):null" :style="{cursor: unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission)?'pointer': 'initial'}">
                  <div :class="['page-nav-item', unitItem.styleC]">
                    <div class="page-nav-n">
                      <img v-show="unitItem.icon" :src="unitItem.icon" width="16" height="16" />
                      <span>{{ unitItem.name }}</span>
                    </div>
                    <a-icon type="caret-right" v-show="unitItem.permission&&unitItem.url&&$hasPermissions(unitItem.permission)" style="color: #BBBBBB;" />
                  </div>
                </div>
              </div>
            </div>
            <!-- 其他指引  end -->
          </a-card>
        </a-col>
      </a-row>
    </div>
    <!-- 重置密码 -->
    <a-modal
      class="resetPwdModal"
      title="重置密码"
      width="60%"
      centered
      :footer="null"
      :closable="false"
      :maskClosable="false"
      :destroyOnClose="true"
      @cancel="openResetPwd=false"
      v-model="openResetPwd">
      <ResetPwd />
    </a-modal>
    <!-- 新产品上线提醒 -->
    <a-modal
      class="newProductTips"
      :title="'新产品'+(onlineFalg=='1'?'上':'下')+'线提醒'"
      :width="800"
      centered
      :footer="null"
      :maskClosable="false"
      :destroyOnClose="true"
      @cancel="cancelProductTips"
      v-model="openNewProduct">
      <newProduct :onlineFalg="onlineFalg" @seeMore="seeMore"></newProduct>
    </a-modal>
  </div>
</template>

<script>
import { mixin, commonMixin } from '@/utils/mixin'
import getDate from '@/libs/getDate.js'
import { mapGetters, mapActions } from 'vuex'
import ResetPwd from '@/views/user/ResetPwd.vue'
import newProduct from '@/views/productManagement/newProduct/modal.vue'
import { queryNewProductPage } from '@/api/product'
import { bizStateCount, bizData, dealerData } from '@/api/data'
export default {
  name: 'Home',
  components: { ResetPwd, newProduct },
  mixins: [mixin, commonMixin],
  data () {
    return {
      spinning: false,
      message: '欢迎登录' + process.env.VUE_APP_PRO_NAME,
      hiddenBizData: true, // 隐藏数据概览
      openResetPwd: false, //  重置密码是否显示
      openNewProduct: false,
      onlineFalg: '1', // 上下线标识  1为上线，0为下线
      queryParams: {
        beginDate: getDate.getMonthDays(12).starttime,
        endDate: getDate.getMonthDays(12).endtime
      },
      curDate: '12',
      navList: [
        [ // 客户
          [
            {
              icon: require('@/assets/home-icon/home_icon_customer.png'),
              name: '客户',
              styleC: 'blue-color',
              url: 'customerInfoList',
              permission: 'M_customerInfoList',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_billing.png'),
              name: '销售开单',
              styleC: 'red-color',
              url: 'salesQueryList',
              permission: 'M_salesQueryList',
              orderNum: ''
            },
            {
              icon: require('@/assets/home-icon/home_icon_return.png'),
              name: '销售退货',
              styleC: 'red-color',
              url: 'salesReturnList',
              permission: 'M_salesReturnList',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_verify.png'),
              name: '销售审核',
              styleC: 'blue-color',
              url: 'salesQueryList',
              params: { billStatus: 'WAIT_AUDIT' },
              permission: 'M_salesQueryList',
              orderNum: 'salesWaitAuditCount'
            },
            {
              icon: require('@/assets/home-icon/home_icon_verify.png'),
              name: '退货审核',
              styleC: 'blue-color',
              url: 'salesReturnList',
              params: { state: 'WAIT_AUDIT' },
              permission: 'M_salesReturnList',
              orderNum: 'salesReturnWaitAuditCount'
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_stock.png'),
              name: '销售出库',
              styleC: 'red-color',
              url: 'outboundOrderList',
              params: { state: 'WAIT', outBizType: 'SALES' },
              permission: 'M_outboundList',
              orderNum: 'salesWaitOutWarehouseCount'
            },
            {
              icon: require('@/assets/home-icon/home_icon_finance_pay.png'),
              name: '财务付款',
              styleC: 'red-color',
              url: 'financialPaymentList',
              params: { bizType: 'SELL_REFUND', billState: 'UNSETTLE' },
              permission: 'M_financialPaymentList',
              orderNum: 'salesReturnFinancialWaitCount'
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_finance_payment.png'),
              name: '财务收款',
              styleC: 'blue-color',
              url: 'financialCollectionList',
              params: { bizType: 'SELL', billState: 'UNSETTLE' },
              permission: 'M_financialCollectionList',
              orderNum: 'salesFinancialWaitCount'
            },
            {}
          ]
        ],
        [ // 供应商(箭冠)
          [
            {
              icon: require('@/assets/home-icon/home_icon_supplier.png'),
              name: '供应商(箭冠)',
              styleC: 'blue-color',
              url: '',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_purchase_billing.png'),
              name: '采购开单',
              styleC: 'red-color',
              url: 'purchaseOrderList',
              permission: 'M_purchasingList',
              orderNum: ''
            },
            {
              icon: require('@/assets/home-icon/home_icon_purchase_return.png'),
              name: '采购退货',
              styleC: 'red-color',
              url: this.$hasPermissions('M_purchaseReturn_outSnycList') ? 'purchaseReturnOutSyncList' : 'purchaseReturnList',
              permission: this.$hasPermissions('M_purchaseReturn_outSnycList') ? 'M_purchaseReturn_outSnycList' : 'M_purchaseReturnList',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_verify_return.png'),
              name: '入库审核',
              styleC: 'blue-color',
              url: 'warehousingAuditList',
              params: { auditState: 'WAIT_PUT_WAREHOUSE_AUDIT' },
              permission: 'M_warehousingAuditList',
              orderNum: 'purchaseWaitAuditCount'
            },
            {
              icon: require('@/assets/home-icon/home_icon_verify_return.png'),
              name: '退货审核',
              styleC: 'blue-color',
              url: this.$hasPermissions('M_purchaseReturn_outSnycList') ? 'purchaseReturnOutSyncList' : 'purchaseReturnList',
              params: { state: 'WAIT_AUDIT' },
              permission: this.$hasPermissions('M_purchaseReturn_outSnycList') ? 'M_purchaseReturn_outSnycList' : 'M_purchaseReturnList',
              orderNum: this.$hasPermissions('M_purchaseReturn_outSnycList') ? 'purchaseReturnOutSyncWaitAuditCount' : 'purchaseReturnWaitAuditCount'
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_finance_pay.png'),
              name: '财务付款',
              styleC: 'red-color',
              url: 'financialPaymentList',
              params: { bizType: 'PURCHASE', billState: 'UNSETTLE' },
              permission: 'M_financialPaymentList',
              orderNum: 'purchaseFinancialWaitCount'
            },
            {
              icon: require('@/assets/home-icon/home_icon_finance_pay.png'),
              name: '财务收款',
              styleC: 'red-color',
              url: 'financialCollectionList',
              params: { bizType: 'PURCHASE_RETURN', billState: 'UNSETTLE' },
              permission: 'M_financialCollectionList',
              orderNum: this.$hasPermissions('M_purchaseReturn_outSnycList') ? 'purchaseReturnOutSyncFinancialWaitCount' : 'purchaseReturnFinancialWaitCount'
            }
          ]
        ],
        [ // 供应商(其他)
          [
            {
              icon: require('@/assets/home-icon/home_icon_supplier.png'),
              name: '供应商(其他)',
              styleC: 'blue-color',
              url: 'supplierInfoList',
              permission: 'M_supplierInfoList',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_scatter_warehousing.png'),
              name: '散件入库',
              styleC: 'red-color',
              url: 'bulkWarehousingOrderList',
              permission: 'M_bulkWarehousingOrderList',
              orderNum: ''
            },
            {
              icon: require('@/assets/home-icon/home_icon_scatter_return.png'),
              name: '散件退货',
              styleC: 'red-color',
              url: 'bulkReturnGoodsList',
              permission: 'M_bulkReturnGoodsList',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_verify_return.png'),
              name: '待入库',
              styleC: 'blue-color',
              url: 'bulkWarehousingOrderList',
              params: { state: 'WAIT_PUT_WAREHOUSE' },
              permission: 'M_bulkWarehousingOrderList',
              orderNum: 'sparePartsPurchaseWaitAuditCount'
            },
            {
              icon: require('@/assets/home-icon/home_icon_verify_return.png'),
              name: '退货审核',
              styleC: 'blue-color',
              url: 'bulkReturnGoodsList',
              params: { state: 'WAIT_AUDIT' },
              permission: 'M_bulkReturnGoodsList',
              orderNum: 'sparePartsReturnWaitAuditCount'
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_finance_pay.png'),
              name: '财务付款',
              styleC: 'red-color',
              url: 'financialPaymentList',
              params: { bizType: 'PARTS_INPUT', billState: 'UNSETTLE' },
              permission: 'M_financialPaymentList',
              orderNum: 'sparePartsPurchaseFinancialWaitCount'
            },
            {
              icon: require('@/assets/home-icon/home_icon_stock.png'),
              name: '待出库',
              styleC: 'red-color',
              url: 'bulkReturnGoodsList',
              params: { state: 'WAIT_OUT_WAREHOUSE' },
              permission: 'M_bulkReturnGoodsList',
              orderNum: 'sparePartsReturnWaitOutWarehouseCount'
            }
          ],
          [
            {},
            {
              icon: require('@/assets/home-icon/home_icon_finance_payment.png'),
              name: '财务收款',
              styleC: 'blue-color',
              url: 'financialCollectionList',
              params: { bizType: 'SPARE_PARTS_RETURN', billState: 'UNSETTLE' },
              permission: 'M_financialCollectionList',
              orderNum: 'sparePartsReturnFinancialWaitCount'
            }
          ]
        ],
        [ // 调拨
          [
            {
              icon: require('@/assets/home-icon/home_icon_transfer.png'),
              name: '调拨',
              styleC: 'blue-color',
              url: '',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_stor_out.png'),
              name: '店内调出',
              styleC: 'red-color',
              url: 'storeTransferOutList',
              permission: 'M_storeTransferOutList',
              orderNum: ''
            },
            {
              icon: require('@/assets/home-icon/home_icon_billing.png'),
              name: '仓库调拨',
              styleC: 'red-color',
              url: 'warehouseAllocationList',
              permission: 'M_warehouseAllocationList',
              orderNum: ''
            },
            {
              icon: require('@/assets/home-icon/home_icon_billing.png'),
              name: '连锁调出',
              styleC: 'red-color',
              url: 'chainTransferOutList',
              permission: 'M_chainTransferOutList',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_verify.png'),
              name: '调出审核',
              styleC: 'blue-color',
              url: 'storeTransferOutList',
              params: { state: 'WAIT_AUDIT' },
              permission: 'M_storeTransferOutList',
              orderNum: 'storeCallOutWaitAuditCount'
            },
            {
              icon: require('@/assets/home-icon/home_icon_verify.png'),
              name: '调拨审核',
              styleC: 'blue-color',
              url: 'warehouseAllocationList',
              params: { state: 'WAIT_AUDIT' },
              permission: 'M_warehouseAllocationList',
              orderNum: 'alloWarehouseWaitAuditCount'
            },
            {
              icon: require('@/assets/home-icon/home_icon_verify.png'),
              name: '调出审核',
              styleC: 'blue-color',
              url: 'chainTransferOutList',
              params: { state: 'WAIT_AUDIT' },
              permission: 'M_chainTransferOutList',
              orderNum: 'alloLinkageOutWaitAuditCount'
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_stock.png'),
              name: '调出出库',
              styleC: 'red-color',
              url: 'outboundOrderList',
              params: { state: 'WAIT', outBizType: 'SHOP_CALL_OUT' },
              permission: 'M_outboundList',
              orderNum: 'storeCallOutWaitOutWarehouseCount'
            },
            {},
            {
              icon: require('@/assets/home-icon/home_icon_stock.png'),
              name: '调出出库',
              styleC: 'red-color',
              url: 'outboundOrderList',
              params: { state: 'WAIT', outBizType: 'LINKAGE_CALL_OUT' },
              permission: 'M_outboundList',
              orderNum: 'alloLinkageOutWaitOutWarehouseCount'
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_finance_payment.png'),
              name: '财务收款',
              styleC: 'blue-color',
              url: 'financialCollectionList',
              params: { bizType: 'STORE_CALL_OUT', billState: 'UNSETTLE' },
              permission: 'M_financialCollectionList',
              orderNum: 'storeCallOutFinancialWaitCount'
            },
            {},
            {}
          ]
        ]

      ],
      countData: null,
      bizData: null,
      dealerData: null,
      navFinancialList: [ // 财务指引
        [
          [
            {
              icon: require('@/assets/home-icon/home_icon_receivable.png'),
              name: '应收应付',
              styleC: 'blue-color',
              url: 'companyReceivablePayableList',
              permission: 'M_companyReceivablePayableList',
              orderNum: ''
            },
            {
              icon: require('@/assets/home-icon/home_icon_finance.png'),
              name: '财务收款',
              styleC: 'blue-color',
              url: 'financialCollectionList',
              params: { bizType: 'ALL' },
              permission: 'M_financialCollectionList',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_unit.png'),
              name: '收付款记录',
              styleC: 'blue-color',
              url: 'companyCollectionPaymentList',
              permission: 'M_companyCollectionPaymentList',
              orderNum: ''
            },
            {
              icon: require('@/assets/home-icon/home_icon_pay.png'),
              name: '财务付款',
              styleC: 'blue-color',
              url: 'financialPaymentList',
              params: { bizType: 'ALL' },
              permission: 'M_financialPaymentList',
              orderNum: ''
            }
          ]
        ]
      ],
      navOtherList: [ // 其他指引
        [
          [
            {
              icon: require('@/assets/home-icon/home_icon_stock s.png'),
              name: '实时库存',
              styleC: 'blue-color',
              url: 'inventoryQueryList',
              permission: 'M_inventoryInventoryQueryList',
              orderNum: ''
            }
          ],
          [
            {
              icon: require('@/assets/home-icon/home_icon_inventory.png'),
              name: '库存盘点',
              styleC: 'blue-color',
              url: 'inventoryCheckingList',
              permission: 'M_inventoryCheckingList',
              orderNum: ''
            }
          ]
        ]
      ]
    }
  },
  computed: {
    ...mapGetters(['mustChangePwd'])
  },
  watch: {
    hiddenBizData (newValue, oldValue) {
      if (!newValue) {
        this.getBizData()
      }
    }
  },
  methods: {
    ...mapActions(['getReturnReasonData']),
    hasNewProduct () {
      queryNewProductPage({ pageNo: 1, pageSize: 20, onlineFalg: this.onlineFalg }).then(res => {
        if (res.status == 200) {
          if (res.data.count > 0) {
            this.openNewProduct = true
          } else {
            if (this.onlineFalg == '1') {
              this.onlineFalg = '0'
              this.hasNewProduct()
            }
          }
        }
      })
    },
    // 查看更多产品
    seeMore () {
      this.openNewProduct = false
      if (this.onlineFalg == '1') { // 上线
        this.$router.push({ name: 'productOnlineInfo' })
      } else { // 下线
        this.$router.push({ name: 'newProductList', params: { onlineFalg: this.onlineFalg } })
      }
    },
    // 关闭弹框
    cancelProductTips () {
      const _this = this
      this.openNewProduct = false
      if (this.onlineFalg == '1') {
        this.onlineFalg = '0'
        setTimeout(() => { _this.hasNewProduct() }, 100)
      }
    },
    // 导航指引合计
    getNavCount () {
      this.spinning = true
      bizStateCount(this.queryParams).then(res => {
        if (res.status == 200) {
          this.countData = res.data
        } else {
          this.countData = null
        }
        this.spinning = false
      })
    },
    onDateChange (e) {
      console.log(e.target.value)
      const v = e.target.value
      if (v != 0) {
        this.queryParams.beginDate = getDate.getMonthDays(v).starttime
        this.queryParams.endDate = getDate.getMonthDays(v).endtime
      } else {
        this.queryParams.beginDate = undefined
        this.queryParams.endDate = undefined
      }
      this.getNavCount()
    },
    // 导航跳转
    goPage (data, subInd) {
      if (data) {
        let params = null
        // 有待办数据,则跳转带有条件的;若无待办数据,则跳转全部数据
        if (data.orderNum && this.countData[data.orderNum] || data.params) {
          data.params.beginDate = this.queryParams.beginDate
          data.params.endDate = this.queryParams.endDate
          params = { pageParams: data.params, type: 'todo' }
        } else {
          params = { pageParams: null, type: subInd == 1 ? 'new' : 'todo' }
        }
        this.setIsHomeNav(data.url, params)
        setTimeout(() => {
          this.$router.push({ name: data.url })
        }, 100)
      }
    },
    // 数据看板信息
    getBizData () {
      bizData({}).then(res => {
        if (res.status == 200) {
          this.bizData = res.data
        } else {
          this.bizData = null
        }
      })
    },
    // 商户信息
    getMerchantData () {
      dealerData({}).then(res => {
        if (res.status == 200) {
          this.dealerData = res.data
        } else {
          this.dealerData = null
        }
      })
    }
  },
  activated () {
    // 请求导航指引合计
    this.getNavCount()
    this.getMerchantData()
  },
  beforeRouteEnter (to, from, next) {
    next(vm => {
      //  判断登录用户是否重置过密码（首次登陆需强制重置密码）
      if (vm.mustChangePwd == 0) {
        vm.openResetPwd = false
        if (from.name == 'login') {
          // 判断是否有新产品上线
          vm.hasNewProduct()
        }
      } else {
        vm.openResetPwd = true
      }
      // 退货原因列表
      vm.getReturnReasonData('RETURN_REASON')
    })
  }
}
</script>
<style lang="less" scoped>
  .ant-card-body{
    padding: 17px 30px 20px;
  }
  .home {
    .page-cont{
      margin-bottom: 10px;
      // 客户信息
      .page-tit{
        color: #000000;
        font-size: 16px;
        font-weight: 500;
        margin-bottom: 18px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        span{
          font-weight: bold;
        }
      }
      .page-list{
        list-style: none;
        margin: 0;
        padding: 0;
        li{
          display: inline-block;
          width: 25%;
          font-size: 14px;
          color: rgba(0, 0, 0);
          vertical-align: top;
        }
      }
      // 数据看板
      .page-data-module{
        display: flex;
        justify-content: space-between;
        align-items: center;
        .page-data-con{
          padding: 20px 30px;
          flex-grow: 1;
          .page-data-tit{
            font-size: 14px;
            color: rgba(0, 0, 0);
            margin: 0;
          }
          .page-data-num{
            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);
          }
          .page-data-item{
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 3px;
            .page-data-itemText{
              font-size: 14px;
              color: rgba(0, 0, 0);
              display: flex;
              align-items: center;
            }
          }
        }
        .page-data-line{
          display: block;
          width: 1px;
          height: 76px;
          background-color: rgba(232, 232, 232, 1);
        }
      }
      // 操作导航引导
      .page-nav-con{
        display: flex;
        align-items: center;
        margin-bottom: 20px;
        padding-bottom: 20px;
        border-bottom: 1px solid #e8e8e8;
        &:last-child{
          margin-bottom: 0px;
          padding-bottom: 0px;
          border-bottom: none;
        }
        .page-nav-box{
          display: inline-block;
          width: 20%;
          .page-nav-badge{
            width: 94%;
            margin: 5px 0;
            .page-nav-item{
              border-radius: 8px;
              display: flex;
              justify-content: space-between;
              align-items: center;
              padding: 13px 10px;
              &:hover{
                opacity: 0.8;
                transform:scale(0.98)
              }
              .page-nav-n{
                img{
                  vertical-align: sub;
                }
                span{
                  color: rgba(0, 0, 0);
                  font-size: 14px;
                  padding-left: 5px;
                }
              }
            }
            .blue-color{
              background-color: #EDF0F9;
            }
            .red-color{
              background-color: #F8F1EF;
            }
          }
        }
      }
    }
    .right-con{
      margin-left: 10px;
    }

    &.small{
      .page-cont{
        .page-tit,
        .page-list li,
        .page-nav-badge .page-nav-n span{
          font-size: 14px!important;
        }
      }
      .page-data-module{
        .page-data-tit,
        .page-data-itemText{
          font-size: 14px!important;
        }
      }
    }
    &.middle{
      .page-cont{
        .page-tit,
        .page-list li,
        .page-nav-badge .page-nav-n span{
          font-size: 14px!important;
        }
      }
      .page-data-module{
        .page-data-tit,
        .page-data-itemText{
          font-size: 14px!important;
        }
      }
    }
    &.large{
      .page-cont{
        .page-tit,
        .page-list li,
        .page-nav-badge .page-nav-n span{
          font-size: 16px!important;
        }
      }
      .page-data-module{
        .page-data-tit,
        .page-data-itemText{
          font-size: 16px!important;
        }
      }
    }
  }
</style>
