新增页面 社会责任 加入我们 客户评价

assets/index.css

@@ -143,7 +143,7 @@
 
 .group_3 {
   width: 100%;
-  height: 613px;
+  height: 681px;
   background: url(public/img/bg-c.png) 100% no-repeat;
   background-size: 100% 100%;
   gap: 150px;
@@ -320,7 +320,7 @@
 .box_5 {
   position: relative;
   width: 100%;
-  height: 648px;
+  height: 991px;
   background: url(public/img/bg-b.png) 100% no-repeat;
   background-size: 100% 100%;
   justify-content: flex-center;
@@ -348,11 +348,27 @@
   height: 440px;
 }
 
+.section_2s {
+  background-image: linear-gradient( 180deg, rgba(108, 169, 255, 0.2) 0%, rgba(255,255,255,0.2) 49%);
+  border-radius: 8px 8px 8px 8px;
+  height: 745px;
+  background-color:#ffffff; 
+}
+.section_2sa{
+  background-image: linear-gradient( 180deg, rgba(252, 116, 40, 0.2) 0%, rgba(255,255,255,0.2) 49%);
+  border-radius: 8px 8px 8px 8px;
+  height: 745px;
+  background-color:#ffffff;
+}
 .group_6 {
-  background-image: linear-gradient(270deg,
+  height: 154px;
-      rgba(248, 248, 248, 0) 0,
+  width: 615px;
-      rgba(255, 222, 204, 1)100%);
+  position: relative;
-  height: 110px;
+  color: #0256FF;
+}
+.group_6s {
+  color: #FC7428;
+  height: 154px;
   width: 615px;
   position: relative;
 }
@@ -376,11 +392,10 @@
 }
 
 .box_6 {
-  position: absolute;
+  width: 524px;
-  left: 30px;
+  height: 100px;
-  top: 24px;
+  padding-top: 50px;
-  width: 503px;
+  padding-left: 31px;
-  height: 63px;
 }
 
 .image-wrapper_3 {
@@ -388,11 +403,20 @@
   margin-top: 10px;
   width: 44px;
 }
+.image-wrapper_3s {
+  height: 120px;
+  width: 120px;
+}
 
 .label_1 {
   width: 44px;
   height: 44px;
 }
+.label_1s{
+  width: 120px;
+  height: 120px;
+}
+
 
 .text-group_2 {
   width: 441px;
@@ -426,7 +450,7 @@
 }
 
 .group_7 {
-  width: 489px;
+  width: 500px;
   height: 63px;
   margin: 26px 0 0 30px;
 }
@@ -460,32 +484,41 @@
   width: 216px;
   height: 32px;
   overflow-wrap: break-word;
-  color: rgba(61, 61, 61, 1);
+  color: #3D3D3D;
   font-size: 18px;
   font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
+  font-weight: 700;
   text-align: left;
   white-space: nowrap;
   line-height: 32px;
 }
 
 .text_19 {
-  width: 427px;
+  width: 456px;
   height: 32px;
   overflow-wrap: break-word;
-  color: rgba(118, 133, 151, 1);
+  color: #768597;
   font-size: 14px;
   font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
+  font-weight: 400;
   text-align: left;
   line-height: 32px;
   margin-top: -1px;
 }
 
 .group_10 {
-  background-color: rgba(248, 248, 248, 1);
+  background-color: #EEEEEE;
-  width: 615px;
+  width: 524px;
   height: 1px;
+  margin-left:30px;
+  margin-top:30px;
+}
+.group_10s {
+  background-color: #77A5FF;
+  width: 524px;
+  height: 1px;
+  opacity: 0.2;
+  margin:0 30px;
 }
 
 .group_11 {
@@ -553,20 +586,20 @@
 }
 
 .group_13 {
-  width: 530px;
+  width: 542px;
   height: 63px;
   margin: 22px 0 23px 30px;
 }
 
 .image-wrapper_5 {
-  height: 44px;
+  height: 48px;
   margin-top: 10px;
-  width: 44px;
+  width: 48px;
 }
 
 .label_3 {
-  width: 40px;
+  width: 48px;
-  height: 40px;
+  height: 48px;
   margin: 2px 0 0 3px;
 }
 
@@ -583,10 +616,10 @@
   width: 169px;
   height: 32px;
   overflow-wrap: break-word;
-  color: rgba(61, 61, 61, 1);
+  color: #3D3D3D;
   font-size: 18px;
   font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
+  font-weight: 700;
   text-align: left;
   white-space: nowrap;
   line-height: 32px;
@@ -596,10 +629,10 @@
   width: 468px;
   height: 32px;
   overflow-wrap: break-word;
-  color: rgba(118, 133, 151, 1);
+  color: #768597;
   font-size: 14px;
   font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
+  font-weight: 400;
   text-align: left;
   line-height: 32px;
   margin-top: -1px;
@@ -667,10 +700,10 @@
 }
 .text_25 {
   overflow-wrap: break-word;
-  color: rgb(252, 116, 40);
+  color: #222222;
   font-size: 16px;
   font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
+  font-weight: 500;
   text-align: left;
   white-space: nowrap;
   line-height: 16px;
@@ -701,8 +734,8 @@
 }
 
 .group_15 {
-  background-color: rgba(255, 255, 255, 1);
+  background-color: #EEEEEE;
-  height: 0.5px;
+  height: 1px;
   width: 95%;
   margin: 20px auto;
 }

global/env.ts

@@ -2,7 +2,7 @@ import { isUndef } from './is'
 
 // 正式环境
 export const PROD_ENV = {
-	SERVER_URL: 'http://naweigetetest2.hschool.com.cn/', // 服务地址
+	SERVER_URL: 'https://democs.0rui.cn/', // 服务地址
 	IS_DEV: 'false', // 是否是测试环境
 }
 

nuxt.config.ts

@@ -3,7 +3,7 @@ import { defineNuxtConfig } from 'nuxt/config'
 
 export default defineNuxtConfig({
   app: {
-    baseURL:'/',
+    baseURL:'/web/',
   },
   nitro: {
     routeRules: {
@@ -39,7 +39,7 @@ export default defineNuxtConfig({
     server: {
       proxy: {
         '/api': {
-          target: "https://www.navigatortrades.com/",
+          target: "https://democs.0rui.cn/api",
           changeOrigin: true,
           rewrite: (path) => path.replace(/^\/api/, ''),
         }

pages/concatUs.vue

@@ -10,7 +10,7 @@
 					<img src="public/img/joinus.png" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
-			<div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
+			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
 				<div class="flex-row justify-center align-center">
 					<div>
 						<img src="public/img/left.png" alt="">
@@ -22,299 +22,86 @@
 						<img src="public/img/right.png" alt="">
 					</div>
 				</div>
-			</div>
+			</div> -->
 		</div>
 		<div class="group_2 flex-col">
 			<div class="box_2 flex-col">
 				<div class="group_3 flex-row justify-center align-center">
+					
+					<div class="group_5 flex-col justify-center align-center rightBox">
+						<div class="section_1s flex-col"></div>
+						
+					</div>
+
 					<div class="group_4 flex-col leftBox">
 						<div class="text-group_1 flex-col justify-between">
-							<span class="text_7">灵睿的互联网之道</span>
+							<span class="text_7">洛阳灵睿网络技术有限公司</span>
-							<span class="text_8">
-								The&nbsp;Way&nbsp;of&nbsp;the&nbsp;Internet
-							</span>
-						</div>
-						<div class="text-wrapper_1 flex-row">
-							<span class="text_9">公司简介</span>
-							<span class="text_10">运营方法论</span>
-							<span class="text_11">互联网营销</span>
-						</div>
-						<div class="box_3 flex-col">
-							<div class="box_4 flex-col"></div>
 						</div>
 						<span class="text_12">
-							灵睿是一家专业提供互联网技术及应用化服务的科技企业。公司成立于2006年，总部位于十三朝古都洛阳，在郑州、洛阳、许昌三地设立四家公司，是洛阳及河南建立较早、实力较强、规模较大的互联网骨干技术服务企业。公司致力于互联网+工业、互联网+医疗、互联网+教育、互联网+旅游、互联网+农业五个方面的发展。目前为近三千家企业提供互联网服务，并为上百家国有大型企业以及党政部门、事业机关单位提供互联网应用化服务。
+							从一支年轻的创业团队，慢慢发展成为业务遍及全国的信息化，内容支持型互联网公司，我们仍旧保持着始终创业的心态，每一天努力向前，如果你也愿意加入我们，请联系我们的HR，期待与你的会面。
 						</span>
-						<div class="text-wrapper_2 flex-col">
+						<div class="flex" style="margin-top: 0px;">
-							<span class="text_13">查看全部</span>
+							<span class="text_13s">
-						</div>
+								<img src="public/img/telphone.png" alt="" class="imgs">
-					</div>
+								联系电话：11245123262
-					<div class="group_5 flex-col justify-center align-center rightBox">
+							</span>
-						<div class="section_1 flex-col">
+							<span class="text_13s">
-							<div class="image-wrapper_2 flex-col">
+								<img src="public/img/wechat.png" alt="" class="imgs">
-								<img class="image_5" referrerpolicy="no-referrer" src="public/img/bf.png" />
+								微信：11245123262
-							</div>
+							</span>
-						</div>
-						<div class="content_box"></div>
-					</div>
-				</div>
-			</div>
-		</div>
-		<div class="group_2 flex-col">
-			<div class="box_5 flex-col">
-				<span class="text_14 topBox">我们的业务</span>
-				<span class="text_15 topBox">
-					Our&nbsp;BusinessWay
-				</span>
-				<div class="flex-row justify-center align-center">
-					<div class="leftBox" style="margin-right: 30px;">
-						<img class="image_6" referrerpolicy="no-referrer" src="public/img/t3.png" />
-					</div>
-
-					<div class="rightBox section_2 flex-col">
-						<div class="group_6 flex-col">
-							<div class="box_6 flex-row justify-between">
-								<div class="image-wrapper_3 flex-col align-center">
-									<img class="label_1" referrerpolicy="no-referrer" src="public/img/u1.png" />
-								</div>
-								<div class="text-group_2 flex-col justify-between">
-									<span class="text_17">
-										专业网站建设与企业官网设计定制服务
-									</span>
-									<span class="text_16">
-										助力企业数字化转型升级，PC端/移动端/H5提供一站式网站开发、搭建
-									</span>
-								</div>
-							</div>
-						</div>
-						<div class="group_7 flex-row justify-between">
-							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r4.png" />
-							</div>
-							<div class="text-group_3 flex-col justify-between">
-								<span class="text_18">企业数字化自媒体托管专家</span>
-								<span class="text_19">
-									业团队代运营+AI智能内容生成+多平台精准投放，助您专注核心业务
-								</span>
-							</div>
-						</div>
-						<div class="group_10 flex-col"></div>
-						<div class="group_7 flex-row justify-between">
-							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r3.png" />
-							</div>
-							<div class="text-group_3 flex-col justify-between">
-								<span class="text_18">全流程抖音短视频制作服务</span>
-								<span class="text_19">
-									助您快速打造高播放量、高互动率的爆款短视频
-								</span>
-							</div>
-						</div>
-						<div class="group_12 flex-col"></div>
-						<div class="group_13 flex-row justify-between">
-							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r2.png" />
-							</div>
-							<div class="text-group_5 flex-col justify-between">
-								<span class="text_22">全栈H5开发解决方案</span>
-								<span class="text_23">
-									基于HTML5/CSS3/JavaScript核心技术助力实现高转化率与沉浸式用户体验
-								</span>
-							</div>
 						</div>
 					</div>
 
 				</div>
 			</div>
 		</div>
-		<div class="box_7 flex-col">
+
-			<span class="text_24 topBox">行业案例</span>
+		<div class="box_17s flex-col" style="overflow: hidden;">
-			<span class="text_15 topBox">Industry&nbsp;Cases</span>
+			<span class="text_53">热门岗位</span>
-			<!-- <div class="group_14 flex-row justify-between align-center" style="flex-wrap: wrap;">
+			<span class="text_54">Company&nbsp;environment</span>
-				<div class="flex-row">
+			<div class="hbform">
-					<div class="text_25">
+				<div class="flex boxgs">
-						<span>医疗</span>
+					<div class="title active">影视类</div>
-						<div
+					<div class="title">技术开发类</div>
-							style="width: 100%;height: 1px;background-color: #fc7428;position: absolute;bottom: -21px;">
+					<div class="title">商务类</div>
+				</div>
+				<div class="flex justify-center align-center" style="margin-top: 30px;">
+					<div class="flex-col box_18s">
+						<div class="titless">
+							<div class="a1s">移动端跨平台开发工程师</div>
+							<div class="a2s">任职要求请联系HR</div>
+						</div>
+						<div class="line"></div>
+						<div class="bottomss">
+							<div>灵睿网络</div>
+							<div>2025-04-06  14:30</div>
 						</div>
 					</div>
-					<div class="text_25">党政</div>
+					<div class="flex-col box_18s">
-					<div class="text_25">建筑</div>
+						<div class="titless">
-					<div class="text_25">物流</div>
+							<div class="a1s">移动端跨平台开发工程师</div>
-					<div class="text_25">教育</div>
+							<div class="a2s">任职要求请联系HR</div>
-					<div class="text_25">文旅</div>
+						</div>
-					<div class="text_25">餐饮</div>
+						<div class="line"></div>
-				</div>
+						<div class="bottomss">
-				<div class="flex-row justify-center align-center">
+							<div>灵睿网络</div>
-					<div style="margin-right: 10px;">
+							<div>2025-04-06  14:30</div>
-						<span class="text_32">更多案例</span>
+						</div>
 					</div>
-					<div>
+					<div class="flex-col box_18s">
-						<img src="public/img/anli.png" />
+						<div class="titless">
-					</div>
+							<div class="a1s">移动端跨平台开发工程师</div>
-				</div>
+							<div class="a2s">任职要求请联系HR</div>
-				<div class="group_15" style="flex: 0 0 100%;"></div>
+						</div>
-			</div> -->
+						<div class="line"></div>
-
+						<div class="bottomss">
-			<div class="dswper">
+							<div>灵睿网络</div>
-				<swiper ref="swiper_exp" :slidesPerView="3" loop :loopedSlides="3" :autoplay="false" centeredSlides
+							<div>2025-04-06  14:30</div>
-					:modules="modules" :watchSlidesProgress="true" @swiper="onSwiperExp" effect="coverflow">
+						</div>
-					<swiper-slide>
-						<img src="public/img/op1.png" style="width: 100%;">
-					</swiper-slide>
-					<swiper-slide>
-						<img src="public/img/op2.png" style="width: 100%;">
-					</swiper-slide>
-					<swiper-slide>
-						<img src="public/img/op1.png" style="width: 100%;">
-					</swiper-slide>
-					 <swiper-slide>
-						<img src="public/img/op2.png" style="width: 100%;">
-					</swiper-slide>
-					<swiper-slide>
-						<img src="public/img/op1.png" style="width: 100%;">
-					</swiper-slide>
-				</swiper>
-				<div class="dswper_left">
-					<img src="public/img/opl.png">
-				</div>
-				<div class="dswper_right">
-					<img src="public/img/opr.png">
-				</div>
-				<div class="flex-row justify-center align-center absolute w-full bottom-[-50px]" style="gap: 30px;">
-					<div style="width: 25px;height:5px;background-color: #fc7428;"></div>
-					<div style="width: 25px;height:5px;background-color: #C1C1C1;"></div>
-					<div style="width: 25px;height:5px;background-color: #C1C1C1;"></div>
-				</div>
-			</div>
-		</div>
-		<div class="box_11 flex-col">
-			<div class="text-wrapper_10">
-				<span class="text_41">新闻动态</span>
-			</div>
-			<div class="text-wrapper_11">
-				<span class="text_42">Our&nbsp;Business&nbsp;</span>
-			</div>
-			<div class="box_12 flex-row justify-center">
-				<img class="image_7 leftBox" referrerpolicy="no-referrer" src="public/img/news1.png" />
-				<div class="box_13 flex-col topBox">
-					<div class="text-group_6 flex-col justify-between">
-						<span class="text_43">
-							洛阳市郑州商会在洛阳灵睿网络技术有限...
-						</span>
-						<span class="paragraph_1">
-							为深入学习贯彻党的二十大精神，落实省、市委决策，
-							<br />
-							充分发挥民营企业的凝聚力、向心力和创造力，赴..
-						</span>
-					</div>
-					<div class="group_22 flex-row">
-						<div class="section_6 flex-col"></div>
-						<span class="text_44">行业动态</span>
-						<span class="text_45">2025-06-24</span>
-					</div>
-				</div>
-				<img class="image_8 rightBox" referrerpolicy="no-referrer" src="public/img/news2.png" />
-			</div>
-			<div class="box_14 flex-row justify-center">
-				<div class="group_23 flex-col leftBox">
-					<div class="text-group_7 flex-col justify-between">
-						<span class="text_46">
-							洛阳市郑州商会在洛阳灵睿网络技术有限...
-						</span>
-						<span class="paragraph_2">
-							为深入学习贯彻党的二十大精神，落实省、市委决策，
-							<br />
-							充分发挥民营企业的凝聚力、向心力和创造力，赴..
-						</span>
-					</div>
-					<div class="group_24 flex-row">
-						<div class="group_25 flex-col"></div>
-						<span class="text_47">行业动态</span>
-						<span class="text_48">2025-06-24</span>
-					</div>
-				</div>
-
-				<img class="image_9 bottomBox" referrerpolicy="no-referrer" src="public/img/news3.png" />
-				<div class="group_26 flex-col rightBox">
-					<div class="text-group_8 flex-col justify-between">
-						<span class="text_49">
-							洛阳市郑州商会在洛阳灵睿网络技术有限...
-						</span>
-						<span class="paragraph_3">
-							为深入学习贯彻党的二十大精神，落实省、市委决策，
-							<br />
-							充分发挥民营企业的凝聚力、向心力和创造力，赴..
-						</span>
-					</div>
-					<div class="box_15 flex-row">
-						<div class="group_27 flex-col"></div>
-						<span class="text_50">行业动态</span>
-						<span class="text_51">2025-06-24</span>
 					</div>
 				</div>
 			</div>
-			<div class="box_16 flex-row">
-				<div class="text-wrapper_12 flex-col">
-					<span class="text_52">查看更多</span>
-				</div>
-			</div>
-		</div>
-		<div class="box_17 flex-col" style="overflow: hidden;">
-			<span class="text_53">合作伙伴</span>
-			<span class="text_54">Our&nbsp;Business&nbsp;</span>
-			<!-- <div class="group_28 flex-row justify-center numberTopBox">
-				<div class="text-group_9 flex-col justify-between">
-					<span class="text_55">
-						<n-number-animation :duration="5000" ref="numberAnimationInstRef"  :active="false" :from="0" :to="5000"></n-number-animation>+
-					</span>
-					<span class="text_56">
-						19年技术沉淀，只为提供更在专业的服务，行业解决方案
-					</span>
-				</div>
-				<span class="text_57">服务客户</span>
-				<div class="section_7 flex-col"></div>
-				<div class="text-group_10 flex-col justify-between">
-					<span class="text_58"><n-number-animation :duration="5000" ref="numberAnimationInstRefKH"  :active="false" :from="0" :to="19"></n-number-animation>+</span>
-					<span class="text_59">
-						19年技术沉淀，只为提供更在专业的服务，行业解决方案
-					</span>
-				</div>
-				<span class="text_60">技术沉淀</span>
-				<div class="section_8 flex-col"></div>
-				<div class="text-group_11 flex-col justify-between">
-					<span class="text_61"><n-number-animation :duration="5000" ref="numberAnimationInstRefJS"  :active="false" :from="0" :to="100"></n-number-animation>+</span>
-					<span class="text_62">
-						19年技术沉淀，只为提供更在专业的服务，行业解决方案
-					</span>
-				</div>
-				<span class="text_63">覆盖行业</span>
-				<div class="section_9 flex-col"></div>
-				<div class="text-group_12 flex-col justify-between">
-					<span class="text_64"><n-number-animation :duration="5000" ref="numberAnimationInstRefHY"  :active="false" :from="0" :to="30"></n-number-animation>+</span>
-					<span class="text_65">
-						19年技术沉淀，只为提供更在专业的服务，行业解决方案
-					</span>
-				</div>
-				<span class="text_66">技术团队</span>
-			</div> -->
-			<div class="group_29 grid grid-cols-6 gap-6 mr-auto">
-				<div class="bottom_imgs topSj"></div>
-				<!-- <div v-for="item in 18" class="">
-					<img class="image_11 topSj" referrerpolicy="no-referrer" src="public/img/q1.png" />
-				</div> -->
-			</div>
-		</div>
-		<div class="box_18 flex-col" style="overflow: hidden;">
-			<span class="text_53" style="color: #fff;">联系我们</span>
-			<span class="text_54" style="color: #fff;">cooperative&nbsp;partner&nbsp;</span>
 			
-			<div class="group_29 grid grid-cols-6 gap-6 mr-auto">
-				<div class="bottom_imgs topSj"></div>
-				<!-- <div v-for="item in 18" class="">
-					<img class="image_11 topSj" referrerpolicy="no-referrer" src="public/img/q1.png" />
-				</div> -->
-			</div>
 		</div>
 	</div>
 </template>
@@ -493,5 +280,109 @@ const animate = () => {
     bottom: -13px;
     background-size: 100%;
 }
+.section_1s {
+  height: 360px;
+  background: url(public/img/allpeople.png) 100% no-repeat;
+  background-size: 100% 100%;
+  width: 585px;
+  z-index: 10;
+}
+.text_13s{
+	width: 261px;
+	height: 48px;
+	line-height: 44px;
+	border-radius: 4px 4px 4px 4px;
+	border: 1px solid #768597;
+	color: #768597;
+	font-size: 16px;
+	font-family: Microsoft YaHei UI-Regular;
+	font-weight: 400;
+	text-align: center;
+	white-space: nowrap;
+	margin-right:22px;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	cursor: pointer;
+	.imgs{
+		width: 24px;
+		height: 24px;
+		margin-right: 10px;
+	}
+}
+.box_17s {
+  width: 100%;
+  height: 490px;
+  background: #F8F8F8;
+  justify-content: flex-center;
+}
 
+.hbform{
+	width: 100%;
+}
+.boxgs{
+	width: 100%;
+	margin-top: 30px;
+	justify-content: center;
+	align-items: center;
+	.title{
+		width: 130px;
+		height: 48px;
+		background: #FFFFFF;
+		border-radius: 78px 78px 78px 78px;
+		margin: 0 20px;
+		line-height: 48px;
+		text-align: center;
+		font-weight: 400;
+		font-size: 18px;
+		color: #222222;
+		&.active{
+			background: linear-gradient( 360deg, #FC7428 0%, #FF9357 100%);
+			color: #FFFFFF;
+		}
+	}
+}
+.box_18s {
+  width: 387px;
+  height: 149px;
+  background: url(public/img/lianxiyp.png) 100% no-repeat;
+  z-index: 10;
+  justify-content: center;
+//   align-items: center;
+  margin-right: 20px;
+  .line{
+	width: 347px;
+	height: 1px;
+	background: #D8D8D8;
+	margin: 0 auto;
+  }
+  .titless{
+	width: 100%;
+	padding-top:20px;
+	padding-left: 20px;
+	.a1s{
+		font-family: Microsoft YaHei, Microsoft YaHei;
+		font-weight: 700;
+		font-size: 18px;
+		color: #3D3D3D;
+	}
+	.a2s{
+		margin: 20px 0;
+		font-family: Microsoft YaHei, Microsoft YaHei;
+		font-weight: 400;
+		font-size: 12px;
+		color: #768597;
+	
+	}
+  }
+  .bottomss{
+	width: 100%;
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 20px;
+	color: #768597;
+  }
+  
+}
 </style>

pages/customerReviews.vue

@@ -31,39 +31,25 @@
 			<div class="text-wrapper_11">
 				<span class="text_42">Company&nbsp;Honors&nbsp;</span>
 			</div>
-			
+
 			<div class="boxgs flex-row flex-wrap">
 
-				<div class="box_con flex-col" v-for="(item,index) in lists" :key="index">
+				<div class="box_con flex-col" v-for="(item, index) in lists" :key="index">
-					<div class="align-center"  style="justify-content: center;margin-top: 10px;">
+					<div class="align-center" style="justify-content: center;margin-top: 10px;">
-						<img width="257px" height="169px" :src="`/img/${index}.png`" alt="">
+						<img width="257px" height="169px" :src="`/img/customer/${index}.png`" alt="">
 					</div>
-					<div class="flex-col" style="justify-content: center;margin-top: 10px;border-top: 1px solid #EEEEEE;">
+					<div class="flex-col"
+						style="justify-content: center;margin-top: 10px;border-top: 1px solid #EEEEEE;">
 						<span class="text_tt">
-							{{item.title}}
+							{{ item.title }}
 						</span>
 						<span class="text_cc">
-							{{item.value}}
+							{{ item.value }}
 						</span>
 					</div>
 				</div>
-
-				
-
-				
-
-				
-				
 			</div>
-			
-				
-				
-			
-			
-			
 		</div>
-
-		
 	</div>
 </template>
 
@@ -71,10 +57,10 @@
 import { Swiper, SwiperSlide } from 'swiper/vue'
 import { nextTick, ref } from 'vue'
 import 'swiper/css'
-import { Autoplay, Navigation, Pagination, Scrollbar, A11y, EffectCoverflow,EffectFade } from "swiper/modules";
+import { Autoplay, Navigation, Pagination, Scrollbar, A11y, EffectCoverflow, EffectFade } from "swiper/modules";
 import ScrollReveal from 'scrollreveal';
 import { NNumberAnimation } from 'naive-ui'
-let modules = [Autoplay, A11y, EffectCoverflow,EffectFade];
+let modules = [Autoplay, A11y, EffectCoverflow, EffectFade];
 
 import "swiper/css";
 import "swiper/css/navigation";
@@ -104,7 +90,7 @@ const swiperOptionsNews = {
 	speed: 500,
 	effect: 'fade',
 	loop: true,
-	modules: [EffectFade,Autoplay,Navigation],
+	modules: [EffectFade, Autoplay, Navigation],
 	navigation: {
 		nextEl: '#swipen_prev',
 		prevEl: '#swipen_next',
@@ -117,14 +103,14 @@ const onSwiperExp = (swiper: any) => {
 }
 const swiper_exp = ref();
 const lists = ref([
-	{title: '扶贫助困情系家乡', value: '-洛阳市郑州商会-'},
+	{ title: '扶贫助困情系家乡', value: '-洛阳市郑州商会-' },
-	{title: '互联网技术服务合作单位', value: '-洛阳百艺建筑装饰-'},
+	{ title: '互联网技术服务合作单位', value: '-洛阳百艺建筑装饰-' },
-	{title: '平安洛阳微信平台技术服务单位', value: '-洛阳市公安局-'},
+	{ title: '平安洛阳微信平台技术服务单位', value: '-洛阳市公安局-' },
-	{title: '健康洛阳微信平台技术合作单位', value: '-河南科技大学第一附属医院-'},
+	{ title: '健康洛阳微信平台技术合作单位', value: '-河南科技大学第一附属医院-' },
-	{title: '爱心捐助奉献奖', value: '-洛阳市郑州商会-'},
+	{ title: '爱心捐助奉献奖', value: '-洛阳市郑州商会-' },
-	{title: '精彩洛阳微信平台技术服务单位', value: '-洛阳市宣传部网信办-'},
+	{ title: '精彩洛阳微信平台技术服务单位', value: '-洛阳市宣传部网信办-' },
-	{title: '青年说短视频征集大赛', value: '-洛阳市公安局-'},
+	{ title: '青年说短视频征集大赛', value: '-洛阳市公安局-' },
-	{title: '青年说短视频征集大赛', value: '-河南科技大学第一附属医院-'}
+	{ title: '青年说短视频征集大赛', value: '-河南科技大学第一附属医院-' }
 ]);
 // 新闻数据
 onMounted(() => {
@@ -217,52 +203,57 @@ const animate = () => {
 
 
 .group_666 .swiper-slide img {
-  width: 100%;
+	width: 100%;
-  height: 500px;
+	height: 500px;
-  height: auto;
+	height: auto;
-  transition: 1s linear 2s;
+	transition: 1s linear 2s;
-  transform: scale(1.1, 1.1);
+	transform: scale(1.1, 1.1);
 }
 
 .group_666 .swiper-slide-active img,
 .swiper-slide-duplicate-active img {
-  transition: 6s linear;
+	transition: 6s linear;
-  transform: scale(1, 1);
+	transform: scale(1, 1);
 }
-.bottom_imgss{
+
+.bottom_imgss {
 	background: url(/public/img/customer/bg-s.png);
 	width: 1920px;
-    height: 800px;
+	height: 800px;
-    background-size: 100%;
+	background-size: 100%;
 }
-.boxgs{
+
-    width: 1300px;
+.boxgs {
-    margin: 0 auto;
+	width: 1300px;
+	margin: 0 auto;
 	margin-top: 30px;
-	.box_con{
+
-		margin:20px;
+	.box_con {
+		margin: 20px;
 		background-color: #ffffff;
 		width: 277px;
 		height: 276px;
 		font-family: Microsoft YaHei UI-Regular;
-		border-radius:4px;
+		border-radius: 4px;
-		.text_tt{
+
+		.text_tt {
 			display: inline-block;
 			width: 100%;
 			margin-top: 15px;
 			overflow-wrap: break-word;
-			color: #3D3D3D ;
+			color: #3D3D3D;
 			font-size: 18px;
 			font-weight: 500;
 			text-align: center;
 			white-space: nowrap;
 		}
-		.text_cc{
+
+		.text_cc {
 			display: inline-block;
 			width: 100%;
 			height: 30px;
 			overflow-wrap: break-word;
-			color: #999999 ;
+			color: #999999;
 			font-size: 14px;
 			font-weight: 400;
 			text-align: center;

pages/index.vue

@@ -67,63 +67,166 @@
 					Our BusinessWay
 				</span>
 				<div class="flex-row justify-center align-center">
-					<div class="leftBox" style="margin-right: 30px;">
+					<div class="leftBox section_2s flex-col" style="margin-right: 30px;">
-						<img class="image_6" referrerpolicy="no-referrer" src="public/img/t3.png" />
-					</div>
-
-					<div class="rightBox section_2 flex-col">
 						<div class="group_6 flex-col">
-							<div class="box_6 flex-row justify-between">
+							<div class="box_6 flex-row align-center justify-between">
-								<div class="image-wrapper_3 flex-col align-center">
-									<img class="label_1" referrerpolicy="no-referrer" src="public/img/u1.png" />
-								</div>
 								<div class="text-group_2 flex-col justify-between">
-									<span class="text_17">
+									<span class="text_17" style="color: #0256FF;">
-										专业网站建设与企业官网设计定制服务
+										专业技术服务
 									</span>
-									<span class="text_16">
+									<span class="text_16" style="color: #0256FF;">
-										助力企业数字化转型升级，PC端/移动端/H5提供一站式网站开发、搭建
+										专业提供互联网技术支持，助力企业高效发展
 									</span>
 								</div>
+								<div class="image-wrapper_3s flex-col align-center">
+									<img class="label_1s" referrerpolicy="no-referrer" src="public/img/u1s.png" />
+								</div>
+								
 							</div>
 						</div>
+						<div class="group_10s flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r4.png" />
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/aiyingyong.png" />
 							</div>
 							<div class="text-group_3 flex-col justify-between">
-								<span class="text_18">企业数字化自媒体托管专家</span>
+								<span class="text_18">AI应用与落地</span>
 								<span class="text_19">
-									业团队代运营+AI智能内容生成+多平台精准投放，助您专注核心业务
+									从模型选型、数据处理、算法优化到应用集成与部署的全栈服务
 								</span>
 							</div>
 						</div>
 						<div class="group_10 flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r3.png" />
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/kaifapeizhi.png" />
 							</div>
 							<div class="text-group_3 flex-col justify-between">
-								<span class="text_18">全流程抖音短视频制作服务</span>
+								<span class="text_18">定制软件开发</span>
 								<span class="text_19">
-									助您快速打造高播放量、高互动率的爆款短视频
+									为您打造用户体验出色、性能稳定可靠的Web应用、移动App及小程序
 								</span>
 							</div>
 						</div>
-						<div class="group_12 flex-col"></div>
+						<div class="group_10 flex-col"></div>
+						<div class="group_7 flex-row justify-between">
+							<div class="image-wrapper_5 flex-col">
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/a-yunweishuju1x.png" />
+							</div>
+							<div class="text-group_3 flex-col justify-between">
+								<span class="text_18">IT运维服务</span>
+								<span class="text_19">
+									专业守护数据，防御威胁，护航企业数字安全
+								</span>
+							</div>
+						</div>
+						<div class="group_10 flex-col"></div>
+						<div class="group_7 flex-row justify-between">
+							<div class="image-wrapper_5 flex-col">
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/wangluoanquanshebei.png" />
+							</div>
+							<div class="text-group_3 flex-col justify-between">
+								<span class="text_18">网络与信息安全</span>
+								<span class="text_19">
+									专业提供网络信息安全防护、实时监测与风险处置服务
+								</span>
+							</div>
+						</div>
+						<div class="group_10 flex-col"></div>
 						<div class="group_13 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r2.png" />
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/yekuogongdianfangan.png" />
 							</div>
 							<div class="text-group_5 flex-col justify-between">
-								<span class="text_22">全栈H5开发解决方案</span>
+								<span class="text_22">智慧化解决方案</span>
 								<span class="text_23">
-									基于HTML5/CSS3/JavaScript核心技术助力实现高转化率与沉浸式用户体验
+									利用物联网、大数据、人工智能等前沿技术，提供智慧化解决方案
 								</span>
 							</div>
 						</div>
 					</div>
 
+					<div class="rightBox section_2sa flex-col">
+						<div class="group_6s flex-col">
+							<div class="box_6 flex-row align-center justify-between">
+								<div class="text-group_2 flex-col justify-between">
+									<span class="text_17" >
+										内容创作与运营
+									</span>
+									<span class="text_16" style="color: #FC7428;">
+										构建全域影响力，赋能品牌长效增长
+									</span>
+								</div>
+								<div class="image-wrapper_3s flex-col align-center">
+									<img class="label_1s" referrerpolicy="no-referrer" src="public/img/u1.png" />
+								</div>
+								
+							</div>
+						</div>
+						<div class="group_10s flex-col"></div>
+						<div class="group_7 flex-row justify-between">
+							<div class="image-wrapper_5 flex-col">
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/quanmeiti.png" />
+							</div>
+							<div class="text-group_3 flex-col justify-between">
+								<span class="text_18">全媒体推广解决方案</span>
+								<span class="text_19">
+									覆盖各大主流平台定制【流量矩阵+内容策略+效果追踪】一体化方案
+								</span>
+							</div>
+						</div>
+						<div class="group_10 flex-col"></div>
+						<div class="group_7 flex-row justify-between">
+							<div class="image-wrapper_5 flex-col">
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/pingpai.png" />
+							</div>
+							<div class="text-group_3 flex-col justify-between">
+								<span class="text_18" style="color: #FC7428;">品牌账号代运营</span>
+								<span class="text_19" style="color: #FC7428;">
+									全链路赋能品牌增长，内容+策略+数据 · 打造品效合一的社交资产
+								</span>
+							</div>
+						</div>
+						<div class="group_10 flex-col"></div>
+						<div class="group_7 flex-row justify-between">
+							<div class="image-wrapper_5 flex-col">
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/xianshang.png" />
+							</div>
+							<div class="text-group_3 flex-col justify-between">
+								<span class="text_18">线上线下活动策划</span>
+								<span class="text_19">
+									专业守护数据，防御威胁，护航企业数字安全
+								</span>
+							</div>
+						</div>
+						<div class="group_10 flex-col"></div>
+						<div class="group_7 flex-row justify-between">
+							<div class="image-wrapper_5 flex-col">
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/news.png" />
+							</div>
+							<div class="text-group_3 flex-col justify-between">
+								<span class="text_18">互联网新闻发布</span>
+								<span class="text_19">
+									整合全网权威渠道，依托海量优质媒体资源，定制新闻发布策略
+								</span>
+							</div>
+						</div>
+						<div class="group_10 flex-col"></div>
+						<div class="group_13 flex-row justify-between">
+							<div class="image-wrapper_5 flex-col">
+								<img class="label_3" referrerpolicy="no-referrer" src="public/img/daren.png" />
+							</div>
+							<div class="text-group_5 flex-col justify-between">
+								<span class="text_22">IP孵化与达人合作</span>
+								<span class="text_23">
+									深度孵化+精准匹配，内容资产×流量裂变 · 打造IP与达人的共生生态
+								</span>
+							</div>
+						</div>
+						
+						
+					</div>
+
 				</div>
 			</div>
 		</div>
@@ -309,11 +412,45 @@
 			<span class="text_53" style="color: #fff;">联系我们</span>
 			<span class="text_54" style="color: #fff;">cooperative&nbsp;partner&nbsp;</span>
 			
-			<div class="group_29 grid grid-cols-6 gap-6 mr-auto">
+			<div class="numberTopBox" style="margin:0 auto;">
-				<div class="bottom_imgs topSj"></div>
+				<form class="contactForm mt-6 w-full" @submit.prevent="submitForm">
-				<!-- <div v-for="item in 18" class="">
+					<div class="inputform">
-					<img class="image_11 topSj" referrerpolicy="no-referrer" src="public/img/q1.png" />
+						<input 
-				</div> -->
+                v-model="formData.name"
+                class="contactInput  mt-[15px] md:mt-[30px] w-full md:w-[700px]" 
+                type="text" 
+                placeholder="输入您的姓名"
+              />
+              <input 
+                v-model="formData.mobile"
+                class="contactInput mt-[15px] md:ml-[30px] md:mt-[30px] w-full md:w-[700px]" 
+                type="text" 
+                placeholder="请输入您的联系电话"
+              />
+			  <input 
+                v-model="formData.emil"
+                class="contactInput mt-[15px] md:ml-[30px] md:mt-[30px] w-full md:w-[700px]" 
+                type="text" 
+                placeholder="请输入您的邮箱"
+              />
+					</div>
+              <div class="relative mt-4 md:mt-8 w-full md:w-[1200px]">
+                <textarea 
+                  v-model="formData.message"
+                  id="myTextarea" 
+                  placeholder="为了更好地帮助您，请尽量提供详细的信息" 
+                  rows="5"
+                  maxlength="100"
+                  class="w-full md:w-[1200px]"
+                ></textarea>
+				<button 
+                  type="submit"
+                  class="contactBut"
+                >
+                  {{ '提交' }}
+                </button>
+              </div>
+            </form>
 			</div>
 		</div>
 	</div>
@@ -368,17 +505,23 @@ const onSwiperExp = (swiper: any) => {
 	vesSwiper = swiper
 }
 const swiper_exp = ref();
-
+// 表单数据
+const formData = reactive({
+  name: '',
+  mobile: '',
+  emil:'',
+  message: ''
+})
 // 新闻数据
 onMounted(() => {
 	nextTick(() => {
 		animate()
 	})
 })
-const numberAnimationInstRef = ref()
+// const numberAnimationInstRef = ref()
-const numberAnimationInstRefKH = ref()
+// const numberAnimationInstRefKH = ref()
-const numberAnimationInstRefJS = ref()
+// const numberAnimationInstRefJS = ref()
-const numberAnimationInstRefHY = ref()
+// const numberAnimationInstRefHY = ref()
 const animate = () => {
 
 	const sr = ScrollReveal();
@@ -432,10 +575,10 @@ const animate = () => {
 		reset: true,
 		mobile: true,
 		beforeReveal: function (el: any) {
-			numberAnimationInstRef.value.play()
+			// numberAnimationInstRef.value.play()
-			numberAnimationInstRefKH.value.play()
+			// numberAnimationInstRefKH.value.play()
-			numberAnimationInstRefJS.value.play()
+			// numberAnimationInstRefJS.value.play()
-			numberAnimationInstRefHY.value.play()
+			// numberAnimationInstRefHY.value.play()
 		},
 	})
 	sr.reveal('.topSj', {
@@ -451,6 +594,46 @@ const animate = () => {
 		interval: 50,
 	})
 }
+// 表单提交方法
+const submitForm = () => {
+  console.log(formData);
+  
+  // 这里可以添加表单验证逻辑
+  if (!formData.name) {
+    alert('请输入您的姓名')
+    return
+  }
+  
+  if (!formData.mobile) {
+    alert('请输入您的手机号码')
+    return
+  }
+  
+  if (!formData.message) {
+    alert('请输入您的留言内容')
+    return
+  }
+  $api.post("/api/home.leave_word/add" , formData)
+		.then((res: any) => {
+			console.log(res)
+      if(res.status == 200){
+        alert('留言成功')
+      }else{
+        alert('失败')
+      }
+      formData.name = '';
+      formData.mobile = '';
+      formData.emil = '';
+      formData.message = '';
+		})
+		.catch((err) => {
+			console.dir(err)
+		})
+  // 重置表单
+  // formData.name = ''
+  // formData.mobile = ''
+  // formData.content = ''
+}
 </script>
 
 <style lang="scss">
@@ -493,5 +676,47 @@ const animate = () => {
     bottom: -13px;
     background-size: 100%;
 }
-
+.contactForm{
+	width: 100%;
+	.inputform{
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		width: 1200px;
+	}
+    
+}
+.contactInput{
+	width: 380px;
+height: 50px;
+background: #FFFFFF;
+border-radius: 6px 6px 6px 6px;
+padding-left: 20px;
+}
+.contactInput::placeholder {color: #768597; }
+.contactInput:focus {outline: none;}
+#myTextarea{
+	width: 1200px;
+	height: 167px;
+	background: #FFFFFF;
+	border-radius: 6px 6px 6px 6px;
+	opacity: 0.8;
+	padding-left: 20px;padding-top: 20px;
+	resize: none;
+}
+#myTextarea::placeholder {color: #768597; }
+#myTextarea:focus {outline: none;}
+.char-count {position: absolute;bottom: 5px; /* 根据需要调整距离底部的位置 */right: 10px; /* 根据需要调整距离右侧的位置 */font-size: 12px; /* 根据需要调整字体大小 */color: #A8CBFF;}
+@media (max-width: 768px) {
+  .contactInput {
+    font-size: 18px;
+    height: 40px;
+  }
+}
+.contactBut{width: 108px;
+	border-radius: 4px 4px 4px 4px;
+	    position: absolute;
+    bottom: 20px;
+    right: 30px;
+height: 36px; background-color: #222222; border: none; font-weight: 400;font-size: 16px;line-height: 28px;color: #FFFFFF;}
 </style>

pages/societyDuty.vue

@@ -4,13 +4,13 @@
 		<div class="group_666" style="position: relative;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/banner.png" style="width: 100%;">
+					<img src="public/img/societyduty/shehui.png" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/banner.png" style="width: 100%;">
+					<img src="public/img/societyduty/shehui.png" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
-			<div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
+			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
 				<div class="flex-row justify-center align-center">
 					<div>
 						<img src="public/img/left.png" alt="">
@@ -22,300 +22,58 @@
 						<img src="public/img/right.png" alt="">
 					</div>
 				</div>
-			</div>
+			</div> -->
 		</div>
-		<div class="group_2 flex-col">
+		<div class="box_11 flex-col bottom_imgss">
-			<div class="box_2 flex-col">
+			<!-- <div class="text-wrapper_10">
-				<div class="group_3 flex-row justify-center align-center">
+				<span class="text_41">公司荣誉</span>
-					<div class="group_4 flex-col leftBox">
-						<div class="text-group_1 flex-col justify-between">
-							<span class="text_7">灵睿的互联网之道</span>
-							<span class="text_8">
-								The&nbsp;Way&nbsp;of&nbsp;the&nbsp;Internet
-							</span>
-						</div>
-						<div class="text-wrapper_1 flex-row">
-							<span class="text_9">公司简介</span>
-							<span class="text_10">运营方法论</span>
-							<span class="text_11">互联网营销</span>
-						</div>
-						<div class="box_3 flex-col">
-							<div class="box_4 flex-col"></div>
-						</div>
-						<span class="text_12">
-							灵睿是一家专业提供互联网技术及应用化服务的科技企业。公司成立于2006年，总部位于十三朝古都洛阳，在郑州、洛阳、许昌三地设立四家公司，是洛阳及河南建立较早、实力较强、规模较大的互联网骨干技术服务企业。公司致力于互联网+工业、互联网+医疗、互联网+教育、互联网+旅游、互联网+农业五个方面的发展。目前为近三千家企业提供互联网服务，并为上百家国有大型企业以及党政部门、事业机关单位提供互联网应用化服务。
-						</span>
-						<div class="text-wrapper_2 flex-col">
-							<span class="text_13">查看全部</span>
-						</div>
-					</div>
-					<div class="group_5 flex-col justify-center align-center rightBox">
-						<div class="section_1 flex-col">
-							<div class="image-wrapper_2 flex-col">
-								<img class="image_5" referrerpolicy="no-referrer" src="public/img/bf.png" />
-							</div>
-						</div>
-						<div class="content_box"></div>
-					</div>
-				</div>
 			</div>
-		</div>
+			<div class="text-wrapper_11">
-		<div class="group_2 flex-col">
+				<span class="text_42">Company&nbsp;Honors&nbsp;</span>
-			<div class="box_5 flex-col">
+			</div> -->
-				<span class="text_14 topBox">我们的业务</span>
+			<div class="group_14 flex-row justify-between align-center" style="flex-wrap: wrap;">
-				<span class="text_15 topBox">
-					Our&nbsp;BusinessWay
-				</span>
-				<div class="flex-row justify-center align-center">
-					<div class="leftBox" style="margin-right: 30px;">
-						<img class="image_6" referrerpolicy="no-referrer" src="public/img/t3.png" />
-					</div>
-
-					<div class="rightBox section_2 flex-col">
-						<div class="group_6 flex-col">
-							<div class="box_6 flex-row justify-between">
-								<div class="image-wrapper_3 flex-col align-center">
-									<img class="label_1" referrerpolicy="no-referrer" src="public/img/u1.png" />
-								</div>
-								<div class="text-group_2 flex-col justify-between">
-									<span class="text_17">
-										专业网站建设与企业官网设计定制服务
-									</span>
-									<span class="text_16">
-										助力企业数字化转型升级，PC端/移动端/H5提供一站式网站开发、搭建
-									</span>
-								</div>
-							</div>
-						</div>
-						<div class="group_7 flex-row justify-between">
-							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r4.png" />
-							</div>
-							<div class="text-group_3 flex-col justify-between">
-								<span class="text_18">企业数字化自媒体托管专家</span>
-								<span class="text_19">
-									业团队代运营+AI智能内容生成+多平台精准投放，助您专注核心业务
-								</span>
-							</div>
-						</div>
-						<div class="group_10 flex-col"></div>
-						<div class="group_7 flex-row justify-between">
-							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r3.png" />
-							</div>
-							<div class="text-group_3 flex-col justify-between">
-								<span class="text_18">全流程抖音短视频制作服务</span>
-								<span class="text_19">
-									助您快速打造高播放量、高互动率的爆款短视频
-								</span>
-							</div>
-						</div>
-						<div class="group_12 flex-col"></div>
-						<div class="group_13 flex-row justify-between">
-							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/r2.png" />
-							</div>
-							<div class="text-group_5 flex-col justify-between">
-								<span class="text_22">全栈H5开发解决方案</span>
-								<span class="text_23">
-									基于HTML5/CSS3/JavaScript核心技术助力实现高转化率与沉浸式用户体验
-								</span>
-							</div>
-						</div>
-					</div>
-
-				</div>
-			</div>
-		</div>
-		<div class="box_7 flex-col">
-			<span class="text_24 topBox">行业案例</span>
-			<span class="text_15 topBox">Industry&nbsp;Cases</span>
-			<!-- <div class="group_14 flex-row justify-between align-center" style="flex-wrap: wrap;">
 				<div class="flex-row">
 					<div class="text_25">
-						<span>医疗</span>
+						<span>公司动态</span>
+					</div>
+					<div class="text_25">
+						<span style="color: rgb(252, 116, 40);">活动影集（部分）</span>
 						<div
 							style="width: 100%;height: 1px;background-color: #fc7428;position: absolute;bottom: -21px;">
 						</div>
 					</div>
-					<div class="text_25">党政</div>
+					
-					<div class="text_25">建筑</div>
-					<div class="text_25">物流</div>
-					<div class="text_25">教育</div>
-					<div class="text_25">文旅</div>
-					<div class="text_25">餐饮</div>
 				</div>
-				<div class="flex-row justify-center align-center">
+				<!-- <div class="flex-row justify-center align-center">
 					<div style="margin-right: 10px;">
 						<span class="text_32">更多案例</span>
 					</div>
 					<div>
 						<img src="public/img/anli.png" />
 					</div>
-				</div>
+				</div> -->
 				<div class="group_15" style="flex: 0 0 100%;"></div>
-			</div> -->
-
-			<div class="dswper">
-				<swiper ref="swiper_exp" :slidesPerView="3" loop :loopedSlides="3" :autoplay="false" centeredSlides
-					:modules="modules" :watchSlidesProgress="true" @swiper="onSwiperExp" effect="coverflow">
-					<swiper-slide>
-						<img src="public/img/op1.png" style="width: 100%;">
-					</swiper-slide>
-					<swiper-slide>
-						<img src="public/img/op2.png" style="width: 100%;">
-					</swiper-slide>
-					<swiper-slide>
-						<img src="public/img/op1.png" style="width: 100%;">
-					</swiper-slide>
-					 <swiper-slide>
-						<img src="public/img/op2.png" style="width: 100%;">
-					</swiper-slide>
-					<swiper-slide>
-						<img src="public/img/op1.png" style="width: 100%;">
-					</swiper-slide>
-				</swiper>
-				<div class="dswper_left">
-					<img src="public/img/opl.png">
-				</div>
-				<div class="dswper_right">
-					<img src="public/img/opr.png">
-				</div>
-				<div class="flex-row justify-center align-center absolute w-full bottom-[-50px]" style="gap: 30px;">
-					<div style="width: 25px;height:5px;background-color: #fc7428;"></div>
-					<div style="width: 25px;height:5px;background-color: #C1C1C1;"></div>
-					<div style="width: 25px;height:5px;background-color: #C1C1C1;"></div>
-				</div>
 			</div>
-		</div>
-		<div class="box_11 flex-col">
-			<div class="text-wrapper_10">
-				<span class="text_41">新闻动态</span>
-			</div>
-			<div class="text-wrapper_11">
-				<span class="text_42">Our&nbsp;Business&nbsp;</span>
-			</div>
-			<div class="box_12 flex-row justify-center">
-				<img class="image_7 leftBox" referrerpolicy="no-referrer" src="public/img/news1.png" />
-				<div class="box_13 flex-col topBox">
-					<div class="text-group_6 flex-col justify-between">
-						<span class="text_43">
-							洛阳市郑州商会在洛阳灵睿网络技术有限...
-						</span>
-						<span class="paragraph_1">
-							为深入学习贯彻党的二十大精神，落实省、市委决策，
-							<br />
-							充分发挥民营企业的凝聚力、向心力和创造力，赴..
-						</span>
-					</div>
-					<div class="group_22 flex-row">
-						<div class="section_6 flex-col"></div>
-						<span class="text_44">行业动态</span>
-						<span class="text_45">2025-06-24</span>
-					</div>
-				</div>
-				<img class="image_8 rightBox" referrerpolicy="no-referrer" src="public/img/news2.png" />
-			</div>
-			<div class="box_14 flex-row justify-center">
-				<div class="group_23 flex-col leftBox">
-					<div class="text-group_7 flex-col justify-between">
-						<span class="text_46">
-							洛阳市郑州商会在洛阳灵睿网络技术有限...
-						</span>
-						<span class="paragraph_2">
-							为深入学习贯彻党的二十大精神，落实省、市委决策，
-							<br />
-							充分发挥民营企业的凝聚力、向心力和创造力，赴..
-						</span>
-					</div>
-					<div class="group_24 flex-row">
-						<div class="group_25 flex-col"></div>
-						<span class="text_47">行业动态</span>
-						<span class="text_48">2025-06-24</span>
-					</div>
-				</div>
-
-				<img class="image_9 bottomBox" referrerpolicy="no-referrer" src="public/img/news3.png" />
-				<div class="group_26 flex-col rightBox">
-					<div class="text-group_8 flex-col justify-between">
-						<span class="text_49">
-							洛阳市郑州商会在洛阳灵睿网络技术有限...
-						</span>
-						<span class="paragraph_3">
-							为深入学习贯彻党的二十大精神，落实省、市委决策，
-							<br />
-							充分发挥民营企业的凝聚力、向心力和创造力，赴..
-						</span>
-					</div>
-					<div class="box_15 flex-row">
-						<div class="group_27 flex-col"></div>
-						<span class="text_50">行业动态</span>
-						<span class="text_51">2025-06-24</span>
-					</div>
-				</div>
-			</div>
-			<div class="box_16 flex-row">
-				<div class="text-wrapper_12 flex-col">
-					<span class="text_52">查看更多</span>
-				</div>
-			</div>
-		</div>
-		<div class="box_17 flex-col" style="overflow: hidden;">
-			<span class="text_53">合作伙伴</span>
-			<span class="text_54">Our&nbsp;Business&nbsp;</span>
-			<!-- <div class="group_28 flex-row justify-center numberTopBox">
-				<div class="text-group_9 flex-col justify-between">
-					<span class="text_55">
-						<n-number-animation :duration="5000" ref="numberAnimationInstRef"  :active="false" :from="0" :to="5000"></n-number-animation>+
-					</span>
-					<span class="text_56">
-						19年技术沉淀，只为提供更在专业的服务，行业解决方案
-					</span>
-				</div>
-				<span class="text_57">服务客户</span>
-				<div class="section_7 flex-col"></div>
-				<div class="text-group_10 flex-col justify-between">
-					<span class="text_58"><n-number-animation :duration="5000" ref="numberAnimationInstRefKH"  :active="false" :from="0" :to="19"></n-number-animation>+</span>
-					<span class="text_59">
-						19年技术沉淀，只为提供更在专业的服务，行业解决方案
-					</span>
-				</div>
-				<span class="text_60">技术沉淀</span>
-				<div class="section_8 flex-col"></div>
-				<div class="text-group_11 flex-col justify-between">
-					<span class="text_61"><n-number-animation :duration="5000" ref="numberAnimationInstRefJS"  :active="false" :from="0" :to="100"></n-number-animation>+</span>
-					<span class="text_62">
-						19年技术沉淀，只为提供更在专业的服务，行业解决方案
-					</span>
-				</div>
-				<span class="text_63">覆盖行业</span>
-				<div class="section_9 flex-col"></div>
-				<div class="text-group_12 flex-col justify-between">
-					<span class="text_64"><n-number-animation :duration="5000" ref="numberAnimationInstRefHY"  :active="false" :from="0" :to="30"></n-number-animation>+</span>
-					<span class="text_65">
-						19年技术沉淀，只为提供更在专业的服务，行业解决方案
-					</span>
-				</div>
-				<span class="text_66">技术团队</span>
-			</div> -->
-			<div class="group_29 grid grid-cols-6 gap-6 mr-auto">
-				<div class="bottom_imgs topSj"></div>
-				<!-- <div v-for="item in 18" class="">
-					<img class="image_11 topSj" referrerpolicy="no-referrer" src="public/img/q1.png" />
-				</div> -->
-			</div>
-		</div>
-		<div class="box_18 flex-col" style="overflow: hidden;">
-			<span class="text_53" style="color: #fff;">联系我们</span>
-			<span class="text_54" style="color: #fff;">cooperative&nbsp;partner&nbsp;</span>
 			
-			<div class="group_29 grid grid-cols-6 gap-6 mr-auto">
+			<div class="boxgs flex-row flex-wrap">
-				<div class="bottom_imgs topSj"></div>
+
-				<!-- <div v-for="item in 18" class="">
+				<div class="box_con flex-col" v-for="(item,index) in lists" :key="index">
-					<img class="image_11 topSj" referrerpolicy="no-referrer" src="public/img/q1.png" />
+					<div class="align-center"  style="justify-content: center;margin-top: 10px;">
-				</div> -->
+						<img width="257px" height="169px" :src="`/img/customer/${index}.png`" alt="">
-			</div>
+					</div>
+					<div class="flex-col" style="justify-content: center;margin-top: 10px;border-top: 1px solid #EEEEEE;">
+						<span class="text_tt">
+							{{item.title}}
+						</span>
+						<span class="text_cc">
+							{{item.value}}
+						</span>
+					</div>
+				</div>	
+			</div>	
 		</div>
+
+		
 	</div>
 </template>
 
@@ -368,7 +126,16 @@ const onSwiperExp = (swiper: any) => {
 	vesSwiper = swiper
 }
 const swiper_exp = ref();
-
+const lists = ref([
+	{title: '扶贫助困情系家乡', value: '-洛阳市郑州商会-'},
+	{title: '互联网技术服务合作单位', value: '-洛阳百艺建筑装饰-'},
+	{title: '平安洛阳微信平台技术服务单位', value: '-洛阳市公安局-'},
+	{title: '健康洛阳微信平台技术合作单位', value: '-河南科技大学第一附属医院-'},
+	{title: '爱心捐助奉献奖', value: '-洛阳市郑州商会-'},
+	{title: '精彩洛阳微信平台技术服务单位', value: '-洛阳市宣传部网信办-'},
+	{title: '青年说短视频征集大赛', value: '-洛阳市公安局-'},
+	{title: '青年说短视频征集大赛', value: '-河南科技大学第一附属医院-'}
+]);
 // 新闻数据
 onMounted(() => {
 	nextTick(() => {
@@ -453,17 +220,11 @@ const animate = () => {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import "@/assets/animate/animate.min.css";
 @import "@/assets/index.css";
 
-:deep(.dswper .swiper-slide-next) {
-	transform: translate3d(0px, 0px, -507px) rotateX(0deg) rotateY(0deg) scale(1) !important;
-}
 
-:deep(.dswper .swiper-slide-prev) {
-	transform: translate3d(0px, 0px, -507px) rotateX(0deg) rotateY(0deg) scale(1) !important;
-}
 
 .group_666 .swiper-slide img {
   width: 100%;
@@ -478,20 +239,46 @@ const animate = () => {
   transition: 6s linear;
   transform: scale(1, 1);
 }
-.bottom_imgs{
+.bottom_imgss{
-	background: url(/public/img/qall.png);
+	// background: url(/public/img/customer/bg-s.png);
-	width: 1230px;
+	background: #F8F8F8;
-    height: 272px;
+	width: 1920px;
-    background-size: 100%;
+    height: 800px;
+    // background-size: 100%;
 }
-.content_box{
+.boxgs{
-	background: url(/public/img/m1.png);;
+    width: 1300px;
-	width: 561px;height: 521px;
+    margin: 0 auto;
-	z-index: 1;
+	margin-top: 30px;
-	position: absolute;
+	.box_con{
-    right: -12px;
+		margin:20px;
-    bottom: -13px;
+		background-color: #ffffff;
-    background-size: 100%;
+		width: 277px;
+		height: 276px;
+		font-family: Microsoft YaHei UI-Regular;
+		border-radius:4px;
+		.text_tt{
+			display: inline-block;
+			width: 100%;
+			margin-top: 15px;
+			overflow-wrap: break-word;
+			color: #3D3D3D ;
+			font-size: 18px;
+			font-weight: 500;
+			text-align: center;
+			white-space: nowrap;
+		}
+		.text_cc{
+			display: inline-block;
+			width: 100%;
+			height: 30px;
+			overflow-wrap: break-word;
+			color: #999999 ;
+			font-size: 14px;
+			font-weight: 400;
+			text-align: center;
+			line-height: 30px;
+		}
+	}
 }
-
 </style>