ソースを参照

feat:结构数据化pc端修改

malin 3 年 前
コミット
f2d505a9d5

+ 38 - 108
src/web/staticres/structuredata/pc/css/stucturedPc.css

@@ -30,11 +30,7 @@
   align-items: center;
   justify-content: center;
   width: 200px;
-<<<<<<< HEAD
   height: 48px;
-=======
-  height: 50px;
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)
   font-size: 20px;
   font-weight: bold;
   border-radius: 8px;
@@ -69,7 +65,7 @@
   min-height: 536px;
 }
 .section-1 .section-text-bg {
-  margin-top: 109px;
+  margin-top: 64px;
   width: 421px;
   height: 218px;
 }
@@ -78,8 +74,8 @@
   min-height: 543px;
 }
 .section-2 .section-title-bg {
-  width: 224px;
-  height: 70px;
+  width: 340px;
+  height: 91px;
 }
 .section-2 .section-item-list {
   display: flex;
@@ -106,23 +102,28 @@
 }
 
 
-.section-3 .section-content {
-  height: 710px;
-}
 .section-3 .section-title-bg {
-  width: 150px;
-  height: 70px;
+  width: 340px;
+  height: 91px;
 }
 .section-3 .section-item-list {
   display: flex;
-  flex-wrap: wrap;
-  padding-top: 30px;
+  align-items: center;
+  justify-content: center;
+  margin-top: 64px;
 }
 .section-3 .section-item-card {
-  width: 50%;
-  height: 172px;
+  width: 300px;
+  height: 168px;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+.section-3-pic{
+  width: 66px;
 }
-<<<<<<< HEAD
 .section-3 .section-item-card div:nth-child(2){
   margin: 12px auto;
   font-size: 18px;
@@ -131,99 +132,42 @@
   line-height: 28px; 
 }
 .section-3 .section-item-card div:nth-child(3){
-=======
-.section-3 .section-item-card {
-  padding: 38px 40px 38px 194px;
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)
   font-size: 16px;
+  font-weight: 400;
+  color: #FFFFFF;
   line-height: 24px;
-  color: #fff;
-}
-.section-3 .section-item-card:nth-of-type(2n) {
-  padding-left: 214px;
-}
-.section-3 .section-item-card:nth-last-of-type(-n+2) {
-  margin-top: 20px;
 }
 
 
-.section-4.s-bg {
-  background-size: 50% 100%;
-  background-position: -28% 1%;
-}
 .section-4 .section-content {
-  height: 940px;
+  min-height: 543px;
 }
 .section-4 .section-title-bg {
-  width: 191px;
-  height: 70px;
+  width: 340px;
+  height: 91px;
 }
 .section-4 .section-item-list {
   display: flex;
-  flex-wrap: wrap;
-  padding-top: 30px;
+  padding-top: 50px;
 }
-
 .section-4 .section-item-card {
-  width: 49%;
-  height: 345px;
-  padding-bottom: 20px;
-  font-size: 16px;
-  line-height: 24px;
-  color: #fff;
-  background-size: 100% 100%;
-  background-repeat: no-repeat;
-  overflow: hidden;
-  border-radius: 8px;
+  flex: 1;
 }
-/* 选中第2第4个元素 */
-.section-4 .section-item-card:nth-of-type(2n) {
+.section-4 .section-item-card:not(:first-of-type) {
   margin-left: 20px;
 }
-/* 选中第3第4个元素 */
-.section-4 .section-item-card:nth-last-of-type(-n+2) {
-  margin-top: 20px;
-  height: 330px;
-}
-.section-4  .item-card-content {
-  margin: 0 40px;
-}
-.section-4  .item-card-title {
-  margin: 48px 0 12px;
-  padding-left: 40px;
-  width: 215px;
-  height: 32px;
-  color: #171826;
+.section-4 .section-item-card .card-title {
   font-size: 20px;
-  line-height: 32px;
-  transition: margin .5s ease;
-}
-.section-4 .item-card-footer {
-  margin: 24px 40px;
-  padding-top: 34px;
-  padding-left: 13px;
-  width: 510px;
-  height: 110px;
-  font-size: 14px;
-  line-height: 22px;
-  background-size: 100% auto;
-}
-.section-4 .item-card-buttons {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.section-4 .item-card-buttons .action-button {
-  height: 0;
-  border-width: 0;
-}
-
-.section-4 .section-item-card:hover .item-card-title {
-  margin-top: 0;
+  line-height: 34px;
+  color: #171826;
+  text-align: center;
 }
-.section-4 .section-item-card:hover .item-card-buttons .action-button {
-  height: 48px;
-  border-width: 1px;
+.section-4 .section-item-card .card-content {
+  padding: 0 40px;
+  margin-top: 14px;
+  font-size: 16px;
+  line-height: 24px;
+  color: #fff;
 }
 
 .section-5 {
@@ -232,26 +176,15 @@
 .section-5 .section-content {
   padding-top: 20px;
   padding-bottom: 0;
-<<<<<<< HEAD
-=======
-  height: 850px;
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)
 }
 .section-5 .section-title-bg {
-  width: 191px;
-  height: 70px;
+  width: 340px;
+  height: 91px;
 }
 .section-5 .section-item-list {
   position: relative;
-<<<<<<< HEAD
   padding-top: 78px;
   height: 245px;
-=======
-  padding-top: 30px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)
 }
 .section-5 .section-item-card {
   height: 245px;
@@ -364,7 +297,6 @@
 .example-pic > img {
   width: 100%;
 }
-<<<<<<< HEAD
 
 /* S  1.17新增 */
 .section-9 .section-title-bg {
@@ -384,5 +316,3 @@
   justify-content: center;
 }
 /* E  1.17新增 */
-=======
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)

+ 61 - 147
src/web/templates/structuredata/pc/index.html

@@ -18,58 +18,37 @@
     <link href='{{Msg "seo" "cdn"}}/common-module/pc-dialog/css/leave-info-dialog.css?v={{Msg "seo" "version"}}' rel="stylesheet">
     <style>
         .section-1 .section-content {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-1-bg.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-1-bg.png');
         }
         .section-1 .section-text-bg {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-1-text.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-1-text.png');
         }
         .section-2 .section-content {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-2-bg.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-2-bg.png');
         }
         .section-2 .section-title-bg {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-2-title.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-2-title.png');
         }
         .section-3 .section-content {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-3-bg.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-3-bg.png');
         }
         .section-3 .section-title-bg {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-3-title.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-3-title.png');
         }
         .section-4 {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-4-bg.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-4-bg.png');
+            background-repeat: no-repeat;
+            background-size: 50% 100%;
+            background-position: -28% 1%;
         }
         .section-4 .section-title-bg {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-4-title.png');
-        }
-        .section-4 .section-item-card {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-4-card-bg.png');
-        }
-        .section-4 .item-card-title {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-4-title-bg.png');
-        }
-        .section-4 .section-item-card:nth-of-type(1) .item-card-footer {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-4-card-content-bg-1.png');
-        }
-        .section-4 .section-item-card:nth-of-type(2) .item-card-footer {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-4-card-content-bg-2.png');
-        }
-        .section-4 .section-item-card:nth-of-type(3) .item-card-footer {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-4-card-content-bg-3.png');
-        }
-        .section-4 .section-item-card:nth-of-type(4) .item-card-footer {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-4-card-content-bg-4.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-4-title.png');
         }
         .section-5 {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-5-bg.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-5-bg.png');
         }
         .section-5 .section-title-bg {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-5-title.png');
-        }
-        .section-5 .section-item-card {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-5-card-1.png');
-        }
-        .section-5 .section-item-card2 {
-            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-5-card-2.png');
+            background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/new-section-5-title.png');
         }
         .section-6 .section-title-bg {
             background-image: url('{{Msg "seo" "cdn"}}/structuredata/pc/image/section-6-title.png');
@@ -97,13 +76,13 @@
     <div class="s-section section-1">
         <div class="section-content s-bg center">
             <div class="section-text-bg s-bg center"></div>
+            <div class="new-flex">
+                <div class="new-flex-son">
+                    <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/new-flex-son-bg.png?v=1' alt="" style="width: 100%;">
+                </div>
+            </div>
             <div class="section-buttons">
-<<<<<<< HEAD
                 <button class="action-button get-data-example  open-customer" data-id="structedData" style="width: 240px;">咨询客服,了解更多</button>
-=======
-                <button class="action-button consult-button open-customer">立即咨询</button>
-                <button class="action-button get-data-example" data-id="structedData">获取数据样例</button>
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)
             </div>
         </div>
     </div>
@@ -112,32 +91,17 @@
             <div class="section-title-bg s-bg center"></div>
             <div class="section-item-list">
                 <div class="section-item-card">
-                    <div class="card-title">销售线索管理</div>
-                    <div class="card-content">
-                        通过API接口或者邮件形式导入到CRM或者BI业务系统:<br />
-                        · 可以对自己掌握的信息进行查漏补缺;<br />
-                        · 对销售上报的商机线索核实。
-                    </div>
+                    <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/section-item-card-one.png?v=1' alt="" style="width: 100%;">
                 </div>
                 <div class="section-item-card">
-                    <div class="card-title">挖掘渠道商</div>
-                    <div class="card-content">
-                        通过以往中标信息、中标单位,进行产品销售;<br />
-                        同类项目信息整理,寻找可跟进的项目。
-                    </div>
+                    <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/section-item-card-two.png?v=1' alt="" style="width: 100%;">
                 </div>
                 <div class="section-item-card">
-                    <div class="card-title">洞察市场</div>
-                    <div class="card-content">
-                        竞对监控,分析重点客户;<br />
-                        分析以往市场体量、产品区域热度;<br />
-                        对采购单位以往招标情况进行分析,预估招标预算;<br />
-                        了解采购单位招标情况和分布,进行市场布局。
-                    </div>
+                    <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/section-item-card-three.png?v=1' alt="" style="width: 100%;">
                 </div>
             </div>
             <div class="section-buttons">
-                <button class="action-button consult-button open-customer">立即咨询</button>
+                <button class="action-button consult-button open-customer">咨询客服</button>
                 <button class="action-button get-data-example" data-id="structedData">获取数据样例</button>
             </div>
         </div>
@@ -147,74 +111,67 @@
             <div class="section-title-bg s-bg center"></div>
             <div class="section-item-list">
                 <div class="section-item-card">
-                    采集全国权威机构公开的招标采购、企业公示等信息(含国家、省市级、县区级政府和企业招标网站),对采集的数据通过层层清洗,交叉验证、自然语言分析和核对,确保数据安全准确。
+                    <div class="section-3-pic">
+                        <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/new-icon-4-1.png?v=1' alt="" style="width: 100%;">
+                    </div>
+                    <div>1.用户需求</div>
+                    <div style="margin-bottom: 26px;">用户向剑鱼标讯提出数据需求</div>
                 </div>
                 <div class="section-item-card">
-                    拥有全国全行业7700万+条招标信息库、4670万+企业数据库、200万+采购单位库信息,招标采购信息全覆盖。
+                    <div class="section-3-pic">
+                        <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/new-icon-4-1.png?v=1' alt="" style="width: 100%;">
+                    </div>
+                    <div>2.数据规则确认</div>
+                    <div>剑鱼标讯数据服务工程师与用户<br>沟通需求,建立用户数据规则</div>
                 </div>
                 <div class="section-item-card">
-                    行业内最早深耕招标采购大数据,拥有强大且专业的数据整合、处理能力,可抽取30+个信息字段,以EXCEL的形式进行输出。海量数据也能做到精确,不含糊,字段识别准确率有保障。
+                    <div class="section-3-pic">
+                        <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/new-icon-4-1.png?v=1' alt="" style="width: 100%;">
+                    </div>
+                    <div>3.样例数据输出</div>
+                    <div>依据数据规则输出样例数据,<br>由用户进行样例数据的确认</div>
                 </div>
                 <div class="section-item-card">
-                    提供API接口调用、自助数据导出、企业定制化数据导出、行业报告分析、行业解决方案等多样化数据合作方式。
+                    <div class="section-3-pic">
+                        <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/new-icon-4-1.png?v=1' alt="" style="width: 100%;">
+                    </div>
+                    <div>4.数据交付</div>
+                    <div>通过用户数据规则筛选后的数据,同<br>时可支持邮件发送和API接口调用</div>
                 </div>
             </div>
             <div class="section-buttons">
-<<<<<<< HEAD
                 <button class="action-button get-data-example" data-id="structedData" style="width: 260px;">马上预约,获取数据样例</button>
-=======
-                <button class="action-button consult-button open-customer">立即咨询</button>
-                <button class="action-button get-data-example" data-id="structedData">获取数据样例</button>
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)
             </div>
         </div>
     </div>
-    <div class="s-section section-4 s-bg center">
+    <div class="s-section section-4">
         <div class="section-content s-bg center">
             <div class="section-title-bg s-bg center"></div>
             <div class="section-item-list">
                 <div class="section-item-card">
-                    <div class="item-card-title s-bg">自助数据导出</div>
-                    <div class="item-card-content">提供标准字段包、高级字段包自助导出,用户可指定关键词、发布时间、地区或行业等筛选条件,以Excel表格形式一次性导出数据,按条计费,成本低。</div>
-                    <div class="item-card-footer s-bg">
-                        可随时以excel批量下载招标、中标数据<br />
-                        可适用各规模企业、多业务场景的全方位数据统计
-                    </div>
-                    <div class="item-card-buttons">
-                        <div class="action-button experience-now">立即体验</div>
-                    </div>
+                    <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/section-item-card-4-one.png?v=1' alt="" style="width: 100%;">
                 </div>
                 <div class="section-item-card">
-                    <div class="item-card-title s-bg">数据流量预充值</div>
-                    <div class="item-card-content">企业可按需预充值数据量,根据业务需求以excel格式批量导出数据,最低1.5折,价格低至0.075元/条,数据有效期长达3年,充值一次即可随时导出。</div>
-                    <div class="item-card-footer s-bg">
-                        可用于销管月度/季度市场分析<br />
-                        可用于销售部门员工KPI考核提供数据支持<br />
-                        可用于渠道经理市场分析优选潜在合作伙伴
-                    </div>
-                    <div class="item-card-buttons">
-                        <div class="action-button get-data-example" data-id="structedDataFlow">获取数据样例</div>
-                    </div>
+                    <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/section-item-card-4-two.png?v=1' alt="" style="width: 100%;">
                 </div>
                 <div class="section-item-card">
-                    <div class="item-card-title s-bg">API接口</div>
-                    <div class="item-card-content">企业可按需调取,快速搭建自己的招标数据库,满足企业实现低成本、高效调用数据分析友商情况、评估市场体量、挖掘渠道商的需求。</div>
-                    <div class="item-card-footer s-bg">
-                        可与企业CRM系统对接<br />
-                        可通过接口定期调用数据统计招标数据<br />
-                        可对接金融(银行)、企业征信机构数据接口
-                    </div>
-                    <div class="item-card-buttons">
-                        <div class="action-button get-data-example" data-id="structedAPI">获取数据样例</div>
-                    </div>
+                    <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/section-item-card-4-three.png?v=1' alt="" style="width: 100%;">
                 </div>
-                <div class="section-item-card">
-                    <div class="item-card-title s-bg">数据单日限量包</div>
-                    <div class="item-card-content">大会员用户支持单日限量包,用户开通可用excel格式批量导出关注的招标采购数据,支持每日最大导出100条、200条套餐包。</div>
-                    <div class="item-card-footer s-bg">
-                        可用于销售商机挖掘,定期分析、跟进中标单位、联系人,挖掘销售线索
+            </div>
+            <div class="section-buttons">
+                <button class="action-button consult-button open-customer">咨询客服</button>
+                <button class="action-button get-data-example" data-id="structedData">获取数据样例</button>
+            </div>
+        </div>
+    </div>
+    <div class="s-section section-5 s-bg">
+        <div class="section-content s-bg center">
+            <div class="section-title-bg s-bg center"></div>
+            <div class="section-item-list">
+                <div class="section-item-card s-bg example-senior">
+                    <div>
+                        <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/section-5-card.png?v=1' alt="" style="width: 100%;">
                     </div>
-<<<<<<< HEAD
                     <div class="example-pic" style="margin: -170px auto;">
                         <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/example-senior.png?v=1' alt="" >
                     </div>
@@ -224,20 +181,12 @@
                 <button class="action-button consult-button open-customer">立即咨询</button>
                 <button class="action-button get-data-example" data-id="structedData">获取数据样例</button>
             </div>
-=======
-                    <div class="item-card-buttons">
-                        <div class="action-button get-data-example" data-id="structedDailyLimit">获取数据样例</div>
-                    </div>
-                </div>
-            </div>
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)
         </div>
     </div>
-    <div class="s-section section-5 s-bg">
+    <div class="s-section section-9">
         <div class="section-content s-bg center">
             <div class="section-title-bg s-bg center"></div>
             <div class="section-item-list">
-<<<<<<< HEAD
                 <div class="section-item-card">
                     <div class="section-9-pic">
                         <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/section-item-card-9-one.png?v=1' alt="" style="width: 100%;">
@@ -254,41 +203,6 @@
                     </div>
                 </div>
             </div>
-=======
-                <div class="section-item-card s-bg example-standard">
-                    <div class="item-card-title">标准数据导出服务</div>
-                    <div class="item-card-content">适用场景:市场调研、竞争对手分析</div>
-                    <div class="example-pic">
-                        <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/example-standard.png?v=1' alt="">
-                    </div>
-                </div>
-                <div class="section-item-card s-bg example-senior">
-                    <div class="item-card-title">高级数据导出服务</div>
-                    <div class="item-card-content">适用场景:商机获取、市场调研、竞争对手分析</div>
-                    <div class="example-pic">
-                        <img src='{{Msg "seo" "cdn"}}/structuredata/pc/image/example-senior.png?v=1' alt="">
-                    </div>
-                </div>
-                <div class="section-item-card s-bg">
-                    <div class="item-card-title">自定义接口数据</div>
-                    <div class="item-card-content">适用场景:挖掘商机、销售政策制定、数据分析、销售管理</div>
-                </div>
-            </div>
-            <div class="section-item-card2 s-bg">
-                <div class="item-card-title">剑鱼提供30+信息字段包含</div>
-                <div class="item-card-content">
-                    招标信息:省份、城市、公告标题、公告类别、公告内容、发布时间、公告地址、剑鱼标讯发布地址;<br />
-                    项目信息:项目名称、项目编号、项目范围、预算(元)、中标金额(元)、开标日期;<br />
-                    采购单位信息:采购单位、采购单位联系人、采购单位联系电话;<br />
-                    招标代理机构信息:招标代理机构名称;<br />
-                    中标单位信息:中标单位、中标单位联系人、中标单位联系电话、中标企业电子邮箱等。
-                </div>
-            </div>
-            <div class="section-buttons">
-                <button class="action-button consult-button open-customer">立即咨询</button>
-                <button class="action-button get-data-example" data-id="structedData">获取数据样例</button>
-            </div>
->>>>>>> parent of 8a5e3fb5d4 (feat:定制服务PC端落地页修改)
         </div>
     </div>
     <div class="s-section section-6">