upp

package.json

@@ -21,6 +21,7 @@
     "braft-utils": "^3.0.12",
     "dayjs": "^1.11.10",
     "echarts": "^6.0.0",
+    "echarts-for-react": "^3.0.6",
     "file-saver": "^2.0.5",
     "js-base64": "^3.7.3",
     "js-export-excel": "^1.1.4",

src/pages/Abench/A1statistics/index.module.scss

@@ -1,4 +1,125 @@
 .A1statistics {
+  padding: 24px;
   :global {
+    .A1_1 {
+      display: flex;
+      margin-bottom: 15px;
+      & > div {
+        width: 18%;
+        height: 150px;
+        border-radius: 6px;
+        border: 1px solid #ccc;
+        background-color: #fff;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        margin-right: 14px;
+        & > div {
+          padding-left: 28px;
+          display: flex;
+          align-items: center;
+          margin-bottom: 20px;
+          img {
+            margin-right: 8px;
+            width: 36px;
+            height: 36px;
+          }
+          h3 {
+            font-size: 16px;
+          }
+        }
+        & > p {
+          padding-left: 55px;
+          & > span {
+            font-size: 34px;
+            font-weight: 700;
+            color: var(--myAntdColor);
+          }
+          & > i {
+            display: inline-block;
+            margin-left: 15px;
+            & > i {
+              margin-left: 5px;
+              font-weight: 700;
+              font-size: 24px;
+              color: var(--myAntdColor);
+            }
+          }
+        }
+      }
+      .A1_1_3 {
+        width: 520px;
+      }
+      .A1_1_4 {
+        margin-right: 0;
+        width: 29%;
+        & > div {
+          position: relative;
+          .A1_1_4_1 {
+            position: absolute;
+            right: 15px;
+            top: 50%;
+            transform: translateY(-50%);
+          }
+        }
+      }
+    }
+
+    .A1_box {
+      width: 100%;
+      height: calc(100% - 160px);
+      display: flex;
+      & > div {
+        padding: 15px;
+        .A1tit {
+          font-weight: 700;
+          font-size: 20px;
+        }
+      }
+      .A1_2 {
+        width: 65%;
+        background-color: #fff;
+        border: 1px solid #ccc;
+        border-radius: 6px;
+        display: flex;
+        justify-content: space-between;
+        .A1_2row {
+          width: 49%;
+          .A1_2ech {
+            width: 100%;
+            height: calc(100% - 20px);
+          }
+        }
+      }
+      .A1_3 {
+        padding: 0;
+        margin-left: 15px;
+        width: calc(35% - 15px);
+        .A1_3row {
+          padding: 15px;
+          background-color: #fff;
+          border: 1px solid #ccc;
+          border-radius: 6px;
+          height: calc(50% - 9px);
+          margin-bottom: 18px;
+          &:nth-of-type(2) {
+            margin-bottom: 0px;
+          }
+          .A1tit2 {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            & > div {
+              font-weight: 700;
+              font-size: 20px;
+            }
+          }
+          .A1_3ech {
+            width: 100%;
+            height: calc(100% - 30px);
+          }
+        }
+      }
+    }
   }
 }

src/pages/Abench/A1statistics/index.tsx

@@ -1,9 +1,410 @@
-import React from 'react'
+import React, { useCallback, useEffect } from 'react'
 import styles from './index.module.scss'
+import { Select } from 'antd'
+import { iconUrl } from '@/utils/http'
+import * as echarts from 'echarts'
+
+const chartData1 = [
+  { name: '啤酒产品类', value: 2500, percentage: '10%' },
+  { name: '饮用器皿类', value: 1800, percentage: '5%' },
+  { name: '品牌文化与节庆类', value: 1200, percentage: '2%' },
+  { name: '企业文化与档案类', value: 800, percentage: '3%' },
+  { name: '艺术与礼品类', value: 1000, percentage: '10%' },
+  { name: '工具与设备类', value: 900, percentage: '5%' },
+  { name: '其他综合类', value: 2500, percentage: '10%' }
+]
+
+const chartData2 = [
+  { name: '酒类实物', value: 2500, percentage: '10%' },
+  { name: '包装与标识', value: 1800, percentage: '8%' },
+  { name: '杯子', value: 1200, percentage: '6%' },
+  { name: '品牌节庆活动', value: 1800, percentage: '8%' },
+  { name: '品牌视觉传播', value: 1800, percentage: '8%' },
+  { name: '文书档案', value: 1800, percentage: '8%' },
+  { name: '影像资料', value: 1800, percentage: '8%' },
+  { name: '荣誉与表彰', value: 1800, percentage: '8%' },
+  { name: '企业藏品', value: 1800, percentage: '8%' },
+  { name: '艺术藏品', value: 1800, percentage: '8%' },
+  { name: '纪念礼品', value: 1800, percentage: '8%' },
+  { name: '酿造与开启工具', value: 1800, percentage: '8%' },
+  { name: '设备模型或实物', value: 1800, percentage: '8%' },
+  { name: '其他', value: 1800, percentage: '6%' }
+]
+
+const DEFAULT_COLORS = ['#c11b2d', '#243220', '#24664b', '#8acfb2', '#806e4c', '#988364', '#972d00']
+
+const binData1 = [
+  {
+    name: '啤酒产品类',
+    value: 2500
+  },
+  {
+    name: '饮用器皿类',
+    value: 1800
+  },
+  {
+    name: '品牌文化与节庆类',
+    value: 1200
+  },
+  {
+    name: '企业历史与档案类',
+    value: 800
+  },
+  {
+    name: '艺术与礼品类',
+    value: 1000
+  },
+  {
+    name: '工具与设备类',
+    value: 900
+  },
+  {
+    name: '其他综合类',
+    value: 600
+  }
+]
+
+const binData2 = [
+  {
+    name: '酒起',
+    value: 400
+  },
+  {
+    name: '杯子',
+    value: 100
+  },
+  {
+    name: '护肤品',
+    value: 100
+  },
+  {
+    name: '冰箱贴',
+    value: 100
+  },
+  {
+    name: '衣服',
+    value: 100
+  }
+]
+
+// 先写一些静态的
 function A1statistics() {
+  // 生成柱状图
+  const initEchFu = useCallback((data: any[], dom: any) => {
+    if (!dom) return
+    const myChart = echarts.getInstanceByDom(dom) || echarts.init(dom)
+
+    const option: echarts.EChartsOption = {
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          type: 'shadow'
+        },
+        formatter: (params: any) => {
+          const param = params[0]
+          return `
+                  <div style="font-weight: bold;">${param.name}</div>
+                  <div>数量: ${param.value}</div>
+                  <div>占比: ${param.data.percentage}</div>
+                `
+        },
+        backgroundColor: 'rgba(255, 255, 255, 0.95)',
+        borderColor: '#ddd',
+        textStyle: {
+          color: '#000'
+        }
+      },
+      grid: {
+        left: '5%',
+        right: '5%',
+        // 减小底部距离 - 调整这个值可以让柱子更靠近底部
+        bottom: '5%',
+        top: '5%',
+        containLabel: true
+      },
+      xAxis: {
+        type: 'category',
+        data: data.map(item => item.name),
+        axisLabel: {
+          interval: 0,
+          rotate: 30,
+          fontSize: 12,
+          color: '#000',
+          margin: 15 // 调整标签与柱子的距离
+        },
+        axisLine: {
+          lineStyle: {
+            color: '#999'
+          }
+        },
+        axisTick: {
+          show: true,
+          alignWithLabel: true,
+          length: 4
+        },
+        // 调整X轴位置，使其更靠近柱子底部
+        offset: 10
+      },
+      yAxis: {
+        type: 'value',
+        name: '',
+        nameTextStyle: {
+          fontSize: 14,
+          color: '#000',
+          padding: [0, 0, 0, 10]
+        },
+        axisLabel: {
+          fontSize: 12,
+          color: '#000',
+          formatter: (value: number) => {
+            if (value >= 1000) {
+              return `${value / 1000}k`
+            }
+            return value.toString()
+          }
+        },
+        splitLine: {
+          lineStyle: {
+            type: 'dashed',
+            color: '#e0e0e0'
+          }
+        },
+        // 设置Y轴最大值
+        max: 3000,
+        min: 0,
+        // 调整Y轴刻度
+        interval: 500
+      },
+      series: [
+        {
+          name: '数量',
+          type: 'bar',
+          data: data.map((item, index) => ({
+            value: item.value,
+            percentage: item.percentage,
+            // 为每个柱子设置独立的渐变
+            itemStyle: {
+              // 关键修改：使用线性渐变实现单个柱子的渐变效果
+              color: new echarts.graphic.LinearGradient(
+                0,
+                0,
+                0,
+                1, // 0,0表示起点，0,1表示终点（垂直方向渐变）
+                [
+                  { offset: 0, color: '#bb1e2e' }, // 顶部颜色
+                  { offset: 1, color: '#29644a' } // 底部颜色（更浅/白色）
+                ]
+              ),
+              borderRadius: [10, 10, 10, 10],
+              // 添加阴影效果增强立体感
+              shadowColor: 'rgba(0, 0, 0, 0.1)',
+              shadowBlur: 4,
+              shadowOffsetY: 2
+            }
+          })),
+          barWidth: '50%', // 稍微调窄柱子
+          // 调整标签位置和样式
+          label: {
+            show: true,
+            position: 'top',
+            formatter: (params: any) => {
+              const itemData = params.data
+              return `${itemData.value}\n${itemData.percentage}`
+            },
+            fontSize: 10,
+            fontWeight: 'bold',
+            color: '#000',
+            lineHeight: 16
+          },
+
+          emphasis: {
+            itemStyle: {
+              shadowColor: 'rgba(0, 0, 0, 0.3)',
+              shadowBlur: 10,
+              shadowOffsetY: 3
+            }
+          }
+        }
+      ]
+    }
+
+    myChart.setOption(option)
+  }, [])
+
+  // 生成饼图
+  const binInitFu = useCallback((data: any[], dom: any) => {
+    if (!dom) return
+
+    // 计算总数用于百分比
+    const total = data.reduce((sum, item) => sum + item.value, 0)
+
+    const myChart = echarts.getInstanceByDom(dom) || echarts.init(dom)
+    const option = {
+      color: DEFAULT_COLORS, // 设置颜色方案
+      tooltip: {
+        trigger: 'item',
+        formatter: '{b}: {c} ({d}%)'
+      },
+      legend: {
+        type: 'scroll',
+        orient: 'vertical',
+        left: '52%',
+        top: 'center',
+        itemGap: 15,
+        textStyle: {
+          fontSize: 12
+        },
+        formatter: function (name: string) {
+          const item = data.find(d => d.name === name)
+          if (item) {
+            const percent = ((item.value / total) * 100).toFixed(1)
+            return `${name}  ${item.value}  ${percent}%`
+          }
+          return name
+        }
+      },
+      series: [
+        {
+          name: '品类分布',
+          type: 'pie',
+          center: ['25%', '50%'], // 设置饼图中心位置
+          radius: ['50%', '90%'],
+          avoidLabelOverlap: false,
+          itemStyle: {
+            borderRadius: 0,
+            borderColor: '#fff',
+            borderWidth: 2
+          },
+          label: {
+            show: false
+          },
+          labelLine: {
+            show: false
+          },
+          emphasis: {
+            itemStyle: {
+              shadowBlur: 10,
+              shadowOffsetX: 0,
+              shadowColor: 'rgba(0, 0, 0, 0.5)'
+            }
+          },
+          data: data.map(item => ({
+            name: item.name,
+            value: item.value
+          }))
+        }
+      ]
+    }
+    myChart.setOption(option)
+  }, [])
+
+  useEffect(() => {
+    initEchFu(chartData1, document.querySelector('#echBox1'))
+    initEchFu(chartData2, document.querySelector('#echBox2'))
+
+    binInitFu(binData1, document.querySelector('#echBox3'))
+    binInitFu(binData2, document.querySelector('#echBox4'))
+  }, [binInitFu, initEchFu])
+
   return (
     <div className={styles.A1statistics}>
       <div className='pageTitle'>数据统计</div>
+
+      <div className='A1_1'>
+        <div>
+          <div>
+            <img src={iconUrl + '/a11.png'} alt='' />
+            <h3>藏品总数</h3>
+          </div>
+          <p>
+            <span>3741</span>（件/套）
+          </p>
+        </div>
+        <div>
+          <div>
+            <img src={iconUrl + '/a22.png'} alt='' />
+            <h3>藏品总数量</h3>
+          </div>
+          <p>
+            <span>5834</span>（个）
+          </p>
+        </div>
+
+        <div className='A1_1_3'>
+          <div>
+            <img src={iconUrl + '/a33.png'} alt='' />
+            <h3>定级文物数量</h3>
+          </div>
+          <p>
+            <span>120</span>（件/套）
+            <i>
+              一级<i>20</i>
+            </i>
+            <i>
+              二级<i>30</i>
+            </i>
+            <i>
+              三级<i>40</i>
+            </i>
+            <i>
+              一般<i>30</i>
+            </i>
+          </p>
+        </div>
+
+        <div className='A1_1_4'>
+          <div>
+            <img src={iconUrl + '/a44.png'} alt='' />
+            <h3>年度新增产品数量</h3>
+            <div className='A1_1_4_1'>
+              <Select
+                defaultValue={2026}
+                options={[
+                  { value: 2026, label: '2026年度' },
+                  { value: 2025, label: '2025年度' },
+                  { value: 2024, label: '2024年度' }
+                ]}
+              />
+            </div>
+          </div>
+          <p>
+            <span>123</span>（件/套）
+          </p>
+        </div>
+      </div>
+
+      <div className='A1_box'>
+        <div className='A1_2'>
+          <div className='A1_2row'>
+            <div className='A1tit'>一级分类</div>
+            <div className='A1_2ech' id='echBox1'></div>
+          </div>
+          <div className='A1_2row'>
+            <div className='A1tit'>二级分类</div>
+            <div className='A1_2ech' id='echBox2'></div>
+          </div>
+        </div>
+        <div className='A1_3'>
+          <div className='A1_3row'>
+            <div className='A1tit2'>
+              <div>材质统计</div>
+              <Select defaultValue={'杯子'} options={[{ value: '杯子', label: '杯子' }]} />
+            </div>
+            <div className='A1_3ech' id='echBox3'></div>
+          </div>
+
+          <div className='A1_3row'>
+            <div className='A1tit2'>
+              <div>品类统计</div>
+              <Select
+                defaultValue={'文创产品'}
+                options={[{ value: '文创产品', label: '文创产品' }]}
+              />
+            </div>
+            <div className='A1_3ech' id='echBox4'></div>
+          </div>
+        </div>
+      </div>
     </div>
   )
 }

src/pages/Zother/EditBtn/index.tsx

@@ -64,7 +64,7 @@ function EditBtn({
     }
   }, [btnCan])
 
-  // 藏品登记号为空 和重复的判断
+  //   藏品数量不能为空判断 、藏品登记号为空 和重复的判断
   const numFlag = (data: GoodsType[]) => {
     const numSet = new Set<string>()
 
@@ -74,6 +74,10 @@ function EditBtn({
         return `${item.name} - 藏品登记号不能为空`
       }
 
+      if (!item.pcs || !item.pcsUnitDictId) {
+        return `${item.name} - 藏品数量不能为空`
+      }
+
       // 检查是否重复
       if (numSet.has(item.num)) {
         const duplicateNames = data.filter(d => d.num === item.num).map(d => d.name)

src/utils/http.ts

@@ -7,8 +7,8 @@ import { domShowFu } from './domShow'
 
 export const envFlag = process.env.NODE_ENV === 'development'
 
-// const baseUrlTemp = 'https://sit-qingdaobeer.4dage.com' // 测试环境
-const baseUrlTemp = 'http://192.168.20.61:8112' // 线下环境
+const baseUrlTemp = 'https://sit-qingdaobeer.4dage.com' // 测试环境
+// const baseUrlTemp = 'http://192.168.20.61:8112' // 线下环境
 
 const baseFlag = baseUrlTemp.includes('https://')
 

src/utils/tableData.ts

@@ -182,7 +182,7 @@ export const GI3tableC = [
   ['select', '附件类型', 'type', selectObj['附件类型']],
   ['txt', '附件名称', 'fileName'],
   ['dateRes', '上传日期', 'createTime'],
-  ['txtC', '上传人', 'creatorName'],
+  ['txt', '上传人', 'creatorName'],
   ['sizeNum', '文件大小(mb)', 'fileSize', 1024]
 ]
 // 藏品详情----藏品故事

yarn.lock

@@ -4543,6 +4543,14 @@ eastasianwidth@^0.2.0:
   resolved "https://registry.npmmirror.com/eastasianwidth/-/eastasianwidth-0.2.0.tgz#696ce2ec0aa0e6ea93a397ffcf24aa7840c827cb"
   integrity sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==
 
+echarts-for-react@^3.0.6:
+  version "3.0.6"
+  resolved "https://registry.npmmirror.com/echarts-for-react/-/echarts-for-react-3.0.6.tgz#267908f53854856833dc39088d2a97ab4bbfad86"
+  integrity sha512-4zqLgTGWS3JvkQDXjzkR1k1CHRdpd6by0988TWMJgnvDytegWLbeP/VNZmMa+0VJx2eD7Y632bi2JquXDgiGJg==
+  dependencies:
+    fast-deep-equal "^3.1.3"
+    size-sensor "^1.0.1"
+
 echarts@^6.0.0:
   version "6.0.0"
   resolved "https://registry.npmmirror.com/echarts/-/echarts-6.0.0.tgz#2935aa7751c282d1abbbf7d719d397199a15b9e7"
@@ -9719,6 +9727,11 @@ sisteransi@^1.0.5:
   resolved "https://registry.npmmirror.com/sisteransi/-/sisteransi-1.0.5.tgz#134d681297756437cc05ca01370d3a7a571075ed"
   integrity sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==
 
+size-sensor@^1.0.1:
+  version "1.0.3"
+  resolved "https://registry.npmmirror.com/size-sensor/-/size-sensor-1.0.3.tgz#4ce525cbc5a098da09852e38b6f851ebb9b5116a"
+  integrity sha512-+k9mJ2/rQMiRmQUcjn+qznch260leIXY8r4FyYKKyRBO/s5UoeMAHGkCJyE1R/4wrIhTJONfyloY55SkE7ve3A==
+
 slash@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmmirror.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634"