From 552ec6b7d8ccc56c379da195fc6c9c74312b1070 Mon Sep 17 00:00:00 2001
From: yyb <995253665@qq.com>
Date: 星期五, 22 五月 2026 17:57:46 +0800
Subject: [PATCH] OA部分查询条件变更
---
src/pages/index.vue | 1946 +++++++++++++++++++++++++++++++++++++---------------------
1 files changed, 1,225 insertions(+), 721 deletions(-)
diff --git a/src/pages/index.vue b/src/pages/index.vue
index c9f1609..2d253b2 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -1,811 +1,1315 @@
<template>
- <view class="content">
- <view class="header-section">
- <view class="currentFactory">
- <up-text type="primary" :text="userStore.currentFactoryName" @click="show = true" size="18"
- class="factoryName" suffixIcon="arrow-right" :iconStyle="iconStyle"></up-text>
- </view>
- <up-picker :show="show" :columns="factoryList" @confirm="changeFactory"></up-picker>
- </view>
-
- <view class="hero-section">
- <view class="bg-img">
- <view class="hero-content">
- <text class="hero-title">浜у搧搴撳瓨绠＄悊绯荤粺</text>
- </view>
- </view>
- </view>
-
- <view class="notice-section">
- <view class="notice">
- <view class="notice-content">
- <view class="notice-left">
- <text class="notice-status">閫氱煡</text>
- </view>
- <view class="notice-separator"></view>
- <view class="notice-right">
- <text class="notice-label">{{currentStatus}}</text>
- <text class="notice-text">褰撴棩閿�鍞澶囨暟:<text class="notice-number">{{number}}<text class="notice-unit">涓�</text></text></text>
- </view>
- </view>
- </view>
- </view>
-
- <!-- 钀ラ攢绠＄悊妯″潡 -->
- <view class="common-module marketing-module">
- <view class="module-header">
- <view class="module-title-container">
- <text class="module-title">钀ラ攢绠＄悊</text>
- </view>
- </view>
- <view class="module-content">
- <up-grid
- :border="false"
- col="4"
- >
- <up-grid-item
- v-for="(item, index) in marketingItems"
- :key="index"
- @click="handleCommonItemClick(item)"
- >
- <view class="icon-container" :style="{ background: item.bgColor }">
- <up-icon
- :name="item.icon"
- :size="26"
- color="#ffffff"
- ></up-icon>
- </view>
- <text class="item-label">{{item.label}}</text>
- </up-grid-item>
- </up-grid>
- </view>
- </view>
-
- <!-- 閲囪喘绠＄悊妯″潡 -->
- <view class="common-module purchase-module">
- <view class="module-header">
- <view class="module-title-container">
- <text class="module-title">閲囪喘绠＄悊</text>
- </view>
- </view>
- <view class="module-content">
- <up-grid
- :border="false"
- col="4"
- >
- <up-grid-item
- v-for="(item, index) in purchaseItems"
- :key="index"
- @click="handleCommonItemClick(item)"
- >
- <view class="icon-container" :style="{ background: item.bgColor }">
- <up-icon
- :name="item.icon"
- :size="26"
- color="#ffffff"
- ></up-icon>
- </view>
- <text class="item-label">{{item.label}}</text>
- </up-grid-item>
- </up-grid>
- </view>
- </view>
-
- <!-- 鍗忓悓鍔炲叕妯″潡 -->
- <view class="common-module collaboration-module">
- <view class="module-header">
- <view class="module-title-container">
- <text class="module-title">鍗忓悓鍔炲叕</text>
- </view>
- </view>
- <view class="module-content">
- <up-grid
- :border="false"
- col="4"
- >
- <up-grid-item
- v-for="(item, index) in collaborationItems"
- :key="index"
- @click="handleCommonItemClick(item)"
- >
- <view class="icon-container" :style="{ background: item.bgColor }">
- <up-icon
- :name="item.icon"
- :size="26"
- color="#ffffff"
- ></up-icon>
- </view>
- <text class="item-label">{{item.label}}</text>
- </up-grid-item>
- </up-grid>
- </view>
- </view>
-
- <!-- 璁惧绠＄悊妯″潡 -->
- <view class="common-module equipment-module">
- <view class="module-header">
- <view class="module-title-container">
- <text class="module-title">璁惧绠＄悊</text>
- </view>
- </view>
- <view class="module-content">
- <up-grid
- :border="false"
- col="4"
- >
- <up-grid-item
- v-for="(item, index) in equipmentItems"
- :key="index"
- @click="handleCommonItemClick(item)"
- >
- <view class="icon-container" :style="{ background: item.bgColor }">
- <up-icon
- :name="item.icon"
- :size="26"
- color="#ffffff"
- ></up-icon>
- </view>
- <text class="item-label">{{item.label}}</text>
- </up-grid-item>
- </up-grid>
- </view>
- </view>
+ <view class="page">
+ <scroll-view class="scroll" scroll-y>
+ <!-- 椤堕儴 Banner锛氭斁鍏ユ粴鍔ㄥ尯鍩燂紝闅忛〉闈竴璧锋粴鍔紝涓嶅浐瀹氬湪椤堕儴 -->
+ <view class="hero-section">
+ <view class="hero-banner">
+ <view class="hero-top">
+ <view class="hero-copy">
+ <view class="hero-badge">缁忚惀鐪嬫澘</view>
+ <text class="hero-title">{{ heroTitle }}</text>
+ <text class="hero-subtitle">{{ heroSubtitle }}</text>
+ <view class="hero-meta">
+ <text
+ v-for="item in heroMetaItems"
+ :key="item"
+ class="hero-meta-item"
+ >
+ {{ item }}
+ </text>
+ </view>
+ </view>
+ <view class="hero-avatar">
+ <text class="hero-avatar-text">{{ heroInitial }}</text>
+ </view>
+ </view>
+ <view class="hero-panels">
+ <view
+ v-for="item in heroMetrics"
+ :key="item.label"
+ class="hero-panel"
+ >
+ <text class="hero-panel-label">{{ item.label }}</text>
+ <text class="hero-panel-value">{{ item.value }}</text>
+ <text class="hero-panel-hint">{{ item.hint }}</text>
+ </view>
+ </view>
+ </view>
+ </view>
+
+ <!-- 蹇嵎鍏ュ彛 -->
+ <view v-if="quickTools.length" class="quick-section">
+ <up-grid :border="false" col="4">
+ <up-grid-item
+ v-for="item in quickTools"
+ :key="item.label"
+ @click="handleQuickTool(item)"
+ >
+ <view class="icon-container">
+ <image :src="item.icon" class="item-icon" mode="aspectFit" />
+ </view>
+ <text class="item-label">{{ item.label }}</text>
+ </up-grid-item>
+ </up-grid>
+ </view>
+
+ <!-- 鏁版嵁鎬昏 -->
+ <view v-if="hasOverviewSection" class="section">
+ <view class="section-header">
+ <view class="section-title">
+ <view class="title-bar" />
+ <text class="title-text">鏁版嵁鎬昏</text>
+ </view>
+ <view class="section-action" @tap="toggleOverview">
+ <text class="action-text">{{ overviewExpanded ? "鏀惰捣" : "灞曞紑" }}</text>
+ <view :class="['chev', overviewExpanded ? 'up' : 'down']" />
+ </view>
+ </view>
+
+ <view v-show="overviewExpanded" class="overview">
+ <view v-if="canShowSalesOverview" class="overview-card sales">
+ <view class="card-left">
+ <text class="card-title">閿�鍞暟鎹�</text>
+ <view class="card-metrics">
+ <view class="metric">
+ <text class="metric-label">鏈湀钀ヤ笟棰�(鍏�)</text>
+ <text class="metric-value">{{ overviewCards.sales.today }}</text>
+ </view>
+ <view class="metric">
+ <text class="metric-label">鏈湀宸插紑绁�(鍏�)</text>
+ <text class="metric-value">{{ overviewCards.sales.unbilled }}</text>
+ </view>
+ </view>
+ </view>
+ </view>
+
+ <view v-if="canShowPurchaseOverview" class="overview-card purchase">
+ <view class="card-left">
+ <text class="card-title">閲囪喘鏁版嵁</text>
+ <view class="card-metrics">
+ <view class="metric">
+ <text class="metric-label">鏈湀钀ヤ笟棰�(鍏�)</text>
+ <text class="metric-value">{{ overviewCards.purchase.today }}</text>
+ </view>
+ <view class="metric">
+ <text class="metric-label">鏈湀宸插紑绁�(鍏�)</text>
+ <text class="metric-value">{{ overviewCards.purchase.unbilled }}</text>
+ </view>
+ </view>
+ </view>
+ </view>
+
+ <view v-if="canShowStockOverview" class="overview-card stock">
+ <view class="card-left">
+ <text class="card-title">搴撳瓨鏁版嵁</text>
+ <view class="card-metrics">
+ <view class="metric">
+ <text class="metric-label">搴撳瓨鏁伴噺</text>
+ <text class="metric-value">{{ overviewCards.stock.today }}</text>
+ </view>
+ <view class="metric">
+ <text class="metric-label">浠婃棩搴撳瓨鏁伴噺</text>
+ <text class="metric-value">{{ overviewCards.stock.unbilled }}</text>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+
+ <!-- 瀹㈡埛鍚堝悓閲戦鍒嗘瀽 -->
+ <view v-if="canShowContractAnalysis" class="section">
+ <view class="section-header">
+ <view class="section-title">
+ <view class="title-bar" />
+ <text class="title-text">瀹㈡埛鍚堝悓閲戦鍒嗘瀽</text>
+ </view>
+ <view class="section-action" @tap="goMore">
+ <text class="action-text">鏇村</text>
+ <view class="chev right" />
+ </view>
+ </view>
+
+ <view class="analysis-card">
+ <view class="chart-row">
+ <view class="chart-box big">
+ <qiun-data-charts
+ type="ring"
+ canvasId="home_contract_ring"
+ :canvas2d="isCanvas2d"
+ :reshow="chartReady"
+ :opts="ringOpts"
+ :chartData="ringChartData"
+ />
+ </view>
+ </view>
+
+ <view class="summary">
+ <view class="summary-main">
+ <text class="summary-label">鎬诲悎鍚岄噾棰�(鍏�)</text>
+ <text class="summary-value">{{ contractSummaryView.sumText }}</text>
+ </view>
+ <view class="summary-sub">
+ <view class="summary-chip">
+ <text class="chip-label">鍛ㄥ悓姣�</text>
+ <text class="chip-value">{{ contractSummaryView.ynyText }}</text>
+ </view>
+ <view class="summary-chip">
+ <text class="chip-label">鏃ョ幆姣�</text>
+ <text class="chip-value">{{ contractSummaryView.chainText }}</text>
+ </view>
+ </view>
+ </view>
+
+ <view class="list-row">
+ <scroll-view class="customer-scroll" scroll-y :show-scrollbar="false">
+ <view class="customer-page">
+ <view v-for="item in contractRawList" :key="item.key" class="customer-item">
+ <view class="customer-row">
+ <view class="customer-name">
+ <image
+ v-if="item.rank === 2"
+ class="rank-icon"
+ :src="imgNum1"
+ mode="heightFix"
+ />
+ <image
+ v-else-if="item.rank === 3"
+ class="rank-icon"
+ :src="imgNum2"
+ mode="heightFix"
+ />
+ <image
+ v-else-if="item.rank === 1"
+ class="rank-icon"
+ :src="imgNum3"
+ mode="heightFix"
+ />
+ <text class="name-text">{{ item.name }}</text>
+ </view>
+ <view class="customer-rate">
+ <text class="rate-label">鍗犳瘮</text>
+ <text class="rate-value">{{ item.rateText }}</text>
+ </view>
+ <view class="amount">
+ <text class="amount-num">{{ item.valueText }}</text>
+ <text class="amount-unit">鍏�</text>
+ </view>
+ </view>
+ </view>
+ </view>
+ </scroll-view>
+ </view>
+ </view>
+ </view>
+
+ <view class="bottom-space" />
+ </scroll-view>
+
+ <DownloadProgressMask />
</view>
</template>
<script setup>
-import {ref, onMounted, nextTick, reactive} from 'vue';
-import {userLoginFacotryList} from "@/api/login";
-import modal from "@/plugins/modal";
+import { computed, onMounted, ref } from "vue";
+import { onShow } from "@dcloudio/uni-app";
+import { analysisCustomerContractAmounts, getBusiness } from "@/api/viewIndex";
+import { createVersionUpgradeChecker } from "@/utils/versionUpgrade";
+import DownloadProgressMask from "@/components/DownloadProgressMask.vue";
import useUserStore from "@/store/modules/user";
-const userStore = useUserStore()
-const factoryId = ref('');
-const show = ref(false);
-const factoryList = ref([]);
-const factoryListTem = ref([]);
-const iconStyle = {
- fontSize: '18px',
- color: '#2979ff'
+const imgNum1 = "/static/images/index/num1.png";
+const imgNum2 = "/static/images/index/num2.png";
+const imgNum3 = "/static/images/index/num3.png";
+
+const userStore = useUserStore();
+
+const quickToolSource = [
+ {
+ label: "鐢熶骇鎶ュ伐",
+ icon: "/static/images/icon/shengchanbaogong.svg",
+ action: "scan",
+ },
+ {
+ label: "璁惧宸℃",
+ icon: "/static/images/icon/xunjianshangchuan.svg",
+ route: "/pages/inspectionUpload/index",
+ },
+ {
+ label: "璁惧淇濆吇",
+ icon: "/static/images/icon/shebeibaoyang.svg",
+ route: "/pages/equipmentManagement/upkeep/index",
+ },
+ {
+ label: "璁惧鎶ヤ慨",
+ icon: "/static/images/icon/shebeibaoxiu.svg",
+ route: "/pages/equipmentManagement/repair/index",
+ },
+];
+const quickTools = ref([...quickToolSource]);
+const allowedMenuTitles = ref(new Set());
+
+const isCanvas2d = ref(false);
+
+const overviewExpanded = ref(true);
+const businessRaw = ref({});
+const contractRawList = ref([]);
+const chartReady = ref(false);
+const contractSummary = ref({ sum: "0", chain: "0", yny: "0" });
+
+// 瀹㈡埛鍚堝悓閲戦鍒嗘瀽锛氭棤闇�绛涢�夐」锛堟寜鎺ュ彛榛樿杩斿洖灞曠ず锛�
+
+const { triggerVersionCheck } = createVersionUpgradeChecker({ logPrefix: "[version-index]" });
+
+function toggleOverview() {
+ overviewExpanded.value = !overviewExpanded.value;
}
-// 閫氱煡鐘舵�佸垏鎹�
-const statusList = ['閿�鍞�', '閲囪喘']
-let statusIndex = 0
-const currentStatus = ref(statusList[0])
-const number = ref(7643)
-
-// 瀹氭椂鍣ㄥ垏鎹㈤�氱煡鐘舵��
-const startStatusTimer = () => {
- setInterval(() => {
- statusIndex = (statusIndex + 1) % statusList.length
- currentStatus.value = statusList[statusIndex]
- }, 3000)
+function handleQuickTool(item) {
+ if (item?.action === "scan") {
+ // 鐢熶骇鎶ュ伐 - 璋冪敤鎵爜
+ uni.scanCode({
+ success: (res) => {
+ console.log("鎵爜缁撴灉:", res);
+ // 瑙ｆ瀽鎵爜缁撴灉骞惰烦杞埌鐢熶骇鎶ュ伐椤甸潰
+ try {
+ const scanResult = JSON.parse(res.result);
+ uni.navigateTo({
+ url: `/pages/productionManagement/productionReport/index?orderRow=${encodeURIComponent(JSON.stringify(scanResult))}`
+ });
+ } catch (e) {
+ console.error("鎵爜缁撴灉瑙ｆ瀽澶辫触:", e);
+ uni.showToast({ title: "鏃犳晥鐨勪簩缁寸爜", icon: "none" });
+ }
+ },
+ fail: (err) => {
+ console.error("鎵爜澶辫触:", err);
+ }
+ });
+ return;
+ }
+ if (!item?.route) return;
+ uni.navigateTo({ url: item.route });
}
-// 钀ラ攢绠＄悊鍔熻兘鏁版嵁
-const marketingItems = reactive([
- {
- icon: 'account',
- label: '閿�鍞彴璐�',
- bgColor: '#2979ff'
- },
- {
- icon: 'home',
- label: '寮�绁ㄧ櫥璁�',
- bgColor: '#1976d2'
- },
- {
- icon: 'file-text',
- label: '寮�绁ㄥ彴璐�',
- bgColor: '#42a5f5'
- },
- {
- icon: 'shopping-cart',
- label: '鍥炴鐧昏',
- bgColor: '#64b5f6'
- },
- {
- icon: 'chat',
- label: '鍥炴娴佹按',
- bgColor: '#90caf9'
- },
- {
- icon: 'chat',
- label: '瀹㈡埛寰�鏉�',
- bgColor: '#90caf9'
- }
-]);
-
-// 閲囪喘绠＄悊鍔熻兘鏁版嵁
-const purchaseItems = reactive([
- {
- icon: 'order',
- label: '閲囪喘鍙拌处',
- bgColor: '#bbdefb'
- },
- {
- icon: 'truck',
- label: '鏉ョエ鐧昏',
- bgColor: '#e3f2fd'
- },
- {
- icon: 'box',
- label: '鏉ョエ鍙拌处',
- bgColor: '#f3e5f5'
- },
- {
- icon: 'chart-line',
- label: '浠樻鐧昏',
- bgColor: '#e8eaf6'
- },
- {
- icon: 'settings',
- label: '浠樻娴佹按',
- bgColor: '#f1f8e9'
- },
- {
- icon: 'settings',
- label: '渚涘簲鍟嗗線鏉�',
- bgColor: '#f1f8e9'
- },
-]);
-
-// 鍗忓悓鍔炲叕鍔熻兘鏁版嵁
-const collaborationItems = reactive([
- {
- icon: 'checkmark-circle',
- label: '鍗忓悓瀹℃壒',
- bgColor: '#4caf50'
- },
- {
- icon: 'map-pin',
- label: '瀹㈡埛鎷滆',
- bgColor: '#ff9800'
- }
-]);
-
-// 璁惧绠＄悊鍔熻兘鏁版嵁
-const equipmentItems = reactive([
- {
- icon: 'list',
- label: '璁惧鍙拌处',
- bgColor: '#9c27b0'
- },
- {
- icon: 'wrench',
- label: '璁惧鎶ヤ慨',
- bgColor: '#f44336'
- },
- {
- icon: 'shield-check',
- label: '璁惧淇濆吇',
- bgColor: '#00bcd4'
- }
-]);
-
-// 澶勭悊甯哥敤鍔熻兘鐐瑰嚮
-const handleCommonItemClick = (item) => {
- // 鏍规嵁涓嶅悓鐨勫姛鑳介」杩涜璺宠浆
- switch (item.label) {
- case '閿�鍞彴璐�':
- uni.navigateTo({
- url: '/pages/sales/salesAccount/index'
- });
- break;
- case '寮�绁ㄧ櫥璁�':
- uni.navigateTo({
- url: '/pages/sales/invoicingRegistration/index'
- });
- break;
- case '寮�绁ㄥ彴璐�':
- uni.navigateTo({
- url: '/pages/sales/invoiceLedger/index'
- });
- break;
- case '鍥炴鐧昏':
- uni.navigateTo({
- url: '/pages/sales/receiptPayment/index'
- });
- break;
- case '鍗忓悓瀹℃壒':
- uni.navigateTo({
- url: '/pages/cooperativeOffice/collaborativeApproval/index'
- });
- break;
- case '瀹㈡埛鎷滆':
- uni.navigateTo({
- url: '/pages/cooperativeOffice/clientVisit/index'
- });
- break;
- default:
- uni.showToast({
- title: `鐐瑰嚮浜�${item.label}`,
- icon: 'none'
- });
- }
-};
-
-// 鍒涘缓瀵瑰瓙缁勪欢鐨勫紩鐢�
-const uToastRef = ref(null);
-
-function getUserLoginFacotryList() {
- userLoginFacotryList({userName: userStore.nickName}).then(res => {
- // 妫�鏌es.data鏄惁涓烘暟缁�
- factoryList.value[0] = []
- if (res.data && Array.isArray(res.data)) {
- factoryListTem.value = res.data
- res.data.forEach(item => {
- factoryList.value[0].push(item.deptName)
- })
- factoryId.value = userStore.currentDeptId
- } else {
- // 濡傛灉res.data涓嶆槸鏁扮粍锛岃缃负绌烘暟缁�
- factoryList.value = []
- }
- }).catch(error => {
- modal.msgError('鑾峰彇鍏徃鍒楄〃澶辫触:', error)
- factoryList.value = []
- })
-}
-const changeFactory = async (arr) => {
- show.value = false;
- const factoryId = factoryListTem.value[arr.indexs[0]].deptId
- const loginForm = {
- username: userStore.name,
- password: uni.getStorageSync('remembered_password'),
- factoryId: factoryId,
- }
- modal.loading("鍒锋柊涓紝璇疯�愬績绛夊緟...")
- userStore.loginCheckFactory(loginForm).then(() => {
- modal.closeLoading()
- nextTick(() => {
- loginSuccess()
- });
- }).catch(() => {
- modal.closeLoading()
- })
-}
-function loginSuccess(result) {
- uni.reLaunch({
- url: '/pages/index'
- });
+function goMore() {
+ uni.showToast({ title: "鏇村鍔熻兘寰呮帴鍏�", icon: "none" });
}
-// 瀹氫箟鏂规硶
-const click = (name) => {
- if (uToastRef.value) {
- uToastRef.value.success(`鐐瑰嚮浜嗙${name + 1}涓猔); // 娉ㄦ剰锛氳繖閲屽姞1鏄洜涓洪�氬父鎴戜滑鏄粠绗�1涓紑濮嬭鏁扮殑
- }
-};
+
+function filterQuickToolsByRoutes() {
+ const routers = userStore.routers || [];
+
+ if (!routers || routers.length === 0) {
+ allowedMenuTitles.value = new Set();
+ quickTools.value = [...quickToolSource];
+ return;
+ }
+
+ const titles = new Set();
+ const collectMenuTitles = (routes) => {
+ if (!Array.isArray(routes)) return;
+ routes.forEach((route) => {
+ if (route.meta && route.meta.title) {
+ titles.add(route.meta.title);
+ }
+ if (route.children && route.children.length > 0) {
+ collectMenuTitles(route.children);
+ }
+ });
+ };
+ collectMenuTitles(routers);
+ allowedMenuTitles.value = titles;
+
+ quickTools.value = quickToolSource.filter((item) =>
+ titles.has(item.label)
+ );
+}
+
+function hasAnyPermission(titles) {
+ const titleSet = allowedMenuTitles.value;
+ if (!titleSet || titleSet.size === 0) return true;
+ return titles.some((title) => titleSet.has(title));
+}
+
+const canShowSalesOverview = computed(() => hasAnyPermission(["閿�鍞彴璐�"]));
+const canShowPurchaseOverview = computed(() => hasAnyPermission(["閲囪喘鍙拌处"]));
+const canShowStockOverview = computed(() => hasAnyPermission(["搴撳瓨绠＄悊"]));
+const hasOverviewSection = computed(
+ () =>
+ canShowSalesOverview.value ||
+ canShowPurchaseOverview.value ||
+ canShowStockOverview.value
+);
+const canShowContractAnalysis = computed(() =>
+ hasAnyPermission(["閿�鍞彴璐�", "瀹㈡埛妗ｆ", "瀹㈡埛寰�鏉�"])
+);
+
+const userDisplayName = computed(
+ () => userStore.nickName
+);
+const heroInitial = computed(() => userDisplayName.value.slice(0, 1).toUpperCase());
+const heroTitle = computed(() => `浣犲ソ锛�${userDisplayName.value}`);
+const heroSubtitle = computed(
+ () => userStore.currentFactoryName || "褰撳墠璐﹀彿宸茶繘鍏ヤ笟鍔￠椤�"
+);
+const heroMetaItems = computed(() => {
+ const items = [];
+ if (userStore.roleName) items.push(userStore.roleName);
+ if (userStore.currentLoginTime) items.push(`鐧诲綍浜� ${userStore.currentLoginTime}`);
+ if (!items.length) items.push("褰撳墠涓氬姟姒傝");
+ return items;
+});
+const visibleSectionCount = computed(() => {
+ let count = 0;
+ if (quickTools.value.length > 0) count += 1;
+ if (hasOverviewSection.value) count += 1;
+ if (canShowContractAnalysis.value) count += 1;
+ return count;
+});
+const heroMetrics = computed(() => {
+ const items = [];
+
+ if (canShowSalesOverview.value) {
+ items.push({
+ label: "閿�鍞�",
+ value: overviewCards.value.sales.today,
+ hint: "鏈湀钀ヤ笟棰�",
+ });
+ }
+ if (canShowPurchaseOverview.value) {
+ items.push({
+ label: "閲囪喘",
+ value: overviewCards.value.purchase.today,
+ hint: "鏈湀閲囪喘棰�",
+ });
+ }
+ if (canShowStockOverview.value) {
+ items.push({
+ label: "搴撳瓨",
+ value: overviewCards.value.stock.today,
+ hint: "褰撳墠搴撳瓨閲�",
+ });
+ }
+ if (canShowContractAnalysis.value && items.length < 3) {
+ items.push({
+ label: "鍚堝悓",
+ value: contractSummaryView.value.sumText,
+ hint: "瀹㈡埛鍚堝悓棰�",
+ });
+ }
+ if (items.length < 3) {
+ items.push({
+ label: "蹇嵎",
+ value: String(quickTools.value.length),
+ hint: "鍙敤鍏ュ彛",
+ });
+ }
+ if (items.length < 3) {
+ items.push({
+ label: "妯″潡",
+ value: String(visibleSectionCount.value),
+ hint: "鍙鏉垮潡",
+ });
+ }
+
+ return items.slice(0, 3);
+});
+
+function getByPath(obj, path) {
+ if (!obj || !path) return undefined;
+ const seg = String(path).split(".");
+ let cur = obj;
+ for (const k of seg) {
+ if (cur == null) return undefined;
+ cur = cur[k];
+ }
+ return cur;
+}
+
+function pick(obj, paths, fallback = undefined) {
+ for (const p of paths) {
+ const v = getByPath(obj, p);
+ if (v !== undefined && v !== null && v !== "") return v;
+ }
+ return fallback;
+}
+
+function toNumber(v) {
+ const n = Number(v);
+ return Number.isFinite(n) ? n : NaN;
+}
+
+function formatMoneyWan(v) {
+ const n = toNumber(v);
+ if (!Number.isFinite(n)) return "--";
+ const wan = n >= 10000 ? n / 10000 : n;
+ const fixed = wan >= 100 ? wan.toFixed(0) : wan >= 10 ? wan.toFixed(1) : wan.toFixed(2);
+ return fixed.replace(/\.0+$/, "");
+}
+
+function formatWanFromYuan(v) {
+ const n = toNumber(v);
+ if (!Number.isFinite(n)) return "--";
+ const wan = n / 10000;
+ const fixed = wan >= 100 ? wan.toFixed(0) : wan >= 10 ? wan.toFixed(1) : wan.toFixed(2);
+ return fixed.replace(/\.0+$/, "");
+}
+
+function formatPlain(v) {
+ const n = toNumber(v);
+ if (!Number.isFinite(n)) return "--";
+ const fixed = n >= 100 ? n.toFixed(0) : n >= 10 ? n.toFixed(1) : n.toFixed(2);
+ return fixed.replace(/\.0+$/, "");
+}
+
+function formatPercent(v) {
+ const n = toNumber(v);
+ if (!Number.isFinite(n)) return "--";
+ const p = n > 1 ? n : n * 100;
+ return `${p.toFixed(1).replace(/\.0$/, "")}%`;
+}
+
+const overviewCards = computed(() => {
+ const b = businessRaw.value || {};
+
+ // /home/business 鍏煎瀛楁锛堜綘鎻愪緵鐨勭粨鏋勪紭鍏堬級
+ const monthSaleMoney = pick(b, ["monthSaleMoney", "sale.monthMoney", "sales.monthMoney", "sales.monthSaleMoney"]);
+ const monthSaleHaveMoney = pick(b, ["monthSaleHaveMoney", "sale.monthHaveMoney", "sales.monthHaveMoney"]);
+ const monthPurchaseMoney = pick(b, ["monthPurchaseMoney", "purchase.monthMoney", "procurement.monthMoney"]);
+ const monthPurchaseHaveMoney = pick(b, ["monthPurchaseHaveMoney", "purchase.monthHaveMoney", "procurement.monthHaveMoney"]);
+ const inventoryNum = pick(b, ["inventoryNum", "stock.inventoryNum", "inventory.num", "stock.num"]);
+ const todayInventoryNum = pick(b, ["todayInventoryNum", "stock.todayInventoryNum", "inventory.todayNum", "stock.todayNum"]);
+
+ return {
+ // 閲戦鎸夆�滃厓鈥濆睍绀�
+ sales: { today: formatPlain(monthSaleMoney), unbilled: formatPlain(monthSaleHaveMoney) },
+ purchase: { today: formatPlain(monthPurchaseMoney), unbilled: formatPlain(monthPurchaseHaveMoney) },
+ // 搴撳瓨涓烘暟閲忥紙涓嶅仛鈥滀竾鈥濇崲绠楋級
+ stock: { today: formatPlain(inventoryNum), unbilled: formatPlain(todayInventoryNum) },
+ };
+});
+
+const contractSummaryView = computed(() => {
+ const sumText = formatPlain(contractSummary.value?.sum);
+ const chainText = formatPlain(contractSummary.value?.chain);
+ const ynyText = formatPlain(contractSummary.value?.yny);
+ return {
+ sumText,
+ chainText,
+ ynyText,
+ };
+});
+
+const ringOpts = computed(() => {
+ const totalYuan = formatPlain(contractSummary.value?.sum);
+ return {
+ padding: [0, 0, 0, 0],
+ legend: { show: false },
+ rotate: false,
+ dataLabel: false,
+ title: { name: totalYuan, fontSize: 18, color: "#2b2b2b" },
+ subtitle: { name: "鍚堝悓閲戦(鍏�)", fontSize: 12, color: "#8a94a6" },
+ extra: {
+ ring: {
+ ringWidth: 18,
+ activeOpacity: 0.5,
+ activeRadius: 8,
+ offsetAngle: 0,
+ labelWidth: 0,
+ border: true,
+ borderWidth: 2,
+ borderColor: "#FFFFFF",
+ },
+ },
+ };
+});
+
+const ringChartData = computed(() => {
+ const list = Array.isArray(contractRawList.value) ? contractRawList.value : [];
+ const top = list.slice(0, 5);
+ const other = list.slice(5);
+ const otherSum = other.reduce((acc, cur) => acc + (Number(cur.value) || 0), 0);
+
+ const data = [
+ ...top.map((x) => ({ name: x.name, value: Number(x.value) || 0 })),
+ ...(otherSum > 0 ? [{ name: "鍏朵粬", value: otherSum }] : []),
+ ].filter((x) => x.value > 0);
+
+ return { series: [{ data }] };
+});
+
+function normalizeContractList(raw) {
+ const rows = Array.isArray(raw?.item) ? raw.item : [];
+
+ const mapped = rows
+ .map((it, idx) => {
+ const name = pick(it, ["name"], `鍏徃${idx + 1}`);
+ const value = pick(it, ["value"], 0);
+ const rate = pick(it, ["rate"], 0);
+
+ return {
+ key: `${idx}-${name}`,
+ name: String(name),
+ value: toNumber(value),
+ valueText: formatPlain(value),
+ rate: toNumber(rate),
+ rateText: `${formatPlain(rate)}%`,
+ };
+ })
+ .sort((a, b) => (b.value || 0) - (a.value || 0))
+ .map((it, index) => ({ ...it, rank: index + 1 }));
+
+ return mapped;
+}
+
+async function loadHome() {
+ chartReady.value = false;
+ try {
+ const businessPromise = hasOverviewSection.value
+ ? getBusiness()
+ : Promise.resolve({ data: {} });
+ const contractPromise = canShowContractAnalysis.value
+ ? analysisCustomerContractAmounts()
+ : Promise.resolve({ data: { item: [], sum: "0", chain: "0", yny: "0" } });
+ const [bRes, cRes] = await Promise.all([businessPromise, contractPromise]);
+ businessRaw.value = bRes?.data || {};
+ const cData = cRes?.data || {};
+ contractSummary.value = {
+ sum: pick(cData, ["sum"], "0"),
+ chain: pick(cData, ["chain"], "0"),
+ yny: pick(cData, ["yny"], "0"),
+ };
+ contractRawList.value = normalizeContractList(cData);
+ } catch (e) {
+ contractSummary.value = { sum: "0", chain: "0", yny: "0" };
+ contractRawList.value = normalizeContractList({ item: [] });
+ } finally {
+ chartReady.value = true;
+ }
+}
onMounted(() => {
- // 璁剧疆鐢ㄦ埛淇℃伅
- userStore.getInfo()
- getUserLoginFacotryList()
- // 鍚姩閫氱煡鐘舵�佸畾鏃跺櫒
- startStatusTimer()
+ try {
+ const platform = uni.getSystemInfoSync().platform;
+ isCanvas2d.value = platform === "android" || platform === "ios";
+ } catch (e) {
+ isCanvas2d.value = false;
+ }
+ triggerVersionCheck("onMounted");
+ userStore
+ .getRouters()
+ .then(() => {
+ filterQuickToolsByRoutes();
+ loadHome();
+ })
+ .catch(() => {
+ filterQuickToolsByRoutes();
+ loadHome();
+ });
+});
+
+onShow(() => {
+ triggerVersionCheck("onShow");
+ filterQuickToolsByRoutes();
});
</script>
<style scoped lang="scss">
-.content {
- background: linear-gradient(135deg, #f8f9fa 0%, #e3f2fd 100%);
+.page {
+ background: #f6f7fb;
min-height: 100vh;
- padding: 20px;
- padding-top: env(safe-area-inset-top);
+ // padding: 12px;
+ /* 涓烘墍鏈夎澶囪缃熀纭�padding-top锛堝寘鍚畨鍏ㄥ尯锛� */
+ padding-top: calc(env(safe-area-inset-top) + 30px);
position: relative;
+ /* 涓哄畨鍗撹澶囪缃洿澶х殑椤堕儴鍐呰竟璺� */
+ /* #ifdef APP-PLUS && !MP && !H5 */
+ padding-top: calc(env(safe-area-inset-top) + 45px);
+ /* #endif */
+
+ /* H5鍜屽皬绋嬪簭骞冲彴鐨勯�氱敤鏍峰紡 */
+ /* #ifdef H5 || MP */
+ padding-top: calc(env(safe-area-inset-top) + 30px);
+ /* #endif */
&::before {
- content: '';
+ content: "";
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
- background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="dots" width="20" height="20" patternUnits="userSpaceOnUse"><circle cx="10" cy="10" r="1" fill="rgba(41, 121, 255, 0.03)"/></pattern></defs><rect width="100" height="100" fill="url(%23dots)"/></svg>');
+ background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="dots" width="24" height="24" patternUnits="userSpaceOnUse"><circle cx="12" cy="12" r="1" fill="rgba(41, 121, 255, 0.02)"/></pattern></defs><rect width="100" height="100" fill="url(%23dots)"/></svg>');
pointer-events: none;
z-index: -1;
}
&::after {
- content: '';
+ content: "";
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
- background: radial-gradient(circle at 20% 80%, rgba(41, 121, 255, 0.02) 0%, transparent 50%),
- radial-gradient(circle at 80% 20%, rgba(156, 39, 176, 0.02) 0%, transparent 50%);
+ background: radial-gradient(
+ circle at 20% 80%,
+ rgba(41, 121, 255, 0.02) 0%,
+ transparent 55%
+ ),
+ radial-gradient(
+ circle at 80% 20%,
+ rgba(156, 39, 176, 0.015) 0%,
+ transparent 55%
+ );
pointer-events: none;
z-index: -1;
}
}
-
-/* 鏈〉涓嶅啀瀹氫箟 .safe-area-top锛屽凡绉昏嚦鍏ㄥ眬鏍峰紡 */
-
-.header-section {
- margin-bottom: 16px;
- animation: fadeInDown 0.6s ease-out;
-}
-
-.currentFactory {
- margin-top: 8px;
- margin-left: 4px;
- font-weight: 500;
- display: flex;
-}
-
-.factoryName {
- width: auto;
-}
-
-:deep(.u-text) {
- align-items: center;
-}
-
.hero-section {
- margin-bottom: 16px;
- animation: fadeInUp 0.6s ease-out 0.1s both;
+ margin: 0 14px 12px;
+ animation: fadeInUp 0.6s ease-out 0.1s both;
}
-.bg-img {
- width: 100%;
- height: 120px;
- background: linear-gradient(135deg, #2979ff 0%, #1565c0 100%);
- border-radius: 12px;
- position: relative;
- overflow: hidden;
- box-shadow: 0 4px 20px rgba(41, 121, 255, 0.15);
-
- &::before {
- content: '';
- position: absolute;
- top: -50%;
- left: -50%;
- width: 200%;
- height: 200%;
- background: conic-gradient(from 0deg, transparent, rgba(255,255,255,0.1), transparent, rgba(255,255,255,0.05), transparent);
- animation: rotate 20s linear infinite;
- }
-
- &::after {
- content: '';
- position: absolute;
- top: 0;
- right: 0;
- width: 120px;
- height: 120px;
- background: radial-gradient(circle, rgba(255,255,255,0.15) 0%, transparent 70%);
- border-radius: 50%;
- transform: translate(40px, -40px);
- }
+.hero-banner {
+ position: relative;
+ overflow: hidden;
+ border-radius: 18px;
+ padding: 18px 16px 16px;
+ min-height: 182px;
+ background:
+ linear-gradient(135deg, rgba(22, 74, 170, 0.92) 0%, rgba(33, 115, 185, 0.88) 48%, rgba(18, 156, 144, 0.82) 100%),
+ url("/static/images/banner/backview.png") center right / cover no-repeat;
+ box-shadow: 0 14px 34px rgba(29, 78, 137, 0.2);
+ border: 1px solid rgba(255, 255, 255, 0.18);
+
+ &::before {
+ content: "";
+ position: absolute;
+ inset: 0;
+ background:
+ linear-gradient(120deg, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0.02) 32%, rgba(255, 255, 255, 0) 60%),
+ radial-gradient(circle at top right, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0) 34%);
+ pointer-events: none;
+ }
+
+ &::after {
+ content: "";
+ position: absolute;
+ right: -28px;
+ bottom: -34px;
+ width: 156px;
+ height: 156px;
+ border-radius: 50%;
+ background: radial-gradient(circle, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 72%);
+ pointer-events: none;
+ }
}
-.hero-content {
- position: relative;
- z-index: 1;
- padding: 20px;
- height: 100%;
- display: flex;
- align-items: center;
+.hero-top {
+ position: relative;
+ z-index: 1;
+ display: flex;
+ align-items: flex-start;
+ justify-content: space-between;
+ gap: 14px;
+}
+
+.hero-copy {
+ min-width: 0;
+ flex: 1;
+}
+
+.hero-badge {
+ display: inline-flex;
+ align-items: center;
+ height: 26px;
+ padding: 0 10px;
+ border-radius: 999px;
+ background: rgba(255, 255, 255, 0.16);
+ border: 1px solid rgba(255, 255, 255, 0.18);
+ color: rgba(255, 255, 255, 0.92);
+ font-size: 11px;
+ font-weight: 600;
}
.hero-title {
- color: #ffffff;
- font-size: 24px;
- font-weight: 600;
+ display: block;
+ margin-top: 12px;
+ color: #ffffff;
+ font-size: 24px;
+ font-weight: 700;
+ line-height: 1.2;
}
-
-
-.notice-section {
- margin-bottom: 16px;
- animation: fadeInUp 0.6s ease-out 0.2s both;
+.hero-subtitle {
+ display: block;
+ margin-top: 8px;
+ color: rgba(255, 255, 255, 0.84);
+ font-size: 13px;
+ line-height: 1.45;
}
-.notice {
- width: 100%;
- background: linear-gradient(135deg, #EAF2FF 0%, #BBDEFB 100%);
- border: 1px solid #e3f2fd;
- border-radius: 12px;
- padding: 16px;
- box-shadow: 0 4px 20px rgba(41, 121, 255, 0.08);
- position: relative;
- overflow: hidden;
-
- &::before {
- content: '';
- position: absolute;
- top: -50%;
- left: -50%;
- width: 200%;
- height: 200%;
- background: linear-gradient(45deg, transparent, rgba(255,255,255,0.6), transparent);
- animation: shine 4s infinite;
- }
-
- &::after {
- content: '';
- position: absolute;
- top: 0;
- right: 0;
- width: 80px;
- height: 80px;
- background: radial-gradient(circle, rgba(255,255,255,0.2) 0%, transparent 70%);
- border-radius: 50%;
- transform: translate(30px, -30px);
- }
+.hero-meta {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ margin-top: 12px;
}
-
-
-@keyframes shine {
- 0% {
- transform: translateX(-100%) translateY(-100%) rotate(45deg);
- }
- 100% {
- transform: translateX(100%) translateY(100%) rotate(45deg);
- }
+.hero-meta-item {
+ padding: 3px 10px;
+ border-radius: 999px;
+ background: rgba(255, 255, 255, 0.12);
+ color: rgba(255, 255, 255, 0.86);
+ font-size: 11px;
+ line-height: 18px;
}
-@keyframes fadeInDown {
- from {
- opacity: 0;
- transform: translateY(-20px);
- }
- to {
- opacity: 1;
- transform: translateY(0);
- }
+.hero-avatar {
+ position: relative;
+ z-index: 1;
+ width: 52px;
+ height: 52px;
+ flex: 0 0 52px;
+ border-radius: 16px;
+ background: rgba(255, 255, 255, 0.18);
+ border: 1px solid rgba(255, 255, 255, 0.22);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
-@keyframes fadeInUp {
- from {
- opacity: 0;
- transform: translateY(20px);
- }
- to {
- opacity: 1;
- transform: translateY(0);
- }
+.hero-avatar-text {
+ color: #ffffff;
+ font-size: 20px;
+ font-weight: 700;
}
-@keyframes rotate {
- from {
- transform: rotate(0deg);
- }
- to {
- transform: rotate(360deg);
- }
+.hero-panels {
+ position: relative;
+ z-index: 1;
+ display: grid;
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ gap: 10px;
+ margin-top: 18px;
}
-.notice-content {
- display: flex;
- align-items: center;
- height: 100%;
- position: relative;
- z-index: 1;
+.hero-panel {
+ min-width: 0;
+ padding: 12px 10px;
+ border-radius: 14px;
+ background: rgba(11, 25, 48, 0.18);
+ border: 1px solid rgba(255, 255, 255, 0.14);
+ backdrop-filter: blur(10px);
}
-.notice-left {
- margin-right: 16px;
+.hero-panel-label {
+ display: block;
+ color: rgba(255, 255, 255, 0.7);
+ font-size: 11px;
+ line-height: 1.2;
}
-.notice-status {
- font-weight: 600;
- font-size: 16px;
- color: #1976d2;
+.hero-panel-value {
+ display: block;
+ margin-top: 8px;
+ color: #ffffff;
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.2;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
-.notice-separator {
- width: 1px;
- height: 24px;
- background: #e0e0e0;
- margin-right: 16px;
+.hero-panel-hint {
+ display: block;
+ margin-top: 6px;
+ color: rgba(255, 255, 255, 0.72);
+ font-size: 11px;
+ line-height: 1.2;
}
-.notice-right {
- display: flex;
- align-items: center;
- justify-content: space-between;
- flex: 1;
+.safe-top {
+ height: calc(env(safe-area-inset-top) + 10px);
}
-.notice-label {
- color: #333;
- font-size: 14px;
- font-weight: 500;
- margin-right: 12px;
+.scroll {
+ min-height: calc(100vh - env(safe-area-inset-top) - 10px);
}
-.notice-text {
- font-weight: 400;
- font-size: 14px;
- color: #666666;
+.section {
+ margin: 0 14px 14px;
}
-.notice-number {
- font-weight: 600;
- font-size: 16px;
- color: #1976d2;
- margin-left: 4px;
-}
-
-.notice-unit {
- color: #666666;
- font-size: 14px;
- margin-left: 2px;
-}
-
-/* 鍔熻兘妯″潡鏍峰紡 */
-.common-module {
- margin-bottom: 24px;
- background: linear-gradient(135deg, #ffffff 0%, #fafbfc 100%);
- border-radius: 16px;
- padding: 16px;
- box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
- border: none;
- position: relative;
- overflow: hidden;
- transition: all 0.3s ease;
-
- &::after {
- content: '';
- position: absolute;
- top: 0;
- right: 0;
- width: 60px;
- height: 60px;
- background: radial-gradient(circle, rgba(0,0,0,0.02) 0%, transparent 70%);
- border-radius: 50%;
- transform: translate(30px, -30px);
- }
-
- &:hover {
- transform: translateY(-2px);
- box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
-
- &::after {
- background: radial-gradient(circle, rgba(0,0,0,0.04) 0%, transparent 70%);
- }
- }
-}
-
-.marketing-module {
- --module-color: #2979ff;
-}
-
-.purchase-module {
- --module-color: #1976d2;
-}
-
-.collaboration-module {
- --module-color: #4caf50;
-}
-
-.equipment-module {
- --module-color: #9c27b0;
-}
-
-.module-header {
- margin-bottom: 24px;
- display: flex;
- align-items: center;
- justify-content: space-between;
-}
-
-.module-title-container {
- display: flex;
- align-items: center;
-}
-
-.module-title {
- color: #333333;
- font-size: 18px;
- font-weight: 600;
- position: relative;
-
- &::after {
- content: '';
- position: absolute;
- bottom: -4px;
- left: 0;
- width: 100%;
- height: 2px;
- background: linear-gradient(90deg, var(--module-color), rgba(255,255,255,0.9));
- border-radius: 1px;
- transition: all 0.3s ease;
- box-shadow: 0 0 8px rgba(0,0,0,0.1);
- }
-
- &:hover::after {
- width: 30px;
- box-shadow: 0 0 12px rgba(0,0,0,0.15);
- }
-}
-
-.module-subtitle {
- color: #666666;
- font-size: 12px;
- font-weight: 400;
- margin-left: 8px;
-}
-
-.module-content {
- width: 100%;
- display: grid;
- gap: 16px;
+.quick-section {
+ margin: 0 14px 10px;
+ padding: 6px 0 2px;
}
.icon-container {
- width: 52px;
- height: 52px;
- border-radius: 12px;
- display: flex;
- align-items: center;
- justify-content: center;
- margin-bottom: 6px;
- box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12);
- transition: all 0.3s ease;
- position: relative;
- overflow: hidden;
-
- &::before {
- content: '';
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, transparent 50%, rgba(255,255,255,0.05) 100%);
- opacity: 0;
- transition: opacity 0.3s ease;
- }
-
- &::after {
- content: '';
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- border-radius: 12px;
- background: linear-gradient(45deg, transparent, rgba(255,255,255,0.2), transparent);
- opacity: 0;
- transition: opacity 0.3s ease;
- }
-
- &:hover {
- transform: translateY(-3px) scale(1.02);
- box-shadow: 0 8px 25px rgba(0, 0, 0, 0.18);
-
- &::before,
- &::after {
- opacity: 1;
- }
- }
+ width: 36px;
+ height: 36px;
+ border-radius: 12px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-bottom: 0.375rem;
+ transition: all 0.2s ease;
+ position: relative;
+ overflow: hidden;
+ animation: fadeInScale 0.5s ease both;
+}
+
+.item-icon {
+ width: 36px;
+ height: 36px;
+ display: block;
+}
+
+.icon-container:active {
+ transform: scale(0.97);
}
.item-label {
- font-size: 13px;
- color: #555555;
- text-align: center;
- display: block;
- line-height: 1.4;
- font-weight: 500;
- margin-top: 4px;
- margin-bottom: 10px;
+ font-size: 12px;
+ color: #555555;
+ text-align: center;
+ display: block;
+ line-height: 1.4;
+ font-weight: 500;
+ margin-top: 4px;
+ margin-bottom: 6px;
}
-.grid-text {
- font-size: 14px;
- color: #909399;
- padding: 10rpx 0 20rpx 0rpx;
- /* #ifndef APP-PLUS */
- box-sizing: border-box;
- /* #endif */
+:deep(.up-grid-item) {
+ padding: 6px 0;
}
+:deep(.up-grid-item__content) {
+ padding: 0;
+}
+.section-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 8px 2px 10px;
+}
+
+.section-title {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+}
+
+.title-bar {
+ width: 4px;
+ height: 16px;
+ border-radius: 2px;
+ background: #2f6bff;
+}
+
+.title-text {
+ font-size: 16px;
+ font-weight: 700;
+ color: #1f2937;
+}
+
+.section-action {
+ display: flex;
+ align-items: center;
+ gap: 6px;
+ color: #8a94a6;
+ font-size: 12px;
+}
+
+.action-text {
+ color: #8a94a6;
+}
+
+.chev {
+ width: 8px;
+ height: 8px;
+ border-right: 2px solid #b9c0cf;
+ border-bottom: 2px solid #b9c0cf;
+ transform: rotate(45deg);
+}
+.chev.up {
+ transform: rotate(-135deg);
+}
+.chev.down {
+ transform: rotate(45deg);
+}
+.chev.right {
+ transform: rotate(-45deg);
+}
+.chev.small {
+ width: 7px;
+ height: 7px;
+ border-width: 2px;
+}
+
+.overview {
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+}
+
+.overview-card {
+ position: relative;
+ overflow: hidden;
+ border-radius: 12px;
+ padding: 14px 14px 12px;
+ border: 1px dashed rgba(31, 41, 55, 0.08);
+}
+
+.overview-card.sales {
+ background: url("/static/images/index/xiaoshoushuju.png") no-repeat center center;
+ background-size: cover;
+}
+.overview-card.purchase {
+ background: url("/static/images/index/caigoushuju.png") no-repeat center center;
+ background-size: cover;
+}
+.overview-card.stock {
+ background: url("/static/images/index/kucunshuju.png") no-repeat center center;
+ background-size: cover;
+}
+
+.card-left {
+ position: relative;
+ z-index: 1;
+}
+
+.card-title {
+ font-size: 14px;
+ font-weight: 700;
+ color: rgba(17, 24, 39, 0.85);
+ margin-bottom: 10px;
+}
+
+.card-metrics {
+ display: flex;
+ gap: 12px;
+ justify-content: space-between;
+ width: 100%;
+}
+
+.metric {
+ display: flex;
+ align-items: center;
+ min-width: 0;
+ flex: 1;
+}
+
+.metric-label {
+ font-size: 11px;
+ color: rgba(107, 114, 128, 0.9);
+ white-space: nowrap;
+ width: 80px;
+}
+
+.metric-value {
+ font-size: 14px;
+ font-weight: 800;
+ color: rgba(17, 24, 39, 0.9);
+ white-space: nowrap;
+ flex: 1 1 auto;
+ min-width: 0;
+ overflow: visible;
+ text-overflow: clip;
+}
+
+.metric-label,
+.metric-value {
+ line-height: 1.2;
+}
+
+.metric-value {
+ font-variant-numeric: tabular-nums;
+}
+
+.overview-card.purchase .metric-value {
+ color: rgba(124, 84, 28, 0.95);
+}
+.overview-card.stock .metric-value {
+ color: rgba(24, 64, 136, 0.95);
+}
+
+.card-icon {
+ position: absolute;
+ right: 10px;
+ top: 10px;
+ width: 78px;
+ opacity: 0.35;
+}
+
+.analysis-card {
+ background: #ffffff;
+ border-radius: 14px;
+ padding: 12px;
+ border: 1px solid rgba(148, 163, 184, 0.18);
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+}
+
+.chart-row {
+ width: 100%;
+ display: flex;
+ justify-content: center;
+}
+
+.summary {
+ padding: 2px 2px 10px;
+}
+.summary-main {
+ display: flex;
+ align-items: baseline;
+ justify-content: space-between;
+ gap: 10px;
+}
+.summary-label {
+ font-size: 12px;
+ color: #6b7280;
+ white-space: nowrap;
+}
+.summary-value {
+ font-size: 18px;
+ font-weight: 800;
+ color: #1f2937;
+ text-align: right;
+ min-width: 0;
+ white-space: nowrap;
+}
+.summary-sub {
+ margin-top: 6px;
+ display: flex;
+ gap: 8px;
+}
+
+.summary-chip {
+ flex: 1;
+ background: rgba(47, 107, 255, 0.06);
+ border: 1px solid rgba(47, 107, 255, 0.12);
+ border-radius: 10px;
+ padding: 6px 8px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 8px;
+ min-width: 0;
+}
+.chip-label {
+ font-size: 11px;
+ color: #6b7280;
+ white-space: nowrap;
+}
+.chip-value {
+ font-size: 12px;
+ font-weight: 700;
+ color: #2f6bff;
+ white-space: nowrap;
+}
+
+.chart-box {
+ height: 170px;
+ width: 100%;
+}
+.chart-box.big {
+ height: 220px;
+ width: 100%;
+}
+
+.list-row {
+ width: 100%;
+ margin-top: 6px;
+}
+
+.customer-scroll {
+ height: 220px;
+}
+
+.customer-page {
+ display: flex;
+ flex-direction: column;
+ gap: 14px;
+ padding-top: 4px;
+ padding-right: 4px;
+}
+
+.customer-item {
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
+}
+
+.customer-row {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 8px;
+}
+
+.customer-name {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ min-width: 0;
+ flex: 1 1 auto;
+}
+
+.rank-icon {
+ width: 18px;
+ height: 18px;
+ flex: 0 0 auto;
+}
+
+.name-text {
+ font-size: 13px;
+ color: #1f2937;
+ font-weight: 600;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.amount {
+ display: flex;
+ align-items: baseline;
+ gap: 4px;
+ color: #1f2937;
+ font-weight: 800;
+ flex: 0 0 auto;
+}
+.amount-num {
+ font-size: 18px;
+ line-height: 1;
+}
+.amount-unit {
+ font-size: 12px;
+ color: #6b7280;
+ font-weight: 600;
+}
+
+.customer-rate {
+ display: flex;
+ align-items: center;
+ gap: 4px;
+ flex: 0 0 auto;
+ white-space: nowrap;
+}
+.rate-label {
+ font-size: 11px;
+ color: #6b7280;
+}
+.rate-value {
+ font-size: 12px;
+ font-weight: 600;
+ color: #2f6bff;
+}
+
+.customer-sub {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ color: #6b7280;
+ font-size: 12px;
+}
+.sub-label {
+ color: #6b7280;
+}
+.sub-value {
+ font-weight: 700;
+ color: #6b7280;
+}
+.sub-value.up {
+ color: #16a34a;
+}
+.sub-value.down {
+ color: #dc2626;
+}
+
+.arrow {
+ width: 0;
+ height: 0;
+ border-left: 4px solid transparent;
+ border-right: 4px solid transparent;
+}
+.arrow.up {
+ border-bottom: 6px solid #16a34a;
+ transform: translateY(-1px);
+}
+.arrow.down {
+ border-top: 6px solid #dc2626;
+ transform: translateY(1px);
+}
+
+.bottom-space {
+ height: 24px;
+}
+
+@media (prefers-color-scheme: dark) {
+ .page {
+ background: #121317;
+ }
+ .title-text {
+ color: #e9edf3;
+ }
+ .overview-card,
+ .filter-item,
+ .analysis-card {
+ border-color: rgba(255, 255, 255, 0.08);
+ }
+ .filter-item,
+ .analysis-card {
+ background: #1e1f24;
+ }
+ .name-text,
+ .amount {
+ color: #e9edf3;
+ }
+ .amount-unit,
+ .metric-label,
+ .action-text,
+ .section-action,
+ .customer-sub,
+ .sub-label,
+ .sub-value {
+ color: #aab2c1;
+ }
+ .summary-value {
+ color: #e9edf3;
+ }
+ .summary-chip {
+ background: rgba(47, 107, 255, 0.12);
+ border-color: rgba(47, 107, 255, 0.18);
+ }
+ .overview-card.sales {
+ background: linear-gradient(135deg, rgba(30, 91, 104, 0.35) 0%, rgba(18, 68, 80, 0.35) 100%);
+ }
+ .overview-card.purchase {
+ background: linear-gradient(135deg, rgba(108, 76, 33, 0.35) 0%, rgba(80, 55, 20, 0.35) 100%);
+ }
+ .overview-card.stock {
+ background: linear-gradient(135deg, rgba(36, 54, 110, 0.35) 0%, rgba(22, 35, 74, 0.35) 100%);
+ }
+ .metric-value {
+ color: #e9edf3;
+ }
+}
+
+@keyframes fadeInScale {
+ 0% {
+ opacity: 0;
+ transform: translateY(0.5rem) scale(0.96);
+ }
+ 100% {
+ opacity: 1;
+ transform: translateY(0) scale(1);
+ }
+}
</style>
--
Gitblit v1.9.3