fix 1920 style

src/components/customEcharts/size1920/index.vue

@@ -140,7 +140,7 @@ const initEcharts = (data) => {
         sampling: "lttb",
         symbol: "none",
         lineStyle: {
-          color: "#2c6288",
+          color: "#CC346C",
         },
         areaStyle: {
           color: {
@@ -152,7 +152,7 @@ const initEcharts = (data) => {
             colorStops: [
               {
                 offset: 0,
-                color: "#2c6288",
+                color: "#CC346C",
               },
               {
                 offset: 1,
@@ -198,7 +198,7 @@ const initEcharts = (data) => {
         show: true,
         dataBackground: {
           lineStyle: {
-            color: "#2C6288",
+            color: "#CC346C",
           },
           areaStyle: {
             color: {
@@ -208,7 +208,7 @@ const initEcharts = (data) => {
               x2: 0,
               y2: 1,
               colorStops: [
-                { offset: 1, color: "#2c6288" },
+                { offset: 1, color: "#CC346C" },
                 { offset: 0, color: "#F4F6F8" },
               ],
             },
@@ -216,7 +216,7 @@ const initEcharts = (data) => {
         },
         selectedDataBackground: {
           lineStyle: {
-            color: "#2C6288",
+            color: "#CC346C",
           },
           areaStyle: {
             color: {
@@ -226,7 +226,7 @@ const initEcharts = (data) => {
               x2: 0,
               y2: 1,
               colorStops: [
-                { offset: 1, color: "#2c6288" },
+                { offset: 1, color: "#CC346C" },
                 { offset: 0, color: "#F4F6F8" },
               ],
             },
@@ -571,7 +571,7 @@ const handleDateRangeChange = (range) => {
     }
 
     .echarts-search-area {
-      padding: 2rem 0 0;
+      padding: 0 16px 32px 16px;
       display: flex;
       flex-direction: row;
       align-items: center;

src/views/news/size1920/index.vue

@@ -12,7 +12,7 @@ import { useI18n } from "vue-i18n";
 const { t } = useI18n();
 import { useRoute } from "vue-router";
 const route = useRoute();
-import axios from 'axios'
+import axios from "axios";
 
 const state = reactive({
   id: "", // 新闻id
@@ -26,22 +26,22 @@ onMounted(() => {
 
 //获取新闻信息
 const getPressReleasesInfo = () => {
-  let url = 'https://erpapi.fiee.com/api/fiee/pressreleases?id=' + state.id
+  let url = "https://erpapi.fiee.com/api/fiee/pressreleases?id=" + state.id;
   axios.get(url).then((res) => {
     // console.log(res)
     if (res.status === 200) {
       if (res.data.status === 0) {
-       const myRichText = document.getElementById('my-richText')
+        const myRichText = document.getElementById("my-richText");
-       myRichText.innerHTML = res.data.data.content
+        myRichText.innerHTML = res.data.data.content;
       }
     }
-  })
+  });
-}
+};
 </script>
 <style scoped lang="scss">
 .page-container {
-  max-width: 1200px;
+  max-width: 932px;
   margin: 0 auto;
-  padding: 40px;
+  padding: 0 16px;
 }
 </style>

src/views/press-releases/size1920/index.vue

@@ -652,8 +652,8 @@ const handleClickOutside = (event) => {
 .pagination-container {
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  margin-top: 20px;
-  margin-top: 30px;
+  justify-content: flex-end;
   margin-bottom: 30px;
   gap: 21px;
 }
@@ -670,7 +670,7 @@ const handleClickOutside = (event) => {
 .pagination-controls {
   display: flex;
   align-items: center;
-  gap: 21px;
+  gap: 8px;
 }
 
 .pagination-buttons {
@@ -678,7 +678,6 @@ const handleClickOutside = (event) => {
   align-items: center;
   gap: 8px;
 }
-
 .page-btn {
   display: flex;
   align-items: center;
@@ -742,7 +741,7 @@ const handleClickOutside = (event) => {
 
 .page-size-menu {
   position: absolute;
-  top: 100%;
+  bottom: 100%;
   left: 0;
   right: 0;
   background: #ffffff;
@@ -750,7 +749,7 @@ const handleClickOutside = (event) => {
   border-radius: 3px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
   z-index: 1000;
-  margin-top: 2px;
+  margin-bottom: 2px;
 }
 
 .page-size-option {
@@ -782,6 +781,7 @@ const handleClickOutside = (event) => {
   font-size: 14px;
   line-height: 1.428em;
   color: #455363;
+  margin-right: 16px;
 }
 
 .goto-input {

src/views/product-introduction/size1920/index.vue

@@ -2,6 +2,13 @@
 
 <template>
   <div class="page-container">
+    <div class="grid-lines">
+      <div class="line solid line-1"></div>
+      <div class="line dashed line-2"></div>
+      <div class="line dashed line-3"></div>
+      <div class="line dashed line-4"></div>
+      <div class="line solid line-5"></div>
+    </div>
     <section class="hero-section relative">
       <div class="hero-content">
         <div class="hero-title">
@@ -261,6 +268,7 @@
   font-family: "PingFang SC", sans-serif;
   /* max-width: 932px; */
   margin: 0 auto;
+  position: relative;
 }
 
 .hero-section {
@@ -368,7 +376,7 @@
   line-height: 32px;
   letter-spacing: 1.2px;
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   gap: 16px;
 }
 .feature-description {
@@ -386,7 +394,7 @@
 }
 .solutions-content {
   display: flex;
-  gap: 16px;
+  gap: 24px;
 }
 .solutions-list {
   display: flex;
@@ -398,7 +406,6 @@
   text-align: left;
   display: flex;
   flex-direction: column;
-  gap: 16px;
 }
 .solution-icon {
   width: 92px;
@@ -406,12 +413,16 @@
   padding-left: 16px;
 }
 .solution-title {
-  font-size: 20px;
+  font-family: "PingFang SC";
-  line-height: 28px;
+  font-size: 24px;
+  font-style: normal;
   font-weight: 500;
+  line-height: 32px; /* 133.333% */
+  letter-spacing: 1.2px;
   display: flex;
   gap: 16px;
-  align-items: center;
+  align-items: flex-start;
+  margin-bottom: 16px;
 }
 .solution-description {
   font-size: 16px;
@@ -422,7 +433,6 @@
 }
 .solution-image-container {
   width: 434px;
-  height: 628px;
   border-radius: 16px;
 }
 .solution-image {
@@ -473,7 +483,7 @@
   letter-spacing: 1.2px;
   display: flex;
   gap: 16px;
-  align-items: center;
+  align-items: flex-start;
 }
 .advantage-description {
   font-size: 16px;
@@ -542,5 +552,49 @@
   height: 20px;
   background: #ff7bac;
   flex-shrink: 0;
+  margin-top: 6px;
+}
+
+.grid-lines {
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 932px;
+  height: 100%;
+  pointer-events: none;
+  z-index: 0;
+}
+
+.grid-lines .line {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+}
+
+.grid-lines .line.solid {
+  width: 1px;
+  background-color: rgba(0, 0, 0, 0.08);
+}
+
+.grid-lines .line.dashed {
+  width: 0;
+  border-left: 1px dotted rgba(0, 0, 0, 0.12);
+}
+
+.grid-lines .line-1 {
+  left: 0;
+}
+.grid-lines .line-2 {
+  left: 233px;
+}
+.grid-lines .line-3 {
+  left: 466px;
+}
+.grid-lines .line-4 {
+  left: 699px;
+}
+.grid-lines .line-5 {
+  right: 0;
 }
 </style>