友情链接修改

controllers/index.go

@@ -3,6 +3,7 @@ package controllers
 import (
 	"cc-officialweb/service"
 	beego "github.com/beego/beego/v2/server/web"
+	"log"
 )
 
 type MainController struct {
@@ -38,6 +39,12 @@ func (c *MainController) Get() {
 	} else {
 		c.Data["Datas"] = "未获得数据"
 	}
+	//友情链接
+	links := service.GetAllLinks()
+	if links != nil {
+		c.Data["Links"] = links
+	}
+	log.Printf("links:%v", links)
 	c.Data["honor"] = honor
 	c.Data["banner"] = banner
 	c.Data["example"] = success

controllers/links.go

@@ -0,0 +1,110 @@
+package controllers
+
+import (
+	"cc-officialweb/models"
+	"cc-officialweb/unity"
+	"encoding/json"
+	beego "github.com/beego/beego/v2/server/web"
+	"github.com/go-playground/validator/v10"
+	"strconv"
+)
+
+type LinksController struct {
+	beego.Controller
+}
+
+// AddLinks 添加友情链接
+func (l *LinksController) AddLinks() {
+	var linksDto models.LinkDto
+	var link models.Link
+	err := json.Unmarshal(l.Ctx.Input.RequestBody, &linksDto)
+	if err != nil {
+		l.Data["json"] = &JSON{Code: 101, Msg: "json解析失败"}
+		l.ServeJSON()
+		return
+	}
+	link.Title = linksDto.Title
+	link.Url = linksDto.Url
+	link.Sort = linksDto.Sort
+	_, err = unity.Add(&link)
+	if err != nil {
+		l.Data["json"] = &JSON{Code: 101, Msg: "添加失败"}
+		l.ServeJSON()
+		return
+	} else {
+		l.Data["json"] = &JSON{Code: 200, Msg: "添加成功", Data: nil}
+		l.ServeJSON()
+	}
+
+}
+
+// UpdateLinks 更新友情链接
+func (l *LinksController) UpdateLinks() {
+	var linksDto models.LinkDto
+	var link models.Link
+	err := json.Unmarshal(l.Ctx.Input.RequestBody, &linksDto)
+	if err != nil {
+		l.Data["json"] = &JSON{Code: 101, Msg: "json解析失败"}
+		l.ServeJSON()
+		return
+	}
+	link.Title = linksDto.Title
+	link.Url = linksDto.Url
+	link.Sort = linksDto.Sort
+	_, err = unity.UpdateById(linksDto.ID, &link)
+	if err != nil {
+		l.Data["json"] = &JSON{Code: 102, Msg: err.Error()}
+		l.ServeJSON()
+		return
+	} else {
+		l.Data["json"] = &JSON{Code: 200, Msg: "修改成功"}
+		l.ServeJSON()
+	}
+}
+
+// DeleteLinksById  根据id删除产品
+func (l *LinksController) DeleteLinksById() {
+	id := l.GetString("id")
+	atoi, _ := strconv.Atoi(id)
+	validate := validator.New()
+	err2 := validate.Var(atoi, "required")
+	if err2 != nil {
+		l.Data["json"] = &JSON{Code: 103, Msg: "id不能为空"}
+		l.ServeJSON()
+		return
+	}
+	_, err := unity.DeleteById(atoi, models.Link{})
+	if err != nil {
+		l.Data["json"] = map[string]interface{}{"code": 101, "msg": "删除失败"}
+		l.ServeJSON()
+		return
+	} else {
+		l.Data["json"] = map[string]interface{}{"code": 200, "msg": "删除成功"}
+		l.ServeJSON()
+	}
+}
+
+// GetAllLinks  获取所有产品信息
+func (l *LinksController) GetAllLinks() {
+	var page unity.PageParams
+	err := json.Unmarshal(l.Ctx.Input.RequestBody, &page)
+	if err != nil {
+		l.Data["json"] = &JSON{Code: 101, Msg: "参数错误"}
+		l.ServeJSON()
+		return
+	}
+	result, total, current, err := unity.Paginate(page, models.Link{})
+	if err != nil {
+		l.Data["json"] = &JSON{Code: 101, Msg: "查询失败"}
+		l.ServeJSON()
+		return
+	} else {
+		l.Data["json"] = &JSON{Code: 200, Msg: "查询成功", Data: &JSONS{
+			Current: current,
+			Size:    total,
+			Data:    result,
+		}}
+		l.ServeJSON()
+		return
+	}
+}

models/links.go

@@ -0,0 +1,16 @@
+package models
+
+import "gorm.io/gorm"
+
+type Link struct {
+	gorm.Model
+	Title string `json:"title"`
+	Url   string `json:"url"`
+	Sort  int    `json:"sort"`
+}
+type LinkDto struct {
+	ID    uint   `json:"id"`
+	Title string `json:"title"`
+	Url   string `json:"url"`
+	Sort  int    `json:"sort"`
+}

routers/router.go

@@ -79,4 +79,10 @@ func init() {
 	beego.Router("/addcontact", &controllers.ContactController{}, "post:AddContact")
 	beego.Router("/api/contact", &controllers.ContactController{}, "delete:DeleteContactById")
 	beego.Router("/api/contactall", &controllers.ContactController{}, "post:GetAllContact")
+	//友情链接
+	beego.Router("/api/links", &controllers.LinksController{}, "post:AddLinks")
+	beego.Router("/api/links", &controllers.LinksController{}, "delete:DeleteLinksById")
+	beego.Router("/api/links", &controllers.LinksController{}, "put:UpdateLinks")
+	beego.Router("/api/alllinks", &controllers.LinksController{}, "post:GetAllLinks")
+
 }

service/links.go

@@ -0,0 +1,15 @@
+package service
+
+import (
+	"cc-officialweb/models"
+	"cc-officialweb/utils"
+)
+
+func GetAllLinks() (links []models.Link) {
+	tx := utils.DB.Order("sort desc").Find(&links)
+	if tx.RowsAffected > 0 {
+		return links
+	} else {
+		return nil
+	}
+}

static/css/style.css

@@ -1550,29 +1550,31 @@ p.help-block li {
   color: white; /* 或指定你需要的颜色，如果需要的话 */
   font-size: 16px; /* 保持或调整为你希望的字体大小 */
 }
-/* 服务介绍区域整体样式 */
 .features {
   background-color: #f9f9f9;
-  padding-top: 80px;
-  padding-bottom: 80px;
+  padding: 80px 0;
 }
 
-/* 服务介绍头部样式 */
-.section-header {
-  text-align: center;
-  margin-bottom: 4rem;
+.container {
+  max-width: 1200px;
+  margin: 0 auto;
 }
+
+.section-header h2 {
+  margin-bottom: 1rem;
+}
+
 .section-header p {
   max-width: 32rem;
   margin: 0 auto;
   font-size: 1.1rem;
 }
 
-/* 服务项目列表样式 */
 .service-description {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  grid-gap: 20px;
+  justify-content: center;
 }
 
 .service-item {
@@ -1580,10 +1582,12 @@ p.help-block li {
   background-color: #ffffff;
   border-radius: 16px;
   padding: 30px;
-  width: calc(25% - 20px);
-  margin-bottom: 40px;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
+  display: flex;
+  flex-direction: column;
+
+
 }
 
 .service-item:hover {
@@ -1596,32 +1600,32 @@ p.help-block li {
   position: absolute;
   top: 0;
   left: 0;
-  width: 100%;
-  height: 100%;
+  right: 0;
+  bottom: 0;
   background-size: cover;
   background-position: center;
   opacity: 0.15;
-  border-radius: 16px;
+  border-radius: inherit;
   z-index: -1;
 }
 
+.service-item h4,
+.service-item p {
+  margin: 0;
+  text-align: center;
+}
+
 .service-item h4 {
-  margin-top: 0;
   font-size: 1.5rem;
   color: #343a40;
 }
 
 .service-item p {
   font-size: 1rem;
-  margin-bottom: 0;
   color: #6c757d;
+  margin-top: 1rem;
 }
 
-.service-item .service-info {
-  text-align: center;
-}
-
-/* 链接样式 */
 .service-item a {
   color: #007bff;
   transition: color 0.3s ease;
@@ -1631,7 +1635,6 @@ p.help-block li {
   color: #0056b3;
 }
 
-/* 深入了解按钮样式 */
 .btn-primary {
   background-color: #007bff;
   border-color: #007bff;
@@ -1643,16 +1646,57 @@ p.help-block li {
   background-color: #0056b3;
   border-color: #0056b3;
 }
+.footer-links {
+  background-color: #f9f9f9;
+  padding: 2rem;
+  border-radius: 8px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  margin-bottom: 4rem;
+}
+
+.footer-links h3 {
+  color: #333;
+  margin-bottom: 1rem;
+  text-transform: uppercase;
+  letter-spacing: 1px;
+  font-size: 1.2rem;
+}
+
+.link-list {
+  list-style: none;
+  padding: 0;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
 
-/* 适应不同屏幕的调整 */
-@media (max-width: 991.98px) {
-  .service-item {
-    width: calc(50% - 20px);
+.link-list li {
+  margin-bottom: 1rem;
+}
+
+.link-list a {
+  color: #333;
+  text-decoration: none;
+  transition: color 0.3s ease;
+}
+
+.link-list a:hover,
+.link-list a:focus {
+  color: #007bff; /* 或选择适合您网站风格的主题色 */
+}
+
+@media (max-width: 768px) {
+  .link-list {
+    justify-content: flex-start;
+  }
+  .link-list li {
+    margin-bottom: 0.5rem;
+    width: 50%; /* 在小屏幕上每行两个链接 */
   }
 }
 
-@media (max-width: 575.98px) {
-  .service-item {
-    width: 100%;
+@media (max-width: 480px) {
+  .link-list li {
+    width: 100%; /* 在更小的屏幕上每行一个链接 */
   }
 }

utils/db.go

@@ -32,5 +32,6 @@ func init() {
 			&models.FileResource{},
 			&models.Data{},
 			&models.Contact{},
+			&models.Link{},
 			&models.DataMOdel{})
 }

views/index.html

@@ -1,288 +1,300 @@
 <!DOCTYPE html>
 <html lang="en">
-    <head>
-        <meta charset="utf-8">
-        <title>宝智达冷链官网</title>
-        <meta content="width=device-width, initial-scale=1.0" name="viewport">
-        <meta content="" name="keywords">
-        <meta content="" name="description">
-        <meta content="Author" name="WebThemez">
-        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
-        <!-- Favicons -->
-        <link href="../static/img/favicon.png" rel="icon">
-        <link href="../static/img/apple-touch-icon.png" rel="apple-touch-icon">
-        <link href="/static/layui/css/layui.css" rel="stylesheet">
-        <!--字体 -->
-        <link
+<head>
+    <meta charset="utf-8">
+    <title>宝智达冷链官网</title>
+    <meta content="width=device-width, initial-scale=1.0" name="viewport">
+    <meta content="" name="keywords">
+    <meta content="" name="description">
+    <meta content="Author" name="WebThemez">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
+    <!-- Favicons -->
+    <link href="../static/img/favicon.png" rel="icon">
+    <link href="../static/img/apple-touch-icon.png" rel="apple-touch-icon">
+    <link href="/static/layui/css/layui.css" rel="stylesheet">
+    <!--字体 -->
+    <link
             href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i|Raleway:300,400,500,700,800|Montserrat:300,400,700"
             rel="stylesheet">
-        <!-- Bootstrap CSS File -->
-        <link href="../static/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
-        <!-- Libraries CSS Files -->
-        <link href="../static/lib/font-awesome/css/font-awesome.min.css" rel="stylesheet">
-        <link href="../static/lib/animate/animate.min.css" rel="stylesheet">
-        <link href="../static/lib/ionicons/css/ionicons.min.css" rel="stylesheet">
-        <link href="../static/lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
-        <link href="../static/lib/magnific-popup/magnific-popup.css" rel="stylesheet">
-        <link href="../static/lib/ionicons/css/ionicons.min.css" rel="stylesheet">
-        <!-- Main Stylesheet File -->
-        <link href="../static/css/style.css" rel="stylesheet">
-    </head>
-    <body id="body">
-        <header id="header">
-            <div class="container">
-                <div id="logo" class="pull-left">
-                    <img src="../static/img/favicon.png" alt="Logo" class="logo-image"/>
-                    <h1><a href="/" class="scrollto"><span>宝</span>智达冷链</a></h1>
-                </div>
-                <!-- 新增电话号码部分 -->
-                <!--<div id="phone-number" class="pull-right">-->
-                <!--    <i class="fa fa-phone-square" aria-hidden="true"></i> 电话: +86-123-4567-890-->
-                <!--</div>-->
-                <nav id="nav-menu-container">
-                    <ul class="layui-nav layui-bg-gray">
-                        <li class="layui-nav-item"><a href="/">首页</a></li>
-                        <li class="layui-nav-item"><a href="/about">关于我们</a></li>
-                        <li class="layui-nav-item">
-                            <a href="/news?types=industry">新闻</a>
-                            <dl class="layui-nav-child">
-                                <dd><a href="/news?types=firm">公司新闻</a></dd>
-                                <dd><a href="/news?types=industry">行业新闻</a></dd>
-                            </dl>
-                        </li>
-                        <li class="layui-nav-item"><a href="/services/1">服务介绍</a></li>
-                        <li class="layui-nav-item">
-                            <a href="/product?ptype=hardware">产品介绍</a>
-                            <dl class="layui-nav-child">
-                                <dd><a href="/product?ptype=software">软件</a></dd>
-                                <dd><a href="/product?ptype=hardware">硬件</a></dd>
-                            </dl>
-                        </li>
-                        <li class="layui-nav-item"><a href="/recruit">全国代理招募</a></li>
-                        <li class="layui-nav-item"><a href="/contact">联系我们</a></li>
-                    </ul>
-                </nav>
-            </div>
-        </header>
+    <!-- Bootstrap CSS File -->
+    <link href="../static/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+    <!-- Libraries CSS Files -->
+    <link href="../static/lib/font-awesome/css/font-awesome.min.css" rel="stylesheet">
+    <link href="../static/lib/animate/animate.min.css" rel="stylesheet">
+    <link href="../static/lib/ionicons/css/ionicons.min.css" rel="stylesheet">
+    <link href="../static/lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
+    <link href="../static/lib/magnific-popup/magnific-popup.css" rel="stylesheet">
+    <link href="../static/lib/ionicons/css/ionicons.min.css" rel="stylesheet">
+    <!-- Main Stylesheet File -->
+    <link href="../static/css/style.css" rel="stylesheet">
+</head>
+<body id="body">
+<header id="header">
+    <div class="container">
+        <div id="logo" class="pull-left">
+            <img src="../static/img/favicon.png" alt="Logo" class="logo-image"/>
+            <h1><a href="/" class="scrollto"><span>宝</span>智达冷链</a></h1>
+        </div>
+        <!-- 新增电话号码部分 -->
+        <!--<div id="phone-number" class="pull-right">-->
+        <!--    <i class="fa fa-phone-square" aria-hidden="true"></i> 电话: +86-123-4567-890-->
+        <!--</div>-->
+        <nav id="nav-menu-container">
+            <ul class="layui-nav layui-bg-gray">
+                <li class="layui-nav-item"><a href="/">首页</a></li>
+                <li class="layui-nav-item"><a href="/about">关于我们</a></li>
+                <li class="layui-nav-item">
+                    <a href="/news?types=industry">新闻</a>
+                    <dl class="layui-nav-child">
+                        <dd><a href="/news?types=firm">公司新闻</a></dd>
+                        <dd><a href="/news?types=industry">行业新闻</a></dd>
+                    </dl>
+                </li>
+                <li class="layui-nav-item"><a href="/services/1">服务介绍</a></li>
+                <li class="layui-nav-item">
+                    <a href="/product?ptype=hardware">产品介绍</a>
+                    <dl class="layui-nav-child">
+                        <dd><a href="/product?ptype=software">软件</a></dd>
+                        <dd><a href="/product?ptype=hardware">硬件</a></dd>
+                    </dl>
+                </li>
+                <li class="layui-nav-item"><a href="/recruit">全国代理招募</a></li>
+                <li class="layui-nav-item"><a href="/contact">联系我们</a></li>
+            </ul>
+        </nav>
+    </div>
+</header>
 
-        <!--==========================
+<!--==========================
 banner
-        ============================-->
-        <div id="carouselExampleIndicators" class="carousel slide" data-bs-ride="carousel">
-            <div class="carousel-inner">
-                {{range $index,$item:=.banner}}
-                <!--<div class="float-buttons">-->
-                <!--    <button class="btn btn-outline-primary btn-lg">校准</button>-->
-                <!--    <button class="btn btn-outline-info btn-lg">验证</button>-->
-                <!--</div>-->
-                <div class="carousel-item{{if eq $index 0}} active{{end}}">
-                    <img src="{{$item}}" id="carousel-img-height" class="d-block w-100" alt="...">
-                </div>
-                {{end}}
-            </div>
-            <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators"
-                    data-bs-slide="prev">
-                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
-                <span class="visually-hidden">Previous</span>
-            </button>
-            <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators"
-                    data-bs-slide="next">
-                <span class="carousel-control-next-icon" aria-hidden="true"></span>
-                <span class="visually-hidden">Next</span>
-            </button>
-        </div><!-- #intro -->
+============================-->
+<div id="carouselExampleIndicators" class="carousel slide" data-bs-ride="carousel">
+    <div class="carousel-inner">
+        {{range $index,$item:=.banner}}
+        <!--<div class="float-buttons">-->
+        <!--    <button class="btn btn-outline-primary btn-lg">校准</button>-->
+        <!--    <button class="btn btn-outline-info btn-lg">验证</button>-->
+        <!--</div>-->
+        <div class="carousel-item{{if eq $index 0}} active{{end}}">
+            <img src="{{$item}}" id="carousel-img-height" class="d-block w-100" alt="...">
+        </div>
+        {{end}}
+    </div>
+    <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators"
+            data-bs-slide="prev">
+        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+        <span class="visually-hidden">Previous</span>
+    </button>
+    <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators"
+            data-bs-slide="next">
+        <span class="carousel-control-next-icon" aria-hidden="true"></span>
+        <span class="visually-hidden">Next</span>
+    </button>
+</div><!-- #intro -->
 
-        <main id="main">
-<!--            <div class="container">-->
-<!--                <div class="section-header" style="margin-top: 20px;">-->
-<!--                    <h2>宝智达-全国服务数量</h2>-->
-<!--                </div>-->
-<!--                &lt;!&ndash; 数据点列表开始 &ndash;&gt;-->
-<!--                <div class="row text-center">-->
-<!--                    &lt;!&ndash; 在这里放置数据点 &ndash;&gt;-->
-<!--                    <div class="row text-center">-->
-<!--                        {{range .Datas}}-->
-<!--                        <div class="col-md-2 mb-5">-->
-<!--                            <div class="card h-100">-->
-<!--                                <div class="card-body">-->
-<!--                                    <h5 class="card-title count-up" data-target="{{.Nums}}">0</h5>-->
-<!--                                    <p class="card-text">{{.Title}}</p>-->
-<!--                                </div>-->
-<!--                            </div>-->
-<!--                        </div>-->
-<!--                        {{end}}-->
-<!--                    </div>-->
-<!--                </div>-->
-<!--                &lt;!&ndash; 数据点列表结束 &ndash;&gt;-->
-<!--            </div>-->
-            <!--==========================
-                服务介绍
-            ============================-->
-            <section id="features" class="features py-5">
-                <div class="container">
-                    <div class="section-header text-center mb-5">
-                        <h2 class="display-4">服务介绍</h2>
-                        <p class="lead">宝智达提供全面的冷链解决方案，包括温湿度监测平台、专用陈列柜等，均拥有自主知识产权。</p>
-                    </div>
-                    <div class="row">
-                        <div class="col-lg-12">
-                            <div class="service-description">
-                                {{range .Serves}}
-                                <div class="service-item mb-4 d-flex" style="background-image: url('{{.Url}}')">
-<!--                                    <div class="service-image-container">-->
-<!--                                        <img src="{{.Url}}" alt="{{.Title}} 图例" class="img-fluid">-->
-<!--                                    </div>-->
-                                    <div class="service-info">
-                                        <h4><a class="text-decoration-none" href="services/{{.ID}}">{{.Title}}</a></h4>
-                                        <p class="text-muted">{{.Synopsis}}</p>
-                                    </div>
-                                </div>
-                                {{end}}
+<main id="main">
+    <!--            <div class="container">-->
+    <!--                <div class="section-header" style="margin-top: 20px;">-->
+    <!--                    <h2>宝智达-全国服务数量</h2>-->
+    <!--                </div>-->
+    <!--                &lt;!&ndash; 数据点列表开始 &ndash;&gt;-->
+    <!--                <div class="row text-center">-->
+    <!--                    &lt;!&ndash; 在这里放置数据点 &ndash;&gt;-->
+    <!--                    <div class="row text-center">-->
+    <!--                        {{range .Datas}}-->
+    <!--                        <div class="col-md-2 mb-5">-->
+    <!--                            <div class="card h-100">-->
+    <!--                                <div class="card-body">-->
+    <!--                                    <h5 class="card-title count-up" data-target="{{.Nums}}">0</h5>-->
+    <!--                                    <p class="card-text">{{.Title}}</p>-->
+    <!--                                </div>-->
+    <!--                            </div>-->
+    <!--                        </div>-->
+    <!--                        {{end}}-->
+    <!--                    </div>-->
+    <!--                </div>-->
+    <!--                &lt;!&ndash; 数据点列表结束 &ndash;&gt;-->
+    <!--            </div>-->
+    <!--==========================
+        服务介绍
+    ============================-->
+    <section id="features" class="features py-5">
+        <div class="container">
+            <div class="section-header text-center mb-5">
+                <h2 class="display-4">服务介绍</h2>
+                <p class="lead">宝智达提供全面的冷链解决方案，包括温湿度监测平台、专用陈列柜等，均拥有自主知识产权。</p>
+            </div>
+            <div class="row">
+                <div class="col-lg-12">
+                    <div class="service-description">
+                        {{range .Serves}}
+                        <div class="service-item mb-4 d-flex" style="background-image: url('{{.Url}}')">
+                            <!--                                    <div class="service-image-container">-->
+                            <!--                                        <img src="{{.Url}}" alt="{{.Title}} 图例" class="img-fluid">-->
+                            <!--                                    </div>-->
+                            <div class="service-info">
+                                <h4><a class="text-decoration-none" href="services/{{.ID}}">{{.Title}}</a></h4>
+                                <p class="text-muted">{{.Synopsis}}</p>
                             </div>
                         </div>
-                    </div>
-                    <div class="text-center mt-5">
-                        <a href="/services/1" class="btn btn-primary rounded-pill px-4">深入了解我们的服务</a>
+                        {{end}}
                     </div>
                 </div>
-            </section><!-- End Features Section -->
-            <!--==========================
-服务&产品
-            ============================-->
-            <section id="services">
-                <div class="container">
-                    <div class="section-header">
-                        <h2>产品介绍</h2>
-                        <p>专业一流的硬件、软件工程师最新设计理念与实现</p>
-                    </div>
-                    <div class="row">
-                        {{range .Products}}
-                        <div class="col-lg-4">
-                            <div class="box wow fadeInLeft">
-                                <div class="icon svgImg"><img src="{{.Url}}" alt=""></div>
-                                <h4 class="title"><a href="product/{{.ID}}">{{.Title}}</a></h4>
-                                <p class="description">{{.Synopsis}}</p>
-                            </div>
-                        </div>
-                        {{end}}
-                        <div class="text-center mt-5">
-                        <a class="btn btn-primary rounded-pill px-4" href= 'product?ptype=hardware'>了解更多产品</a>
-                        </div>
+            </div>
+            <div class="text-center mt-5">
+                <a href="/services/1" class="btn btn-primary rounded-pill px-4">深入了解我们的服务</a>
+            </div>
+        </div>
+    </section><!-- End Features Section -->
+    <!--==========================
+        服务&产品
+    ============================-->
+    <section id="services">
+        <div class="container">
+            <div class="section-header">
+                <h2>产品介绍</h2>
+                <p>专业一流的硬件、软件工程师最新设计理念与实现</p>
+            </div>
+            <div class="row">
+                {{range .Products}}
+                <div class="col-lg-4">
+                    <div class="box wow fadeInLeft">
+                        <div class="icon svgImg"><img src="{{.Url}}" alt=""></div>
+                        <h4 class="title"><a href="product/{{.ID}}">{{.Title}}</a></h4>
+                        <p class="description">{{.Synopsis}}</p>
                     </div>
                 </div>
-            </section><!-- #services -->
+                {{end}}
+                <div class="text-center mt-5">
+                    <a class="btn btn-primary rounded-pill px-4" href='product?ptype=hardware'>了解更多产品</a>
+                </div>
+            </div>
+        </div>
+    </section><!-- #services -->
 
-            <!--==========================
+    <!--==========================
 成功案例
-            ============================-->
-            <section id="clients" class="wow fadeInUp">
-                <div class="container">
-                    <div class="section-header">
-                        <h2>部分合作案例</h2>
-                        <!--                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores quae porro consequatur aliquam,-->
-                        <!--                    incidunt fugiat culpa esse aute nulla. duis fugiat culpa esse aute nulla ipsum velit export irure-->
-                        <!--                    minim illum fore</p>-->
-                    </div>
-                    <div class="owl-carousel clients-carousel">
-                        {{range $index,$exam:=.example}}
-                        <img src="{{$exam}}" alt="..." style="max-width: 100%; height: auto">
-                        {{end}}
-                    </div>
-                </div>
-            </section><!-- #clients -->
-            <!--==========================
+    ============================-->
+    <section id="clients" class="wow fadeInUp">
+        <div class="container">
+            <div class="section-header">
+                <h2>部分合作案例</h2>
+                <!--                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores quae porro consequatur aliquam,-->
+                <!--                    incidunt fugiat culpa esse aute nulla. duis fugiat culpa esse aute nulla ipsum velit export irure-->
+                <!--                    minim illum fore</p>-->
+            </div>
+            <div class="owl-carousel clients-carousel">
+                {{range $index,$exam:=.example}}
+                <img src="{{$exam}}" alt="..." style="max-width: 100%; height: auto">
+                {{end}}
+            </div>
+        </div>
+    </section><!-- #clients -->
+    <!--==========================
 资质荣耀
-            ============================-->
-            <section id="testimonials" class="wow fadeInUp">
-                <div class="container">
-                    <div class="section-header">
-                        <h2>资质荣耀</h2>
-                        <!--                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores quae porro consequatur aliquam,-->
-                        <!--                    incidunt fugiat culpa esse aute nulla. duis fugiat culpa esse aute nulla ipsum velit export irure-->
-                        <!--                    minim illum fore</p>-->
-                    </div>
-                    <div class="owl-carousel testimonials-carousel">
-                        {{range $index,$honor:=.honor}}
-                        <div class="testimonial-item">
-                            <img src="{{$honor}}" alt="..." style="max-width: 100%; height: auto">
-                        </div>
-                        {{end}}
-                    </div>
-
+    ============================-->
+    <section id="testimonials" class="wow fadeInUp">
+        <div class="container">
+            <div class="section-header">
+                <h2>资质荣耀</h2>
+                <!--                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores quae porro consequatur aliquam,-->
+                <!--                    incidunt fugiat culpa esse aute nulla. duis fugiat culpa esse aute nulla ipsum velit export irure-->
+                <!--                    minim illum fore</p>-->
+            </div>
+            <div class="owl-carousel testimonials-carousel">
+                {{range $index,$honor:=.honor}}
+                <div class="testimonial-item">
+                    <img src="{{$honor}}" alt="..." style="max-width: 100%; height: auto">
                 </div>
-            </section><!-- #testimonials -->
+                {{end}}
+            </div>
 
-            <!--==========================
+        </div>
+    </section><!-- #testimonials -->
+
+    <!--==========================
 Call To Action Section
-            ============================-->
-            <section id="call-to-action" class="wow fadeInUp">
-                <div class="container">
-                    <div class="row">
-                        <div class="col-lg-9 text-center text-lg-left">
-                            <h3 class="cta-title">获取我们的服务</h3>
-                            <p class="cta-text">
-                                欢迎随时与我们联系！无论您有关于产品的问题，需要技术支持，或是想要探讨合作机会，我们的团队都乐意为您提供帮助</p>
-                        </div>
-                        <div class="col-lg-3 cta-btn-container text-center">
-                            <a class="cta-btn align-middle" href="/contact">联系我们</a>
-                        </div>
-                    </div>
+    ============================-->
 
+    <section id="call-to-action" class="wow fadeInUp">
+        <div class="container">
+            <div class="row">
+                <div class="col-lg-9 text-center text-lg-left">
+                    <h3 class="cta-title">获取我们的服务</h3>
+                    <p class="cta-text">
+                        欢迎随时与我们联系！无论您有关于产品的问题，需要技术支持，或是想要探讨合作机会，我们的团队都乐意为您提供帮助</p>
+                </div>
+                <div class="col-lg-3 cta-btn-container text-center">
+                    <a class="cta-btn align-middle" href="/contact">联系我们</a>
                 </div>
-            </section><!-- #call-to-action -->
+            </div>
 
+        </div>
+    </section><!-- #call-to-action -->
 
-        </main>
+    <!-- 页面其他内容 -->
 
-        <!--==========================
+</main>
+
+<!--==========================
 页脚
-        ============================-->
-        <footer id="footer">
-            <div class="container">
-                <div class="copyright">
-                    © 版权所有 2024 宝智达科技有限公司 <a target="_blank"
-                                             href="https://beian.miit.gov.cn/">黔ICP备2022006612号</a>
-                </div>
-                <div class="credits">
-                </div>
-            </div>
-        </footer><!-- #footer -->
+============================-->
+<div class="footer-links">
+    <h3>友情链接</h3>
+    <ul class="link-list">
+        {{range .Links}}
+        <li><a href="{{.Url}}">{{.Title}}</a></li>
+        {{end}}
+        <!-- 更多链接... -->
+    </ul>
+</div>
+<footer id="footer">
+    <div class="container">
+        <div class="copyright">
+            © 版权所有 2024 宝智达科技有限公司 <a target="_blank"
+                                                  href="https://beian.miit.gov.cn/">黔ICP备2022006612号</a>
+        </div>
+        <div class="credits">
+        </div>
+    </div>
+
+</footer><!-- #footer -->
 
-        <a href="#" class="back-to-top"><i class="fa fa-chevron-up"></i></a>
+<a href="#" class="back-to-top"><i class="fa fa-chevron-up"></i></a>
 
-        <!-- JavaScript  -->
-        <script src="../static/lib/jquery/jquery.min.js"></script>
-        <script src="../static/lib/jquery/jquery-migrate.min.js"></script>
-        <script src="../static/lib/bootstrap/js/bootstrap.bundle.min.js"></script>
-        <script src="../static/lib/easing/easing.min.js"></script>
-        <script src="../static/lib/superfish/hoverIntent.js"></script>
-        <script src="../static/lib/superfish/superfish.min.js"></script>
-        <script src="../static/lib/wow/wow.min.js"></script>
-        <script src="../static/lib/owlcarousel/owl.carousel.min.js"></script>
-        <script src="../static/lib/magnific-popup/magnific-popup.min.js"></script>
-        <script src="../static/lib/sticky/sticky.js"></script>
-        <script src="../static/js/main.js"></script>
-        <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
-        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js"></script>
-        <script src="/static/layui/layui.js"></script>
-        <script>
-            document.addEventListener('DOMContentLoaded', function () {
-                var countUpElements = document.querySelectorAll('.count-up');
-                countUpElements.forEach(function (element) {
-                    var target = parseInt(element.getAttribute('data-target')); // 获取目标数值
-                    var start = 0; // 初始值
-                    var duration = 2000; // 动画持续时间，单位毫秒
-                    var increment = Math.ceil(target / (duration / 16)); // 计算每16ms增加的值
-                    var timer = setInterval(function () {
-                        start += increment;
-                        element.textContent = start; // 更新显示的数值
-                        if (start > target) {
-                            clearInterval(timer); // 达到或超过目标值时停止
-                            element.textContent = target;
-                        }
-                    }, 16); // 每16ms执行一次，大约60帧/秒
-                });
-            });
-        </script>
-    </body>
+<!-- JavaScript  -->
+<script src="../static/lib/jquery/jquery.min.js"></script>
+<script src="../static/lib/jquery/jquery-migrate.min.js"></script>
+<script src="../static/lib/bootstrap/js/bootstrap.bundle.min.js"></script>
+<script src="../static/lib/easing/easing.min.js"></script>
+<script src="../static/lib/superfish/hoverIntent.js"></script>
+<script src="../static/lib/superfish/superfish.min.js"></script>
+<script src="../static/lib/wow/wow.min.js"></script>
+<script src="../static/lib/owlcarousel/owl.carousel.min.js"></script>
+<script src="../static/lib/magnific-popup/magnific-popup.min.js"></script>
+<script src="../static/lib/sticky/sticky.js"></script>
+<script src="../static/js/main.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js"></script>
+<script src="/static/layui/layui.js"></script>
+<script>
+    document.addEventListener('DOMContentLoaded', function () {
+        var countUpElements = document.querySelectorAll('.count-up');
+        countUpElements.forEach(function (element) {
+            var target = parseInt(element.getAttribute('data-target')); // 获取目标数值
+            var start = 0; // 初始值
+            var duration = 2000; // 动画持续时间，单位毫秒
+            var increment = Math.ceil(target / (duration / 16)); // 计算每16ms增加的值
+            var timer = setInterval(function () {
+                start += increment;
+                element.textContent = start; // 更新显示的数值
+                if (start > target) {
+                    clearInterval(timer); // 达到或超过目标值时停止
+                    element.textContent = target;
+                }
+            }, 16); // 每16ms执行一次，大约60帧/秒
+        });
+    });
+</script>
+</body>
 </html>

views/product.html

@@ -175,7 +175,7 @@ Page Banner Section
             <!--==========================
 Services Section
             ============================-->
-            <section id="services" style="margin: -80px">
+            <section id="services" style="margin: -40px">
                 <div class="container">
                     <div class="btn-group" role="group" aria-label="Basic outlined example">
                         <button type="button" class="btn btn-outline-primary" onclick="location.href = 'product?ptype=hardware'">