Commit 62f1d695310d773cc62b6a6a6b3f7a996418bf76
1 parent
f218a54a
最新
Showing
7 changed files
with
372 additions
and
277 deletions
绿纤uni-app/pages/dashboard/dashboard.vue
| @@ -321,19 +321,12 @@ | @@ -321,19 +321,12 @@ | ||
| 321 | <view class="warpboxs-small-title"> | 321 | <view class="warpboxs-small-title"> |
| 322 | <view><text class="warpboxs-small-title-line"></text>客户获取转化链</view> | 322 | <view><text class="warpboxs-small-title-line"></text>客户获取转化链</view> |
| 323 | </view> | 323 | </view> |
| 324 | - <view class="funnel-box"> | ||
| 325 | - <view class="funnel-step" v-for="(item, index) in funnelData" :key="index"> | ||
| 326 | - <view class="step-shape" :style="{ width: (100 - index * 15) + '%', opacity: 1 - index * 0.1 }"> | ||
| 327 | - <view class="step-content"> | ||
| 328 | - <text class="step-label">{{ item.label }}</text> | ||
| 329 | - <text class="step-value">{{ formatNumber(item.value) }}</text> | ||
| 330 | - </view> | ||
| 331 | - </view> | ||
| 332 | - <view class="step-arrow" v-if="index < funnelData.length - 1"> | ||
| 333 | - <u-icon name="arrow-down" size="16" color="#999"></u-icon> | ||
| 334 | - <text class="rate-text" v-if="item.rate">转化率 {{ item.rate }}%</text> | ||
| 335 | - </view> | ||
| 336 | - </view> | 324 | + <view class="chart-wrapper"> |
| 325 | + <canvas canvas-id="funnelChart" class="funnel-chart-canvas" :style="{ width: chartWidth + 'px', height: chartHeight + 'px' }"></canvas> | ||
| 326 | + </view> | ||
| 327 | + <view class="funnel-stats"> | ||
| 328 | + <view class="stat-mini">邀约率: <text class="stat-value">{{ formatPercent(getTkInviteRate()) }}%</text></view> | ||
| 329 | + <view class="stat-mini">到店率: <text class="stat-value">{{ formatPercent(getInviteStoreRate()) }}%</text></view> | ||
| 337 | </view> | 330 | </view> |
| 338 | </view> | 331 | </view> |
| 339 | 332 | ||
| @@ -504,33 +497,6 @@ export default { | @@ -504,33 +497,6 @@ export default { | ||
| 504 | GoldTriangleName: item.F_GoldTriangleName || item.GoldTriangleName || '未知', | 497 | GoldTriangleName: item.F_GoldTriangleName || item.GoldTriangleName || '未知', |
| 505 | TotalPerformance: item.F_TotalPerformance || item.TotalPerformance || 0 | 498 | TotalPerformance: item.F_TotalPerformance || item.TotalPerformance || 0 |
| 506 | })) | 499 | })) |
| 507 | - }, | ||
| 508 | - // 转化漏斗数据 | ||
| 509 | - funnelData() { | ||
| 510 | - if (!this.tkStatisticsData) return [] | ||
| 511 | - const tk = this.tkStatisticsData | ||
| 512 | - return [ | ||
| 513 | - { | ||
| 514 | - label: '拓客人数', | ||
| 515 | - value: tk.TkCount || 0, | ||
| 516 | - rate: null | ||
| 517 | - }, | ||
| 518 | - { | ||
| 519 | - label: '邀约人数', | ||
| 520 | - value: tk.InviteCount || 0, | ||
| 521 | - rate: tk.TkCount > 0 ? this.formatPercent((tk.InviteCount || 0) / tk.TkCount * 100) : 0 | ||
| 522 | - }, | ||
| 523 | - { | ||
| 524 | - label: '到店人数', | ||
| 525 | - value: tk.StoreCount || 0, | ||
| 526 | - rate: tk.InviteCount > 0 ? this.formatPercent((tk.StoreCount || 0) / tk.InviteCount * 100) : 0 | ||
| 527 | - }, | ||
| 528 | - { | ||
| 529 | - label: '成交人数', | ||
| 530 | - value: tk.DealCount || 0, | ||
| 531 | - rate: tk.StoreCount > 0 ? this.formatPercent((tk.DealCount || 0) / tk.StoreCount * 100) : 0 | ||
| 532 | - } | ||
| 533 | - ] | ||
| 534 | } | 500 | } |
| 535 | }, | 501 | }, |
| 536 | onLoad() { | 502 | onLoad() { |
| @@ -713,6 +679,10 @@ export default { | @@ -713,6 +679,10 @@ export default { | ||
| 713 | 679 | ||
| 714 | if (res.code === 200 && res.data) { | 680 | if (res.code === 200 && res.data) { |
| 715 | this.tkStatisticsData = res.data | 681 | this.tkStatisticsData = res.data |
| 682 | + // 绘制漏斗图 | ||
| 683 | + this.$nextTick(() => { | ||
| 684 | + this.drawFunnelChart() | ||
| 685 | + }) | ||
| 716 | } | 686 | } |
| 717 | } catch (error) { | 687 | } catch (error) { |
| 718 | console.error('加载拓客漏斗数据失败:', error) | 688 | console.error('加载拓客漏斗数据失败:', error) |
| @@ -1003,6 +973,16 @@ export default { | @@ -1003,6 +973,16 @@ export default { | ||
| 1003 | formatPercent(percent) { | 973 | formatPercent(percent) { |
| 1004 | return Math.round(percent * 100) / 100 | 974 | return Math.round(percent * 100) / 100 |
| 1005 | }, | 975 | }, |
| 976 | + // 获取邀约率 | ||
| 977 | + getTkInviteRate() { | ||
| 978 | + if (!this.tkStatisticsData || !this.tkStatisticsData.TkCount) return 0 | ||
| 979 | + return (this.tkStatisticsData.YaoyCount || 0) / this.tkStatisticsData.TkCount * 100 | ||
| 980 | + }, | ||
| 981 | + // 获取到店率 | ||
| 982 | + getInviteStoreRate() { | ||
| 983 | + if (!this.tkStatisticsData || !this.tkStatisticsData.YaoyCount) return 0 | ||
| 984 | + return (this.tkStatisticsData.DdCount || 0) / this.tkStatisticsData.YaoyCount * 100 | ||
| 985 | + }, | ||
| 1006 | // 格式化日期时间 | 986 | // 格式化日期时间 |
| 1007 | formatDateTime(date) { | 987 | formatDateTime(date) { |
| 1008 | const year = date.getFullYear() | 988 | const year = date.getFullYear() |
| @@ -1434,6 +1414,82 @@ export default { | @@ -1434,6 +1414,82 @@ export default { | ||
| 1434 | getMemberTypeColor(index) { | 1414 | getMemberTypeColor(index) { |
| 1435 | const colors = ['#F56C6C', '#67C23A', '#409EFF', '#E6A23C'] | 1415 | const colors = ['#F56C6C', '#67C23A', '#409EFF', '#E6A23C'] |
| 1436 | return colors[index % colors.length] | 1416 | return colors[index % colors.length] |
| 1417 | + }, | ||
| 1418 | + // 绘制漏斗图 | ||
| 1419 | + drawFunnelChart() { | ||
| 1420 | + if (!this.tkStatisticsData) return | ||
| 1421 | + | ||
| 1422 | + const ctx = uni.createCanvasContext('funnelChart', this) | ||
| 1423 | + const systemInfo = uni.getSystemInfoSync() | ||
| 1424 | + const width = systemInfo.windowWidth - 60 | ||
| 1425 | + const height = this.chartHeight | ||
| 1426 | + | ||
| 1427 | + // 清空画布 | ||
| 1428 | + ctx.clearRect(0, 0, width, height) | ||
| 1429 | + | ||
| 1430 | + const d = this.tkStatisticsData | ||
| 1431 | + const funnelData = [ | ||
| 1432 | + { value: d.TkCount || 0, name: '获客', color: '#409EFF' }, | ||
| 1433 | + { value: d.YaoyCount || 0, name: '邀约', color: '#67C23A' }, | ||
| 1434 | + { value: d.DdCount || 0, name: '到店', color: '#E6A23C' }, | ||
| 1435 | + { value: d.XfCount || 0, name: '成交', color: '#F56C6C' } | ||
| 1436 | + ] | ||
| 1437 | + | ||
| 1438 | + // 计算最大值（用于归一化） | ||
| 1439 | + const maxValue = Math.max(...funnelData.map(item => item.value), 1) | ||
| 1440 | + | ||
| 1441 | + // 漏斗图参数 | ||
| 1442 | + const topWidth = width * 0.8 // 顶部宽度 | ||
| 1443 | + const bottomWidth = width * 0.2 // 底部宽度 | ||
| 1444 | + const stepHeight = (height - 40) / funnelData.length // 每层高度（留出上下边距） | ||
| 1445 | + const padding = { top: 20, bottom: 20, left: width * 0.1, right: width * 0.1 } | ||
| 1446 | + | ||
| 1447 | + // 绘制每一层 | ||
| 1448 | + funnelData.forEach((item, index) => { | ||
| 1449 | + // 计算当前层的宽度（从上到下逐渐变窄） | ||
| 1450 | + const currentTopWidth = topWidth - (topWidth - bottomWidth) * (index / (funnelData.length - 1)) | ||
| 1451 | + const currentBottomWidth = topWidth - (topWidth - bottomWidth) * ((index + 1) / (funnelData.length - 1)) | ||
| 1452 | + | ||
| 1453 | + // 计算当前层的Y位置 | ||
| 1454 | + const y = padding.top + index * stepHeight | ||
| 1455 | + const nextY = padding.top + (index + 1) * stepHeight | ||
| 1456 | + | ||
| 1457 | + // 计算中心X位置 | ||
| 1458 | + const centerX = width / 2 | ||
| 1459 | + const topLeftX = centerX - currentTopWidth / 2 | ||
| 1460 | + const topRightX = centerX + currentTopWidth / 2 | ||
| 1461 | + const bottomLeftX = centerX - currentBottomWidth / 2 | ||
| 1462 | + const bottomRightX = centerX + currentBottomWidth / 2 | ||
| 1463 | + | ||
| 1464 | + // 绘制梯形（漏斗的一层） | ||
| 1465 | + ctx.beginPath() | ||
| 1466 | + ctx.moveTo(topLeftX, y) | ||
| 1467 | + ctx.lineTo(topRightX, y) | ||
| 1468 | + ctx.lineTo(bottomRightX, nextY) | ||
| 1469 | + ctx.lineTo(bottomLeftX, nextY) | ||
| 1470 | + ctx.closePath() | ||
| 1471 | + | ||
| 1472 | + // 填充颜色 | ||
| 1473 | + ctx.setFillStyle(item.color) | ||
| 1474 | + ctx.fill() | ||
| 1475 | + | ||
| 1476 | + // 绘制边框 | ||
| 1477 | + ctx.setStrokeStyle('rgba(255, 255, 255, 0.3)') | ||
| 1478 | + ctx.setLineWidth(2) | ||
| 1479 | + ctx.stroke() | ||
| 1480 | + | ||
| 1481 | + // 绘制文字标签 | ||
| 1482 | + ctx.setFillStyle('#fff') | ||
| 1483 | + ctx.setFontSize(24) | ||
| 1484 | + ctx.setTextAlign('center') | ||
| 1485 | + const labelY = y + stepHeight / 2 + 8 | ||
| 1486 | + ctx.fillText(item.name, centerX, labelY - 8) | ||
| 1487 | + ctx.setFontSize(28) | ||
| 1488 | + ctx.setFillStyle('#fff') | ||
| 1489 | + ctx.fillText((item.value || 0) + '人', centerX, labelY + 16) | ||
| 1490 | + }) | ||
| 1491 | + | ||
| 1492 | + ctx.draw() | ||
| 1437 | } | 1493 | } |
| 1438 | } | 1494 | } |
| 1439 | } | 1495 | } |
| @@ -1834,44 +1890,34 @@ export default { | @@ -1834,44 +1890,34 @@ export default { | ||
| 1834 | } | 1890 | } |
| 1835 | 1891 | ||
| 1836 | /* 转化漏斗 */ | 1892 | /* 转化漏斗 */ |
| 1837 | -.funnel-box { | ||
| 1838 | - padding: 20rpx 0; | ||
| 1839 | -} | ||
| 1840 | - | ||
| 1841 | -.funnel-step { | ||
| 1842 | - display: flex; | ||
| 1843 | - flex-direction: column; | ||
| 1844 | - align-items: center; | ||
| 1845 | - margin-bottom: 10rpx; | 1893 | +.funnel-section { |
| 1894 | + .chart-wrapper { | ||
| 1895 | + width: 100%; | ||
| 1896 | + height: 280px; | ||
| 1897 | + margin-bottom: 20rpx; | ||
| 1898 | + } | ||
| 1846 | 1899 | ||
| 1847 | - .step-shape { | ||
| 1848 | - background: linear-gradient(90deg, #66bb6a 0%, #43a047 100%); | ||
| 1849 | - border-radius: 8rpx; | ||
| 1850 | - padding: 16rpx; | ||
| 1851 | - box-shadow: 0 4rpx 12rpx rgba(67, 160, 71, 0.2); | ||
| 1852 | - display: flex; | ||
| 1853 | - justify-content: center; | ||
| 1854 | - | ||
| 1855 | - .step-content { | ||
| 1856 | - display: flex; | ||
| 1857 | - align-items: center; | ||
| 1858 | - justify-content: space-between; | ||
| 1859 | - width: 100%; | ||
| 1860 | - padding: 0 20rpx; | ||
| 1861 | - | ||
| 1862 | - .step-label { color: #fff; font-size: 26rpx; font-weight: 500; } | ||
| 1863 | - .step-value { color: #fff; font-size: 32rpx; font-weight: bold; } | ||
| 1864 | - } | 1900 | + .funnel-chart-canvas { |
| 1901 | + width: 100%; | ||
| 1902 | + height: 100%; | ||
| 1865 | } | 1903 | } |
| 1866 | 1904 | ||
| 1867 | - .step-arrow { | 1905 | + .funnel-stats { |
| 1868 | display: flex; | 1906 | display: flex; |
| 1869 | - flex-direction: column; | ||
| 1870 | - align-items: center; | ||
| 1871 | - padding: 8rpx 0; | ||
| 1872 | - height: 60rpx; | 1907 | + justify-content: space-around; |
| 1908 | + padding: 20rpx 0; | ||
| 1909 | + border-top: 1px solid rgba(0, 0, 0, 0.05); | ||
| 1873 | 1910 | ||
| 1874 | - .rate-text { font-size: 20rpx; color: #666; margin-top: 4rpx; } | 1911 | + .stat-mini { |
| 1912 | + font-size: 24rpx; | ||
| 1913 | + color: #666; | ||
| 1914 | + | ||
| 1915 | + .stat-value { | ||
| 1916 | + color: #43a047; | ||
| 1917 | + font-weight: 600; | ||
| 1918 | + margin-left: 8rpx; | ||
| 1919 | + } | ||
| 1920 | + } | ||
| 1875 | } | 1921 | } |
| 1876 | } | 1922 | } |
| 1877 | 1923 |
绿纤uni-app/pages/home/home.vue
| @@ -913,7 +913,7 @@ export default { | @@ -913,7 +913,7 @@ export default { | ||
| 913 | 913 | ||
| 914 | /* 主题色背景 - 渐变立体效果 */ | 914 | /* 主题色背景 - 渐变立体效果 */ |
| 915 | &.icon-circle-bg-1 { | 915 | &.icon-circle-bg-1 { |
| 916 | - background: linear-gradient(135deg, #E3F2FD 0%, #2196F3 100%); | 916 | + background: linear-gradient(135deg, #1E88E5 0%, #42a5f5 50%, #1565C0 100%); |
| 917 | box-shadow: | 917 | box-shadow: |
| 918 | 0 6rpx 20rpx rgba(30, 136, 229, 0.35), | 918 | 0 6rpx 20rpx rgba(30, 136, 229, 0.35), |
| 919 | 0 2rpx 8rpx rgba(30, 136, 229, 0.25), | 919 | 0 2rpx 8rpx rgba(30, 136, 229, 0.25), |
| @@ -922,7 +922,7 @@ export default { | @@ -922,7 +922,7 @@ export default { | ||
| 922 | } | 922 | } |
| 923 | 923 | ||
| 924 | &.icon-circle-bg-2 { | 924 | &.icon-circle-bg-2 { |
| 925 | - background: linear-gradient(135deg, #E8F5E9 0%, #4CAF50 100%); | 925 | + background: linear-gradient(135deg, #43A047 0%, #66bb6a 50%, #388E3C 100%); |
| 926 | box-shadow: | 926 | box-shadow: |
| 927 | 0 6rpx 20rpx rgba(67, 160, 71, 0.35), | 927 | 0 6rpx 20rpx rgba(67, 160, 71, 0.35), |
| 928 | 0 2rpx 8rpx rgba(67, 160, 71, 0.25), | 928 | 0 2rpx 8rpx rgba(67, 160, 71, 0.25), |
| @@ -931,7 +931,7 @@ export default { | @@ -931,7 +931,7 @@ export default { | ||
| 931 | } | 931 | } |
| 932 | 932 | ||
| 933 | &.icon-circle-bg-3 { | 933 | &.icon-circle-bg-3 { |
| 934 | - background: linear-gradient(135deg, #FFEBEE 0%, #F44336 100%); | 934 | + background: linear-gradient(135deg, #D32F2F 0%, #ef5350 50%, #c62828 100%); |
| 935 | box-shadow: | 935 | box-shadow: |
| 936 | 0 6rpx 20rpx rgba(211, 47, 47, 0.35), | 936 | 0 6rpx 20rpx rgba(211, 47, 47, 0.35), |
| 937 | 0 2rpx 8rpx rgba(211, 47, 47, 0.25), | 937 | 0 2rpx 8rpx rgba(211, 47, 47, 0.25), |
| @@ -940,7 +940,7 @@ export default { | @@ -940,7 +940,7 @@ export default { | ||
| 940 | } | 940 | } |
| 941 | 941 | ||
| 942 | &.icon-circle-bg-4 { | 942 | &.icon-circle-bg-4 { |
| 943 | - background: linear-gradient(135deg, #E0F7FA 0%, #00BCD4 100%); | 943 | + background: linear-gradient(135deg, #00838F 0%, #26a69a 50%, #00695C 100%); |
| 944 | box-shadow: | 944 | box-shadow: |
| 945 | 0 6rpx 20rpx rgba(0, 131, 143, 0.35), | 945 | 0 6rpx 20rpx rgba(0, 131, 143, 0.35), |
| 946 | 0 2rpx 8rpx rgba(0, 131, 143, 0.25), | 946 | 0 2rpx 8rpx rgba(0, 131, 143, 0.25), |
| @@ -949,7 +949,7 @@ export default { | @@ -949,7 +949,7 @@ export default { | ||
| 949 | } | 949 | } |
| 950 | 950 | ||
| 951 | &.icon-circle-bg-5 { | 951 | &.icon-circle-bg-5 { |
| 952 | - background: linear-gradient(135deg, #FFF3E0 0%, #FF9800 100%); | 952 | + background: linear-gradient(135deg, #F57C00 0%, #ffb74d 50%, #ef6c00 100%); |
| 953 | box-shadow: | 953 | box-shadow: |
| 954 | 0 6rpx 20rpx rgba(245, 124, 0, 0.35), | 954 | 0 6rpx 20rpx rgba(245, 124, 0, 0.35), |
| 955 | 0 2rpx 8rpx rgba(245, 124, 0, 0.25), | 955 | 0 2rpx 8rpx rgba(245, 124, 0, 0.25), |
| @@ -958,7 +958,7 @@ export default { | @@ -958,7 +958,7 @@ export default { | ||
| 958 | } | 958 | } |
| 959 | 959 | ||
| 960 | &.icon-circle-bg-6 { | 960 | &.icon-circle-bg-6 { |
| 961 | - background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); | 961 | + background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); |
| 962 | box-shadow: | 962 | box-shadow: |
| 963 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), | 963 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), |
| 964 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), | 964 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), |
| @@ -967,7 +967,7 @@ export default { | @@ -967,7 +967,7 @@ export default { | ||
| 967 | } | 967 | } |
| 968 | 968 | ||
| 969 | &.icon-circle-bg-7 { | 969 | &.icon-circle-bg-7 { |
| 970 | - background: linear-gradient(135deg, #FCE4EC 0%, #E91E63 100%); | 970 | + background: linear-gradient(135deg, #C2185B 0%, #e91e63 50%, #ad1457 100%); |
| 971 | box-shadow: | 971 | box-shadow: |
| 972 | 0 6rpx 20rpx rgba(194, 24, 91, 0.35), | 972 | 0 6rpx 20rpx rgba(194, 24, 91, 0.35), |
| 973 | 0 2rpx 8rpx rgba(194, 24, 91, 0.25), | 973 | 0 2rpx 8rpx rgba(194, 24, 91, 0.25), |
| @@ -976,7 +976,7 @@ export default { | @@ -976,7 +976,7 @@ export default { | ||
| 976 | } | 976 | } |
| 977 | 977 | ||
| 978 | &.icon-circle-bg-8 { | 978 | &.icon-circle-bg-8 { |
| 979 | - background: linear-gradient(135deg, #FFFDE7 0%, #FFC107 100%); | 979 | + background: linear-gradient(135deg, #F9A825 0%, #ffb74d 50%, #f57f17 100%); |
| 980 | box-shadow: | 980 | box-shadow: |
| 981 | 0 6rpx 20rpx rgba(249, 168, 37, 0.35), | 981 | 0 6rpx 20rpx rgba(249, 168, 37, 0.35), |
| 982 | 0 2rpx 8rpx rgba(249, 168, 37, 0.25), | 982 | 0 2rpx 8rpx rgba(249, 168, 37, 0.25), |
| @@ -985,7 +985,7 @@ export default { | @@ -985,7 +985,7 @@ export default { | ||
| 985 | } | 985 | } |
| 986 | 986 | ||
| 987 | &.icon-circle-bg-9 { | 987 | &.icon-circle-bg-9 { |
| 988 | - background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); | 988 | + background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); |
| 989 | box-shadow: | 989 | box-shadow: |
| 990 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), | 990 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), |
| 991 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), | 991 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), |
| @@ -994,7 +994,7 @@ export default { | @@ -994,7 +994,7 @@ export default { | ||
| 994 | } | 994 | } |
| 995 | 995 | ||
| 996 | &.icon-circle-bg-10 { | 996 | &.icon-circle-bg-10 { |
| 997 | - background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); | 997 | + background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); |
| 998 | box-shadow: | 998 | box-shadow: |
| 999 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), | 999 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), |
| 1000 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), | 1000 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), |
| @@ -1003,7 +1003,7 @@ export default { | @@ -1003,7 +1003,7 @@ export default { | ||
| 1003 | } | 1003 | } |
| 1004 | 1004 | ||
| 1005 | &.icon-circle-bg-11 { | 1005 | &.icon-circle-bg-11 { |
| 1006 | - background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); | 1006 | + background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); |
| 1007 | box-shadow: | 1007 | box-shadow: |
| 1008 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), | 1008 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), |
| 1009 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), | 1009 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), |
| @@ -1012,7 +1012,7 @@ export default { | @@ -1012,7 +1012,7 @@ export default { | ||
| 1012 | } | 1012 | } |
| 1013 | 1013 | ||
| 1014 | &.icon-circle-bg-12 { | 1014 | &.icon-circle-bg-12 { |
| 1015 | - background: linear-gradient(135deg, #B2EBF2 0%, #0097A7 100%); | 1015 | + background: linear-gradient(135deg, #0097A7 0%, #26a69a 50%, #00838f 100%); |
| 1016 | box-shadow: | 1016 | box-shadow: |
| 1017 | 0 6rpx 20rpx rgba(0, 151, 167, 0.35), | 1017 | 0 6rpx 20rpx rgba(0, 151, 167, 0.35), |
| 1018 | 0 2rpx 8rpx rgba(0, 151, 167, 0.25), | 1018 | 0 2rpx 8rpx rgba(0, 151, 167, 0.25), |
| @@ -1021,7 +1021,7 @@ export default { | @@ -1021,7 +1021,7 @@ export default { | ||
| 1021 | } | 1021 | } |
| 1022 | 1022 | ||
| 1023 | &.icon-circle-bg-13 { | 1023 | &.icon-circle-bg-13 { |
| 1024 | - background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); | 1024 | + background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); |
| 1025 | box-shadow: | 1025 | box-shadow: |
| 1026 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), | 1026 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), |
| 1027 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), | 1027 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), |
| @@ -1030,7 +1030,7 @@ export default { | @@ -1030,7 +1030,7 @@ export default { | ||
| 1030 | } | 1030 | } |
| 1031 | 1031 | ||
| 1032 | &.icon-circle-bg-14 { | 1032 | &.icon-circle-bg-14 { |
| 1033 | - background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); | 1033 | + background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); |
| 1034 | box-shadow: | 1034 | box-shadow: |
| 1035 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), | 1035 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), |
| 1036 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), | 1036 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), |
| @@ -1039,7 +1039,7 @@ export default { | @@ -1039,7 +1039,7 @@ export default { | ||
| 1039 | } | 1039 | } |
| 1040 | 1040 | ||
| 1041 | &.icon-circle-bg-15 { | 1041 | &.icon-circle-bg-15 { |
| 1042 | - background: linear-gradient(135deg, #F8BBD0 0%, #C2185B 100%); | 1042 | + background: linear-gradient(135deg, #AD1457 0%, #e91e63 50%, #880e4f 100%); |
| 1043 | box-shadow: | 1043 | box-shadow: |
| 1044 | 0 6rpx 20rpx rgba(173, 20, 87, 0.35), | 1044 | 0 6rpx 20rpx rgba(173, 20, 87, 0.35), |
| 1045 | 0 2rpx 8rpx rgba(173, 20, 87, 0.25), | 1045 | 0 2rpx 8rpx rgba(173, 20, 87, 0.25), |
| @@ -1048,7 +1048,7 @@ export default { | @@ -1048,7 +1048,7 @@ export default { | ||
| 1048 | } | 1048 | } |
| 1049 | 1049 | ||
| 1050 | &.icon-circle-bg-16 { | 1050 | &.icon-circle-bg-16 { |
| 1051 | - background: linear-gradient(135deg, #FFF9C4 0%, #F9A825 100%); | 1051 | + background: linear-gradient(135deg, #FBC02D 0%, #ffeb3b 50%, #f9a825 100%); |
| 1052 | box-shadow: | 1052 | box-shadow: |
| 1053 | 0 6rpx 20rpx rgba(251, 192, 45, 0.35), | 1053 | 0 6rpx 20rpx rgba(251, 192, 45, 0.35), |
| 1054 | 0 2rpx 8rpx rgba(251, 192, 45, 0.25), | 1054 | 0 2rpx 8rpx rgba(251, 192, 45, 0.25), |
| @@ -1057,7 +1057,7 @@ export default { | @@ -1057,7 +1057,7 @@ export default { | ||
| 1057 | } | 1057 | } |
| 1058 | 1058 | ||
| 1059 | &.icon-circle-bg-17 { | 1059 | &.icon-circle-bg-17 { |
| 1060 | - background: linear-gradient(135deg, #EFEBE9 0%, #5D4037 100%); | 1060 | + background: linear-gradient(135deg, #5D4037 0%, #8d6e63 50%, #3e2723 100%); |
| 1061 | box-shadow: | 1061 | box-shadow: |
| 1062 | 0 6rpx 20rpx rgba(93, 64, 55, 0.35), | 1062 | 0 6rpx 20rpx rgba(93, 64, 55, 0.35), |
| 1063 | 0 2rpx 8rpx rgba(93, 64, 55, 0.25), | 1063 | 0 2rpx 8rpx rgba(93, 64, 55, 0.25), |
| @@ -1066,7 +1066,7 @@ export default { | @@ -1066,7 +1066,7 @@ export default { | ||
| 1066 | } | 1066 | } |
| 1067 | 1067 | ||
| 1068 | &.icon-circle-bg-18 { | 1068 | &.icon-circle-bg-18 { |
| 1069 | - background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); | 1069 | + background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #5a67d8 100%); |
| 1070 | box-shadow: | 1070 | box-shadow: |
| 1071 | 0 6rpx 20rpx rgba(102, 126, 234, 0.35), | 1071 | 0 6rpx 20rpx rgba(102, 126, 234, 0.35), |
| 1072 | 0 2rpx 8rpx rgba(102, 126, 234, 0.25), | 1072 | 0 2rpx 8rpx rgba(102, 126, 234, 0.25), |
| @@ -1259,7 +1259,7 @@ export default { | @@ -1259,7 +1259,7 @@ export default { | ||
| 1259 | 1259 | ||
| 1260 | /* 主题色 - 渐变立体效果 */ | 1260 | /* 主题色 - 渐变立体效果 */ |
| 1261 | &.icon-circle-bg-1 { | 1261 | &.icon-circle-bg-1 { |
| 1262 | - background: linear-gradient(135deg, #E3F2FD 0%, #2196F3 100%); | 1262 | + background: linear-gradient(135deg, #1E88E5 0%, #42a5f5 50%, #1565C0 100%); |
| 1263 | box-shadow: | 1263 | box-shadow: |
| 1264 | 0 6rpx 20rpx rgba(30, 136, 229, 0.35), | 1264 | 0 6rpx 20rpx rgba(30, 136, 229, 0.35), |
| 1265 | 0 2rpx 8rpx rgba(30, 136, 229, 0.25), | 1265 | 0 2rpx 8rpx rgba(30, 136, 229, 0.25), |
| @@ -1268,7 +1268,7 @@ export default { | @@ -1268,7 +1268,7 @@ export default { | ||
| 1268 | } | 1268 | } |
| 1269 | 1269 | ||
| 1270 | &.icon-circle-bg-2 { | 1270 | &.icon-circle-bg-2 { |
| 1271 | - background: linear-gradient(135deg, #E8F5E9 0%, #4CAF50 100%); | 1271 | + background: linear-gradient(135deg, #43A047 0%, #66bb6a 50%, #388E3C 100%); |
| 1272 | box-shadow: | 1272 | box-shadow: |
| 1273 | 0 6rpx 20rpx rgba(67, 160, 71, 0.35), | 1273 | 0 6rpx 20rpx rgba(67, 160, 71, 0.35), |
| 1274 | 0 2rpx 8rpx rgba(67, 160, 71, 0.25), | 1274 | 0 2rpx 8rpx rgba(67, 160, 71, 0.25), |
| @@ -1277,7 +1277,7 @@ export default { | @@ -1277,7 +1277,7 @@ export default { | ||
| 1277 | } | 1277 | } |
| 1278 | 1278 | ||
| 1279 | &.icon-circle-bg-3 { | 1279 | &.icon-circle-bg-3 { |
| 1280 | - background: linear-gradient(135deg, #FFEBEE 0%, #F44336 100%); | 1280 | + background: linear-gradient(135deg, #D32F2F 0%, #ef5350 50%, #c62828 100%); |
| 1281 | box-shadow: | 1281 | box-shadow: |
| 1282 | 0 6rpx 20rpx rgba(211, 47, 47, 0.35), | 1282 | 0 6rpx 20rpx rgba(211, 47, 47, 0.35), |
| 1283 | 0 2rpx 8rpx rgba(211, 47, 47, 0.25), | 1283 | 0 2rpx 8rpx rgba(211, 47, 47, 0.25), |
| @@ -1286,7 +1286,7 @@ export default { | @@ -1286,7 +1286,7 @@ export default { | ||
| 1286 | } | 1286 | } |
| 1287 | 1287 | ||
| 1288 | &.icon-circle-bg-4 { | 1288 | &.icon-circle-bg-4 { |
| 1289 | - background: linear-gradient(135deg, #E0F7FA 0%, #00BCD4 100%); | 1289 | + background: linear-gradient(135deg, #00838F 0%, #26a69a 50%, #00695C 100%); |
| 1290 | box-shadow: | 1290 | box-shadow: |
| 1291 | 0 6rpx 20rpx rgba(0, 131, 143, 0.35), | 1291 | 0 6rpx 20rpx rgba(0, 131, 143, 0.35), |
| 1292 | 0 2rpx 8rpx rgba(0, 131, 143, 0.25), | 1292 | 0 2rpx 8rpx rgba(0, 131, 143, 0.25), |
| @@ -1295,7 +1295,7 @@ export default { | @@ -1295,7 +1295,7 @@ export default { | ||
| 1295 | } | 1295 | } |
| 1296 | 1296 | ||
| 1297 | &.icon-circle-bg-5 { | 1297 | &.icon-circle-bg-5 { |
| 1298 | - background: linear-gradient(135deg, #FFF3E0 0%, #FF9800 100%); | 1298 | + background: linear-gradient(135deg, #F57C00 0%, #ffb74d 50%, #ef6c00 100%); |
| 1299 | box-shadow: | 1299 | box-shadow: |
| 1300 | 0 6rpx 20rpx rgba(245, 124, 0, 0.35), | 1300 | 0 6rpx 20rpx rgba(245, 124, 0, 0.35), |
| 1301 | 0 2rpx 8rpx rgba(245, 124, 0, 0.25), | 1301 | 0 2rpx 8rpx rgba(245, 124, 0, 0.25), |
| @@ -1304,7 +1304,7 @@ export default { | @@ -1304,7 +1304,7 @@ export default { | ||
| 1304 | } | 1304 | } |
| 1305 | 1305 | ||
| 1306 | &.icon-circle-bg-6 { | 1306 | &.icon-circle-bg-6 { |
| 1307 | - background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); | 1307 | + background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); |
| 1308 | box-shadow: | 1308 | box-shadow: |
| 1309 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), | 1309 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), |
| 1310 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), | 1310 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), |
| @@ -1313,7 +1313,7 @@ export default { | @@ -1313,7 +1313,7 @@ export default { | ||
| 1313 | } | 1313 | } |
| 1314 | 1314 | ||
| 1315 | &.icon-circle-bg-7 { | 1315 | &.icon-circle-bg-7 { |
| 1316 | - background: linear-gradient(135deg, #FCE4EC 0%, #E91E63 100%); | 1316 | + background: linear-gradient(135deg, #C2185B 0%, #e91e63 50%, #ad1457 100%); |
| 1317 | box-shadow: | 1317 | box-shadow: |
| 1318 | 0 6rpx 20rpx rgba(194, 24, 91, 0.35), | 1318 | 0 6rpx 20rpx rgba(194, 24, 91, 0.35), |
| 1319 | 0 2rpx 8rpx rgba(194, 24, 91, 0.25), | 1319 | 0 2rpx 8rpx rgba(194, 24, 91, 0.25), |
| @@ -1322,7 +1322,7 @@ export default { | @@ -1322,7 +1322,7 @@ export default { | ||
| 1322 | } | 1322 | } |
| 1323 | 1323 | ||
| 1324 | &.icon-circle-bg-8 { | 1324 | &.icon-circle-bg-8 { |
| 1325 | - background: linear-gradient(135deg, #FFFDE7 0%, #FFC107 100%); | 1325 | + background: linear-gradient(135deg, #F9A825 0%, #ffb74d 50%, #f57f17 100%); |
| 1326 | box-shadow: | 1326 | box-shadow: |
| 1327 | 0 6rpx 20rpx rgba(249, 168, 37, 0.35), | 1327 | 0 6rpx 20rpx rgba(249, 168, 37, 0.35), |
| 1328 | 0 2rpx 8rpx rgba(249, 168, 37, 0.25), | 1328 | 0 2rpx 8rpx rgba(249, 168, 37, 0.25), |
| @@ -1331,7 +1331,7 @@ export default { | @@ -1331,7 +1331,7 @@ export default { | ||
| 1331 | } | 1331 | } |
| 1332 | 1332 | ||
| 1333 | &.icon-circle-bg-9 { | 1333 | &.icon-circle-bg-9 { |
| 1334 | - background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); | 1334 | + background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); |
| 1335 | box-shadow: | 1335 | box-shadow: |
| 1336 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), | 1336 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), |
| 1337 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), | 1337 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), |
| @@ -1340,7 +1340,7 @@ export default { | @@ -1340,7 +1340,7 @@ export default { | ||
| 1340 | } | 1340 | } |
| 1341 | 1341 | ||
| 1342 | &.icon-circle-bg-10 { | 1342 | &.icon-circle-bg-10 { |
| 1343 | - background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); | 1343 | + background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); |
| 1344 | box-shadow: | 1344 | box-shadow: |
| 1345 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), | 1345 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), |
| 1346 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), | 1346 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), |
| @@ -1349,7 +1349,7 @@ export default { | @@ -1349,7 +1349,7 @@ export default { | ||
| 1349 | } | 1349 | } |
| 1350 | 1350 | ||
| 1351 | &.icon-circle-bg-11 { | 1351 | &.icon-circle-bg-11 { |
| 1352 | - background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); | 1352 | + background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); |
| 1353 | box-shadow: | 1353 | box-shadow: |
| 1354 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), | 1354 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), |
| 1355 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), | 1355 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), |
| @@ -1358,7 +1358,7 @@ export default { | @@ -1358,7 +1358,7 @@ export default { | ||
| 1358 | } | 1358 | } |
| 1359 | 1359 | ||
| 1360 | &.icon-circle-bg-12 { | 1360 | &.icon-circle-bg-12 { |
| 1361 | - background: linear-gradient(135deg, #B2EBF2 0%, #0097A7 100%); | 1361 | + background: linear-gradient(135deg, #0097A7 0%, #26a69a 50%, #00838f 100%); |
| 1362 | box-shadow: | 1362 | box-shadow: |
| 1363 | 0 6rpx 20rpx rgba(0, 151, 167, 0.35), | 1363 | 0 6rpx 20rpx rgba(0, 151, 167, 0.35), |
| 1364 | 0 2rpx 8rpx rgba(0, 151, 167, 0.25), | 1364 | 0 2rpx 8rpx rgba(0, 151, 167, 0.25), |
| @@ -1367,7 +1367,7 @@ export default { | @@ -1367,7 +1367,7 @@ export default { | ||
| 1367 | } | 1367 | } |
| 1368 | 1368 | ||
| 1369 | &.icon-circle-bg-13 { | 1369 | &.icon-circle-bg-13 { |
| 1370 | - background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); | 1370 | + background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); |
| 1371 | box-shadow: | 1371 | box-shadow: |
| 1372 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), | 1372 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), |
| 1373 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), | 1373 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), |
| @@ -1376,7 +1376,7 @@ export default { | @@ -1376,7 +1376,7 @@ export default { | ||
| 1376 | } | 1376 | } |
| 1377 | 1377 | ||
| 1378 | &.icon-circle-bg-14 { | 1378 | &.icon-circle-bg-14 { |
| 1379 | - background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); | 1379 | + background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); |
| 1380 | box-shadow: | 1380 | box-shadow: |
| 1381 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), | 1381 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), |
| 1382 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), | 1382 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), |
| @@ -1385,7 +1385,7 @@ export default { | @@ -1385,7 +1385,7 @@ export default { | ||
| 1385 | } | 1385 | } |
| 1386 | 1386 | ||
| 1387 | &.icon-circle-bg-15 { | 1387 | &.icon-circle-bg-15 { |
| 1388 | - background: linear-gradient(135deg, #F8BBD0 0%, #C2185B 100%); | 1388 | + background: linear-gradient(135deg, #AD1457 0%, #e91e63 50%, #880e4f 100%); |
| 1389 | box-shadow: | 1389 | box-shadow: |
| 1390 | 0 6rpx 20rpx rgba(173, 20, 87, 0.35), | 1390 | 0 6rpx 20rpx rgba(173, 20, 87, 0.35), |
| 1391 | 0 2rpx 8rpx rgba(173, 20, 87, 0.25), | 1391 | 0 2rpx 8rpx rgba(173, 20, 87, 0.25), |
| @@ -1394,7 +1394,7 @@ export default { | @@ -1394,7 +1394,7 @@ export default { | ||
| 1394 | } | 1394 | } |
| 1395 | 1395 | ||
| 1396 | &.icon-circle-bg-16 { | 1396 | &.icon-circle-bg-16 { |
| 1397 | - background: linear-gradient(135deg, #FFF9C4 0%, #F9A825 100%); | 1397 | + background: linear-gradient(135deg, #FBC02D 0%, #ffeb3b 50%, #f9a825 100%); |
| 1398 | box-shadow: | 1398 | box-shadow: |
| 1399 | 0 6rpx 20rpx rgba(251, 192, 45, 0.35), | 1399 | 0 6rpx 20rpx rgba(251, 192, 45, 0.35), |
| 1400 | 0 2rpx 8rpx rgba(251, 192, 45, 0.25), | 1400 | 0 2rpx 8rpx rgba(251, 192, 45, 0.25), |
| @@ -1403,7 +1403,7 @@ export default { | @@ -1403,7 +1403,7 @@ export default { | ||
| 1403 | } | 1403 | } |
| 1404 | 1404 | ||
| 1405 | &.icon-circle-bg-17 { | 1405 | &.icon-circle-bg-17 { |
| 1406 | - background: linear-gradient(135deg, #EFEBE9 0%, #5D4037 100%); | 1406 | + background: linear-gradient(135deg, #5D4037 0%, #8d6e63 50%, #3e2723 100%); |
| 1407 | box-shadow: | 1407 | box-shadow: |
| 1408 | 0 6rpx 20rpx rgba(93, 64, 55, 0.35), | 1408 | 0 6rpx 20rpx rgba(93, 64, 55, 0.35), |
| 1409 | 0 2rpx 8rpx rgba(93, 64, 55, 0.25), | 1409 | 0 2rpx 8rpx rgba(93, 64, 55, 0.25), |
| @@ -1502,7 +1502,7 @@ export default { | @@ -1502,7 +1502,7 @@ export default { | ||
| 1502 | 1502 | ||
| 1503 | /* 主题色背景 - 渐变立体效果 */ | 1503 | /* 主题色背景 - 渐变立体效果 */ |
| 1504 | &.icon-circle-bg-6 { | 1504 | &.icon-circle-bg-6 { |
| 1505 | - background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); | 1505 | + background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); |
| 1506 | box-shadow: | 1506 | box-shadow: |
| 1507 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), | 1507 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), |
| 1508 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), | 1508 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), |
| @@ -1511,7 +1511,7 @@ export default { | @@ -1511,7 +1511,7 @@ export default { | ||
| 1511 | } | 1511 | } |
| 1512 | 1512 | ||
| 1513 | &.icon-circle-bg-9 { | 1513 | &.icon-circle-bg-9 { |
| 1514 | - background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); | 1514 | + background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); |
| 1515 | box-shadow: | 1515 | box-shadow: |
| 1516 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), | 1516 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), |
| 1517 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), | 1517 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), |
| @@ -1520,7 +1520,7 @@ export default { | @@ -1520,7 +1520,7 @@ export default { | ||
| 1520 | } | 1520 | } |
| 1521 | 1521 | ||
| 1522 | &.icon-circle-bg-10 { | 1522 | &.icon-circle-bg-10 { |
| 1523 | - background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); | 1523 | + background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); |
| 1524 | box-shadow: | 1524 | box-shadow: |
| 1525 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), | 1525 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), |
| 1526 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), | 1526 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), |
| @@ -1618,7 +1618,7 @@ export default { | @@ -1618,7 +1618,7 @@ export default { | ||
| 1618 | 1618 | ||
| 1619 | /* 主题色背景 - 渐变立体效果 */ | 1619 | /* 主题色背景 - 渐变立体效果 */ |
| 1620 | &.icon-circle-bg-11 { | 1620 | &.icon-circle-bg-11 { |
| 1621 | - background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); | 1621 | + background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); |
| 1622 | box-shadow: | 1622 | box-shadow: |
| 1623 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), | 1623 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), |
| 1624 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), | 1624 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), |
| @@ -1627,7 +1627,7 @@ export default { | @@ -1627,7 +1627,7 @@ export default { | ||
| 1627 | } | 1627 | } |
| 1628 | 1628 | ||
| 1629 | &.icon-circle-bg-13 { | 1629 | &.icon-circle-bg-13 { |
| 1630 | - background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); | 1630 | + background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); |
| 1631 | box-shadow: | 1631 | box-shadow: |
| 1632 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), | 1632 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), |
| 1633 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), | 1633 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), |
| @@ -1636,7 +1636,7 @@ export default { | @@ -1636,7 +1636,7 @@ export default { | ||
| 1636 | } | 1636 | } |
| 1637 | 1637 | ||
| 1638 | &.icon-circle-bg-14 { | 1638 | &.icon-circle-bg-14 { |
| 1639 | - background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); | 1639 | + background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); |
| 1640 | box-shadow: | 1640 | box-shadow: |
| 1641 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), | 1641 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), |
| 1642 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), | 1642 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), |
绿纤uni-app/pages/home/home1.vue renamed to 绿纤uni-app/pages/home/home2.vue
| @@ -913,7 +913,7 @@ export default { | @@ -913,7 +913,7 @@ export default { | ||
| 913 | 913 | ||
| 914 | /* 主题色背景 - 渐变立体效果 */ | 914 | /* 主题色背景 - 渐变立体效果 */ |
| 915 | &.icon-circle-bg-1 { | 915 | &.icon-circle-bg-1 { |
| 916 | - background: linear-gradient(135deg, #1E88E5 0%, #42a5f5 50%, #1565C0 100%); | 916 | + background: linear-gradient(135deg, #E3F2FD 0%, #2196F3 100%); |
| 917 | box-shadow: | 917 | box-shadow: |
| 918 | 0 6rpx 20rpx rgba(30, 136, 229, 0.35), | 918 | 0 6rpx 20rpx rgba(30, 136, 229, 0.35), |
| 919 | 0 2rpx 8rpx rgba(30, 136, 229, 0.25), | 919 | 0 2rpx 8rpx rgba(30, 136, 229, 0.25), |
| @@ -922,7 +922,7 @@ export default { | @@ -922,7 +922,7 @@ export default { | ||
| 922 | } | 922 | } |
| 923 | 923 | ||
| 924 | &.icon-circle-bg-2 { | 924 | &.icon-circle-bg-2 { |
| 925 | - background: linear-gradient(135deg, #43A047 0%, #66bb6a 50%, #388E3C 100%); | 925 | + background: linear-gradient(135deg, #E8F5E9 0%, #4CAF50 100%); |
| 926 | box-shadow: | 926 | box-shadow: |
| 927 | 0 6rpx 20rpx rgba(67, 160, 71, 0.35), | 927 | 0 6rpx 20rpx rgba(67, 160, 71, 0.35), |
| 928 | 0 2rpx 8rpx rgba(67, 160, 71, 0.25), | 928 | 0 2rpx 8rpx rgba(67, 160, 71, 0.25), |
| @@ -931,7 +931,7 @@ export default { | @@ -931,7 +931,7 @@ export default { | ||
| 931 | } | 931 | } |
| 932 | 932 | ||
| 933 | &.icon-circle-bg-3 { | 933 | &.icon-circle-bg-3 { |
| 934 | - background: linear-gradient(135deg, #D32F2F 0%, #ef5350 50%, #c62828 100%); | 934 | + background: linear-gradient(135deg, #FFEBEE 0%, #F44336 100%); |
| 935 | box-shadow: | 935 | box-shadow: |
| 936 | 0 6rpx 20rpx rgba(211, 47, 47, 0.35), | 936 | 0 6rpx 20rpx rgba(211, 47, 47, 0.35), |
| 937 | 0 2rpx 8rpx rgba(211, 47, 47, 0.25), | 937 | 0 2rpx 8rpx rgba(211, 47, 47, 0.25), |
| @@ -940,7 +940,7 @@ export default { | @@ -940,7 +940,7 @@ export default { | ||
| 940 | } | 940 | } |
| 941 | 941 | ||
| 942 | &.icon-circle-bg-4 { | 942 | &.icon-circle-bg-4 { |
| 943 | - background: linear-gradient(135deg, #00838F 0%, #26a69a 50%, #00695C 100%); | 943 | + background: linear-gradient(135deg, #E0F7FA 0%, #00BCD4 100%); |
| 944 | box-shadow: | 944 | box-shadow: |
| 945 | 0 6rpx 20rpx rgba(0, 131, 143, 0.35), | 945 | 0 6rpx 20rpx rgba(0, 131, 143, 0.35), |
| 946 | 0 2rpx 8rpx rgba(0, 131, 143, 0.25), | 946 | 0 2rpx 8rpx rgba(0, 131, 143, 0.25), |
| @@ -949,7 +949,7 @@ export default { | @@ -949,7 +949,7 @@ export default { | ||
| 949 | } | 949 | } |
| 950 | 950 | ||
| 951 | &.icon-circle-bg-5 { | 951 | &.icon-circle-bg-5 { |
| 952 | - background: linear-gradient(135deg, #F57C00 0%, #ffb74d 50%, #ef6c00 100%); | 952 | + background: linear-gradient(135deg, #FFF3E0 0%, #FF9800 100%); |
| 953 | box-shadow: | 953 | box-shadow: |
| 954 | 0 6rpx 20rpx rgba(245, 124, 0, 0.35), | 954 | 0 6rpx 20rpx rgba(245, 124, 0, 0.35), |
| 955 | 0 2rpx 8rpx rgba(245, 124, 0, 0.25), | 955 | 0 2rpx 8rpx rgba(245, 124, 0, 0.25), |
| @@ -958,7 +958,7 @@ export default { | @@ -958,7 +958,7 @@ export default { | ||
| 958 | } | 958 | } |
| 959 | 959 | ||
| 960 | &.icon-circle-bg-6 { | 960 | &.icon-circle-bg-6 { |
| 961 | - background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); | 961 | + background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); |
| 962 | box-shadow: | 962 | box-shadow: |
| 963 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), | 963 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), |
| 964 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), | 964 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), |
| @@ -967,7 +967,7 @@ export default { | @@ -967,7 +967,7 @@ export default { | ||
| 967 | } | 967 | } |
| 968 | 968 | ||
| 969 | &.icon-circle-bg-7 { | 969 | &.icon-circle-bg-7 { |
| 970 | - background: linear-gradient(135deg, #C2185B 0%, #e91e63 50%, #ad1457 100%); | 970 | + background: linear-gradient(135deg, #FCE4EC 0%, #E91E63 100%); |
| 971 | box-shadow: | 971 | box-shadow: |
| 972 | 0 6rpx 20rpx rgba(194, 24, 91, 0.35), | 972 | 0 6rpx 20rpx rgba(194, 24, 91, 0.35), |
| 973 | 0 2rpx 8rpx rgba(194, 24, 91, 0.25), | 973 | 0 2rpx 8rpx rgba(194, 24, 91, 0.25), |
| @@ -976,7 +976,7 @@ export default { | @@ -976,7 +976,7 @@ export default { | ||
| 976 | } | 976 | } |
| 977 | 977 | ||
| 978 | &.icon-circle-bg-8 { | 978 | &.icon-circle-bg-8 { |
| 979 | - background: linear-gradient(135deg, #F9A825 0%, #ffb74d 50%, #f57f17 100%); | 979 | + background: linear-gradient(135deg, #FFFDE7 0%, #FFC107 100%); |
| 980 | box-shadow: | 980 | box-shadow: |
| 981 | 0 6rpx 20rpx rgba(249, 168, 37, 0.35), | 981 | 0 6rpx 20rpx rgba(249, 168, 37, 0.35), |
| 982 | 0 2rpx 8rpx rgba(249, 168, 37, 0.25), | 982 | 0 2rpx 8rpx rgba(249, 168, 37, 0.25), |
| @@ -985,7 +985,7 @@ export default { | @@ -985,7 +985,7 @@ export default { | ||
| 985 | } | 985 | } |
| 986 | 986 | ||
| 987 | &.icon-circle-bg-9 { | 987 | &.icon-circle-bg-9 { |
| 988 | - background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); | 988 | + background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); |
| 989 | box-shadow: | 989 | box-shadow: |
| 990 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), | 990 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), |
| 991 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), | 991 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), |
| @@ -994,7 +994,7 @@ export default { | @@ -994,7 +994,7 @@ export default { | ||
| 994 | } | 994 | } |
| 995 | 995 | ||
| 996 | &.icon-circle-bg-10 { | 996 | &.icon-circle-bg-10 { |
| 997 | - background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); | 997 | + background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); |
| 998 | box-shadow: | 998 | box-shadow: |
| 999 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), | 999 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), |
| 1000 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), | 1000 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), |
| @@ -1003,7 +1003,7 @@ export default { | @@ -1003,7 +1003,7 @@ export default { | ||
| 1003 | } | 1003 | } |
| 1004 | 1004 | ||
| 1005 | &.icon-circle-bg-11 { | 1005 | &.icon-circle-bg-11 { |
| 1006 | - background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); | 1006 | + background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); |
| 1007 | box-shadow: | 1007 | box-shadow: |
| 1008 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), | 1008 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), |
| 1009 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), | 1009 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), |
| @@ -1012,7 +1012,7 @@ export default { | @@ -1012,7 +1012,7 @@ export default { | ||
| 1012 | } | 1012 | } |
| 1013 | 1013 | ||
| 1014 | &.icon-circle-bg-12 { | 1014 | &.icon-circle-bg-12 { |
| 1015 | - background: linear-gradient(135deg, #0097A7 0%, #26a69a 50%, #00838f 100%); | 1015 | + background: linear-gradient(135deg, #B2EBF2 0%, #0097A7 100%); |
| 1016 | box-shadow: | 1016 | box-shadow: |
| 1017 | 0 6rpx 20rpx rgba(0, 151, 167, 0.35), | 1017 | 0 6rpx 20rpx rgba(0, 151, 167, 0.35), |
| 1018 | 0 2rpx 8rpx rgba(0, 151, 167, 0.25), | 1018 | 0 2rpx 8rpx rgba(0, 151, 167, 0.25), |
| @@ -1021,7 +1021,7 @@ export default { | @@ -1021,7 +1021,7 @@ export default { | ||
| 1021 | } | 1021 | } |
| 1022 | 1022 | ||
| 1023 | &.icon-circle-bg-13 { | 1023 | &.icon-circle-bg-13 { |
| 1024 | - background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); | 1024 | + background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); |
| 1025 | box-shadow: | 1025 | box-shadow: |
| 1026 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), | 1026 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), |
| 1027 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), | 1027 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), |
| @@ -1030,7 +1030,7 @@ export default { | @@ -1030,7 +1030,7 @@ export default { | ||
| 1030 | } | 1030 | } |
| 1031 | 1031 | ||
| 1032 | &.icon-circle-bg-14 { | 1032 | &.icon-circle-bg-14 { |
| 1033 | - background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); | 1033 | + background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); |
| 1034 | box-shadow: | 1034 | box-shadow: |
| 1035 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), | 1035 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), |
| 1036 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), | 1036 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), |
| @@ -1039,7 +1039,7 @@ export default { | @@ -1039,7 +1039,7 @@ export default { | ||
| 1039 | } | 1039 | } |
| 1040 | 1040 | ||
| 1041 | &.icon-circle-bg-15 { | 1041 | &.icon-circle-bg-15 { |
| 1042 | - background: linear-gradient(135deg, #AD1457 0%, #e91e63 50%, #880e4f 100%); | 1042 | + background: linear-gradient(135deg, #F8BBD0 0%, #C2185B 100%); |
| 1043 | box-shadow: | 1043 | box-shadow: |
| 1044 | 0 6rpx 20rpx rgba(173, 20, 87, 0.35), | 1044 | 0 6rpx 20rpx rgba(173, 20, 87, 0.35), |
| 1045 | 0 2rpx 8rpx rgba(173, 20, 87, 0.25), | 1045 | 0 2rpx 8rpx rgba(173, 20, 87, 0.25), |
| @@ -1048,7 +1048,7 @@ export default { | @@ -1048,7 +1048,7 @@ export default { | ||
| 1048 | } | 1048 | } |
| 1049 | 1049 | ||
| 1050 | &.icon-circle-bg-16 { | 1050 | &.icon-circle-bg-16 { |
| 1051 | - background: linear-gradient(135deg, #FBC02D 0%, #ffeb3b 50%, #f9a825 100%); | 1051 | + background: linear-gradient(135deg, #FFF9C4 0%, #F9A825 100%); |
| 1052 | box-shadow: | 1052 | box-shadow: |
| 1053 | 0 6rpx 20rpx rgba(251, 192, 45, 0.35), | 1053 | 0 6rpx 20rpx rgba(251, 192, 45, 0.35), |
| 1054 | 0 2rpx 8rpx rgba(251, 192, 45, 0.25), | 1054 | 0 2rpx 8rpx rgba(251, 192, 45, 0.25), |
| @@ -1057,7 +1057,7 @@ export default { | @@ -1057,7 +1057,7 @@ export default { | ||
| 1057 | } | 1057 | } |
| 1058 | 1058 | ||
| 1059 | &.icon-circle-bg-17 { | 1059 | &.icon-circle-bg-17 { |
| 1060 | - background: linear-gradient(135deg, #5D4037 0%, #8d6e63 50%, #3e2723 100%); | 1060 | + background: linear-gradient(135deg, #EFEBE9 0%, #5D4037 100%); |
| 1061 | box-shadow: | 1061 | box-shadow: |
| 1062 | 0 6rpx 20rpx rgba(93, 64, 55, 0.35), | 1062 | 0 6rpx 20rpx rgba(93, 64, 55, 0.35), |
| 1063 | 0 2rpx 8rpx rgba(93, 64, 55, 0.25), | 1063 | 0 2rpx 8rpx rgba(93, 64, 55, 0.25), |
| @@ -1066,7 +1066,7 @@ export default { | @@ -1066,7 +1066,7 @@ export default { | ||
| 1066 | } | 1066 | } |
| 1067 | 1067 | ||
| 1068 | &.icon-circle-bg-18 { | 1068 | &.icon-circle-bg-18 { |
| 1069 | - background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #5a67d8 100%); | 1069 | + background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); |
| 1070 | box-shadow: | 1070 | box-shadow: |
| 1071 | 0 6rpx 20rpx rgba(102, 126, 234, 0.35), | 1071 | 0 6rpx 20rpx rgba(102, 126, 234, 0.35), |
| 1072 | 0 2rpx 8rpx rgba(102, 126, 234, 0.25), | 1072 | 0 2rpx 8rpx rgba(102, 126, 234, 0.25), |
| @@ -1259,7 +1259,7 @@ export default { | @@ -1259,7 +1259,7 @@ export default { | ||
| 1259 | 1259 | ||
| 1260 | /* 主题色 - 渐变立体效果 */ | 1260 | /* 主题色 - 渐变立体效果 */ |
| 1261 | &.icon-circle-bg-1 { | 1261 | &.icon-circle-bg-1 { |
| 1262 | - background: linear-gradient(135deg, #1E88E5 0%, #42a5f5 50%, #1565C0 100%); | 1262 | + background: linear-gradient(135deg, #E3F2FD 0%, #2196F3 100%); |
| 1263 | box-shadow: | 1263 | box-shadow: |
| 1264 | 0 6rpx 20rpx rgba(30, 136, 229, 0.35), | 1264 | 0 6rpx 20rpx rgba(30, 136, 229, 0.35), |
| 1265 | 0 2rpx 8rpx rgba(30, 136, 229, 0.25), | 1265 | 0 2rpx 8rpx rgba(30, 136, 229, 0.25), |
| @@ -1268,7 +1268,7 @@ export default { | @@ -1268,7 +1268,7 @@ export default { | ||
| 1268 | } | 1268 | } |
| 1269 | 1269 | ||
| 1270 | &.icon-circle-bg-2 { | 1270 | &.icon-circle-bg-2 { |
| 1271 | - background: linear-gradient(135deg, #43A047 0%, #66bb6a 50%, #388E3C 100%); | 1271 | + background: linear-gradient(135deg, #E8F5E9 0%, #4CAF50 100%); |
| 1272 | box-shadow: | 1272 | box-shadow: |
| 1273 | 0 6rpx 20rpx rgba(67, 160, 71, 0.35), | 1273 | 0 6rpx 20rpx rgba(67, 160, 71, 0.35), |
| 1274 | 0 2rpx 8rpx rgba(67, 160, 71, 0.25), | 1274 | 0 2rpx 8rpx rgba(67, 160, 71, 0.25), |
| @@ -1277,7 +1277,7 @@ export default { | @@ -1277,7 +1277,7 @@ export default { | ||
| 1277 | } | 1277 | } |
| 1278 | 1278 | ||
| 1279 | &.icon-circle-bg-3 { | 1279 | &.icon-circle-bg-3 { |
| 1280 | - background: linear-gradient(135deg, #D32F2F 0%, #ef5350 50%, #c62828 100%); | 1280 | + background: linear-gradient(135deg, #FFEBEE 0%, #F44336 100%); |
| 1281 | box-shadow: | 1281 | box-shadow: |
| 1282 | 0 6rpx 20rpx rgba(211, 47, 47, 0.35), | 1282 | 0 6rpx 20rpx rgba(211, 47, 47, 0.35), |
| 1283 | 0 2rpx 8rpx rgba(211, 47, 47, 0.25), | 1283 | 0 2rpx 8rpx rgba(211, 47, 47, 0.25), |
| @@ -1286,7 +1286,7 @@ export default { | @@ -1286,7 +1286,7 @@ export default { | ||
| 1286 | } | 1286 | } |
| 1287 | 1287 | ||
| 1288 | &.icon-circle-bg-4 { | 1288 | &.icon-circle-bg-4 { |
| 1289 | - background: linear-gradient(135deg, #00838F 0%, #26a69a 50%, #00695C 100%); | 1289 | + background: linear-gradient(135deg, #E0F7FA 0%, #00BCD4 100%); |
| 1290 | box-shadow: | 1290 | box-shadow: |
| 1291 | 0 6rpx 20rpx rgba(0, 131, 143, 0.35), | 1291 | 0 6rpx 20rpx rgba(0, 131, 143, 0.35), |
| 1292 | 0 2rpx 8rpx rgba(0, 131, 143, 0.25), | 1292 | 0 2rpx 8rpx rgba(0, 131, 143, 0.25), |
| @@ -1295,7 +1295,7 @@ export default { | @@ -1295,7 +1295,7 @@ export default { | ||
| 1295 | } | 1295 | } |
| 1296 | 1296 | ||
| 1297 | &.icon-circle-bg-5 { | 1297 | &.icon-circle-bg-5 { |
| 1298 | - background: linear-gradient(135deg, #F57C00 0%, #ffb74d 50%, #ef6c00 100%); | 1298 | + background: linear-gradient(135deg, #FFF3E0 0%, #FF9800 100%); |
| 1299 | box-shadow: | 1299 | box-shadow: |
| 1300 | 0 6rpx 20rpx rgba(245, 124, 0, 0.35), | 1300 | 0 6rpx 20rpx rgba(245, 124, 0, 0.35), |
| 1301 | 0 2rpx 8rpx rgba(245, 124, 0, 0.25), | 1301 | 0 2rpx 8rpx rgba(245, 124, 0, 0.25), |
| @@ -1304,7 +1304,7 @@ export default { | @@ -1304,7 +1304,7 @@ export default { | ||
| 1304 | } | 1304 | } |
| 1305 | 1305 | ||
| 1306 | &.icon-circle-bg-6 { | 1306 | &.icon-circle-bg-6 { |
| 1307 | - background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); | 1307 | + background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); |
| 1308 | box-shadow: | 1308 | box-shadow: |
| 1309 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), | 1309 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), |
| 1310 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), | 1310 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), |
| @@ -1313,7 +1313,7 @@ export default { | @@ -1313,7 +1313,7 @@ export default { | ||
| 1313 | } | 1313 | } |
| 1314 | 1314 | ||
| 1315 | &.icon-circle-bg-7 { | 1315 | &.icon-circle-bg-7 { |
| 1316 | - background: linear-gradient(135deg, #C2185B 0%, #e91e63 50%, #ad1457 100%); | 1316 | + background: linear-gradient(135deg, #FCE4EC 0%, #E91E63 100%); |
| 1317 | box-shadow: | 1317 | box-shadow: |
| 1318 | 0 6rpx 20rpx rgba(194, 24, 91, 0.35), | 1318 | 0 6rpx 20rpx rgba(194, 24, 91, 0.35), |
| 1319 | 0 2rpx 8rpx rgba(194, 24, 91, 0.25), | 1319 | 0 2rpx 8rpx rgba(194, 24, 91, 0.25), |
| @@ -1322,7 +1322,7 @@ export default { | @@ -1322,7 +1322,7 @@ export default { | ||
| 1322 | } | 1322 | } |
| 1323 | 1323 | ||
| 1324 | &.icon-circle-bg-8 { | 1324 | &.icon-circle-bg-8 { |
| 1325 | - background: linear-gradient(135deg, #F9A825 0%, #ffb74d 50%, #f57f17 100%); | 1325 | + background: linear-gradient(135deg, #FFFDE7 0%, #FFC107 100%); |
| 1326 | box-shadow: | 1326 | box-shadow: |
| 1327 | 0 6rpx 20rpx rgba(249, 168, 37, 0.35), | 1327 | 0 6rpx 20rpx rgba(249, 168, 37, 0.35), |
| 1328 | 0 2rpx 8rpx rgba(249, 168, 37, 0.25), | 1328 | 0 2rpx 8rpx rgba(249, 168, 37, 0.25), |
| @@ -1331,7 +1331,7 @@ export default { | @@ -1331,7 +1331,7 @@ export default { | ||
| 1331 | } | 1331 | } |
| 1332 | 1332 | ||
| 1333 | &.icon-circle-bg-9 { | 1333 | &.icon-circle-bg-9 { |
| 1334 | - background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); | 1334 | + background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); |
| 1335 | box-shadow: | 1335 | box-shadow: |
| 1336 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), | 1336 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), |
| 1337 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), | 1337 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), |
| @@ -1340,7 +1340,7 @@ export default { | @@ -1340,7 +1340,7 @@ export default { | ||
| 1340 | } | 1340 | } |
| 1341 | 1341 | ||
| 1342 | &.icon-circle-bg-10 { | 1342 | &.icon-circle-bg-10 { |
| 1343 | - background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); | 1343 | + background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); |
| 1344 | box-shadow: | 1344 | box-shadow: |
| 1345 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), | 1345 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), |
| 1346 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), | 1346 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), |
| @@ -1349,7 +1349,7 @@ export default { | @@ -1349,7 +1349,7 @@ export default { | ||
| 1349 | } | 1349 | } |
| 1350 | 1350 | ||
| 1351 | &.icon-circle-bg-11 { | 1351 | &.icon-circle-bg-11 { |
| 1352 | - background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); | 1352 | + background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); |
| 1353 | box-shadow: | 1353 | box-shadow: |
| 1354 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), | 1354 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), |
| 1355 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), | 1355 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), |
| @@ -1358,7 +1358,7 @@ export default { | @@ -1358,7 +1358,7 @@ export default { | ||
| 1358 | } | 1358 | } |
| 1359 | 1359 | ||
| 1360 | &.icon-circle-bg-12 { | 1360 | &.icon-circle-bg-12 { |
| 1361 | - background: linear-gradient(135deg, #0097A7 0%, #26a69a 50%, #00838f 100%); | 1361 | + background: linear-gradient(135deg, #B2EBF2 0%, #0097A7 100%); |
| 1362 | box-shadow: | 1362 | box-shadow: |
| 1363 | 0 6rpx 20rpx rgba(0, 151, 167, 0.35), | 1363 | 0 6rpx 20rpx rgba(0, 151, 167, 0.35), |
| 1364 | 0 2rpx 8rpx rgba(0, 151, 167, 0.25), | 1364 | 0 2rpx 8rpx rgba(0, 151, 167, 0.25), |
| @@ -1367,7 +1367,7 @@ export default { | @@ -1367,7 +1367,7 @@ export default { | ||
| 1367 | } | 1367 | } |
| 1368 | 1368 | ||
| 1369 | &.icon-circle-bg-13 { | 1369 | &.icon-circle-bg-13 { |
| 1370 | - background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); | 1370 | + background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); |
| 1371 | box-shadow: | 1371 | box-shadow: |
| 1372 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), | 1372 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), |
| 1373 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), | 1373 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), |
| @@ -1376,7 +1376,7 @@ export default { | @@ -1376,7 +1376,7 @@ export default { | ||
| 1376 | } | 1376 | } |
| 1377 | 1377 | ||
| 1378 | &.icon-circle-bg-14 { | 1378 | &.icon-circle-bg-14 { |
| 1379 | - background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); | 1379 | + background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); |
| 1380 | box-shadow: | 1380 | box-shadow: |
| 1381 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), | 1381 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), |
| 1382 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), | 1382 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), |
| @@ -1385,7 +1385,7 @@ export default { | @@ -1385,7 +1385,7 @@ export default { | ||
| 1385 | } | 1385 | } |
| 1386 | 1386 | ||
| 1387 | &.icon-circle-bg-15 { | 1387 | &.icon-circle-bg-15 { |
| 1388 | - background: linear-gradient(135deg, #AD1457 0%, #e91e63 50%, #880e4f 100%); | 1388 | + background: linear-gradient(135deg, #F8BBD0 0%, #C2185B 100%); |
| 1389 | box-shadow: | 1389 | box-shadow: |
| 1390 | 0 6rpx 20rpx rgba(173, 20, 87, 0.35), | 1390 | 0 6rpx 20rpx rgba(173, 20, 87, 0.35), |
| 1391 | 0 2rpx 8rpx rgba(173, 20, 87, 0.25), | 1391 | 0 2rpx 8rpx rgba(173, 20, 87, 0.25), |
| @@ -1394,7 +1394,7 @@ export default { | @@ -1394,7 +1394,7 @@ export default { | ||
| 1394 | } | 1394 | } |
| 1395 | 1395 | ||
| 1396 | &.icon-circle-bg-16 { | 1396 | &.icon-circle-bg-16 { |
| 1397 | - background: linear-gradient(135deg, #FBC02D 0%, #ffeb3b 50%, #f9a825 100%); | 1397 | + background: linear-gradient(135deg, #FFF9C4 0%, #F9A825 100%); |
| 1398 | box-shadow: | 1398 | box-shadow: |
| 1399 | 0 6rpx 20rpx rgba(251, 192, 45, 0.35), | 1399 | 0 6rpx 20rpx rgba(251, 192, 45, 0.35), |
| 1400 | 0 2rpx 8rpx rgba(251, 192, 45, 0.25), | 1400 | 0 2rpx 8rpx rgba(251, 192, 45, 0.25), |
| @@ -1403,7 +1403,7 @@ export default { | @@ -1403,7 +1403,7 @@ export default { | ||
| 1403 | } | 1403 | } |
| 1404 | 1404 | ||
| 1405 | &.icon-circle-bg-17 { | 1405 | &.icon-circle-bg-17 { |
| 1406 | - background: linear-gradient(135deg, #5D4037 0%, #8d6e63 50%, #3e2723 100%); | 1406 | + background: linear-gradient(135deg, #EFEBE9 0%, #5D4037 100%); |
| 1407 | box-shadow: | 1407 | box-shadow: |
| 1408 | 0 6rpx 20rpx rgba(93, 64, 55, 0.35), | 1408 | 0 6rpx 20rpx rgba(93, 64, 55, 0.35), |
| 1409 | 0 2rpx 8rpx rgba(93, 64, 55, 0.25), | 1409 | 0 2rpx 8rpx rgba(93, 64, 55, 0.25), |
| @@ -1502,7 +1502,7 @@ export default { | @@ -1502,7 +1502,7 @@ export default { | ||
| 1502 | 1502 | ||
| 1503 | /* 主题色背景 - 渐变立体效果 */ | 1503 | /* 主题色背景 - 渐变立体效果 */ |
| 1504 | &.icon-circle-bg-6 { | 1504 | &.icon-circle-bg-6 { |
| 1505 | - background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); | 1505 | + background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); |
| 1506 | box-shadow: | 1506 | box-shadow: |
| 1507 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), | 1507 | 0 6rpx 20rpx rgba(123, 31, 162, 0.35), |
| 1508 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), | 1508 | 0 2rpx 8rpx rgba(123, 31, 162, 0.25), |
| @@ -1511,7 +1511,7 @@ export default { | @@ -1511,7 +1511,7 @@ export default { | ||
| 1511 | } | 1511 | } |
| 1512 | 1512 | ||
| 1513 | &.icon-circle-bg-9 { | 1513 | &.icon-circle-bg-9 { |
| 1514 | - background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); | 1514 | + background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); |
| 1515 | box-shadow: | 1515 | box-shadow: |
| 1516 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), | 1516 | 0 6rpx 20rpx rgba(25, 118, 210, 0.35), |
| 1517 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), | 1517 | 0 2rpx 8rpx rgba(25, 118, 210, 0.25), |
| @@ -1520,7 +1520,7 @@ export default { | @@ -1520,7 +1520,7 @@ export default { | ||
| 1520 | } | 1520 | } |
| 1521 | 1521 | ||
| 1522 | &.icon-circle-bg-10 { | 1522 | &.icon-circle-bg-10 { |
| 1523 | - background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); | 1523 | + background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); |
| 1524 | box-shadow: | 1524 | box-shadow: |
| 1525 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), | 1525 | 0 6rpx 20rpx rgba(56, 142, 60, 0.35), |
| 1526 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), | 1526 | 0 2rpx 8rpx rgba(56, 142, 60, 0.25), |
| @@ -1618,7 +1618,7 @@ export default { | @@ -1618,7 +1618,7 @@ export default { | ||
| 1618 | 1618 | ||
| 1619 | /* 主题色背景 - 渐变立体效果 */ | 1619 | /* 主题色背景 - 渐变立体效果 */ |
| 1620 | &.icon-circle-bg-11 { | 1620 | &.icon-circle-bg-11 { |
| 1621 | - background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); | 1621 | + background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); |
| 1622 | box-shadow: | 1622 | box-shadow: |
| 1623 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), | 1623 | 0 6rpx 20rpx rgba(183, 28, 28, 0.35), |
| 1624 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), | 1624 | 0 2rpx 8rpx rgba(183, 28, 28, 0.25), |
| @@ -1627,7 +1627,7 @@ export default { | @@ -1627,7 +1627,7 @@ export default { | ||
| 1627 | } | 1627 | } |
| 1628 | 1628 | ||
| 1629 | &.icon-circle-bg-13 { | 1629 | &.icon-circle-bg-13 { |
| 1630 | - background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); | 1630 | + background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); |
| 1631 | box-shadow: | 1631 | box-shadow: |
| 1632 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), | 1632 | 0 6rpx 20rpx rgba(230, 81, 0, 0.35), |
| 1633 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), | 1633 | 0 2rpx 8rpx rgba(230, 81, 0, 0.25), |
| @@ -1636,7 +1636,7 @@ export default { | @@ -1636,7 +1636,7 @@ export default { | ||
| 1636 | } | 1636 | } |
| 1637 | 1637 | ||
| 1638 | &.icon-circle-bg-14 { | 1638 | &.icon-circle-bg-14 { |
| 1639 | - background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); | 1639 | + background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); |
| 1640 | box-shadow: | 1640 | box-shadow: |
| 1641 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), | 1641 | 0 6rpx 20rpx rgba(106, 27, 154, 0.35), |
| 1642 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), | 1642 | 0 2rpx 8rpx rgba(106, 27, 154, 0.25), |
绿纤uni-app/unpackage/dist/dev/mp-weixin/pages/dashboard/dashboard.js
| @@ -303,17 +303,11 @@ var render = function () { | @@ -303,17 +303,11 @@ var render = function () { | ||
| 303 | } | 303 | } |
| 304 | }) | 304 | }) |
| 305 | : null | 305 | : null |
| 306 | - var l7 = _vm.tkStatisticsData | ||
| 307 | - ? _vm.__map(_vm.funnelData, function (item, index) { | ||
| 308 | - var $orig = _vm.__get_orig(item) | ||
| 309 | - var m27 = _vm.formatNumber(item.value) | ||
| 310 | - var g11 = _vm.funnelData.length | ||
| 311 | - return { | ||
| 312 | - $orig: $orig, | ||
| 313 | - m27: m27, | ||
| 314 | - g11: g11, | ||
| 315 | - } | ||
| 316 | - }) | 306 | + var m27 = _vm.tkStatisticsData |
| 307 | + ? _vm.formatPercent(_vm.getTkInviteRate()) | ||
| 308 | + : null | ||
| 309 | + var m28 = _vm.tkStatisticsData | ||
| 310 | + ? _vm.formatPercent(_vm.getInviteStoreRate()) | ||
| 317 | : null | 311 | : null |
| 318 | if (!_vm._isMounted) { | 312 | if (!_vm._isMounted) { |
| 319 | _vm.e0 = function ($event, item) { | 313 | _vm.e0 = function ($event, item) { |
| @@ -362,7 +356,8 @@ var render = function () { | @@ -362,7 +356,8 @@ var render = function () { | ||
| 362 | l5: l5, | 356 | l5: l5, |
| 363 | g10: g10, | 357 | g10: g10, |
| 364 | l6: l6, | 358 | l6: l6, |
| 365 | - l7: l7, | 359 | + m27: m27, |
| 360 | + m28: m28, | ||
| 366 | }, | 361 | }, |
| 367 | } | 362 | } |
| 368 | ) | 363 | ) |
| @@ -750,13 +745,6 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va | @@ -750,13 +745,6 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va | ||
| 750 | // | 745 | // |
| 751 | // | 746 | // |
| 752 | // | 747 | // |
| 753 | -// | ||
| 754 | -// | ||
| 755 | -// | ||
| 756 | -// | ||
| 757 | -// | ||
| 758 | -// | ||
| 759 | -// | ||
| 760 | var _default = { | 748 | var _default = { |
| 761 | data: function data() { | 749 | data: function data() { |
| 762 | return { | 750 | return { |
| @@ -914,28 +902,6 @@ var _default = { | @@ -914,28 +902,6 @@ var _default = { | ||
| 914 | TotalPerformance: item.F_TotalPerformance || item.TotalPerformance || 0 | 902 | TotalPerformance: item.F_TotalPerformance || item.TotalPerformance || 0 |
| 915 | }; | 903 | }; |
| 916 | }); | 904 | }); |
| 917 | - }, | ||
| 918 | - // 转化漏斗数据 | ||
| 919 | - funnelData: function funnelData() { | ||
| 920 | - if (!this.tkStatisticsData) return []; | ||
| 921 | - var tk = this.tkStatisticsData; | ||
| 922 | - return [{ | ||
| 923 | - label: '拓客人数', | ||
| 924 | - value: tk.TkCount || 0, | ||
| 925 | - rate: null | ||
| 926 | - }, { | ||
| 927 | - label: '邀约人数', | ||
| 928 | - value: tk.InviteCount || 0, | ||
| 929 | - rate: tk.TkCount > 0 ? this.formatPercent((tk.InviteCount || 0) / tk.TkCount * 100) : 0 | ||
| 930 | - }, { | ||
| 931 | - label: '到店人数', | ||
| 932 | - value: tk.StoreCount || 0, | ||
| 933 | - rate: tk.InviteCount > 0 ? this.formatPercent((tk.StoreCount || 0) / tk.InviteCount * 100) : 0 | ||
| 934 | - }, { | ||
| 935 | - label: '成交人数', | ||
| 936 | - value: tk.DealCount || 0, | ||
| 937 | - rate: tk.StoreCount > 0 ? this.formatPercent((tk.DealCount || 0) / tk.StoreCount * 100) : 0 | ||
| 938 | - }]; | ||
| 939 | } | 905 | } |
| 940 | }, | 906 | }, |
| 941 | onLoad: function onLoad() { | 907 | onLoad: function onLoad() { |
| @@ -1197,6 +1163,10 @@ var _default = { | @@ -1197,6 +1163,10 @@ var _default = { | ||
| 1197 | res = _context4.sent; | 1163 | res = _context4.sent; |
| 1198 | if (res.code === 200 && res.data) { | 1164 | if (res.code === 200 && res.data) { |
| 1199 | _this4.tkStatisticsData = res.data; | 1165 | _this4.tkStatisticsData = res.data; |
| 1166 | + // 绘制漏斗图 | ||
| 1167 | + _this4.$nextTick(function () { | ||
| 1168 | + _this4.drawFunnelChart(); | ||
| 1169 | + }); | ||
| 1200 | } | 1170 | } |
| 1201 | _context4.next = 10; | 1171 | _context4.next = 10; |
| 1202 | break; | 1172 | break; |
| @@ -1566,6 +1536,16 @@ var _default = { | @@ -1566,6 +1536,16 @@ var _default = { | ||
| 1566 | formatPercent: function formatPercent(percent) { | 1536 | formatPercent: function formatPercent(percent) { |
| 1567 | return Math.round(percent * 100) / 100; | 1537 | return Math.round(percent * 100) / 100; |
| 1568 | }, | 1538 | }, |
| 1539 | + // 获取邀约率 | ||
| 1540 | + getTkInviteRate: function getTkInviteRate() { | ||
| 1541 | + if (!this.tkStatisticsData || !this.tkStatisticsData.TkCount) return 0; | ||
| 1542 | + return (this.tkStatisticsData.YaoyCount || 0) / this.tkStatisticsData.TkCount * 100; | ||
| 1543 | + }, | ||
| 1544 | + // 获取到店率 | ||
| 1545 | + getInviteStoreRate: function getInviteStoreRate() { | ||
| 1546 | + if (!this.tkStatisticsData || !this.tkStatisticsData.YaoyCount) return 0; | ||
| 1547 | + return (this.tkStatisticsData.DdCount || 0) / this.tkStatisticsData.YaoyCount * 100; | ||
| 1548 | + }, | ||
| 1569 | // 格式化日期时间 | 1549 | // 格式化日期时间 |
| 1570 | formatDateTime: function formatDateTime(date) { | 1550 | formatDateTime: function formatDateTime(date) { |
| 1571 | var year = date.getFullYear(); | 1551 | var year = date.getFullYear(); |
| @@ -2013,6 +1993,97 @@ var _default = { | @@ -2013,6 +1993,97 @@ var _default = { | ||
| 2013 | getMemberTypeColor: function getMemberTypeColor(index) { | 1993 | getMemberTypeColor: function getMemberTypeColor(index) { |
| 2014 | var colors = ['#F56C6C', '#67C23A', '#409EFF', '#E6A23C']; | 1994 | var colors = ['#F56C6C', '#67C23A', '#409EFF', '#E6A23C']; |
| 2015 | return colors[index % colors.length]; | 1995 | return colors[index % colors.length]; |
| 1996 | + }, | ||
| 1997 | + // 绘制漏斗图 | ||
| 1998 | + drawFunnelChart: function drawFunnelChart() { | ||
| 1999 | + if (!this.tkStatisticsData) return; | ||
| 2000 | + var ctx = uni.createCanvasContext('funnelChart', this); | ||
| 2001 | + var systemInfo = uni.getSystemInfoSync(); | ||
| 2002 | + var width = systemInfo.windowWidth - 60; | ||
| 2003 | + var height = this.chartHeight; | ||
| 2004 | + | ||
| 2005 | + // 清空画布 | ||
| 2006 | + ctx.clearRect(0, 0, width, height); | ||
| 2007 | + var d = this.tkStatisticsData; | ||
| 2008 | + var funnelData = [{ | ||
| 2009 | + value: d.TkCount || 0, | ||
| 2010 | + name: '获客', | ||
| 2011 | + color: '#409EFF' | ||
| 2012 | + }, { | ||
| 2013 | + value: d.YaoyCount || 0, | ||
| 2014 | + name: '邀约', | ||
| 2015 | + color: '#67C23A' | ||
| 2016 | + }, { | ||
| 2017 | + value: d.DdCount || 0, | ||
| 2018 | + name: '到店', | ||
| 2019 | + color: '#E6A23C' | ||
| 2020 | + }, { | ||
| 2021 | + value: d.XfCount || 0, | ||
| 2022 | + name: '成交', | ||
| 2023 | + color: '#F56C6C' | ||
| 2024 | + }]; | ||
| 2025 | + | ||
| 2026 | + // 计算最大值（用于归一化） | ||
| 2027 | + var maxValue = Math.max.apply(Math, (0, _toConsumableArray2.default)(funnelData.map(function (item) { | ||
| 2028 | + return item.value; | ||
| 2029 | + })).concat([1])); | ||
| 2030 | + | ||
| 2031 | + // 漏斗图参数 | ||
| 2032 | + var topWidth = width * 0.8; // 顶部宽度 | ||
| 2033 | + var bottomWidth = width * 0.2; // 底部宽度 | ||
| 2034 | + var stepHeight = (height - 40) / funnelData.length; // 每层高度（留出上下边距） | ||
| 2035 | + var padding = { | ||
| 2036 | + top: 20, | ||
| 2037 | + bottom: 20, | ||
| 2038 | + left: width * 0.1, | ||
| 2039 | + right: width * 0.1 | ||
| 2040 | + }; | ||
| 2041 | + | ||
| 2042 | + // 绘制每一层 | ||
| 2043 | + funnelData.forEach(function (item, index) { | ||
| 2044 | + // 计算当前层的宽度（从上到下逐渐变窄） | ||
| 2045 | + var currentTopWidth = topWidth - (topWidth - bottomWidth) * (index / (funnelData.length - 1)); | ||
| 2046 | + var currentBottomWidth = topWidth - (topWidth - bottomWidth) * ((index + 1) / (funnelData.length - 1)); | ||
| 2047 | + | ||
| 2048 | + // 计算当前层的Y位置 | ||
| 2049 | + var y = padding.top + index * stepHeight; | ||
| 2050 | + var nextY = padding.top + (index + 1) * stepHeight; | ||
| 2051 | + | ||
| 2052 | + // 计算中心X位置 | ||
| 2053 | + var centerX = width / 2; | ||
| 2054 | + var topLeftX = centerX - currentTopWidth / 2; | ||
| 2055 | + var topRightX = centerX + currentTopWidth / 2; | ||
| 2056 | + var bottomLeftX = centerX - currentBottomWidth / 2; | ||
| 2057 | + var bottomRightX = centerX + currentBottomWidth / 2; | ||
| 2058 | + | ||
| 2059 | + // 绘制梯形（漏斗的一层） | ||
| 2060 | + ctx.beginPath(); | ||
| 2061 | + ctx.moveTo(topLeftX, y); | ||
| 2062 | + ctx.lineTo(topRightX, y); | ||
| 2063 | + ctx.lineTo(bottomRightX, nextY); | ||
| 2064 | + ctx.lineTo(bottomLeftX, nextY); | ||
| 2065 | + ctx.closePath(); | ||
| 2066 | + | ||
| 2067 | + // 填充颜色 | ||
| 2068 | + ctx.setFillStyle(item.color); | ||
| 2069 | + ctx.fill(); | ||
| 2070 | + | ||
| 2071 | + // 绘制边框 | ||
| 2072 | + ctx.setStrokeStyle('rgba(255, 255, 255, 0.3)'); | ||
| 2073 | + ctx.setLineWidth(2); | ||
| 2074 | + ctx.stroke(); | ||
| 2075 | + | ||
| 2076 | + // 绘制文字标签 | ||
| 2077 | + ctx.setFillStyle('#fff'); | ||
| 2078 | + ctx.setFontSize(24); | ||
| 2079 | + ctx.setTextAlign('center'); | ||
| 2080 | + var labelY = y + stepHeight / 2 + 8; | ||
| 2081 | + ctx.fillText(item.name, centerX, labelY - 8); | ||
| 2082 | + ctx.setFontSize(28); | ||
| 2083 | + ctx.setFillStyle('#fff'); | ||
| 2084 | + ctx.fillText((item.value || 0) + '人', centerX, labelY + 16); | ||
| 2085 | + }); | ||
| 2086 | + ctx.draw(); | ||
| 2016 | } | 2087 | } |
| 2017 | } | 2088 | } |
| 2018 | }; | 2089 | }; |
绿纤uni-app/unpackage/dist/dev/mp-weixin/pages/dashboard/dashboard.wxml
| 1 | -<view class="page data-v-a09b2520"><view class="warpbox data-v-a09b2520"><view class="header-section data-v-a09b2520"><view class="page-title data-v-a09b2520">经营看板</view><view class="filter-box data-v-a09b2520"><picker mode="date" fields="month" value="{{selectedMonth}}" data-event-opts="{{[['change',[['onMonthChange',['$event']]]]]}}" bindchange="__e" class="data-v-a09b2520"><view class="date-picker-trigger data-v-a09b2520"><text class="date-text data-v-a09b2520">{{selectedMonthText}}</text><u-icon vue-id="469bc196-1" name="arrow-down" size="14" color="#666" class="data-v-a09b2520" bind:__l="__l"></u-icon></view></picker><view data-event-opts="{{[['tap',[['search',['$event']]]]]}}" class="{{['refresh-btn','data-v-a09b2520',loading?'loading':'']}}" bindtap="__e"><u-icon vue-id="469bc196-2" name="reload" size="16" color="#43a047" class="data-v-a09b2520" bind:__l="__l"></u-icon></view></view></view><view class="warpboxss kpi-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>核心业务指标</view></view><view class="kpi-grid data-v-a09b2520"><block wx:for="{{$root.l0}}" wx:for-item="kpi" wx:for-index="index" wx:key="index"><view data-event-opts="{{[['tap',[['handleKpiClick',['$0'],[[['kpiList','',index]]]]]]]}}" class="{{['kpi-card','data-v-a09b2520','kpi-'+kpi.$orig.type]}}" bindtap="__e"><view class="kpi-header data-v-a09b2520"><text class="kpi-label data-v-a09b2520">{{kpi.$orig.label}}</text><view class="{{['kpi-icon-badge','data-v-a09b2520',kpi.$orig.type]}}"><text class="kpi-icon-text data-v-a09b2520">{{kpi.m0}}</text></view></view><view class="kpi-content data-v-a09b2520"><view class="kpi-value-group data-v-a09b2520"><block wx:if="{{kpi.$orig.isMoney}}"><text class="currency data-v-a09b2520">￥</text></block><text class="value data-v-a09b2520">{{kpi.g0}}</text><block wx:if="{{kpi.$orig.isPercent}}"><text class="unit data-v-a09b2520">%</text></block></view><block wx:if="{{kpi.$orig.target}}"><view class="kpi-footer data-v-a09b2520"><view class="target-progress data-v-a09b2520"><view class="progress-bg data-v-a09b2520"><view class="progress-bar data-v-a09b2520" style="{{'width:'+(kpi.g1+'%')+';'+('background-color:'+(kpi.$orig.status==='up'?'#4caf50':'#ff9800')+';')}}"></view></view></view><view class="target-text data-v-a09b2520">{{'目标: '+kpi.$orig.target+''}}<text class="{{['status-arrow','data-v-a09b2520',kpi.$orig.status]}}">{{kpi.$orig.status==='up'?'↑':'↓'}}</text></view></view></block></view></view></block></view></view><block wx:if="{{memberStatistics.totalMembers>0}}"><view class="warpboxss member-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>会员资产全景</view></view><view class="member-grid data-v-a09b2520"><view class="member-stat-card blue-theme data-v-a09b2520"><view class="icon-circle data-v-a09b2520"><u-icon vue-id="469bc196-3" name="account" size="24" color="#409EFF" class="data-v-a09b2520" bind:__l="__l"></u-icon></view><view class="stat-info data-v-a09b2520"><view class="stat-label data-v-a09b2520">总会员数</view><view class="stat-value data-v-a09b2520">{{$root.m1}}</view><view class="stat-sub data-v-a09b2520">{{"本月新增: "+$root.m2}}</view><block wx:if="{{memberStatistics.newMembersLastMonth>0}}"><view class="stat-sub data-v-a09b2520">{{"上月新增: "+$root.m3}}</view></block></view></view><view class="member-stat-card green-theme data-v-a09b2520"><view class="icon-circle data-v-a09b2520"><u-icon vue-id="469bc196-4" name="checkmark-circle" size="24" color="#67C23A" class="data-v-a09b2520" bind:__l="__l"></u-icon></view><view class="stat-info data-v-a09b2520"><view class="stat-label data-v-a09b2520">活跃会员</view><view class="stat-value data-v-a09b2520">{{$root.m4}}</view><view class="stat-sub data-v-a09b2520">{{"活跃(≤3天): "+$root.m5}}</view><view class="stat-sub data-v-a09b2520">{{"常到店(4-59天): "+$root.m6}}</view><view class="stat-sub data-v-a09b2520">{{"60天活跃率: "+memberStatistics.activeRate+"%"}}</view><view class="stat-sub data-v-a09b2520">{{"30天活跃率: "+memberStatistics.activeRate30+"%"}}</view></view></view><view class="member-stat-card orange-theme data-v-a09b2520"><view class="icon-circle data-v-a09b2520"><u-icon vue-id="469bc196-5" name="wallet" size="24" color="#E6A23C" class="data-v-a09b2520" bind:__l="__l"></u-icon></view><view class="stat-info data-v-a09b2520"><view class="stat-label data-v-a09b2520">剩余权益</view><view class="stat-value mini data-v-a09b2520">{{"￥"+$root.m7}}</view><view class="stat-sub data-v-a09b2520">{{"人均: "+$root.m8+"元"}}</view><block wx:if="{{memberStatistics.topRemainingAmount>0}}"><view class="stat-sub data-v-a09b2520">{{"最高: "+(memberStatistics.topRemainingMemberName||'无')+" ￥"+$root.m9}}</view></block><block wx:if="{{memberStatistics.topBillingAmount>0}}"><view class="stat-sub data-v-a09b2520">{{"本月开单最高: "+(memberStatistics.topBillingMemberName||'无')+" ￥"+$root.m10}}</view></block><block wx:if="{{memberStatistics.topConsumeAmount>0}}"><view class="stat-sub data-v-a09b2520">{{"本月消耗最高: "+(memberStatistics.topConsumeMemberName||'无')+" ￥"+$root.m11}}</view></block></view></view><view class="member-stat-card red-theme data-v-a09b2520"><view class="icon-circle data-v-a09b2520"><u-icon vue-id="469bc196-6" name="info-circle" size="24" color="#F56C6C" class="data-v-a09b2520" bind:__l="__l"></u-icon></view><view class="stat-info data-v-a09b2520"><view class="stat-label data-v-a09b2520">沉睡会员</view><view class="stat-value data-v-a09b2520">{{$root.m12}}</view><view class="stat-sub data-v-a09b2520">{{"60-89天: "+$root.m13}}</view><view class="stat-sub data-v-a09b2520">{{"90-179天: "+$root.m14}}</view><view class="stat-sub data-v-a09b2520">{{"180-359天: "+$root.m15}}</view><view class="stat-sub data-v-a09b2520">{{"360天+: "+$root.m16}}</view></view></view></view></view></block><block wx:if="{{$root.g2>0}}"><view class="warpboxss member-chart-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>会员结构洞察</view></view><view class="member-chart-container data-v-a09b2520"><view class="member-type-chart-wrapper data-v-a09b2520"><canvas class="member-type-chart-canvas data-v-a09b2520" canvas-id="memberTypeChart"></canvas></view><view class="member-type-legend data-v-a09b2520"><block wx:for="{{$root.l1}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="legend-item data-v-a09b2520"><view class="legend-dot data-v-a09b2520" style="{{'background-color:'+(item.m17)+';'}}"></view><text class="legend-name data-v-a09b2520">{{item.$orig.MemberType||'未知'}}</text><text class="legend-value data-v-a09b2520">{{item.m18+"人"}}</text></view></block></view></view></view></block><block wx:if="{{memberStatistics.beautyMembers>0||memberStatistics.medicalMembers>0||memberStatistics.techMembers>0}}"><view class="warpboxss member-category-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>会员价值分层</view></view><view class="member-category-container data-v-a09b2520"><view class="member-category-chart-wrapper data-v-a09b2520"><canvas class="member-category-chart-canvas data-v-a09b2520" canvas-id="memberCategoryChart"></canvas></view><view class="member-category-legend data-v-a09b2520"><view class="legend-item data-v-a09b2520"><view class="legend-color data-v-a09b2520" style="background:#409EFF;"></view><view class="legend-text data-v-a09b2520"><view class="legend-name data-v-a09b2520">生美会员</view><view class="legend-value data-v-a09b2520">{{$root.m19+"人"}}</view></view></view><view class="legend-item data-v-a09b2520"><view class="legend-color data-v-a09b2520" style="background:#F56C6C;"></view><view class="legend-text data-v-a09b2520"><view class="legend-name data-v-a09b2520">医美会员</view><view class="legend-value data-v-a09b2520">{{$root.m20+"人"}}</view></view></view><view class="legend-item data-v-a09b2520"><view class="legend-color data-v-a09b2520" style="background:#67C23A;"></view><view class="legend-text data-v-a09b2520"><view class="legend-name data-v-a09b2520">科技部会员</view><view class="legend-value data-v-a09b2520">{{$root.m21+"人"}}</view></view></view></view></view></view></block><block wx:if="{{$root.g3>0}}"><view class="warpboxss trend-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>经营效能趋势</view><view class="trend-controls data-v-a09b2520"><view class="pill-switch data-v-a09b2520"><view data-event-opts="{{[['tap',[['switchTrendType',['month']]]]]}}" class="{{['pill-item','data-v-a09b2520',trendType==='month'?'active':'']}}" bindtap="__e">月</view><view data-event-opts="{{[['tap',[['switchTrendType',['day']]]]]}}" class="{{['pill-item','data-v-a09b2520',trendType==='day'?'active':'']}}" bindtap="__e">日</view><view data-event-opts="{{[['tap',[['switchTrendType',['week']]]]]}}" class="{{['pill-item','data-v-a09b2520',trendType==='week'?'active':'']}}" bindtap="__e">周</view></view></view></view><view class="chart-wrapper data-v-a09b2520"><canvas class="trend-chart-canvas data-v-a09b2520" style="{{'width:'+(chartWidth+'px')+';'+('height:'+(chartHeight+'px')+';')}}" canvas-id="trendChart"></canvas></view><view class="trend-legend-modern data-v-a09b2520"><view class="legend-item data-v-a09b2520"><view class="dot revenue data-v-a09b2520"></view><text class="data-v-a09b2520">营收(成交额)</text></view><view class="legend-item data-v-a09b2520"><view class="dot consume data-v-a09b2520"></view><text class="data-v-a09b2520">消耗(服务产出)</text></view></view></view></block><block wx:if="{{$root.g4>0}}"><view class="warpboxss ranking-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>门店卓越榜</view></view><view class="rank-list-modern data-v-a09b2520"><block wx:for="{{$root.l2}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view data-event-opts="{{[['tap',[['e0',['$event']]]]]}}" data-event-params="{{({item:item.$orig})}}" class="rank-item data-v-a09b2520" bindtap="__e"><view class="{{['rank-idx','data-v-a09b2520',index<3?'top-3':'']}}"><block wx:if="{{index===0}}"><image class="medal-icon data-v-a09b2520" src="/static/rank/no1.png"></image></block><block wx:else><block wx:if="{{index===1}}"><image class="medal-icon data-v-a09b2520" src="/static/rank/no2.png"></image></block><block wx:else><block wx:if="{{index===2}}"><image class="medal-icon data-v-a09b2520" src="/static/rank/no3.png"></image></block><block wx:else><text class="data-v-a09b2520">{{index+1}}</text></block></block></block></view><view class="rank-info data-v-a09b2520"><view class="info-main data-v-a09b2520"><text class="name data-v-a09b2520">{{item.$orig.StoreName||'未知门店'}}</text><text class="value data-v-a09b2520">{{"￥"+item.m22}}</text></view><view class="progress-bg data-v-a09b2520"><view class="progress-bar data-v-a09b2520" style="{{'width:'+(item.$orig.TotalPerformance/(storeRanking[0].TotalPerformance||1)*100+'%')+';'}}"></view></view></view></view></block></view></view></block><block wx:if="{{$root.g5>0}}"><view class="warpboxss coach-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>核心员效贡献矩阵</view><view class="type-tags data-v-a09b2520"><view data-event-opts="{{[['tap',[['switchCoachRankType',['billing']]]]]}}" class="{{['tag-item','data-v-a09b2520',coachRankType==='billing'?'active':'']}}" bindtap="__e">开单</view><view data-event-opts="{{[['tap',[['switchCoachRankType',['consume']]]]]}}" class="{{['tag-item','data-v-a09b2520',coachRankType==='consume'?'active':'']}}" bindtap="__e">消耗</view><view data-event-opts="{{[['tap',[['switchCoachRankType',['refund']]]]]}}" class="{{['tag-item','data-v-a09b2520',coachRankType==='refund'?'active':'']}}" bindtap="__e">退卡</view></view></view><view class="rank-list-modern data-v-a09b2520"><block wx:for="{{$root.l3}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="rank-item data-v-a09b2520"><view class="{{['rank-idx','data-v-a09b2520',index<3?'top-3':'']}}"><text class="data-v-a09b2520">{{index+1}}</text></view><view class="rank-avatar data-v-a09b2520"><text class="data-v-a09b2520">{{item.$orig.HealthCoachName?item.g6:'无'}}</text></view><view class="rank-info data-v-a09b2520"><view class="info-main data-v-a09b2520"><text class="name data-v-a09b2520">{{item.$orig.HealthCoachName||'未知'}}</text><text class="value data-v-a09b2520">{{"￥"+item.m23}}</text></view><view class="progress-bg data-v-a09b2520"><view class="progress-bar green data-v-a09b2520" style="{{'width:'+(item.$orig.Percent+'%')+';'}}"></view></view></view></view></block></view></view></block><block wx:if="{{$root.g7>0}}"><view class="warpboxss gold-triangle-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>协同作战榜</view></view><view class="rank-list-modern data-v-a09b2520"><block wx:for="{{$root.l4}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="rank-item data-v-a09b2520"><view class="{{['rank-idx','data-v-a09b2520',index<3?'top-3':'']}}"><text class="data-v-a09b2520">{{index+1}}</text></view><view class="rank-info data-v-a09b2520"><view class="info-main data-v-a09b2520"><text class="name data-v-a09b2520">{{item.$orig.GoldTriangleName||'未知'}}</text><text class="value data-v-a09b2520">{{"￥"+item.m24}}</text></view><view class="progress-bg data-v-a09b2520"><view class="progress-bar orange data-v-a09b2520" style="{{'width:'+(item.$orig.TotalPerformance/(goldTriangleRankingTop10[0].TotalPerformance||1)*100+'%')+';'}}"></view></view></view></view></block></view></view></block><block wx:if="{{$root.g8>0}}"><view class="warpboxss visit-frequency-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>客户活跃度分析</view></view><view class="chart-wrapper data-v-a09b2520"><canvas class="visit-frequency-chart-canvas data-v-a09b2520" style="{{'width:'+(chartWidth+'px')+';'+('height:'+(chartHeight+'px')+';')}}" canvas-id="visitFrequencyChart"></canvas></view></view></block><block wx:if="{{$root.g9>0}}"><view class="warpboxss item-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>热门服务品项</view></view><view class="item-grid data-v-a09b2520"><block wx:for="{{$root.l5}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="item-card data-v-a09b2520"><view class="{{['item-rank-badge','data-v-a09b2520','rank-'+(index+1)]}}">{{index+1}}</view><view class="item-name data-v-a09b2520">{{item.$orig.ItemName||'未知品项'}}</view><view class="item-val data-v-a09b2520">{{"￥"+item.m25}}</view><view class="item-process data-v-a09b2520"><view class="bar data-v-a09b2520" style="{{'width:'+(item.$orig.Percent+'%')+';'}}"></view></view></view></block></view></view></block><block wx:if="{{$root.g10>0}}"><view class="warpboxss item-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>热销产品品项</view></view><view class="item-grid data-v-a09b2520"><block wx:for="{{$root.l6}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="item-card data-v-a09b2520"><view class="{{['item-rank-badge','data-v-a09b2520','rank-'+(index+1)]}}">{{index+1}}</view><view class="item-name data-v-a09b2520">{{item.$orig.ItemName||'未知品项'}}</view><view class="item-val data-v-a09b2520">{{"￥"+item.m26}}</view><view class="item-process data-v-a09b2520"><view class="bar blue data-v-a09b2520" style="{{'width:'+(item.$orig.Percent+'%')+';'}}"></view></view></view></block></view></view></block><block wx:if="{{tkStatisticsData}}"><view class="warpboxss funnel-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>客户获取转化链</view></view><view class="funnel-box data-v-a09b2520"><block wx:for="{{$root.l7}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="funnel-step data-v-a09b2520"><view class="step-shape data-v-a09b2520" style="{{'width:'+(100-index*15+'%')+';'+('opacity:'+(1-index*0.1)+';')}}"><view class="step-content data-v-a09b2520"><text class="step-label data-v-a09b2520">{{item.$orig.label}}</text><text class="step-value data-v-a09b2520">{{item.m27}}</text></view></view><block wx:if="{{index<item.g11-1}}"><view class="step-arrow data-v-a09b2520"><u-icon vue-id="{{'469bc196-7-'+index}}" name="arrow-down" size="16" color="#999" class="data-v-a09b2520" bind:__l="__l"></u-icon><block wx:if="{{item.$orig.rate}}"><text class="rate-text data-v-a09b2520">{{"转化率 "+item.$orig.rate+"%"}}</text></block></view></block></view></block></view></view></block><view style="height:40rpx;" class="data-v-a09b2520"></view></view></view> | ||
| 2 | \ No newline at end of file | 1 | \ No newline at end of file |
| 2 | +<view class="page data-v-a09b2520"><view class="warpbox data-v-a09b2520"><view class="header-section data-v-a09b2520"><view class="page-title data-v-a09b2520">经营看板</view><view class="filter-box data-v-a09b2520"><picker mode="date" fields="month" value="{{selectedMonth}}" data-event-opts="{{[['change',[['onMonthChange',['$event']]]]]}}" bindchange="__e" class="data-v-a09b2520"><view class="date-picker-trigger data-v-a09b2520"><text class="date-text data-v-a09b2520">{{selectedMonthText}}</text><u-icon vue-id="469bc196-1" name="arrow-down" size="14" color="#666" class="data-v-a09b2520" bind:__l="__l"></u-icon></view></picker><view data-event-opts="{{[['tap',[['search',['$event']]]]]}}" class="{{['refresh-btn','data-v-a09b2520',loading?'loading':'']}}" bindtap="__e"><u-icon vue-id="469bc196-2" name="reload" size="16" color="#43a047" class="data-v-a09b2520" bind:__l="__l"></u-icon></view></view></view><view class="warpboxss kpi-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>核心业务指标</view></view><view class="kpi-grid data-v-a09b2520"><block wx:for="{{$root.l0}}" wx:for-item="kpi" wx:for-index="index" wx:key="index"><view data-event-opts="{{[['tap',[['handleKpiClick',['$0'],[[['kpiList','',index]]]]]]]}}" class="{{['kpi-card','data-v-a09b2520','kpi-'+kpi.$orig.type]}}" bindtap="__e"><view class="kpi-header data-v-a09b2520"><text class="kpi-label data-v-a09b2520">{{kpi.$orig.label}}</text><view class="{{['kpi-icon-badge','data-v-a09b2520',kpi.$orig.type]}}"><text class="kpi-icon-text data-v-a09b2520">{{kpi.m0}}</text></view></view><view class="kpi-content data-v-a09b2520"><view class="kpi-value-group data-v-a09b2520"><block wx:if="{{kpi.$orig.isMoney}}"><text class="currency data-v-a09b2520">￥</text></block><text class="value data-v-a09b2520">{{kpi.g0}}</text><block wx:if="{{kpi.$orig.isPercent}}"><text class="unit data-v-a09b2520">%</text></block></view><block wx:if="{{kpi.$orig.target}}"><view class="kpi-footer data-v-a09b2520"><view class="target-progress data-v-a09b2520"><view class="progress-bg data-v-a09b2520"><view class="progress-bar data-v-a09b2520" style="{{'width:'+(kpi.g1+'%')+';'+('background-color:'+(kpi.$orig.status==='up'?'#4caf50':'#ff9800')+';')}}"></view></view></view><view class="target-text data-v-a09b2520">{{'目标: '+kpi.$orig.target+''}}<text class="{{['status-arrow','data-v-a09b2520',kpi.$orig.status]}}">{{kpi.$orig.status==='up'?'↑':'↓'}}</text></view></view></block></view></view></block></view></view><block wx:if="{{memberStatistics.totalMembers>0}}"><view class="warpboxss member-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>会员资产全景</view></view><view class="member-grid data-v-a09b2520"><view class="member-stat-card blue-theme data-v-a09b2520"><view class="icon-circle data-v-a09b2520"><u-icon vue-id="469bc196-3" name="account" size="24" color="#409EFF" class="data-v-a09b2520" bind:__l="__l"></u-icon></view><view class="stat-info data-v-a09b2520"><view class="stat-label data-v-a09b2520">总会员数</view><view class="stat-value data-v-a09b2520">{{$root.m1}}</view><view class="stat-sub data-v-a09b2520">{{"本月新增: "+$root.m2}}</view><block wx:if="{{memberStatistics.newMembersLastMonth>0}}"><view class="stat-sub data-v-a09b2520">{{"上月新增: "+$root.m3}}</view></block></view></view><view class="member-stat-card green-theme data-v-a09b2520"><view class="icon-circle data-v-a09b2520"><u-icon vue-id="469bc196-4" name="checkmark-circle" size="24" color="#67C23A" class="data-v-a09b2520" bind:__l="__l"></u-icon></view><view class="stat-info data-v-a09b2520"><view class="stat-label data-v-a09b2520">活跃会员</view><view class="stat-value data-v-a09b2520">{{$root.m4}}</view><view class="stat-sub data-v-a09b2520">{{"活跃(≤3天): "+$root.m5}}</view><view class="stat-sub data-v-a09b2520">{{"常到店(4-59天): "+$root.m6}}</view><view class="stat-sub data-v-a09b2520">{{"60天活跃率: "+memberStatistics.activeRate+"%"}}</view><view class="stat-sub data-v-a09b2520">{{"30天活跃率: "+memberStatistics.activeRate30+"%"}}</view></view></view><view class="member-stat-card orange-theme data-v-a09b2520"><view class="icon-circle data-v-a09b2520"><u-icon vue-id="469bc196-5" name="wallet" size="24" color="#E6A23C" class="data-v-a09b2520" bind:__l="__l"></u-icon></view><view class="stat-info data-v-a09b2520"><view class="stat-label data-v-a09b2520">剩余权益</view><view class="stat-value mini data-v-a09b2520">{{"￥"+$root.m7}}</view><view class="stat-sub data-v-a09b2520">{{"人均: "+$root.m8+"元"}}</view><block wx:if="{{memberStatistics.topRemainingAmount>0}}"><view class="stat-sub data-v-a09b2520">{{"最高: "+(memberStatistics.topRemainingMemberName||'无')+" ￥"+$root.m9}}</view></block><block wx:if="{{memberStatistics.topBillingAmount>0}}"><view class="stat-sub data-v-a09b2520">{{"本月开单最高: "+(memberStatistics.topBillingMemberName||'无')+" ￥"+$root.m10}}</view></block><block wx:if="{{memberStatistics.topConsumeAmount>0}}"><view class="stat-sub data-v-a09b2520">{{"本月消耗最高: "+(memberStatistics.topConsumeMemberName||'无')+" ￥"+$root.m11}}</view></block></view></view><view class="member-stat-card red-theme data-v-a09b2520"><view class="icon-circle data-v-a09b2520"><u-icon vue-id="469bc196-6" name="info-circle" size="24" color="#F56C6C" class="data-v-a09b2520" bind:__l="__l"></u-icon></view><view class="stat-info data-v-a09b2520"><view class="stat-label data-v-a09b2520">沉睡会员</view><view class="stat-value data-v-a09b2520">{{$root.m12}}</view><view class="stat-sub data-v-a09b2520">{{"60-89天: "+$root.m13}}</view><view class="stat-sub data-v-a09b2520">{{"90-179天: "+$root.m14}}</view><view class="stat-sub data-v-a09b2520">{{"180-359天: "+$root.m15}}</view><view class="stat-sub data-v-a09b2520">{{"360天+: "+$root.m16}}</view></view></view></view></view></block><block wx:if="{{$root.g2>0}}"><view class="warpboxss member-chart-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>会员结构洞察</view></view><view class="member-chart-container data-v-a09b2520"><view class="member-type-chart-wrapper data-v-a09b2520"><canvas class="member-type-chart-canvas data-v-a09b2520" canvas-id="memberTypeChart"></canvas></view><view class="member-type-legend data-v-a09b2520"><block wx:for="{{$root.l1}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="legend-item data-v-a09b2520"><view class="legend-dot data-v-a09b2520" style="{{'background-color:'+(item.m17)+';'}}"></view><text class="legend-name data-v-a09b2520">{{item.$orig.MemberType||'未知'}}</text><text class="legend-value data-v-a09b2520">{{item.m18+"人"}}</text></view></block></view></view></view></block><block wx:if="{{memberStatistics.beautyMembers>0||memberStatistics.medicalMembers>0||memberStatistics.techMembers>0}}"><view class="warpboxss member-category-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>会员价值分层</view></view><view class="member-category-container data-v-a09b2520"><view class="member-category-chart-wrapper data-v-a09b2520"><canvas class="member-category-chart-canvas data-v-a09b2520" canvas-id="memberCategoryChart"></canvas></view><view class="member-category-legend data-v-a09b2520"><view class="legend-item data-v-a09b2520"><view class="legend-color data-v-a09b2520" style="background:#409EFF;"></view><view class="legend-text data-v-a09b2520"><view class="legend-name data-v-a09b2520">生美会员</view><view class="legend-value data-v-a09b2520">{{$root.m19+"人"}}</view></view></view><view class="legend-item data-v-a09b2520"><view class="legend-color data-v-a09b2520" style="background:#F56C6C;"></view><view class="legend-text data-v-a09b2520"><view class="legend-name data-v-a09b2520">医美会员</view><view class="legend-value data-v-a09b2520">{{$root.m20+"人"}}</view></view></view><view class="legend-item data-v-a09b2520"><view class="legend-color data-v-a09b2520" style="background:#67C23A;"></view><view class="legend-text data-v-a09b2520"><view class="legend-name data-v-a09b2520">科技部会员</view><view class="legend-value data-v-a09b2520">{{$root.m21+"人"}}</view></view></view></view></view></view></block><block wx:if="{{$root.g3>0}}"><view class="warpboxss trend-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>经营效能趋势</view><view class="trend-controls data-v-a09b2520"><view class="pill-switch data-v-a09b2520"><view data-event-opts="{{[['tap',[['switchTrendType',['month']]]]]}}" class="{{['pill-item','data-v-a09b2520',trendType==='month'?'active':'']}}" bindtap="__e">月</view><view data-event-opts="{{[['tap',[['switchTrendType',['day']]]]]}}" class="{{['pill-item','data-v-a09b2520',trendType==='day'?'active':'']}}" bindtap="__e">日</view><view data-event-opts="{{[['tap',[['switchTrendType',['week']]]]]}}" class="{{['pill-item','data-v-a09b2520',trendType==='week'?'active':'']}}" bindtap="__e">周</view></view></view></view><view class="chart-wrapper data-v-a09b2520"><canvas class="trend-chart-canvas data-v-a09b2520" style="{{'width:'+(chartWidth+'px')+';'+('height:'+(chartHeight+'px')+';')}}" canvas-id="trendChart"></canvas></view><view class="trend-legend-modern data-v-a09b2520"><view class="legend-item data-v-a09b2520"><view class="dot revenue data-v-a09b2520"></view><text class="data-v-a09b2520">营收(成交额)</text></view><view class="legend-item data-v-a09b2520"><view class="dot consume data-v-a09b2520"></view><text class="data-v-a09b2520">消耗(服务产出)</text></view></view></view></block><block wx:if="{{$root.g4>0}}"><view class="warpboxss ranking-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>门店卓越榜</view></view><view class="rank-list-modern data-v-a09b2520"><block wx:for="{{$root.l2}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view data-event-opts="{{[['tap',[['e0',['$event']]]]]}}" data-event-params="{{({item:item.$orig})}}" class="rank-item data-v-a09b2520" bindtap="__e"><view class="{{['rank-idx','data-v-a09b2520',index<3?'top-3':'']}}"><block wx:if="{{index===0}}"><image class="medal-icon data-v-a09b2520" src="/static/rank/no1.png"></image></block><block wx:else><block wx:if="{{index===1}}"><image class="medal-icon data-v-a09b2520" src="/static/rank/no2.png"></image></block><block wx:else><block wx:if="{{index===2}}"><image class="medal-icon data-v-a09b2520" src="/static/rank/no3.png"></image></block><block wx:else><text class="data-v-a09b2520">{{index+1}}</text></block></block></block></view><view class="rank-info data-v-a09b2520"><view class="info-main data-v-a09b2520"><text class="name data-v-a09b2520">{{item.$orig.StoreName||'未知门店'}}</text><text class="value data-v-a09b2520">{{"￥"+item.m22}}</text></view><view class="progress-bg data-v-a09b2520"><view class="progress-bar data-v-a09b2520" style="{{'width:'+(item.$orig.TotalPerformance/(storeRanking[0].TotalPerformance||1)*100+'%')+';'}}"></view></view></view></view></block></view></view></block><block wx:if="{{$root.g5>0}}"><view class="warpboxss coach-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>核心员效贡献矩阵</view><view class="type-tags data-v-a09b2520"><view data-event-opts="{{[['tap',[['switchCoachRankType',['billing']]]]]}}" class="{{['tag-item','data-v-a09b2520',coachRankType==='billing'?'active':'']}}" bindtap="__e">开单</view><view data-event-opts="{{[['tap',[['switchCoachRankType',['consume']]]]]}}" class="{{['tag-item','data-v-a09b2520',coachRankType==='consume'?'active':'']}}" bindtap="__e">消耗</view><view data-event-opts="{{[['tap',[['switchCoachRankType',['refund']]]]]}}" class="{{['tag-item','data-v-a09b2520',coachRankType==='refund'?'active':'']}}" bindtap="__e">退卡</view></view></view><view class="rank-list-modern data-v-a09b2520"><block wx:for="{{$root.l3}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="rank-item data-v-a09b2520"><view class="{{['rank-idx','data-v-a09b2520',index<3?'top-3':'']}}"><text class="data-v-a09b2520">{{index+1}}</text></view><view class="rank-avatar data-v-a09b2520"><text class="data-v-a09b2520">{{item.$orig.HealthCoachName?item.g6:'无'}}</text></view><view class="rank-info data-v-a09b2520"><view class="info-main data-v-a09b2520"><text class="name data-v-a09b2520">{{item.$orig.HealthCoachName||'未知'}}</text><text class="value data-v-a09b2520">{{"￥"+item.m23}}</text></view><view class="progress-bg data-v-a09b2520"><view class="progress-bar green data-v-a09b2520" style="{{'width:'+(item.$orig.Percent+'%')+';'}}"></view></view></view></view></block></view></view></block><block wx:if="{{$root.g7>0}}"><view class="warpboxss gold-triangle-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>协同作战榜</view></view><view class="rank-list-modern data-v-a09b2520"><block wx:for="{{$root.l4}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="rank-item data-v-a09b2520"><view class="{{['rank-idx','data-v-a09b2520',index<3?'top-3':'']}}"><text class="data-v-a09b2520">{{index+1}}</text></view><view class="rank-info data-v-a09b2520"><view class="info-main data-v-a09b2520"><text class="name data-v-a09b2520">{{item.$orig.GoldTriangleName||'未知'}}</text><text class="value data-v-a09b2520">{{"￥"+item.m24}}</text></view><view class="progress-bg data-v-a09b2520"><view class="progress-bar orange data-v-a09b2520" style="{{'width:'+(item.$orig.TotalPerformance/(goldTriangleRankingTop10[0].TotalPerformance||1)*100+'%')+';'}}"></view></view></view></view></block></view></view></block><block wx:if="{{$root.g8>0}}"><view class="warpboxss visit-frequency-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>客户活跃度分析</view></view><view class="chart-wrapper data-v-a09b2520"><canvas class="visit-frequency-chart-canvas data-v-a09b2520" style="{{'width:'+(chartWidth+'px')+';'+('height:'+(chartHeight+'px')+';')}}" canvas-id="visitFrequencyChart"></canvas></view></view></block><block wx:if="{{$root.g9>0}}"><view class="warpboxss item-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>热门服务品项</view></view><view class="item-grid data-v-a09b2520"><block wx:for="{{$root.l5}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="item-card data-v-a09b2520"><view class="{{['item-rank-badge','data-v-a09b2520','rank-'+(index+1)]}}">{{index+1}}</view><view class="item-name data-v-a09b2520">{{item.$orig.ItemName||'未知品项'}}</view><view class="item-val data-v-a09b2520">{{"￥"+item.m25}}</view><view class="item-process data-v-a09b2520"><view class="bar data-v-a09b2520" style="{{'width:'+(item.$orig.Percent+'%')+';'}}"></view></view></view></block></view></view></block><block wx:if="{{$root.g10>0}}"><view class="warpboxss item-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>热销产品品项</view></view><view class="item-grid data-v-a09b2520"><block wx:for="{{$root.l6}}" wx:for-item="item" wx:for-index="index" wx:key="index"><view class="item-card data-v-a09b2520"><view class="{{['item-rank-badge','data-v-a09b2520','rank-'+(index+1)]}}">{{index+1}}</view><view class="item-name data-v-a09b2520">{{item.$orig.ItemName||'未知品项'}}</view><view class="item-val data-v-a09b2520">{{"￥"+item.m26}}</view><view class="item-process data-v-a09b2520"><view class="bar blue data-v-a09b2520" style="{{'width:'+(item.$orig.Percent+'%')+';'}}"></view></view></view></block></view></view></block><block wx:if="{{tkStatisticsData}}"><view class="warpboxss funnel-section data-v-a09b2520"><view class="warpboxs-small-title data-v-a09b2520"><view class="data-v-a09b2520"><text class="warpboxs-small-title-line data-v-a09b2520"></text>客户获取转化链</view></view><view class="chart-wrapper data-v-a09b2520"><canvas class="funnel-chart-canvas data-v-a09b2520" style="{{'width:'+(chartWidth+'px')+';'+('height:'+(chartHeight+'px')+';')}}" canvas-id="funnelChart"></canvas></view><view class="funnel-stats data-v-a09b2520"><view class="stat-mini data-v-a09b2520">邀约率: <text class="stat-value data-v-a09b2520">{{$root.m27+"%"}}</text></view><view class="stat-mini data-v-a09b2520">到店率: <text class="stat-value data-v-a09b2520">{{$root.m28+"%"}}</text></view></view></view></block><view style="height:40rpx;" class="data-v-a09b2520"></view></view></view> | ||
| 3 | \ No newline at end of file | 3 | \ No newline at end of file |
绿纤uni-app/unpackage/dist/dev/mp-weixin/pages/dashboard/dashboard.wxss
| @@ -471,51 +471,29 @@ | @@ -471,51 +471,29 @@ | ||
| 471 | border-radius: 2rpx; | 471 | border-radius: 2rpx; |
| 472 | } | 472 | } |
| 473 | /* 转化漏斗 */ | 473 | /* 转化漏斗 */ |
| 474 | -.funnel-box.data-v-a09b2520 { | ||
| 475 | - padding: 20rpx 0; | ||
| 476 | -} | ||
| 477 | -.funnel-step.data-v-a09b2520 { | ||
| 478 | - display: flex; | ||
| 479 | - flex-direction: column; | ||
| 480 | - align-items: center; | ||
| 481 | - margin-bottom: 10rpx; | ||
| 482 | -} | ||
| 483 | -.funnel-step .step-shape.data-v-a09b2520 { | ||
| 484 | - background: linear-gradient(90deg, #66bb6a 0%, #43a047 100%); | ||
| 485 | - border-radius: 8rpx; | ||
| 486 | - padding: 16rpx; | ||
| 487 | - box-shadow: 0 4rpx 12rpx rgba(67, 160, 71, 0.2); | ||
| 488 | - display: flex; | ||
| 489 | - justify-content: center; | ||
| 490 | -} | ||
| 491 | -.funnel-step .step-shape .step-content.data-v-a09b2520 { | ||
| 492 | - display: flex; | ||
| 493 | - align-items: center; | ||
| 494 | - justify-content: space-between; | 474 | +.funnel-section .chart-wrapper.data-v-a09b2520 { |
| 495 | width: 100%; | 475 | width: 100%; |
| 496 | - padding: 0 20rpx; | ||
| 497 | -} | ||
| 498 | -.funnel-step .step-shape .step-content .step-label.data-v-a09b2520 { | ||
| 499 | - color: #fff; | ||
| 500 | - font-size: 26rpx; | ||
| 501 | - font-weight: 500; | 476 | + height: 280px; |
| 477 | + margin-bottom: 20rpx; | ||
| 502 | } | 478 | } |
| 503 | -.funnel-step .step-shape .step-content .step-value.data-v-a09b2520 { | ||
| 504 | - color: #fff; | ||
| 505 | - font-size: 32rpx; | ||
| 506 | - font-weight: bold; | 479 | +.funnel-section .funnel-chart-canvas.data-v-a09b2520 { |
| 480 | + width: 100%; | ||
| 481 | + height: 100%; | ||
| 507 | } | 482 | } |
| 508 | -.funnel-step .step-arrow.data-v-a09b2520 { | 483 | +.funnel-section .funnel-stats.data-v-a09b2520 { |
| 509 | display: flex; | 484 | display: flex; |
| 510 | - flex-direction: column; | ||
| 511 | - align-items: center; | ||
| 512 | - padding: 8rpx 0; | ||
| 513 | - height: 60rpx; | 485 | + justify-content: space-around; |
| 486 | + padding: 20rpx 0; | ||
| 487 | + border-top: 1px solid rgba(0, 0, 0, 0.05); | ||
| 514 | } | 488 | } |
| 515 | -.funnel-step .step-arrow .rate-text.data-v-a09b2520 { | ||
| 516 | - font-size: 20rpx; | 489 | +.funnel-section .funnel-stats .stat-mini.data-v-a09b2520 { |
| 490 | + font-size: 24rpx; | ||
| 517 | color: #666; | 491 | color: #666; |
| 518 | - margin-top: 4rpx; | 492 | +} |
| 493 | +.funnel-section .funnel-stats .stat-mini .stat-value.data-v-a09b2520 { | ||
| 494 | + color: #43a047; | ||
| 495 | + font-weight: 600; | ||
| 496 | + margin-left: 8rpx; | ||
| 519 | } | 497 | } |
| 520 | @-webkit-keyframes rotate-data-v-a09b2520 { | 498 | @-webkit-keyframes rotate-data-v-a09b2520 { |
| 521 | from { | 499 | from { |
绿纤uni-app/unpackage/dist/dev/mp-weixin/pages/home/home.wxss
| @@ -199,75 +199,75 @@ | @@ -199,75 +199,75 @@ | ||
| 199 | filter: brightness(1.2) drop-shadow(0 2rpx 4rpx rgba(0, 0, 0, 0.2)); | 199 | filter: brightness(1.2) drop-shadow(0 2rpx 4rpx rgba(0, 0, 0, 0.2)); |
| 200 | } | 200 | } |
| 201 | .warpboxss .common-func-icon.icon-circle-bg-1.data-v-92bb8f34 { | 201 | .warpboxss .common-func-icon.icon-circle-bg-1.data-v-92bb8f34 { |
| 202 | - background: linear-gradient(135deg, #E3F2FD 0%, #2196F3 100%); | 202 | + background: linear-gradient(135deg, #1E88E5 0%, #42a5f5 50%, #1565C0 100%); |
| 203 | box-shadow: 0 6rpx 20rpx rgba(30, 136, 229, 0.35), 0 2rpx 8rpx rgba(30, 136, 229, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 203 | box-shadow: 0 6rpx 20rpx rgba(30, 136, 229, 0.35), 0 2rpx 8rpx rgba(30, 136, 229, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 204 | } | 204 | } |
| 205 | .warpboxss .common-func-icon.icon-circle-bg-2.data-v-92bb8f34 { | 205 | .warpboxss .common-func-icon.icon-circle-bg-2.data-v-92bb8f34 { |
| 206 | - background: linear-gradient(135deg, #E8F5E9 0%, #4CAF50 100%); | 206 | + background: linear-gradient(135deg, #43A047 0%, #66bb6a 50%, #388E3C 100%); |
| 207 | box-shadow: 0 6rpx 20rpx rgba(67, 160, 71, 0.35), 0 2rpx 8rpx rgba(67, 160, 71, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 207 | box-shadow: 0 6rpx 20rpx rgba(67, 160, 71, 0.35), 0 2rpx 8rpx rgba(67, 160, 71, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 208 | } | 208 | } |
| 209 | .warpboxss .common-func-icon.icon-circle-bg-3.data-v-92bb8f34 { | 209 | .warpboxss .common-func-icon.icon-circle-bg-3.data-v-92bb8f34 { |
| 210 | - background: linear-gradient(135deg, #FFEBEE 0%, #F44336 100%); | 210 | + background: linear-gradient(135deg, #D32F2F 0%, #ef5350 50%, #c62828 100%); |
| 211 | box-shadow: 0 6rpx 20rpx rgba(211, 47, 47, 0.35), 0 2rpx 8rpx rgba(211, 47, 47, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 211 | box-shadow: 0 6rpx 20rpx rgba(211, 47, 47, 0.35), 0 2rpx 8rpx rgba(211, 47, 47, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 212 | } | 212 | } |
| 213 | .warpboxss .common-func-icon.icon-circle-bg-4.data-v-92bb8f34 { | 213 | .warpboxss .common-func-icon.icon-circle-bg-4.data-v-92bb8f34 { |
| 214 | - background: linear-gradient(135deg, #E0F7FA 0%, #00BCD4 100%); | 214 | + background: linear-gradient(135deg, #00838F 0%, #26a69a 50%, #00695C 100%); |
| 215 | box-shadow: 0 6rpx 20rpx rgba(0, 131, 143, 0.35), 0 2rpx 8rpx rgba(0, 131, 143, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 215 | box-shadow: 0 6rpx 20rpx rgba(0, 131, 143, 0.35), 0 2rpx 8rpx rgba(0, 131, 143, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 216 | } | 216 | } |
| 217 | .warpboxss .common-func-icon.icon-circle-bg-5.data-v-92bb8f34 { | 217 | .warpboxss .common-func-icon.icon-circle-bg-5.data-v-92bb8f34 { |
| 218 | - background: linear-gradient(135deg, #FFF3E0 0%, #FF9800 100%); | 218 | + background: linear-gradient(135deg, #F57C00 0%, #ffb74d 50%, #ef6c00 100%); |
| 219 | box-shadow: 0 6rpx 20rpx rgba(245, 124, 0, 0.35), 0 2rpx 8rpx rgba(245, 124, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 219 | box-shadow: 0 6rpx 20rpx rgba(245, 124, 0, 0.35), 0 2rpx 8rpx rgba(245, 124, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 220 | } | 220 | } |
| 221 | .warpboxss .common-func-icon.icon-circle-bg-6.data-v-92bb8f34 { | 221 | .warpboxss .common-func-icon.icon-circle-bg-6.data-v-92bb8f34 { |
| 222 | - background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); | 222 | + background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); |
| 223 | box-shadow: 0 6rpx 20rpx rgba(123, 31, 162, 0.35), 0 2rpx 8rpx rgba(123, 31, 162, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 223 | box-shadow: 0 6rpx 20rpx rgba(123, 31, 162, 0.35), 0 2rpx 8rpx rgba(123, 31, 162, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 224 | } | 224 | } |
| 225 | .warpboxss .common-func-icon.icon-circle-bg-7.data-v-92bb8f34 { | 225 | .warpboxss .common-func-icon.icon-circle-bg-7.data-v-92bb8f34 { |
| 226 | - background: linear-gradient(135deg, #FCE4EC 0%, #E91E63 100%); | 226 | + background: linear-gradient(135deg, #C2185B 0%, #e91e63 50%, #ad1457 100%); |
| 227 | box-shadow: 0 6rpx 20rpx rgba(194, 24, 91, 0.35), 0 2rpx 8rpx rgba(194, 24, 91, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 227 | box-shadow: 0 6rpx 20rpx rgba(194, 24, 91, 0.35), 0 2rpx 8rpx rgba(194, 24, 91, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 228 | } | 228 | } |
| 229 | .warpboxss .common-func-icon.icon-circle-bg-8.data-v-92bb8f34 { | 229 | .warpboxss .common-func-icon.icon-circle-bg-8.data-v-92bb8f34 { |
| 230 | - background: linear-gradient(135deg, #FFFDE7 0%, #FFC107 100%); | 230 | + background: linear-gradient(135deg, #F9A825 0%, #ffb74d 50%, #f57f17 100%); |
| 231 | box-shadow: 0 6rpx 20rpx rgba(249, 168, 37, 0.35), 0 2rpx 8rpx rgba(249, 168, 37, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 231 | box-shadow: 0 6rpx 20rpx rgba(249, 168, 37, 0.35), 0 2rpx 8rpx rgba(249, 168, 37, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 232 | } | 232 | } |
| 233 | .warpboxss .common-func-icon.icon-circle-bg-9.data-v-92bb8f34 { | 233 | .warpboxss .common-func-icon.icon-circle-bg-9.data-v-92bb8f34 { |
| 234 | - background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); | 234 | + background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); |
| 235 | box-shadow: 0 6rpx 20rpx rgba(25, 118, 210, 0.35), 0 2rpx 8rpx rgba(25, 118, 210, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 235 | box-shadow: 0 6rpx 20rpx rgba(25, 118, 210, 0.35), 0 2rpx 8rpx rgba(25, 118, 210, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 236 | } | 236 | } |
| 237 | .warpboxss .common-func-icon.icon-circle-bg-10.data-v-92bb8f34 { | 237 | .warpboxss .common-func-icon.icon-circle-bg-10.data-v-92bb8f34 { |
| 238 | - background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); | 238 | + background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); |
| 239 | box-shadow: 0 6rpx 20rpx rgba(56, 142, 60, 0.35), 0 2rpx 8rpx rgba(56, 142, 60, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 239 | box-shadow: 0 6rpx 20rpx rgba(56, 142, 60, 0.35), 0 2rpx 8rpx rgba(56, 142, 60, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 240 | } | 240 | } |
| 241 | .warpboxss .common-func-icon.icon-circle-bg-11.data-v-92bb8f34 { | 241 | .warpboxss .common-func-icon.icon-circle-bg-11.data-v-92bb8f34 { |
| 242 | - background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); | 242 | + background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); |
| 243 | box-shadow: 0 6rpx 20rpx rgba(183, 28, 28, 0.35), 0 2rpx 8rpx rgba(183, 28, 28, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 243 | box-shadow: 0 6rpx 20rpx rgba(183, 28, 28, 0.35), 0 2rpx 8rpx rgba(183, 28, 28, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 244 | } | 244 | } |
| 245 | .warpboxss .common-func-icon.icon-circle-bg-12.data-v-92bb8f34 { | 245 | .warpboxss .common-func-icon.icon-circle-bg-12.data-v-92bb8f34 { |
| 246 | - background: linear-gradient(135deg, #B2EBF2 0%, #0097A7 100%); | 246 | + background: linear-gradient(135deg, #0097A7 0%, #26a69a 50%, #00838f 100%); |
| 247 | box-shadow: 0 6rpx 20rpx rgba(0, 151, 167, 0.35), 0 2rpx 8rpx rgba(0, 151, 167, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 247 | box-shadow: 0 6rpx 20rpx rgba(0, 151, 167, 0.35), 0 2rpx 8rpx rgba(0, 151, 167, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 248 | } | 248 | } |
| 249 | .warpboxss .common-func-icon.icon-circle-bg-13.data-v-92bb8f34 { | 249 | .warpboxss .common-func-icon.icon-circle-bg-13.data-v-92bb8f34 { |
| 250 | - background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); | 250 | + background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); |
| 251 | box-shadow: 0 6rpx 20rpx rgba(230, 81, 0, 0.35), 0 2rpx 8rpx rgba(230, 81, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 251 | box-shadow: 0 6rpx 20rpx rgba(230, 81, 0, 0.35), 0 2rpx 8rpx rgba(230, 81, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 252 | } | 252 | } |
| 253 | .warpboxss .common-func-icon.icon-circle-bg-14.data-v-92bb8f34 { | 253 | .warpboxss .common-func-icon.icon-circle-bg-14.data-v-92bb8f34 { |
| 254 | - background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); | 254 | + background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); |
| 255 | box-shadow: 0 6rpx 20rpx rgba(106, 27, 154, 0.35), 0 2rpx 8rpx rgba(106, 27, 154, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 255 | box-shadow: 0 6rpx 20rpx rgba(106, 27, 154, 0.35), 0 2rpx 8rpx rgba(106, 27, 154, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 256 | } | 256 | } |
| 257 | .warpboxss .common-func-icon.icon-circle-bg-15.data-v-92bb8f34 { | 257 | .warpboxss .common-func-icon.icon-circle-bg-15.data-v-92bb8f34 { |
| 258 | - background: linear-gradient(135deg, #F8BBD0 0%, #C2185B 100%); | 258 | + background: linear-gradient(135deg, #AD1457 0%, #e91e63 50%, #880e4f 100%); |
| 259 | box-shadow: 0 6rpx 20rpx rgba(173, 20, 87, 0.35), 0 2rpx 8rpx rgba(173, 20, 87, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 259 | box-shadow: 0 6rpx 20rpx rgba(173, 20, 87, 0.35), 0 2rpx 8rpx rgba(173, 20, 87, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 260 | } | 260 | } |
| 261 | .warpboxss .common-func-icon.icon-circle-bg-16.data-v-92bb8f34 { | 261 | .warpboxss .common-func-icon.icon-circle-bg-16.data-v-92bb8f34 { |
| 262 | - background: linear-gradient(135deg, #FFF9C4 0%, #F9A825 100%); | 262 | + background: linear-gradient(135deg, #FBC02D 0%, #ffeb3b 50%, #f9a825 100%); |
| 263 | box-shadow: 0 6rpx 20rpx rgba(251, 192, 45, 0.35), 0 2rpx 8rpx rgba(251, 192, 45, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 263 | box-shadow: 0 6rpx 20rpx rgba(251, 192, 45, 0.35), 0 2rpx 8rpx rgba(251, 192, 45, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 264 | } | 264 | } |
| 265 | .warpboxss .common-func-icon.icon-circle-bg-17.data-v-92bb8f34 { | 265 | .warpboxss .common-func-icon.icon-circle-bg-17.data-v-92bb8f34 { |
| 266 | - background: linear-gradient(135deg, #EFEBE9 0%, #5D4037 100%); | 266 | + background: linear-gradient(135deg, #5D4037 0%, #8d6e63 50%, #3e2723 100%); |
| 267 | box-shadow: 0 6rpx 20rpx rgba(93, 64, 55, 0.35), 0 2rpx 8rpx rgba(93, 64, 55, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 267 | box-shadow: 0 6rpx 20rpx rgba(93, 64, 55, 0.35), 0 2rpx 8rpx rgba(93, 64, 55, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 268 | } | 268 | } |
| 269 | .warpboxss .common-func-icon.icon-circle-bg-18.data-v-92bb8f34 { | 269 | .warpboxss .common-func-icon.icon-circle-bg-18.data-v-92bb8f34 { |
| 270 | - background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); | 270 | + background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #5a67d8 100%); |
| 271 | box-shadow: 0 6rpx 20rpx rgba(102, 126, 234, 0.35), 0 2rpx 8rpx rgba(102, 126, 234, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 271 | box-shadow: 0 6rpx 20rpx rgba(102, 126, 234, 0.35), 0 2rpx 8rpx rgba(102, 126, 234, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 272 | } | 272 | } |
| 273 | .warpboxss .common-func-text.data-v-92bb8f34 { | 273 | .warpboxss .common-func-text.data-v-92bb8f34 { |
| @@ -437,71 +437,71 @@ | @@ -437,71 +437,71 @@ | ||
| 437 | transition: transform 300ms ease, opacity 300ms ease, -webkit-transform 300ms ease; | 437 | transition: transform 300ms ease, opacity 300ms ease, -webkit-transform 300ms ease; |
| 438 | } | 438 | } |
| 439 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-1.data-v-92bb8f34 { | 439 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-1.data-v-92bb8f34 { |
| 440 | - background: linear-gradient(135deg, #E3F2FD 0%, #2196F3 100%); | 440 | + background: linear-gradient(135deg, #1E88E5 0%, #42a5f5 50%, #1565C0 100%); |
| 441 | box-shadow: 0 6rpx 20rpx rgba(30, 136, 229, 0.35), 0 2rpx 8rpx rgba(30, 136, 229, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 441 | box-shadow: 0 6rpx 20rpx rgba(30, 136, 229, 0.35), 0 2rpx 8rpx rgba(30, 136, 229, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 442 | } | 442 | } |
| 443 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-2.data-v-92bb8f34 { | 443 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-2.data-v-92bb8f34 { |
| 444 | - background: linear-gradient(135deg, #E8F5E9 0%, #4CAF50 100%); | 444 | + background: linear-gradient(135deg, #43A047 0%, #66bb6a 50%, #388E3C 100%); |
| 445 | box-shadow: 0 6rpx 20rpx rgba(67, 160, 71, 0.35), 0 2rpx 8rpx rgba(67, 160, 71, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 445 | box-shadow: 0 6rpx 20rpx rgba(67, 160, 71, 0.35), 0 2rpx 8rpx rgba(67, 160, 71, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 446 | } | 446 | } |
| 447 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-3.data-v-92bb8f34 { | 447 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-3.data-v-92bb8f34 { |
| 448 | - background: linear-gradient(135deg, #FFEBEE 0%, #F44336 100%); | 448 | + background: linear-gradient(135deg, #D32F2F 0%, #ef5350 50%, #c62828 100%); |
| 449 | box-shadow: 0 6rpx 20rpx rgba(211, 47, 47, 0.35), 0 2rpx 8rpx rgba(211, 47, 47, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 449 | box-shadow: 0 6rpx 20rpx rgba(211, 47, 47, 0.35), 0 2rpx 8rpx rgba(211, 47, 47, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 450 | } | 450 | } |
| 451 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-4.data-v-92bb8f34 { | 451 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-4.data-v-92bb8f34 { |
| 452 | - background: linear-gradient(135deg, #E0F7FA 0%, #00BCD4 100%); | 452 | + background: linear-gradient(135deg, #00838F 0%, #26a69a 50%, #00695C 100%); |
| 453 | box-shadow: 0 6rpx 20rpx rgba(0, 131, 143, 0.35), 0 2rpx 8rpx rgba(0, 131, 143, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 453 | box-shadow: 0 6rpx 20rpx rgba(0, 131, 143, 0.35), 0 2rpx 8rpx rgba(0, 131, 143, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 454 | } | 454 | } |
| 455 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-5.data-v-92bb8f34 { | 455 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-5.data-v-92bb8f34 { |
| 456 | - background: linear-gradient(135deg, #FFF3E0 0%, #FF9800 100%); | 456 | + background: linear-gradient(135deg, #F57C00 0%, #ffb74d 50%, #ef6c00 100%); |
| 457 | box-shadow: 0 6rpx 20rpx rgba(245, 124, 0, 0.35), 0 2rpx 8rpx rgba(245, 124, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 457 | box-shadow: 0 6rpx 20rpx rgba(245, 124, 0, 0.35), 0 2rpx 8rpx rgba(245, 124, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 458 | } | 458 | } |
| 459 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-6.data-v-92bb8f34 { | 459 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-6.data-v-92bb8f34 { |
| 460 | - background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); | 460 | + background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); |
| 461 | box-shadow: 0 6rpx 20rpx rgba(123, 31, 162, 0.35), 0 2rpx 8rpx rgba(123, 31, 162, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 461 | box-shadow: 0 6rpx 20rpx rgba(123, 31, 162, 0.35), 0 2rpx 8rpx rgba(123, 31, 162, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 462 | } | 462 | } |
| 463 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-7.data-v-92bb8f34 { | 463 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-7.data-v-92bb8f34 { |
| 464 | - background: linear-gradient(135deg, #FCE4EC 0%, #E91E63 100%); | 464 | + background: linear-gradient(135deg, #C2185B 0%, #e91e63 50%, #ad1457 100%); |
| 465 | box-shadow: 0 6rpx 20rpx rgba(194, 24, 91, 0.35), 0 2rpx 8rpx rgba(194, 24, 91, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 465 | box-shadow: 0 6rpx 20rpx rgba(194, 24, 91, 0.35), 0 2rpx 8rpx rgba(194, 24, 91, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 466 | } | 466 | } |
| 467 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-8.data-v-92bb8f34 { | 467 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-8.data-v-92bb8f34 { |
| 468 | - background: linear-gradient(135deg, #FFFDE7 0%, #FFC107 100%); | 468 | + background: linear-gradient(135deg, #F9A825 0%, #ffb74d 50%, #f57f17 100%); |
| 469 | box-shadow: 0 6rpx 20rpx rgba(249, 168, 37, 0.35), 0 2rpx 8rpx rgba(249, 168, 37, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 469 | box-shadow: 0 6rpx 20rpx rgba(249, 168, 37, 0.35), 0 2rpx 8rpx rgba(249, 168, 37, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 470 | } | 470 | } |
| 471 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-9.data-v-92bb8f34 { | 471 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-9.data-v-92bb8f34 { |
| 472 | - background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); | 472 | + background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); |
| 473 | box-shadow: 0 6rpx 20rpx rgba(25, 118, 210, 0.35), 0 2rpx 8rpx rgba(25, 118, 210, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 473 | box-shadow: 0 6rpx 20rpx rgba(25, 118, 210, 0.35), 0 2rpx 8rpx rgba(25, 118, 210, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 474 | } | 474 | } |
| 475 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-10.data-v-92bb8f34 { | 475 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-10.data-v-92bb8f34 { |
| 476 | - background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); | 476 | + background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); |
| 477 | box-shadow: 0 6rpx 20rpx rgba(56, 142, 60, 0.35), 0 2rpx 8rpx rgba(56, 142, 60, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 477 | box-shadow: 0 6rpx 20rpx rgba(56, 142, 60, 0.35), 0 2rpx 8rpx rgba(56, 142, 60, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 478 | } | 478 | } |
| 479 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-11.data-v-92bb8f34 { | 479 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-11.data-v-92bb8f34 { |
| 480 | - background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); | 480 | + background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); |
| 481 | box-shadow: 0 6rpx 20rpx rgba(183, 28, 28, 0.35), 0 2rpx 8rpx rgba(183, 28, 28, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 481 | box-shadow: 0 6rpx 20rpx rgba(183, 28, 28, 0.35), 0 2rpx 8rpx rgba(183, 28, 28, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 482 | } | 482 | } |
| 483 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-12.data-v-92bb8f34 { | 483 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-12.data-v-92bb8f34 { |
| 484 | - background: linear-gradient(135deg, #B2EBF2 0%, #0097A7 100%); | 484 | + background: linear-gradient(135deg, #0097A7 0%, #26a69a 50%, #00838f 100%); |
| 485 | box-shadow: 0 6rpx 20rpx rgba(0, 151, 167, 0.35), 0 2rpx 8rpx rgba(0, 151, 167, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 485 | box-shadow: 0 6rpx 20rpx rgba(0, 151, 167, 0.35), 0 2rpx 8rpx rgba(0, 151, 167, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 486 | } | 486 | } |
| 487 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-13.data-v-92bb8f34 { | 487 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-13.data-v-92bb8f34 { |
| 488 | - background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); | 488 | + background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); |
| 489 | box-shadow: 0 6rpx 20rpx rgba(230, 81, 0, 0.35), 0 2rpx 8rpx rgba(230, 81, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 489 | box-shadow: 0 6rpx 20rpx rgba(230, 81, 0, 0.35), 0 2rpx 8rpx rgba(230, 81, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 490 | } | 490 | } |
| 491 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-14.data-v-92bb8f34 { | 491 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-14.data-v-92bb8f34 { |
| 492 | - background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); | 492 | + background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); |
| 493 | box-shadow: 0 6rpx 20rpx rgba(106, 27, 154, 0.35), 0 2rpx 8rpx rgba(106, 27, 154, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 493 | box-shadow: 0 6rpx 20rpx rgba(106, 27, 154, 0.35), 0 2rpx 8rpx rgba(106, 27, 154, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 494 | } | 494 | } |
| 495 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-15.data-v-92bb8f34 { | 495 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-15.data-v-92bb8f34 { |
| 496 | - background: linear-gradient(135deg, #F8BBD0 0%, #C2185B 100%); | 496 | + background: linear-gradient(135deg, #AD1457 0%, #e91e63 50%, #880e4f 100%); |
| 497 | box-shadow: 0 6rpx 20rpx rgba(173, 20, 87, 0.35), 0 2rpx 8rpx rgba(173, 20, 87, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 497 | box-shadow: 0 6rpx 20rpx rgba(173, 20, 87, 0.35), 0 2rpx 8rpx rgba(173, 20, 87, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 498 | } | 498 | } |
| 499 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-16.data-v-92bb8f34 { | 499 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-16.data-v-92bb8f34 { |
| 500 | - background: linear-gradient(135deg, #FFF9C4 0%, #F9A825 100%); | 500 | + background: linear-gradient(135deg, #FBC02D 0%, #ffeb3b 50%, #f9a825 100%); |
| 501 | box-shadow: 0 6rpx 20rpx rgba(251, 192, 45, 0.35), 0 2rpx 8rpx rgba(251, 192, 45, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 501 | box-shadow: 0 6rpx 20rpx rgba(251, 192, 45, 0.35), 0 2rpx 8rpx rgba(251, 192, 45, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 502 | } | 502 | } |
| 503 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-17.data-v-92bb8f34 { | 503 | .fun_box_fir .fun_fir_1 .icon.icon-circle-bg-17.data-v-92bb8f34 { |
| 504 | - background: linear-gradient(135deg, #EFEBE9 0%, #5D4037 100%); | 504 | + background: linear-gradient(135deg, #5D4037 0%, #8d6e63 50%, #3e2723 100%); |
| 505 | box-shadow: 0 6rpx 20rpx rgba(93, 64, 55, 0.35), 0 2rpx 8rpx rgba(93, 64, 55, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 505 | box-shadow: 0 6rpx 20rpx rgba(93, 64, 55, 0.35), 0 2rpx 8rpx rgba(93, 64, 55, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 506 | } | 506 | } |
| 507 | .fun_box_fir .fun_fir_border.data-v-92bb8f34 { | 507 | .fun_box_fir .fun_fir_border.data-v-92bb8f34 { |
| @@ -582,15 +582,15 @@ | @@ -582,15 +582,15 @@ | ||
| 582 | filter: brightness(1.2) drop-shadow(0 2rpx 4rpx rgba(0, 0, 0, 0.2)); | 582 | filter: brightness(1.2) drop-shadow(0 2rpx 4rpx rgba(0, 0, 0, 0.2)); |
| 583 | } | 583 | } |
| 584 | .mgmt-icon.icon-circle-bg-6.data-v-92bb8f34 { | 584 | .mgmt-icon.icon-circle-bg-6.data-v-92bb8f34 { |
| 585 | - background: linear-gradient(135deg, #F3E5F5 0%, #9C27B0 100%); | 585 | + background: linear-gradient(135deg, #7B1FA2 0%, #9c27b0 50%, #6a1b9a 100%); |
| 586 | box-shadow: 0 6rpx 20rpx rgba(123, 31, 162, 0.35), 0 2rpx 8rpx rgba(123, 31, 162, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 586 | box-shadow: 0 6rpx 20rpx rgba(123, 31, 162, 0.35), 0 2rpx 8rpx rgba(123, 31, 162, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 587 | } | 587 | } |
| 588 | .mgmt-icon.icon-circle-bg-9.data-v-92bb8f34 { | 588 | .mgmt-icon.icon-circle-bg-9.data-v-92bb8f34 { |
| 589 | - background: linear-gradient(135deg, #BBDEFB 0%, #1976D2 100%); | 589 | + background: linear-gradient(135deg, #1976D2 0%, #42a5f5 50%, #1565C0 100%); |
| 590 | box-shadow: 0 6rpx 20rpx rgba(25, 118, 210, 0.35), 0 2rpx 8rpx rgba(25, 118, 210, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 590 | box-shadow: 0 6rpx 20rpx rgba(25, 118, 210, 0.35), 0 2rpx 8rpx rgba(25, 118, 210, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 591 | } | 591 | } |
| 592 | .mgmt-icon.icon-circle-bg-10.data-v-92bb8f34 { | 592 | .mgmt-icon.icon-circle-bg-10.data-v-92bb8f34 { |
| 593 | - background: linear-gradient(135deg, #C8E6C9 0%, #388E3C 100%); | 593 | + background: linear-gradient(135deg, #388E3C 0%, #66bb6a 50%, #2e7d32 100%); |
| 594 | box-shadow: 0 6rpx 20rpx rgba(56, 142, 60, 0.35), 0 2rpx 8rpx rgba(56, 142, 60, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 594 | box-shadow: 0 6rpx 20rpx rgba(56, 142, 60, 0.35), 0 2rpx 8rpx rgba(56, 142, 60, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 595 | } | 595 | } |
| 596 | .mgmt-text.data-v-92bb8f34 { | 596 | .mgmt-text.data-v-92bb8f34 { |
| @@ -673,15 +673,15 @@ | @@ -673,15 +673,15 @@ | ||
| 673 | filter: brightness(1.2) drop-shadow(0 2rpx 4rpx rgba(0, 0, 0, 0.2)); | 673 | filter: brightness(1.2) drop-shadow(0 2rpx 4rpx rgba(0, 0, 0, 0.2)); |
| 674 | } | 674 | } |
| 675 | .bottom-icon.icon-circle-bg-11.data-v-92bb8f34 { | 675 | .bottom-icon.icon-circle-bg-11.data-v-92bb8f34 { |
| 676 | - background: linear-gradient(135deg, #FFCDD2 0%, #D32F2F 100%); | 676 | + background: linear-gradient(135deg, #B71C1C 0%, #ef5350 50%, #c62828 100%); |
| 677 | box-shadow: 0 6rpx 20rpx rgba(183, 28, 28, 0.35), 0 2rpx 8rpx rgba(183, 28, 28, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 677 | box-shadow: 0 6rpx 20rpx rgba(183, 28, 28, 0.35), 0 2rpx 8rpx rgba(183, 28, 28, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 678 | } | 678 | } |
| 679 | .bottom-icon.icon-circle-bg-13.data-v-92bb8f34 { | 679 | .bottom-icon.icon-circle-bg-13.data-v-92bb8f34 { |
| 680 | - background: linear-gradient(135deg, #FFE0B2 0%, #F57C00 100%); | 680 | + background: linear-gradient(135deg, #E65100 0%, #ff9800 50%, #e64a19 100%); |
| 681 | box-shadow: 0 6rpx 20rpx rgba(230, 81, 0, 0.35), 0 2rpx 8rpx rgba(230, 81, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 681 | box-shadow: 0 6rpx 20rpx rgba(230, 81, 0, 0.35), 0 2rpx 8rpx rgba(230, 81, 0, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 682 | } | 682 | } |
| 683 | .bottom-icon.icon-circle-bg-14.data-v-92bb8f34 { | 683 | .bottom-icon.icon-circle-bg-14.data-v-92bb8f34 { |
| 684 | - background: linear-gradient(135deg, #E1BEE7 0%, #7B1FA2 100%); | 684 | + background: linear-gradient(135deg, #6A1B9A 0%, #9c27b0 50%, #4a148c 100%); |
| 685 | box-shadow: 0 6rpx 20rpx rgba(106, 27, 154, 0.35), 0 2rpx 8rpx rgba(106, 27, 154, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); | 685 | box-shadow: 0 6rpx 20rpx rgba(106, 27, 154, 0.35), 0 2rpx 8rpx rgba(106, 27, 154, 0.25), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.3), inset 0 -2rpx 4rpx rgba(0, 0, 0, 0.1); |
| 686 | } | 686 | } |
| 687 | .bottom-text.data-v-92bb8f34 { | 687 | .bottom-text.data-v-92bb8f34 { |