shaogen1995 2 anni fa
parent
commit
40fd5f36b7

File diff suppressed because it is too large
+ 45 - 0
vue/public/echarts.min.js


BIN
vue/public/goodsData/2D/1_1.JPG


BIN
vue/public/goodsData/2D/1_2.JPG


BIN
vue/public/goodsData/2D/2.JPG


BIN
vue/public/goodsData/2D/3_1.JPG


BIN
vue/public/goodsData/2D/3_2.JPG


BIN
vue/public/goodsData/2D/3_3.JPG


BIN
vue/public/goodsData/2D/3_4.JPG


BIN
vue/public/goodsData/2D/4_1.JPG


BIN
vue/public/goodsData/2D/4_2.JPG


BIN
vue/public/goodsData/2D/4_3.JPG


BIN
vue/public/goodsData/2D/5_1.JPG


BIN
vue/public/goodsData/2D/5_2.JPG


BIN
vue/public/goodsData/2D/6.JPG


BIN
vue/public/goodsData/2D/7_1.JPG


BIN
vue/public/goodsData/2D/7_2.JPG


BIN
vue/public/goodsData/2D/8.JPG


+ 1 - 0
vue/public/index.html

@@ -6,6 +6,7 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="./favicon.ico">
     <title>雨花台烈士纪念馆</title>
+    <script src="./echarts.min.js"></script>
   </head>
   <body>
     <noscript>

BIN
vue/src/assets/img/Likebac.jpg


+ 4 - 4
vue/src/views/Goods/components/Img.vue

@@ -28,9 +28,9 @@
               class="swiper-slide"
               v-for="i in info.imgNum"
               :key="i"
-              @click="lookImg(require('@/assets/img/Home/bac.jpg'))"
+              @click="lookImg(`goodsData/2D/${info.bs}_${i}.JPG`)"
             >
-              <img v-lazy="require('@/assets/img/Home/bac.jpg')" alt="" />
+              <img v-lazy="`goodsData/2D/${info.bs}_${i}.JPG`" alt="" />
             </div>
           </div>
         </div>
@@ -41,9 +41,9 @@
     </template>
     <div class="imgMain2" v-else>
       <img
-        v-lazy="require('@/assets/img/Home/bac.jpg')"
+        v-lazy="`goodsData/2D/${info.bs}.JPG`"
         alt=""
-        @click="lookImg(require('@/assets/img/Home/bac.jpg'))"
+        @click="lookImg(`goodsData/2D/${info.bs}.JPG`)"
       />
     </div>
   </div>

+ 2 - 1
vue/src/views/Goods/components/Tow.vue

@@ -8,7 +8,8 @@
         v-for="(item, index) in data"
         :key="index"
       >
-        <div><img v-lazy="require('@/assets/img/Home/demo.png')" alt="" /></div>
+        <div v-if="item.imgNum"><img v-lazy="`goodsData/2D/${item.bs}_1.JPG`" alt="" /></div>
+        <div v-else><img v-lazy="`goodsData/2D/${item.bs}.JPG`" alt="" /></div>
         <p>{{ item.name }}</p>
       </div>
     </div>

+ 15 - 55
vue/src/views/Goods/data.js

@@ -14,85 +14,45 @@ export const goodsData = {
   '3D': [
     // 手稿
     { bs: 'yht06', type: 'straw', name: '1943年丁行烈士在狱中刻的图章1', age: '', sort: '书法、绘画', grain: '钢,其他金属,其他无机质', long: '13', width: '', tall: '' },
-    { bs: 'yht40', type: 'straw', name: '1943年丁行在狱中手磨制的石笔架1', age: '', sort: '文件、宣传品', grain: '其他无机质', long: '5', width: '1.1', tall: '1.2' },
-    { bs: 'yht49', type: 'straw', name: '民国时期蒋宗銮烈士小学时竹木刻2', age: '', sort: '文件、宣传品', grain: '其他金属', long: '7', width: '1.5', tall: '' },
     { bs: 'yht06', type: 'straw', name: '1943年丁行烈士在狱中刻的图章', age: '', sort: '书法、绘画', grain: '钢,其他金属,其他无机质', long: '13', width: '', tall: '' },
+    { bs: 'yht40', type: 'straw', name: '1943年丁行在狱中手磨制的石笔架1', age: '', sort: '文件、宣传品', grain: '其他无机质', long: '5', width: '1.1', tall: '1.2' },
     { bs: 'yht40', type: 'straw', name: '1943年丁行在狱中手磨制的石笔架2', age: '', sort: '文件、宣传品', grain: '其他无机质', long: '5', width: '1.1', tall: '1.2' },
+    { bs: 'yht49', type: 'straw', name: '民国时期蒋宗銮烈士小学时竹木刻2', age: '', sort: '文件、宣传品', grain: '其他金属', long: '7', width: '1.5', tall: '' },
     { bs: 'yht49', type: 'straw', name: '民国时期蒋宗銮烈士小学时竹木刻', age: '', sort: '文件、宣传品', grain: '其他金属', long: '7', width: '1.5', tall: '' },
     // 书刊
     { bs: 'yht50', type: 'book', name: '民国时期赵良璋烈士穿过的皮夹克1', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '10' },
-    { bs: 'yht53', type: 'book', name: '二十世纪三十年代郭纲琳烈士在狱中用铜元磨制的铜片1,上刻“健美”二字', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '5.1' },
     { bs: 'yht50', type: 'book', name: '民国时期赵良璋烈士穿过的皮夹克2', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '10' },
+    { bs: 'yht53', type: 'book', name: '二十世纪三十年代郭纲琳烈士在狱中用铜元磨制的铜片1,上刻“健美”二字', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '5.1' },
     { bs: 'yht53', type: 'book', name: '二十世纪三十年代郭纲琳烈士在狱中用铜元磨制的铜片2,上刻“健美”二字', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '5.1' },
-    { bs: 'yht50', type: 'book', name: '民国时期赵良璋烈士穿过的皮夹克3', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '10' },
     { bs: 'yht53', type: 'book', name: '二十世纪三十年代郭纲琳烈士在狱中用铜元磨制的铜片3,上刻“健美”二字', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '5.1' },
+    { bs: 'yht50', type: 'book', name: '民国时期赵良璋烈士穿过的皮夹克3', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '10' },
     // 用具
     { bs: 'yht55', type: 'tool', name: '民国初期邓中夏穿过的紫色绸质背坎1', age: '', sort: '家具', grain: '瓷,木', long: '', width: '23', tall: '16' },
-    { bs: 'yht61', type: 'tool', name: '1934年卢志英烈士在贵州工作时少数民族赠送给他的毛毯1', age: '', sort: '皮革', grain: '皮革', long: '79.5', width: '47.3', tall: '19.5' },
     { bs: 'yht55', type: 'tool', name: '民国初期邓中夏穿过的紫色绸质背坎2', age: '', sort: '家具', grain: '瓷,木', long: '', width: '23', tall: '16' },
+    { bs: 'yht61', type: 'tool', name: '1934年卢志英烈士在贵州工作时少数民族赠送给他的毛毯1', age: '', sort: '皮革', grain: '皮革', long: '79.5', width: '47.3', tall: '19.5' },
     { bs: 'yht61', type: 'tool', name: '1934年卢志英烈士在贵州工作时少数民族赠送给他的毛毯2', age: '', sort: '皮革', grain: '皮革', long: '79.5', width: '47.3', tall: '19.5' },
-    { bs: 'yht55', type: 'tool', name: '民国初期邓中夏穿过的紫色绸质背坎3', age: '', sort: '家具', grain: '瓷,木', long: '', width: '23', tall: '16' },
     { bs: 'yht61', type: 'tool', name: '1934年卢志英烈士在贵州工作时少数民族赠送给他的毛毯3', age: '', sort: '皮革', grain: '皮革', long: '79.5', width: '47.3', tall: '19.5' },
+    { bs: 'yht55', type: 'tool', name: '民国初期邓中夏穿过的紫色绸质背坎3', age: '', sort: '家具', grain: '瓷,木', long: '', width: '23', tall: '16' },
     // 服装
     { bs: 'yht63', type: 'clothing', name: '1933年郭纲琳烈士工作时期戴过的帽子1', age: '', sort: '文具', grain: '石', long: '10', width: '', tall: '2' },
-    { bs: 'yht65', type: 'clothing', name: '民国时期杨斌烈士用过的床单1', age: '', sort: '文具', grain: '铜', long: '10.8', width: '10.8', tall: '3.8' },
     { bs: 'yht63', type: 'clothing', name: '1933年郭纲琳烈士工作时期戴过的帽子2', age: '', sort: '文具', grain: '石', long: '10', width: '', tall: '2' },
+    { bs: 'yht65', type: 'clothing', name: '民国时期杨斌烈士用过的床单1', age: '', sort: '文具', grain: '铜', long: '10.8', width: '10.8', tall: '3.8' },
     { bs: 'yht65', type: 'clothing', name: '民国时期杨斌烈士用过的床单2', age: '', sort: '文具', grain: '铜', long: '10.8', width: '10.8', tall: '3.8' },
   ],
   '2D': [
     // 手稿
-    {imgNum:3, type: 'book', name: '20世纪20年代高文华烈士北伐时期用的瓷杯', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '10' },
-    { type: 'book', name: '民国时期谢文锦烈士用过的金边碗', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '5.1' },
-    { type: 'book', name: '民国时期杜焕卿烈士用过的漱口杯', age: '', sort: '瓷器', grain: '瓷', long: '', width: '8.8', tall: '10' },
-    { type: 'book', name: '民国时期谢世炎烈士用过的铁皮箱', age: '', sort: '家具', grain: '铁', long: '81.5', width: '47.7', tall: '19.7' },
-    { type: 'book', name: '民国时期谭寿林烈士用过的书箱', age: '', sort: '家具', grain: '木', long: '63.5', width: '30.7', tall: '38.5' },
+    {bs:'4',imgNum:3, type: 'straw', name: '中华民国时期陈君起烈士读过的《史记》(卷二)', age: '', sort: '书法、绘画', grain: '钢,其他金属,其他无机质', long: '13', width: '', tall: '' },
+    {bs:'5',imgNum:2, type: 'straw', name: '民国时期陈君起烈士读过的《史记》(卷六)', age: '', sort: '文件、宣传品', grain: '其他无机质', long: '5', width: '1.1', tall: '1.2' },
     // 书刊
-    { type: 'straw', name: '民国时期赵良璋烈士用过的派克51型钢笔', age: '', sort: '书法、绘画', grain: '钢,其他金属,其他无机质', long: '13', width: '', tall: '' },
-    { type: 'straw', name: '1947年赵良璋在北平刻的"野雪"印章', age: '', sort: '文件、宣传品', grain: '其他无机质', long: '5', width: '1.1', tall: '1.2' },
-    { type: 'straw', name: '民国时期丁行烈士的水晶图章', age: '', sort: '文件、宣传品', grain: '其他金属', long: '7', width: '1.5', tall: '' },
-    { type: 'straw', name: '民国时期邓振询烈士用的私章及盒子', age: '', sort: '文件、宣传品', grain: '其他动物质', long: '2.3', width: '1.1', tall: '' },
-    { type: 'straw', name: '民国时期文绍珍烈士在国民革命军军官学校第六期学生毕业证章', age: '', sort: '文件、宣传品', grain: '铜', long: '6.4', width: '2.6', tall: '' },
-    { type: 'straw', name: '1943年丁行烈士在狱中刻的图章', age: '', sort: '文件、宣传品', grain: '石', long: '4.5', width: '1.6', tall: '' },
-    { type: 'straw', name: '民国时期成贻宾烈士在国立中央大学的校徽', age: '', sort: '文件、宣传品', grain: '铜', long: '', width: '', tall: '' },
-    { type: 'straw', name: '民国时期谭寿林烈士木刻私章(刻有“祝封贵县”)', age: '', sort: '文件、宣传品', grain: '木', long: '', width: '', tall: '' },
-    { type: 'straw', name: '民国时期周镐烈士用过的红玉石印章', age: '', sort: '文件、宣传品', grain: '宝玉石', long: '4', width: '1.5', tall: '1.5' },
-    { type: 'straw', name: '民国时期谢文锦烈士用过的印章', age: '', sort: '文件、宣传品', grain: '石', long: '3', width: '3', tall: '3.5' },
+    {bs:'1',imgNum:2, type: 'book', name: '郭凤韶烈士在校写的大字', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '10' },
+    {bs:'2', type: 'book', name: '1921年侯少裘烈士在景贤女中绘制的水彩画', age: '', sort: '瓷器', grain: '瓷', long: '', width: '', tall: '5.1' },
+    {bs:'3',imgNum:4, type: 'book', name: '1928年史砚芬烈士在狱中所作画和诗“夜莺啼月”', age: '', sort: '瓷器', grain: '瓷', long: '', width: '8.8', tall: '10' },
 
     // 用具
-    { type: 'clothing', name: '民国时期杜焕卿烈士使用过的墨盒', age: '', sort: '文具', grain: '石', long: '10', width: '', tall: '2' },
-    { type: 'clothing', name: '民国时期谢士炎烈士用过的墨盒', age: '', sort: '文具', grain: '铜', long: '10.8', width: '10.8', tall: '3.8' },
-    { type: 'clothing', name: '民国时期蒋传宗烈士用过的钢笔', age: '', sort: '文具', grain: '其他无机质', long: '13', width: '1.3', tall: '' },
-    { type: 'clothing', name: '1927年夏雨初烈士在郎溪组织农民起义时用的梭镖', age: '', sort: '武器', grain: '铁', long: '30', width: '4.7', tall: '' },
-    { type: 'clothing', name: '吕惠生1943年用过的大刀', age: '', sort: '武器', grain: '其他金属', long: '68.6', width: '6.6', tall: '' },
-    { type: 'clothing', name: '民国时期国民党宪兵司令部的奠基纪念碑', age: '', sort: '玺印符牌', grain: '石', long: '93', width: '51', tall: '10' },
-    { type: 'clothing', name: '1928年冯玉祥送给谢庆云烈士的象牙筷一双', age: '', sort: '牙骨角器', grain: '棉麻纤维', long: '22', width: '', tall: '' },
-    { type: 'clothing', name: '民国时期蒋宗銮烈士小学时竹木刻', age: '', sort: '竹木雕', grain: '木', long: '21', width: '6', tall: '' },
+    {bs:'6', type: 'clothing', name: '民国时期郭凤韶烈士穿过的浅蓝色大褂', age: '', sort: '文具', grain: '石', long: '10', width: '', tall: '2' },
     // 服装
-    { type: 'tool', name: '民国时期朱杏南烈士工作时联络做暗号用的陶瓷花盆和茶几', age: '', sort: '家具', grain: '瓷,木', long: '', width: '23', tall: '16' },
-    { type: 'tool', name: '民国时期石淳烈士用过的皮箱', age: '', sort: '皮革', grain: '皮革', long: '79.5', width: '47.3', tall: '19.5' },
-    { type: 'tool', name: '民国时期焦恭士烈士用过的皮箱', age: '', sort: '皮革', grain: '皮革', long: '29.5', width: '17.6', tall: '8.5' },
-    { type: 'tool', name: '民国时期何宝珍用过的皮箱', age: '', sort: '皮革', grain: '皮革', long: '65.4', width: '38.5', tall: '19.6' },
-    { type: 'tool', name: '抗战时期周镐烈士用过的皮包', age: '', sort: '皮革', grain: '皮革', long: '28', width: '39', tall: '' },
-    { type: 'tool', name: '民国时期文绍珍烈士用过的黄皮文件包', age: '', sort: '皮革', grain: '皮革', long: '33', width: '26', tall: '' },
-    { type: 'tool', name: '民国时期赵良璋烈士飞行时用的美国光学公司制造的飞行员护目眼镜盒', age: '', sort: '其他', grain: '其他金属', long: '22', width: '8.4', tall: '5.2' },
-    { type: 'tool', name: '民国时期郭纲琳烈士戴过的瑞士方形女表', age: '', sort: '其他', grain: '其他金属', long: '20.8', width: '1.5', tall: '' },
-    { type: 'tool', name: '民国时期吕惠生烈士用过的手电筒', age: '', sort: '其他', grain: '其他金属', long: '18.7', width: '4.1', tall: '' },
-    { type: 'tool', name: '民国时期夏雨初烈士用过的铜锁', age: '', sort: '其他', grain: '铜', long: '7.5', width: '1.5', tall: '3.3' },
-    { type: 'tool', name: '1930年夏雨初烈士就义时戴的眼镜', age: '', sort: '其他', grain: '玻璃,其他无机质', long: '11.8', width: '5.2', tall: '' },
-    { type: 'tool', name: '民国时期夏雨初烈士使用的油灯', age: '', sort: '其他', grain: '铜', long: '14', width: '10.5', tall: '' },
-    { type: 'tool', name: '1947年卢志英烈士在上海工作时使用的怀表', age: '', sort: '其他', grain: '铜,其他金属', long: '', width: '', tall: '' },
-    { type: 'tool', name: '二十世纪三十年代郭纲琳烈士在狱中用铜元磨的鸡心,刻有“永是勇士”', age: '', sort: '其他', grain: '铜', long: '2.5', width: '1.5', tall: '' },
-    { type: 'tool', name: '民国时期文绍珍烈士用过的闹钟', age: '', sort: '其他', grain: '铜,其他金属', long: '', width: '', tall: '' },
-    { type: 'tool', name: '二十世纪三十年代郭纲琳烈士狱中磨制的铜圆', age: '', sort: '钱币', grain: '铜', long: '', width: '', tall: '' },
-    { type: 'tool', name: '民国时期文绍珍烈士用过的剪刀', age: '', sort: '铁器、其他金属器', grain: '铁', long: '23', width: '9.6', tall: '' },
-    { type: 'tool', name: '民国时期谢士炎烈士用过的铜压条', age: '', sort: '铜器', grain: '铜', long: '25', width: '3', tall: '' },
-    { type: 'tool', name: '民国时期胡廷俊烈士自制砚台', age: '', sort: '文具', grain: '石', long: '10.5', width: '9.8', tall: '2.2' },
+    {bs:'7',imgNum:2, type: 'tool', name: '民国时期侯少裘半身像', age: '', sort: '家具', grain: '瓷,木', long: '', width: '23', tall: '16' },
     // 油画
-    { author: '作者1', type: 'Italy', name: '启蒙', age: '1999', sort: '油 画', grain: '', long: '2.03', width: '2.45', tall: '' },
-    { author: '作者1', type: 'Italy', name: '邓演达主持农工党一干会议', age: '1999', sort: '油 画', grain: '', long: '2.25', width: '3.27', tall: '' },
-    { author: '作者1', type: 'Italy', name: '被    捕', age: '1987', sort: '油 画', grain: '', long: '3.0 ', width: '2.4', tall: '' },
-    { author: '作者1', type: 'Italy', name: '在青年中间', age: '1987', sort: '油 画', grain: '', long: '2.04', width: '2.04', tall: '' },
-    { author: '作者1', type: 'Italy', name: '演    说', age: '1987', sort: '油 画', grain: '', long: '3.03', width: '1.95', tall: '' },
-    { author: '作者1', type: 'Italy', name: '马克昌就义', age: '1987', sort: '油 画', grain: '', long: '1.92', width: '2.01', tall: '' },
+    {bs:'8', author: '某画家', type: 'Italy', name: '启蒙', age: '1999', sort: '油 画', grain: '', long: '2.03', width: '2.45', tall: '' },
   ]
 }

+ 224 - 28
vue/src/views/LikeNum.vue

@@ -1,12 +1,15 @@
 <template>
   <div class="LikeNum">
-    <div>
-      <p>
-        总访问量:<span>{{ visit }}</span>
-      </p>
-      <p>
-        总点赞量:<span>{{ like }}</span>
-      </p>
+    <div id="echartsBox"></div>
+    <div class="numBox">
+      <div class="allNum">
+        <p>
+          <span class="all1">总访问量:</span>
+          <span class="num">5000</span>&emsp;&emsp;
+          <span class="all2">总点赞量:</span>
+          <span class="num">2000</span>
+        </p>
+      </div>
     </div>
   </div>
 </template>
@@ -17,17 +20,146 @@ export default {
   components: {},
   data() {
     //这里存放数据
-    return {
-      visit: 0,
-      like: 0,
-    };
+    return {};
   },
   //监听属性 类似于data概念
   computed: {},
   //监控data中的数据变化
   watch: {},
   //方法集合
-  methods: {},
+  methods: {
+    echartsFu(data1, data2, data3, data4) {
+      let ecDemo = echarts.init(document.getElementById("echartsBox"));
+      let option = {
+        color: ["#37F4E9", "#FFD15C"],
+        legend: {
+          itemWidth: 20,
+          itemHeight: 10,
+          itemGap: 10,
+          data: [
+            {
+              name: "访问量",
+              icon: "rect",
+            },
+            {
+              name: "点赞量",
+              icon: "rect",
+            },
+          ],
+          right: "4%",
+          textStyle: {
+            fontSize: 12,
+            color: "#F1F1F3",
+          },
+        },
+        grid: {
+          top: "15%",
+          left: "3%",
+          right: "8%",
+          bottom: "0%",
+          containLabel: true,
+        },
+        tooltip: {
+          trigger: "axis",
+        },
+        xAxis: {
+          type: "category",
+          data: data1,
+          boundaryGap: false,
+          axisLine: {
+            show: true,
+            lineStyle: {
+              color: "rgba(255,255,255,.8)",
+            },
+          },
+          axisTick: {
+            //x轴刻度线
+            show: false,
+          },
+          axisLabel: {
+            textStyle: {
+              show: true,
+              fontFamily: "微软雅黑",
+              color: "#fff",
+              fontSize: "14",
+              lineHeight: 30,
+            },
+          },
+        },
+        yAxis: {
+          type: "value",
+          axisLine: {
+            show: true,
+            lineStyle: {
+              color: "rgba(255,255,255,.8)",
+            },
+          },
+          splitLine: {
+            show: false,
+          },
+          axisTick: {
+            //x轴刻度线
+            show: false,
+          },
+          axisLabel: {
+            textStyle: {
+              show: true,
+              fontFamily: "微软雅黑",
+              color: "#fff",
+              fontSize: "14",
+            },
+          },
+        },
+        series: [
+          {
+            symbol: "none",
+            name: "访问量",
+            data: data2,
+            type: "line",
+            smooth: true,
+            areaStyle: {
+              normal: {
+                // 填充色渐变
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 1,
+                    color: "rgba(55, 244, 233, 0)",
+                  },
+                  {
+                    offset: 0,
+                    color: "rgba(55, 244, 233, .4)",
+                  },
+                ]),
+              },
+            },
+          },
+          {
+            symbol: "none",
+            name: "点赞量",
+            data: data3,
+            type: "line",
+            smooth: true,
+            areaStyle: {
+              normal: {
+                // 填充色渐变
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 1,
+                    color: "rgba(7, 131, 250, 0)",
+                  },
+                  {
+                    offset: 0,
+                    color: "rgba(7, 131, 250, .4)",
+                  },
+                ]),
+              },
+            },
+          },
+        ],
+      };
+      ecDemo.setOption(option);
+    },
+  },
   //生命周期 - 创建完成(可以访问当前this实例)
   created() {},
   //生命周期 - 挂载完成(可以访问DOM元素)
@@ -37,12 +169,23 @@ export default {
     dom.style.minHeight = "100vh";
     dom.style.overflow = "hidden";
 
-    fetch("http://map.4dage.com:8109/api/count/detail/museum_yuhuatai")
-      .then((response) => response.json())
-      .then((data) => {
-        this.visit = data.data.visitSum;
-        this.like = data.data.starSum;
-      });
+    let arr1 = [
+      "",
+      "2022-10-12",
+      "2022-10-13",
+      "2022-10-14",
+      "2022-10-15",
+      "2022-10-16",
+      "2022-10-17",
+      "2022-10-18",
+      "2022-10-19",
+      "2022-10-20",
+      "2022-10-21",
+      "",
+    ];
+    let arr2 = [0, 10, 50, 20, 33, 13, 46, 46, 45, 66, 78, 0];
+    let arr3 = [0, 7, 34, 66, 13, 66, 75, 22, 31, 45, 54, 0];
+    this.echartsFu(arr1, arr2, arr3);
   },
   beforeCreate() {}, //生命周期 - 创建之前
   beforeMount() {}, //生命周期 - 挂载之前
@@ -58,20 +201,73 @@ export default {
   position: fixed;
   width: 100vw;
   height: 100vh;
-  background-image: url("../assets/img/Goods/GoodsBac.png");
-  background-size: 100% 100%;
+  background-image: url("../assets/img/Likebac.jpg");
+  background-size: cover;
   display: flex;
   justify-content: center;
   align-items: center;
-  & > div {
+  &::after {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    background-image: linear-gradient(
+      rgba(25, 59, 78, 0.8),
+      rgba(20, 44, 57, 0.5)
+    );
+  }
+  #echartsBox {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
     width: 100%;
-    & > p {
-      font-weight: 700;
-      font-size: 24px;
-      text-align: center;
-      margin: 25px 0;
-      & > span {
-        color: #930909;
+    max-width: 800px;
+    height: 500px;
+  }
+  .numBox {
+    pointer-events: none;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 100%;
+    max-width: 800px;
+    height: 500px;
+    z-index: 10;
+    .allNum {
+      color: #ffd15c;
+      position: absolute;
+      left: 24px;
+      top: 0px;
+      z-index: 10;
+      font-size: 14px;
+      & > p {
+        display: flex;
+        align-items: center;
+      }
+      .all1 {
+        color: #37f4e9;
+      }
+      .all2 {
+        color: #ffd15c;
+      }
+      .num {
+        color: #fff;
+        font-size: 18px;
+      }
+    }
+  }
+  @media screen and (max-width: 500px) {
+    .allNum {
+      width: 100% !important;
+      top: -30px !important;
+      left: 0 !important;
+      &>p{
+        justify-content: center;
       }
     }
   }