Merge branch 'master' of http://47.100.37.243:10191/wutt/manHourHousekeeper

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/controller/ArticleController.java

@@ -1,6 +1,8 @@
 package com.my.bigevent.controller;
 
+import com.my.bigevent.mapper.DictMapper;
 import com.my.bigevent.pojo.Article;
+import com.my.bigevent.pojo.Dict;
 import com.my.bigevent.pojo.PageBean;
 import com.my.bigevent.pojo.Result;
 import com.my.bigevent.service.ArticleService;
@@ -17,6 +19,9 @@ public class ArticleController
     @Autowired
     ArticleService articleService;
 
+    @Autowired
+    private DictMapper dictMapper;
+
     /**
      * 新增文章
      * @param article
@@ -69,9 +74,11 @@ public class ArticleController
                                          @RequestParam(value = "profile",required = false) String profile,
                                          @RequestParam(value = "state",required = true) String state,
                                          @RequestParam(value = "coverImage",required = false) MultipartFile coverImage,
-                                         @RequestParam(value = "id",required = false) Integer id)
+                                         @RequestParam(value = "id",required = false) Integer id,
+                                         @RequestParam(value = "productId",required = true) String productId
+                                        )
     {
-        articleService.insertOrUpdateArticle(title,categoryIds,profile,content,state,coverImage,id);
+        articleService.insertOrUpdateArticle(title,categoryIds,profile,content,state,coverImage,id,productId);
         return Result.success();
     }
 
@@ -95,4 +102,15 @@ public class ArticleController
         return Result.success(relatedList);
     }
 
+    @GetMapping ("/deleteById")
+    public Result deleteById(@RequestParam("id") Integer id) {
+        return articleService.deleteById(id);
+    }
+
+    @GetMapping ("/dictProduction")
+    public Result dictProduction() {
+        List<Dict> dictList= dictMapper.dictProduction();
+        return Result.success(dictList);
+    }
+
 }

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/controller/CategoryController.java

@@ -24,8 +24,7 @@ public class CategoryController
     @PostMapping
     public Result add(@RequestBody @Validated Category category)
     {
-        categoryService.add(category);
-        return Result.success("新增分类成功！");
+        return categoryService.add(category);
     }
 
     /**
@@ -59,6 +58,10 @@ public class CategoryController
     @DeleteMapping
     public Result delete(Integer id)
     {
+        Integer count= categoryService.selectArticleCountByCategoryId(id.toString());
+        if(count>0){
+            return Result.error("存在文章关联该标签,不能删除");
+        }
         categoryService.delete(id);
         return Result.success("文章删除成功！");
     }

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/mapper/ArticleCoverImgMapper.java

@@ -4,6 +4,7 @@ import com.my.bigevent.pojo.ArticleCoverImg;
 import org.apache.ibatis.annotations.Delete;
 import org.apache.ibatis.annotations.Insert;
 import org.apache.ibatis.annotations.Mapper;
+import org.apache.ibatis.annotations.Select;
 
 @Mapper
 public interface ArticleCoverImgMapper {
@@ -12,4 +13,7 @@ public interface ArticleCoverImgMapper {
 
     @Insert("insert into article_cover_img(article_id,cover_img_data) values (#{articleId},#{coverImgData})")
     void insert(ArticleCoverImg articleCoverImg);
+
+    @Select("select * from article_cover_img where article_id=#{articleId}")
+    ArticleCoverImg selectByArticleId(Integer articleId);
 }

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/mapper/ArticleMapper.java

@@ -1,9 +1,7 @@
 package com.my.bigevent.mapper;
 
 import com.my.bigevent.pojo.Article;
-import org.apache.ibatis.annotations.Insert;
-import org.apache.ibatis.annotations.Mapper;
-import org.apache.ibatis.annotations.Select;
+import org.apache.ibatis.annotations.*;
 
 import java.util.List;
 
@@ -16,7 +14,7 @@ public interface ArticleMapper
     void add(Article article);
 
     // 动态实现 sql，所以这里不用注解
-    List<Article> list(Integer userId, Integer categoryId, String state);
+    List<Article> list(@Param("userId") Integer userId,@Param("categoryId") String categoryId,@Param("state") String state);
     List<Article> pageList(Integer userId, String info);
 
     @Select("select * from article where id = #{id}")
@@ -29,4 +27,7 @@ public interface ArticleMapper
     List<Article> latestList();
 
     List<Article> relatedList(List<String> strings);
+
+    @Delete("delete from article where id = #{articleId}")
+    void deleteById(Integer articleId);
 }

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/mapper/CategoryMapper.java

@@ -21,4 +21,10 @@ public interface CategoryMapper
 
     @Delete("delete from category where id=#{id}")
     void delete(Integer id);
+
+    @Select("select count(*) from article where JSON_CONTAINS(category_ids, #{id})")
+    Integer selectArticleCountByCategoryId(String id);
+
+    @Select("select count(*) from category where category_name=#{categoryName}")
+    Integer selectCountByName(String categoryName);
 }

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/mapper/DictMapper.java

@@ -0,0 +1,15 @@
+package com.my.bigevent.mapper;
+
+import com.my.bigevent.pojo.Dict;
+import org.apache.ibatis.annotations.Mapper;
+import org.apache.ibatis.annotations.Select;
+
+import java.util.List;
+
+@Mapper
+public interface DictMapper {
+
+    @Select("select * from dict where code='productName'")
+    List<Dict> dictProduction();
+
+}

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/pojo/Article.java

@@ -33,6 +33,7 @@ public class Article {
 
     private String categoryIds;//文章分类 category_ids
     private Integer createUser;//创建人ID
+    private String productId;
 
     @JsonFormat(pattern = "yyyy-MM-dd")
     @DateTimeFormat(pattern = "yyyy-MM-dd")

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/pojo/Dict.java

@@ -0,0 +1,10 @@
+package com.my.bigevent.pojo;
+
+import lombok.Data;
+
+@Data
+public class Dict {
+    private String code;
+    private String id;
+    private String name;
+}

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/service/ArticleService.java

@@ -2,6 +2,7 @@ package com.my.bigevent.service;
 
 import com.my.bigevent.pojo.Article;
 import com.my.bigevent.pojo.PageBean;
+import com.my.bigevent.pojo.Result;
 import org.springframework.web.multipart.MultipartFile;
 
 import java.util.List;
@@ -16,11 +17,13 @@ public interface ArticleService
 
     Article getArticleById(Integer id);
 
-    void insertOrUpdateArticle(String title, String categoryIds,String profile, String content, String state, MultipartFile coverImage,Integer id);
+    void insertOrUpdateArticle(String title, String categoryIds,String profile, String content, String state, MultipartFile coverImage,Integer id,String productId);
 
     PageBean<Article> PageList(Integer pageIndex, Integer pageSize, String info);
 
     List<Article> latestList();
 
     List<Article> relatedList(Integer articleId);
+
+    Result deleteById(Integer articleId);
 }

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/service/CategoryService.java

@@ -1,16 +1,20 @@
 package com.my.bigevent.service;
 
 import com.my.bigevent.pojo.Category;
+import com.my.bigevent.pojo.Result;
 
 import java.util.List;
 
 public interface CategoryService
 {
-    void add(Category category);
+    Result add(Category category);
 
     List<Category> list();
 
     void update(Category category);
 
     void delete(Integer id);
+
+
+    Integer selectArticleCountByCategoryId(String id);
 }

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/service/impl/ArticleServiceImpl.java

@@ -9,6 +9,7 @@ import com.my.bigevent.mapper.CategoryMapper;
 import com.my.bigevent.pojo.Article;
 import com.my.bigevent.pojo.ArticleCoverImg;
 import com.my.bigevent.pojo.PageBean;
+import com.my.bigevent.pojo.Result;
 import com.my.bigevent.service.ArticleService;
 import com.my.bigevent.utils.ThreadLocalUtil;
 import org.junit.platform.commons.util.StringUtils;
@@ -103,7 +104,16 @@ public class ArticleServiceImpl implements ArticleService
         // 调用 mapper
         Map<String,Object> map=ThreadLocalUtil.get();
         Integer userId=(Integer)map.get("id");
-        List<Article> as=articleMapper.list(userId,categoryId,state);
+        String categoryIdStr=categoryId==null?"":categoryId.toString();
+        List<Article> as=articleMapper.list(userId,categoryIdStr,state);
+        if (!as.isEmpty()){
+            for (Article a : as) {
+                ArticleCoverImg articleCoverImg= coverImgMapper.selectByArticleId(a.getId());
+                if(null!=articleCoverImg&&articleCoverImg.getCoverImgData()!=null){
+                    a.setCoverImg(articleCoverImg.getCoverImgData());
+                }
+            }
+        }
         // Page 中提供了方法，可以获取 PageHelper 分页查询后，得到的总记录条数和当前页数据
         Page<Article> p=(Page<Article>) as;
 
@@ -122,10 +132,11 @@ public class ArticleServiceImpl implements ArticleService
 
     @Override
     @Transactional
-    public void insertOrUpdateArticle(String title, String categoryIds,String profile, String content, String state, MultipartFile coverImage, Integer id) {
+    public void insertOrUpdateArticle(String title, String categoryIds,String profile, String content, String state, MultipartFile coverImage, Integer id,String productId) {
         Optional.ofNullable(title).orElseThrow(() -> new RuntimeException("请传标题"));
         Optional.ofNullable(content).orElseThrow(() -> new RuntimeException("请书写文章内容"));
         Optional.ofNullable(state).orElseThrow(() -> new RuntimeException("请传递发布类型"));
+        Optional.ofNullable(productId).orElseThrow(() -> new RuntimeException("请传递产品类型"));
 
         // 新增
         if (id == null) {
@@ -142,6 +153,7 @@ public class ArticleServiceImpl implements ArticleService
             article.setCreateTime(LocalDateTime.now());
             article.setUpdateTime(LocalDateTime.now());
             article.setCreateUser(6);
+            article.setProductId(productId);
 
             articleMapper.insert(article);
             log.info("文章的id{}", article.getId());
@@ -163,6 +175,7 @@ public class ArticleServiceImpl implements ArticleService
             article.setState(state);
             article.setUpdateTime(LocalDateTime.now());
             article.setId(id);
+            article.setProductId(productId);
             articleMapper.update(article);
 
             if (coverImage != null) {
@@ -213,6 +226,13 @@ public class ArticleServiceImpl implements ArticleService
         }
     }
 
+    @Override
+    public Result deleteById(Integer articleId) {
+        articleMapper.deleteById(articleId);
+        coverImgMapper.deleteByArticleId(articleId);
+        return Result.success();
+    }
+
     private void handleCoverImage(MultipartFile coverImage, Integer articleId) {
         String fileName = coverImage.getOriginalFilename();
         String fileType = fileName.substring(fileName.lastIndexOf("."));

fhKeeper/formulahousekeeper/ArticleOperation/src/main/java/com/my/bigevent/service/impl/CategoryServiceImpl.java

@@ -1,7 +1,9 @@
 package com.my.bigevent.service.impl;
 
+import com.my.bigevent.mapper.ArticleMapper;
 import com.my.bigevent.mapper.CategoryMapper;
 import com.my.bigevent.pojo.Category;
+import com.my.bigevent.pojo.Result;
 import com.my.bigevent.service.CategoryService;
 import com.my.bigevent.utils.ThreadLocalUtil;
 import org.springframework.beans.factory.annotation.Autowired;
@@ -16,9 +18,22 @@ public class CategoryServiceImpl implements CategoryService
 {
     @Autowired
     CategoryMapper categoryMapper;
+
+    @Autowired
+    ArticleMapper articleMapper;
     @Override
-    public void add(Category category)
+    public Result add(Category category)
     {
+        if(null==category.getCategoryName()||category.getCategoryName().isEmpty()){
+            return Result.error("分类名称不能为空");
+        }
+        if(null==category.getCategoryAlias()||category.getCategoryAlias().isEmpty()){
+            return Result.error("分类别名不能为空");
+        }
+        Integer count=categoryMapper.selectCountByName(category.getCategoryName());
+        if(count>0){
+            return Result.error("标签名称重复");
+        }
         // 补充属性值，数据库里规定 category 的字段都不为 null
         category.setCreateTime(LocalDateTime.now());
         category.setUpdateTime(LocalDateTime.now());
@@ -28,6 +43,8 @@ public class CategoryServiceImpl implements CategoryService
         category.setCreateUser(userId);
 
         categoryMapper.add(category);
+
+        return Result.success("新增分类成功！");
     }
 
     @Override
@@ -50,4 +67,9 @@ public class CategoryServiceImpl implements CategoryService
     {
         categoryMapper.delete(id);
     }
+
+    @Override
+    public Integer selectArticleCountByCategoryId(String id) {
+        return categoryMapper.selectArticleCountByCategoryId(id);
+    }
 }

fhKeeper/formulahousekeeper/ArticleOperation/src/main/resources/com/my/bigevent/mapper/ArticleMapper.xml

@@ -31,6 +31,9 @@
             <if test=" updateTime!=null">
                  update_time,
             </if>
+            <if test=" productId!=null and productId!=''">
+                product_id,
+            </if>
         </trim>
         <trim prefix=" values (" suffix=")" suffixOverrides=",">
             <if test="title !=null and title !=''">
@@ -57,6 +60,9 @@
             <if test="updateTime !=null">
                 #{updateTime},
             </if>
+            <if test=" productId!=null and productId!=''">
+                #{productId},
+            </if>
         </trim>
     </insert>
     <update id="update">
@@ -80,6 +86,9 @@
                 <if test="updateTime !=null">
                     update_time=#{updateTime},
                 </if>
+                <if test=" productId!=null and productId!=''">
+                    product_id=#{productId},
+                </if>
             </set>
         where id=#{id}
     </update>
@@ -87,15 +96,19 @@
     <select id="list" resultType="com.my.bigevent.pojo.Article">
         select * from article
         <where>
-            <if test="categoryId!=null">
-                category_id=#{categoryId}
+            <if test="categoryId!=null and categoryId !='' ">
+               and JSON_CONTAINS(category_ids, #{categoryId})
             </if>
 
-            <if test="state!=null">
-                and state=#{state}
+            <if test="state!=null and state=='yes'">
+                and state='已发布'
+            </if>
+            <if test="state!=null and state=='no'">
+                and state='草稿'
             </if>
         and create_user=#{userId}
         </where>
+        order by update_time desc
     </select>
     <select id="pageList" resultType="com.my.bigevent.pojo.Article">
         select a.* ,aci.cover_img_data coverImg

fhKeeper/formulahousekeeper/inva_4_tivo/css/knowledgeField.css

@@ -1,7 +1,7 @@
 .knowledgeFieldCon {
   position: relative;
   background: #f6f7fb;
-  height: 100%;
+  min-height: 100%;
   padding-top: 4.5rem;
   display: flex;
 }
@@ -32,13 +32,13 @@
   margin-right: 0.8125rem;
 }
 .knowledgeFieldCon .knowledgeField .knowledgeField-header .knowledgeInput:focus {
-  border: 0.0625rem solid #3396FB;
+  border: 0.0625rem solid #3396fb;
   outline: none;
 }
 .knowledgeFieldCon .knowledgeField .knowledgeField-header .searchButton {
   width: 7.1875rem;
   height: 2.8125rem;
-  background: #3396FB;
+  background: #3396fb;
   border-radius: 0.375rem;
   display: flex;
   justify-content: center;
@@ -65,14 +65,14 @@
   padding: 0 1.5625rem;
   margin: 1.875rem 0;
   overflow-y: auto;
-}
-.knowledgeFieldCon .knowledgeField .knowledgeField-content .dividingLine {
-  height: 0.0625rem;
-  background: #dcdfe6;
-  margin: 1.25rem 0;
+  height: 60vh;
 }
 .knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item {
   display: flex;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item:hover .textContent div {
+  color: #3396fb;
 }
 .knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .image {
   width: 10.1875rem;
@@ -122,6 +122,7 @@
 }
 .knowledgeFieldCon .knowledgeField .knowledgeField-bottom {
   padding: 1.5625rem 0;
+  font-size: 1rem !important;
 }
 .knowledgeFieldCon .knowledgeDetails {
   padding: 1.25rem 2.1875rem;
@@ -134,7 +135,14 @@
   left: 4.0625rem;
   top: 2.8125rem;
   font-size: 1.5625rem;
+  z-index: 2;
   cursor: pointer;
+  width: 1.875rem;
+  height: 1.875rem;
+}
+.knowledgeFieldCon .knowledgeDetails .returnIcon img {
+  width: 100%;
+  height: 100%;
 }
 .knowledgeFieldCon .knowledgeDetails .returnIcon:hover {
   color: #3396fb;
@@ -179,9 +187,17 @@
   margin-right: 1rem;
   color: #7b7b7b;
 }
-.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .readUse .image {
-  width: 8.8125rem;
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .readUse .jumpToImg {
+  width: 8.75rem;
   height: 2.5rem;
+  font-size: 1rem;
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 0.375rem;
+  background: linear-gradient(180deg, #3597fb 0%, #39e5ff 100%);
+  cursor: pointer;
 }
 .knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con li {
   font-family: Microsoft YaHei UI;
@@ -199,7 +215,6 @@
 .knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .hypertextContent {
   background: #f6f6f6;
   padding: 1.875rem;
-  overflow-y: auto;
   margin: 0 1.875rem;
   flex: 1;
   font-size: 1rem;
@@ -221,7 +236,7 @@
   padding: 1.25rem;
 }
 .knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .relatedRecommendations {
-  flex: 1;
+  height: 32.5rem;
   background: #fff;
   padding: 1.25rem;
 }
@@ -256,9 +271,6 @@
   border: 1px solid #fff;
   cursor: pointer;
 }
-.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item:hover {
-  border: 1px solid #409eff;
-}
 .knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item:hover .latestList-item-text {
   color: #3396fb;
 }
@@ -311,12 +323,101 @@
   width: 100%;
   height: 100%;
 }
-.knowledgeFieldCon .linkButton {
-  color: #3396fb;
+.knowledgeFieldCon .linkButton,
+.knowledgeFieldCon .linkButtonss {
+  color: #7b7b7b;
   font-family: Microsoft YaHei UI;
   font-weight: regular;
-  font-size: 1rem;
+  font-size: 0.875rem;
   line-height: normal;
   letter-spacing: 0px;
   cursor: pointer;
+  position: relative;
+  z-index: 2;
+}
+.knowledgeFieldCon .linkButtonss {
+  color: #3396fb;
+}
+.knowledgeFieldCon .dividingLine {
+  height: 0.0625rem;
+  background: #dcdfe6;
+  margin: 1.25rem 0;
+}
+.knowledgeFieldCon .pagination {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 0.625rem;
+}
+.knowledgeFieldCon .pagination button {
+  padding: 0.3125rem 0.625rem;
+  cursor: pointer;
+  background-color: #007bff;
+  color: white;
+  border: 0.0625rem solid #007bff;
+  border-radius: 0.3125rem;
+}
+.knowledgeFieldCon .pagination button:disabled {
+  background-color: #fff;
+  border-color: #d6d6d6;
+  cursor: not-allowed;
+  color: #000000;
+}
+.knowledgeFieldCon .pagination ul {
+  list-style-type: none;
+  display: flex;
+  gap: 0.3125rem;
+}
+.knowledgeFieldCon .pagination li {
+  padding: 0.3125rem 0.625rem;
+  cursor: pointer;
+  border: 0.0625rem solid #d6d6d6;
+  border-radius: 0.3125rem;
+}
+.knowledgeFieldCon .pagination li.active {
+  background-color: #007bff;
+  background: #007bff;
+  color: white;
+}
+.knowledgeFieldCon .pagination li:hover {
+  background-color: #007bff;
+  color: white;
+}
+.knowledgeFieldCon .pagination button {
+  padding: 0.3125rem 0.625rem;
+  margin: 0 0.3125rem;
+}
+.knowledgeFieldCon .paginationInput {
+  width: 3.75rem;
+  height: 2rem;
+  text-align: center;
+  border-radius: 0.1875rem;
+  background: #ffffff;
+  border: 0.0625rem solid #d6d6d6;
+  margin: 0 0.5rem;
+}
+.knowledgeFieldCon .paginationInput:focus {
+  border: 0.0625rem solid #3396fb;
+  outline: none;
+}
+.knowledgeFieldCon .paginationButton {
+  width: 3.75rem;
+  height: 2rem;
+  border-radius: 0.1875rem;
+  background: #f6f6f6;
+  border: 0.0625rem solid #d6d6d6;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 1rem;
+  color: #363636;
+  margin: 0 0.5rem;
+}
+.knowledgeFieldCon .paginationButton:hover {
+  background: #3396fb;
+  color: #fff;
+  border-color: #3396fb;
+}
+body {
+  background: #7b7b7b;
 }

fhKeeper/formulahousekeeper/inva_4_tivo/css/knowledgeField.less

@@ -1,7 +1,7 @@
 .knowledgeFieldCon {
   position: relative;
   background: #f6f7fb;
-  height: 100%;
+  min-height: 100%;
   padding-top: 4.5rem;
   display: flex;
   // 知识园地
@@ -27,17 +27,17 @@
         border-radius: 2.625rem;
         border: 1px solid #fff;
         padding: 0 1.25rem;
-        margin-right: .8125rem;
+        margin-right: 0.8125rem;
         &:focus {
-          border: .0625rem solid #3396FB;
+          border: 0.0625rem solid #3396fb;
           outline: none;
         }
       }
       .searchButton {
         width: 7.1875rem;
         height: 2.8125rem;
-        background: #3396FB;
-        border-radius: .375rem;
+        background: #3396fb;
+        border-radius: 0.375rem;
         display: flex;
         justify-content: center;
         align-items: center;
@@ -65,13 +65,16 @@
       padding: 0 1.5625rem;
       margin: 1.875rem 0;
       overflow-y: auto;
-      .dividingLine {
-        height: 0.0625rem;
-        background: #dcdfe6;
-        margin: 1.25rem 0;
-      }
+      height: 60vh;
+
       .knowledgeField-content-item {
         display: flex;
+        cursor: pointer;
+        &:hover {
+          .textContent div {
+            color: #3396fb;
+          }
+        }
         .image {
           width: 10.1875rem;
           height: 6.8125rem;
@@ -118,6 +121,7 @@
 
     .knowledgeField-bottom {
       padding: 1.5625rem 0;
+      font-size: 1rem !important;
     }
   }
 
@@ -132,7 +136,14 @@
       left: 4.0625rem;
       top: 2.8125rem;
       font-size: 1.5625rem;
+      z-index: 2;
       cursor: pointer;
+      width: 1.875rem;
+      height: 1.875rem;
+      img {
+        width: 100%;
+        height: 100%;
+      }
     }
     .returnIcon:hover {
       color: #3396fb;
@@ -179,9 +190,17 @@
             margin-right: 1rem;
             color: #7b7b7b;
           }
-          .image {
-            width: 8.8125rem;
+          .jumpToImg {
+            width: 8.75rem;
             height: 2.5rem;
+            font-size: 1rem;
+            color: #fff;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-radius: .375rem;
+            background: linear-gradient(180deg, #3597fb 0%, #39e5ff 100%);
+            cursor: pointer;
           }
         }
         li {
@@ -202,7 +221,7 @@
       .hypertextContent {
         background: #f6f6f6;
         padding: 1.875rem;
-        overflow-y: auto;
+        // overflow-y: auto;
         margin: 0 1.875rem;
         flex: 1;
         font-size: 1rem;
@@ -226,7 +245,8 @@
         padding: 1.25rem;
       }
       .relatedRecommendations {
-        flex: 1;
+        // flex: 1;
+        height: 32.5rem;
         background: #fff;
         padding: 1.25rem;
       }
@@ -260,7 +280,7 @@
           border: 1px solid #fff;
           cursor: pointer;
           &:hover {
-            border: 1px solid #409eff;
+            // border: 1px solid #409eff;
             .latestList-item-text {
               color: #3396fb;
             }
@@ -315,13 +335,111 @@
     height: 100%;
   }
 
-  .linkButton {
-    color: #3396fb;
+  .linkButton, .linkButtonss {
+    color: #7b7b7b;
     font-family: Microsoft YaHei UI;
     font-weight: regular;
-    font-size: 1rem;
+    font-size: .875rem;
     line-height: normal;
     letter-spacing: 0px;
     cursor: pointer;
+    position: relative;
+    z-index: 2;
+  }
+
+  .linkButtonss {
+    color: #3396fb;
+  }
+
+  .dividingLine {
+    height: 0.0625rem;
+    background: #dcdfe6;
+    margin: 1.25rem 0;
+  }
+
+  .pagination {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 0.625rem;
+  }
+
+  .pagination button {
+    padding: 0.3125rem 0.625rem;
+    cursor: pointer;
+    background-color: #007bff;
+    color: white;
+    border: 0.0625rem solid #007bff;
+    border-radius: 0.3125rem;
+  }
+
+  .pagination button:disabled {
+    background-color: #fff;
+    border-color: #d6d6d6;
+    cursor: not-allowed;
+    color: #000000;
+  }
+
+  .pagination ul {
+    list-style-type: none;
+    display: flex;
+    gap: 0.3125rem;
   }
+
+  .pagination li {
+    padding: 0.3125rem 0.625rem;
+    cursor: pointer;
+    border: 0.0625rem solid #d6d6d6;
+    border-radius: 0.3125rem;
+  }
+
+  .pagination li.active {
+    background-color: #007bff;
+    background: #007bff;
+    color: white;
+  }
+
+  .pagination li:hover {
+    background-color: #007bff;
+    color: white;
+  }
+  .pagination button {
+    padding: 0.3125rem 0.625rem;
+    margin: 0 0.3125rem;
+  }
+  .paginationInput {
+    width: 3.75rem;
+    height: 2rem;
+    text-align: center;
+    border-radius: 0.1875rem;
+    background: #ffffff;
+    border: 0.0625rem solid #d6d6d6;
+    margin: 0 0.5rem;
+    &:focus {
+      border: 0.0625rem solid #3396fb;
+      outline: none;
+    }
+  }
+  .paginationButton {
+    width: 3.75rem;
+    height: 2rem;
+    border-radius: 0.1875rem;
+    background: #f6f6f6;
+    border: 0.0625rem solid #d6d6d6;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 1rem;
+    color: #363636;
+    margin: 0 0.5rem;
+    &:hover {
+      background: #3396fb;
+      color: #fff;
+      border-color: #3396fb;
+    }
+  }
+}
+
+body {
+  background: #7b7b7b;
 }

fhKeeper/formulahousekeeper/inva_4_tivo/js/iframe.js

@@ -7,7 +7,8 @@ const backcolor = {
   about: { background: 'none', color: '#000', logo: './image/logos.jpg' },
   dynamic: { background: 'none', color: '#000', logo: './image/logos.jpg' },
   customerNew: { background: '#fff', color: '#000', logo: './image/logos.jpg' },
-  knowledgeField: { background: '#fff', color: '#000', logo: './image/logos.jpg' }
+  knowledgeField: { background: '#fff', color: '#000', logo: './image/logos.jpg' },
+  noLinkAvailable: { background: '#fff', color: '#000', logo: './image/logos.jpg' }
 }
 
 function removeListener() {
@@ -35,7 +36,8 @@ function handleScroll() {
   let headerItems = iframeDocument.querySelectorAll('.header-item')
   let headerView = iframeDocument.querySelector('.headerView')
   const urls = window.location.href
-  const filed = urls.match(/\/([^\/]+)\.html$/) && urls.match(/\/([^\/]+)\.html$/)[1];
+  const filed = urls.match(/\/([^\/]+)\.html$/) && urls.match(/\/([^\/]+)\.html$/)[1] || 'noLinkAvailable';
+  console.log(filed, '<==== filed')
   if(scrollYnma > 1) {
     headerView.style.background = '#fff'
     imgElement.src = './image/logos.jpg'

fhKeeper/formulahousekeeper/inva_4_tivo/knowledge.ftl

@@ -0,0 +1,191 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta name="keywords"
+    content="工时管理，工时统计，工时填报，项目成本统计，生产工时管理系统，工时成本管理，工时管理软件，研发工时管理系统，企业工时管理系统，项目工时统计，项目工时统计软件，项目工时统计系统，工时统计系统，工时统计表" />
+  <meta name="description" content="工时管家提供专业的工时填报和统计报表。支持PC和手机端。可按项目，部门，岗位等多维度统计成本。" />
+  <title>工时管家-专注工时管理，手机移动填报，核算项目投入人力成本，企业IPO利器！</title>
+  <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext"
+    rel="stylesheet">
+  <link href="/css/bootstrap.css" rel="stylesheet">
+  <link href="/css/font-awesome.css" rel="stylesheet">
+  <link href="/css/swiper.css" rel="stylesheet">
+  <link href="/css/magnific-popup.css" rel="stylesheet">
+  <link href="/css/styles.css" rel="stylesheet">
+  <link href="/css/reset.css" rel="stylesheet">
+  <link href="/css/tongyong.css" rel="stylesheet" >
+  <link href="/css/knowledgeField.css" rel="stylesheet" >
+</head>
+
+<body data-spy="scroll" data-target=".fixed-top" id="body">
+  <div class="spinner-wrapper">
+      <div class="spinner">
+          <div class="bounce1"></div>
+          <div class="bounce2"></div>
+          <div class="bounce3"></div>
+      </div>
+  </div>
+  <iframe id="headerIframe" src="/moduleView/header.html" class="iframeClass"></iframe>
+  <div class="knowledgeFieldCon">
+    <div v-loading="detailsSwitchingLoading" class="wh100 flex">
+      <div class="knowledgeField">
+        <div class="knowledgeField-header">
+          <div class="knowledgeField-header-text">知识园地</div>
+          <div class="flex">
+            <input id="knowledgeInput" type="text" class="knowledgeInput" placeholder="请输入关键字搜索">
+            <button class="searchButton" onclick="search()">搜索</button>
+          </div>
+        </div>
+        <div class="knowledgeField-content">
+          <#list knowledgeFieldTableList as item>
+            <div>
+              <div class="knowledgeField-content-item" onclick="triggerButtonClick(${item.id})">
+                <div class="image"><img src="data:image;base64,${item.baseImage}" class="wh100" class="wh100"></img>
+                </div>
+                <div class="textContent">
+                  <div>${ item.title }</div>
+                  <p>${ item.profile }</p>
+                  <button class="linkButtonss" onclick="learnMore(${item.id})">了解详情></button>
+                </div>
+              </div>
+              <div class="dividingLine"></div>
+            </div>
+          </#list>
+        </div>
+        <div class="knowledgeField-bottom flex-center">
+          <div class="pagination">
+            <button class="prev" onclick="goToPage(currentPage - 1)">上一页</button>
+            <ul id="page-list">
+              <!-- 动态生成页码 -->
+            </ul>
+            <button class="next" onclick="goToPage(currentPage + 1)">下一页</button>
+          </div>
+          <div class="flex-center">
+            到第
+            <input type="number" class="paginationInput" min="0" id="paginationInput">
+            页
+          </div>
+          <button onClick="confirmJump()" class="paginationButton">确定</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</body>
+<script src="/js/js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
+<script src="/js/js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
+<script src="/js/js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
+<script src="/js/js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
+<script src="/js/js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
+<script src="/js/js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
+<script src="/js/js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
+<script src="/js/js/scripts.js"></script>
+<script src="/js/iframe.js"></script>
+
+<script>
+  // 获取当前页面的 URL 参数
+  const params = new URLSearchParams(window.location.search);
+
+  // 将参数转换为一个对象
+  const paramObj = {};
+  params.forEach((value, key) => {
+    paramObj[key] = value;
+  });
+
+  // 获取当前页面地址的参数
+  const { pageIndex = 1, pageSize = 10 } = params;
+
+  let total = ${total}
+  let totalPages = Math.ceil(total / pageSize); // 总页数
+  let currentSize = pageSize;
+  let currentPage = pageIndex; // 当前页
+  const knowledgeUrl = '/articleTemplate/pageList'
+  const knowledgeDetails = '/articleTemplate/articleDetail'
+  const fixedParameters = '?pageIndex=' + currentPage + '&pageSize=' + currentSize + '&info=' // 分页固定参数
+
+  function search() {
+    const inputVal = document.getElementById("knowledgeInput").value;
+    window.location.href = knowledgeUrl + fixedParameters + inputVal
+  }
+  function learnMore(id) {
+    window.location.href = knowledgeDetails + `?id=` + id
+  }
+  function triggerButtonClick(itemId) {
+    // 找到该 item 对应的按钮并触发点击事件
+    const button = document.querySelector('button[onclick="learnMore('+itemId+')"]');
+    if (button) {
+      button.click();
+    }
+  }
+  function confirmJump() {
+    let inputVal = document.getElementById("paginationInput").value;
+    if(inputVal <= 0) {
+      inputVal = 1
+    }
+    if(inputVal > totalPages) {
+      inputVal = totalPages
+    }
+    if(!inputVal) {
+      return
+    }
+    window.location.href = knowledgeUrl + '?pageIndex=' + inputVal + '&pageSize=' + currentSize
+  }
+
+  // 初始化分页组件
+  function initPagination() {
+    const pageList = document.getElementById('page-list');
+    pageList.innerHTML = ''; // 清空之前的页码
+
+    for (let i = 1; i <= totalPages; i++) {
+      const li = document.createElement('li');
+      li.textContent = i;
+      li.classList.toggle('active', i === currentPage); // 设置当前页的样式
+      li.onclick = () => goToPage(i);
+      pageList.appendChild(li);
+    }
+
+    // 更新按钮的禁用状态
+    document.querySelector('.prev').disabled = currentPage === 1;
+    document.querySelector('.next').disabled = currentPage === totalPages;
+  }
+
+  // 跳转到指定页面
+  function goToPage(page) {
+    window.location.href = knowledgeUrl + '?pageIndex=' + page + '&pageSize=' + currentSize
+  }
+
+  // 初始化分页
+  initPagination();
+
+  function reinitIframe() {
+      const iframe = document.getElementById("headerIframe");
+      let observer = null
+      if (iframe) {
+          const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
+          const iframeBody = iframeDocument.body
+          observer = new MutationObserver(function(mutationsList, observer) {
+              const bodyHeight = iframeBody.clientHeight;
+              iframe.style.height = (bodyHeight + 1) + 'px';
+          });
+
+          observer.observe(iframeBody, { attributes: true, childList: true, subtree: true });
+          let imgElement = iframeDocument.getElementById('logo');
+          let headerItems = iframeDocument.querySelectorAll('.header-item')
+          let headerView = iframeDocument.querySelector('.headerView')
+          headerView.style.background = '#fff'
+          imgElement.src = './image/logos.jpg'
+          headerView.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0)';
+          headerItems.forEach(function(item) {
+              item.style.color = '#000'; // 设置你想要的字体颜色
+          });
+      }
+  }
+  reinitIframe()
+  
+</script>
+
+</html>

fhKeeper/formulahousekeeper/inva_4_tivo/knowledge.html

@@ -1,78 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
-  <meta name="keywords"
-    content="工时管理，工时统计，工时填报，项目成本统计，生产工时管理系统，工时成本管理，工时管理软件，研发工时管理系统，企业工时管理系统，项目工时统计，项目工时统计软件，项目工时统计系统，工时统计系统，工时统计表" />
-  <meta name="description" content="工时管家提供专业的工时填报和统计报表。支持PC和手机端。可按项目，部门，岗位等多维度统计成本。" />
-  <title>工时管家-专注工时管理，手机移动填报，核算项目投入人力成本，企业IPO利器！</title>
-  <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
-  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext"
-    rel="stylesheet">
-  <link href="css/bootstrap.css" rel="stylesheet">
-  <link href="css/font-awesome.css" rel="stylesheet">
-  <link href="css/swiper.css" rel="stylesheet">
-  <link href="css/magnific-popup.css" rel="stylesheet">
-  <link href="css/styles.css" rel="stylesheet">
-  <link rel="stylesheet" href="css/reset.css">
-  <link rel="stylesheet" href="css/tongyong.css">
-  <link rel="stylesheet" href="css/knowledgeField.css">
-</head>
-
-<body>
-  <iframe id="headerIframe" src="./moduleView/header.html" class="iframeClass" onLoad="reinitIframe();"></iframe>
-  <div class="knowledgeFieldCon">
-    <div v-loading="detailsSwitchingLoading" class="wh100 flex"></div>
-    <div class="knowledgeField">
-      <div class="knowledgeField-header">
-        <div class="knowledgeField-header-text">知识园地</div>
-        <div class="flex">
-          <input id="knowledgeInput" type="text" class="knowledgeInput" placeholder="请输入关键字搜索">
-          <button class="searchButton" onclick="search()">搜索</button>
-        </div>
-      </div>
-      <div class="flex1 knowledgeField-content">
-        <#list articles as item>
-          <div>
-            <div class="knowledgeField-content-item">
-              <div class="image"><img src="data:image;base64,${item.baseImage}" class="wh100" class="wh100"></img></div>
-              <div class="textContent">
-                <div>${ item.title }</div>
-                <p>${ item.profile }</p>
-                <button class="linkButton" onclick="learnMore(${item.id})">了解详情></button>
-              </div>
-            </div>
-            <div class="dividingLine"></div>
-          </div>
-        </#list>
-      </div>
-      <div class="knowledgeField-bottom flex-center">
-
-      </div>
-    </div>
-  </div>
-</body>
-<script src="js/js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
-<script src="js/js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
-<script src="js/js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
-<script src="js/js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
-<script src="js/js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
-<script src="js/js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
-<script src="js/js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
-<script src="js/js/scripts.js"></script>
-<script src="js/iframe.js"></script>
-
-<script>
-  function search() {
-    const inputVal = document.getElementById("knowledgeInput").value;
-    console.log(inputVal)
-    window.location.href = `/articleTemplate/pageList?pageIndex=1&pageSize=10&info=${inputVal}`
-  }
-  function learnMore(id) {
-    window.location.href = `/articleTemplate/articleDetail?id=${id}`
-  }
-</script>
-</html>

fhKeeper/formulahousekeeper/inva_4_tivo/knowledgeDetails.ftl

@@ -0,0 +1,196 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta name="keywords"
+    content="工时管理，工时统计，工时填报，项目成本统计，生产工时管理系统，工时成本管理，工时管理软件，研发工时管理系统，企业工时管理系统，项目工时统计，项目工时统计软件，项目工时统计系统，工时统计系统，工时统计表" />
+  <meta name="description" content="工时管家提供专业的工时填报和统计报表。支持PC和手机端。可按项目，部门，岗位等多维度统计成本。" />
+  <title>工时管家-专注工时管理，手机移动填报，核算项目投入人力成本，企业IPO利器！</title>
+  <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext"
+    rel="stylesheet">
+  <link href="/css/bootstrap.css" rel="stylesheet">
+  <link href="/css/font-awesome.css" rel="stylesheet">
+  <link href="/css/swiper.css" rel="stylesheet">
+  <link href="/css/magnific-popup.css" rel="stylesheet">
+  <link href="/css/styles.css" rel="stylesheet">
+  <link href="/css/reset.css" rel="stylesheet" >
+  <link href="/css/tongyong.css" rel="stylesheet">
+  <link href="/css/knowledgeField.css" rel="stylesheet" >
+</head>
+
+<body data-spy="scroll" data-target=".fixed-top" id="body">
+  <div class="spinner-wrapper">
+      <div class="spinner">
+          <div class="bounce1"></div>
+          <div class="bounce2"></div>
+          <div class="bounce3"></div>
+      </div>
+  </div>
+  <iframe id="headerIframe" src="/moduleView/header.html" class="iframeClass"></iframe>
+  <div class="knowledgeFieldCon">
+    <div v-if="isItForDetails" class="knowledgeDetails">
+      <div class="returnIcon" id="returnIcon">
+        <img src="/image/ions/zuos.png" />
+      </div>
+      <div class="knowledgeDetails-left">
+        <div class="knowledgeDetails-left-title">${article.title}</div>
+        <div class="dividingLine"></div>
+        <div class="knowledgeDetails-left-con">
+          <div class="flex distribution">
+            <ul class="flex">
+              <li class="grey">标签：</li>
+              <#list categoryNameList as item>
+                <li class="blue">${item}</li>
+              </#list>
+            </ul>
+          </div>
+          <div class="flex-center distribution timeContent">
+            <p>发布时间</p>
+            <span>${ article.createTimeStr }</span>
+          </div>
+          <div class="flex-center distribution readUse" style="justify-content: flex-end;">
+            <div class="text">推荐使用:</div>
+            <#if article?exists && article.productId?exists>
+              <#if article.productId == "1">
+                <div class="jumpToImg" id="imgClick">工时管家</div>
+              <#elseif article.productId == "2">
+                <div class="jumpToImg" id="imgClick">随访管家</div>
+              <#elseif article.productId == "3">
+                <div class="jumpToImg" id="imgClick">项目管家</div>
+              <#elseif article.productId == "4">
+                <div class="jumpToImg" id="imgClick">客户管家</div>
+              <#elseif article.productId == "5">
+                <div class="jumpToImg" id="imgClick">生产车间管家</div>
+              <#else>
+                <div class="jumpToImg">敬请期待</div>
+              </#if>
+            <#else>
+              <div class="jumpToImg">敬请期待</div>
+            </#if>
+
+          </div>
+        </div>
+        <div class="hypertextContent" id="hypertextContent">
+          ${ article.content }
+        </div>
+        <div class="knowledgeDetails-left-bottom flex-center"></div>
+      </div>
+      <div class="knowledgeDetails-right">
+        <div class="latestArticles">
+          <div class="knowledgeDetails-right-title">
+            <div>最新文章</div>
+            <buttom class="linkButton" onclick="toKnowledge()">查看更多></buttom>
+          </div>
+          <div class="line"></div>
+          <div class="latestList">
+            <#list latestList as item>
+              <div class="latestList-item" data-item='${item.id}'>
+                <div class="latestList-item-image">
+                  <img src="data:image;base64,${item.baseImage}" class="wh100"></img>
+                </div>
+                <div class="latestList-item-text">
+                  <div class="latestList-item-text-title">${ item.title }</div>
+                  <div class="data">${ item.createTimeStr }</div>
+                </div>
+              </div>
+            </#list>
+          </div>
+        </div>
+        <div class="relatedRecommendations">
+          <div class="knowledgeDetails-right-title">
+            <div>相关推荐</div>
+            <buttom class="linkButton" onclick="toKnowledge()">查看更多></buttom>
+          </div>
+          <div class="line"></div>
+          <div class="latestList">
+            <#list relatedList as item>
+              <div class="latestList-item" data-item='${item.id}'>
+                <div class="latestList-item-image">
+                  <img src="data:image;base64,${item.baseImage}" class="wh100"></img>
+                </div>
+                <div class="latestList-item-text">
+                  <div class="latestList-item-text-title">${ item.title }</div>
+                  <div class="data">${item.createTimeStr}</div>
+                </div>
+              </div>
+            </#list>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</body>
+<script src="/js/js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
+<script src="/js/js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
+<script src="/js/js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
+<script src="/js/js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
+<script src="/js/js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
+<script src="/js/js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
+<script src="/js/js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
+<script src="/js/js/scripts.js"></script>
+<script src="/js/iframe.js"></script>
+
+<script>
+  const knowledgeDetails = '/articleTemplate/articleDetail'
+  function toKnowledge() {
+    window.location.href = `/articleTemplate/pageList?pageIndex=1&pageSize=10`
+  }
+  $('#returnIcon').click(function () {
+    window.history.back()
+  })
+
+  $('#imgClick').click(function () {
+    const id = ${article.productId}
+    const jumpObject = {
+      '1': 'http://worktime.ttkuaiban.com/#/login',
+      '2': 'http://clinic.ttkuaiban.com/#/login',
+      '3': 'http://worktime.ttkuaiban.com/#/login',
+      '4': 'http://crm.ttkuaiban.com/login',
+      '5': 'http://workshop.ttkuaiban.com'
+    }
+    if (id) {
+      window.location.href = jumpObject[id]
+    }
+  })
+
+  document.addEventListener("DOMContentLoaded", function () {
+    const items = document.querySelectorAll('.latestList-item');
+    items.forEach(item => {
+      item.addEventListener('click', function () {
+        const itemData = item.getAttribute('data-item');
+        console.log('点击了', itemData)
+        window.location.href = knowledgeDetails + `?id=` + itemData
+      });
+    });
+  });
+
+  function reinitIframe() {
+      const iframe = document.getElementById("headerIframe");
+      let observer = null
+      if (iframe) {
+          const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
+          const iframeBody = iframeDocument.body
+          observer = new MutationObserver(function(mutationsList, observer) {
+              const bodyHeight = iframeBody.clientHeight;
+              iframe.style.height = (bodyHeight + 1) + 'px';
+          });
+
+          observer.observe(iframeBody, { attributes: true, childList: true, subtree: true });
+          let imgElement = iframeDocument.getElementById('logo');
+          let headerItems = iframeDocument.querySelectorAll('.header-item')
+          let headerView = iframeDocument.querySelector('.headerView')
+          headerView.style.background = '#fff'
+          imgElement.src = './image/logos.jpg'
+          headerView.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0)';
+          headerItems.forEach(function(item) {
+              item.style.color = '#000'; // 设置你想要的字体颜色
+          });
+      }
+  }
+  reinitIframe()
+</script>
+</html>

fhKeeper/formulahousekeeper/management-workshop/src/main/java/com/management/platform/controller/CommonUploadController.java

@@ -5,14 +5,18 @@ import org.apache.log4j.LogManager;
 import org.apache.log4j.Logger;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.beans.factory.annotation.Value;
+import org.springframework.http.HttpHeaders;
+import org.springframework.http.MediaType;
+import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 import org.springframework.web.multipart.MultipartFile;
 
-import java.io.File;
-import java.io.FileOutputStream;
-import java.io.InputStream;
-import java.io.OutputStream;
+import java.io.*;
+import java.net.URLEncoder;
+import java.nio.file.Files;
+import java.nio.file.Path;
+import java.nio.file.Paths;
 import java.util.UUID;
 
 @RestController
@@ -26,6 +30,9 @@ public class CommonUploadController {
     @Value(value = "${upload.tempUpdatePath}")
     private String tempUpdatePath;
 
+    @Value(value = "${logging.path}")
+    private String logPath;
+
     @RequestMapping(value="uploadFile")
     public HttpRespMsg uploadFile(MultipartFile multipartFile) {
         HttpRespMsg msg = new HttpRespMsg();
@@ -97,4 +104,25 @@ public class CommonUploadController {
 
         return msg;
     }
+
+    @RequestMapping("/downLoadLog")
+    public ResponseEntity<byte[]> downLoadLog() throws IOException {
+        // 🧐🧐🧐读取本地的文件
+        // 获取File对象
+        System.out.println("读取目录=="+logPath);
+        logger.info("读取目录=={}"+logPath);
+        String fileName = "workshop.out";
+        File readFile=new File(logPath+fileName);
+        // 🐳🐳🐳设置响应头,把文件名称放入响应头中,确保文件可下载
+        HttpHeaders headers = new HttpHeaders();
+        headers.set("Content-Disposition", "attachment;filename=" + URLEncoder.encode(readFile.getName(), "UTF-8"));
+        // 🐳🐳🐳设置内容类型为「application/octet-stream」二进制流
+        headers.setContentType(MediaType.APPLICATION_OCTET_STREAM);
+
+        Path path = Paths.get(readFile.toURI());
+        // 获取File对象的字节码文件
+        byte[] bytes = Files.readAllBytes(path);
+        //return new ResponseEntity<>(bytes, headers, HttpStatus.OK);
+        return ResponseEntity.ok().headers(headers).body(bytes);
+    }
 }

fhKeeper/formulahousekeeper/webttkuaiban/src/main/java/com/firerock/webttkuaiban/demos/controller/ArticleTemplateController.java

@@ -0,0 +1,105 @@
+package com.firerock.webttkuaiban.demos.controller;
+
+import com.firerock.webttkuaiban.demos.pojo.Article;
+import com.firerock.webttkuaiban.demos.service.ArticleService;
+import org.apache.tomcat.util.codec.binary.StringUtils;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestMethod;
+import org.springframework.web.bind.annotation.RequestParam;
+
+import java.time.format.DateTimeFormatter;
+import java.util.ArrayList;
+import java.util.Base64;
+import java.util.HashMap;
+import java.util.List;
+
+@Controller
+@RequestMapping("articleTemplate")
+public class ArticleTemplateController {
+
+    @Autowired
+    ArticleService articleService;
+
+    @GetMapping("/pageList")  // 这里的 PageBean 是事先定义好的实体类
+    public Object PageList(Model model, Integer pageIndex, Integer pageSize,
+                           @RequestParam(required = false) String info)
+    {
+        List<Article> articleList= articleService.PageList(pageIndex,pageSize,info);
+        Integer total=articleService.getTotal(info);
+        if (!articleList.isEmpty()){
+            for (Article article : articleList) {
+                byte[] imageData = article.getCoverImg();
+                if (imageData != null){
+                    String base64Image = Base64.getEncoder().encodeToString(imageData);
+                    article.setBaseImage(base64Image);
+                }else {
+                    article.setBaseImage("");
+                }
+
+            }
+        }
+        model.addAttribute("knowledgeFieldTableList", articleList);
+        model.addAttribute("total",total );
+        return "knowledge";
+    }
+    @RequestMapping(value = "/articleList", method = RequestMethod.GET)
+    public String articleList(Model model) {
+        List<HashMap> articles = new ArrayList<>();
+        for (int i = 0; i < 10; i++) {
+            HashMap<String, String> article = new HashMap<>();
+            article.put("id", "" + (i+1));
+            article.put("title", "Article Title " + i);
+            article.put("content", "Article Content " + i);
+            articles.add(article);
+        }
+        model.addAttribute("articles", articles);
+        return "articleList";
+    }
+    @GetMapping("/articleDetail")  // 这里的 PageBean 是事先定义好的实体类
+    public Object articleDetail(Model model,@RequestParam("id") Integer id)
+    {
+        // 定义格式化器
+        DateTimeFormatter formatter = DateTimeFormatter.ofPattern("yyyy-MM-dd");
+
+        List<Article> latestList =articleService.latestList();
+        if (!latestList.isEmpty()){
+            for (Article article : latestList) {
+                byte[] imageData = article.getCoverImg();
+                if (imageData != null){
+                    String base64Image = Base64.getEncoder().encodeToString(imageData);
+                    article.setBaseImage(base64Image);
+                }
+                else {
+                    article.setBaseImage("");
+                }
+                article.setCreateTimeStr(article.getCreateTime().format(formatter));
+            }
+        }
+        List<Article> relatedList =articleService.relatedList(id);
+        if (!relatedList.isEmpty()){
+            for (Article article : relatedList) {
+                byte[] imageData = article.getCoverImg();
+                if (imageData != null){
+                    String base64Image = Base64.getEncoder().encodeToString(imageData);
+                    article.setBaseImage(base64Image);
+                }
+                else {
+                    article.setBaseImage("");
+                }
+                article.setCreateTimeStr(article.getCreateTime().format(formatter));
+            }
+        }
+        Article article = articleService.getArticleById(id);
+        article.setCreateTimeStr(article.getCreateTime().format(formatter));
+
+        model.addAttribute("latestList", latestList);
+        model.addAttribute("relatedList",relatedList );
+        model.addAttribute("article",article);
+        model.addAttribute("categoryNameList",article.getCategoryNameList()==null?new ArrayList<String>():article.getCategoryNameList());
+        return "knowledgeDetails";
+    }
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/java/com/firerock/webttkuaiban/demos/pojo/Article.java

@@ -8,6 +8,7 @@ import org.springframework.format.annotation.DateTimeFormat;
 import org.springframework.web.multipart.MultipartFile;
 
 import java.time.LocalDateTime;
+import java.util.List;
 
 @Data
 public class Article {
@@ -30,12 +31,18 @@ public class Article {
 
     private String categoryIds;//文章分类 category_ids
     private String categoryNames;//文章分类 category_ids
+    private List<String> categoryNameList;//文章分类 category_ids
     private Integer createUser;//创建人ID
 
+    private String baseImage;
+    private String productId;
+
     @JsonFormat(pattern = "yyyy-MM-dd")
     @DateTimeFormat(pattern = "yyyy-MM-dd")
     private LocalDateTime createTime;//创建时间
 
+    private String createTimeStr;
+
     @JsonFormat(pattern = "yyyy-MM-dd")
     @DateTimeFormat(pattern = "yyyy-MM-dd")
     private LocalDateTime updateTime;//更新时间

fhKeeper/formulahousekeeper/webttkuaiban/src/main/java/com/firerock/webttkuaiban/demos/service/impl/ArticleServiceImpl.java

@@ -13,6 +13,7 @@ import org.springframework.util.StringUtils;
 import java.util.ArrayList;
 import java.util.List;
 import java.util.StringJoiner;
+import java.util.stream.Collectors;
 
 @Service
 public class ArticleServiceImpl implements ArticleService {
@@ -61,6 +62,8 @@ public class ArticleServiceImpl implements ArticleService {
             List<Category> list = categoryMapper.listByIds(categoryIds);
             StringJoiner stringJoiner = new StringJoiner(",");
             if (list != null && !list.isEmpty()) {
+                List<String> categoryList = list.stream().map(Category::getCategoryName).collect(Collectors.toList());
+                article.setCategoryNameList(categoryList);
                 list.forEach(a -> stringJoiner.add(a.getCategoryName()));
                 article.setCategoryNames(stringJoiner.toString());
             }

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/css/index.css

@@ -72,26 +72,29 @@
 
 /* 图片 */
 .bannarIMgGam {
-    width: 62.5rem;
-    /* height: 34.625rem; */
+    width: 35.6875rem;
     position: absolute;
-    top: 13.75rem;
-    right: 3.4375rem;
+    top: 15.8125rem;
+    right: 6.25rem;
     z-index: 1;
 }
 
 .bannarTxt {
     position: absolute;
-    top: 18.375rem;
-    left: 16.25rem;
-    color: #fff;
+    top: 13.9688rem;
+    left: 9rem;
+    color: #252432;
+    font-size: 3.75rem;
 }
 .bannarTil {
-    font-size: 6.9375rem;
+    font-size: 5.25rem;
     font-weight: bold;
     font-family: '黑体';
     letter-spacing: .625rem;
 }
+.bannarTil span {
+    color: #3396FB;
+}
 .bannarTilP {
     font-size: 20px;
     font-style: oblique;
@@ -108,16 +111,18 @@
     font-size: 16px;
     line-height: 50px;
     border: 1px solid #fff;
+    background: #3396FB;
     width: 208px;
     padding: 0 46px;
     text-align: center;
     border-radius: 6px;
     margin: 20px 0 0 0;
     letter-spacing: .3125rem;
+    margin-right: .75rem;
 }
 .bannarBtn:hover {
-    background: #fff;
-    color: #333333;
+    background: #66b1ff;
+    color: #fff;
     font-weight: normal;
     cursor: pointer;
 }
@@ -126,26 +131,45 @@
 }
 .bannarRz {
     display: flex;
-    justify-content: space-between;
-    width: 31.25rem;
-    margin-top: .75rem;
+    margin-top: 2.3887rem;
 }
 .bannarRzBox {
-    padding: 0 .625rem;
+    padding: .3125rem 1.1875rem;
     display: flex;
     align-items: center;
     justify-content: center;
-    line-height: 1.375rem;
-    border-radius: .625rem;
-    font-size: .375rem;
-    color: #d7d7d7;
+    font-weight: medium;
+    line-height: 1.2;
+    font-size: .625rem;
+    color: #000000;
+    border-radius: 100px;
+    background: #00B05019;
+    border: 2px solid #00B050;
+    margin-right: 1.25rem;
 }
 .bannarRzBox img {
     width: 1.125rem;
-    height: .9375rem;
+    height: 1.125rem;
     display: inline-block;
     margin-right: .3125rem;
 }
+.bannarTextList {
+    color: #252432;
+    font-family: PingFang SC;
+    font-weight: heavy;
+    font-size: 26px;
+    line-height: 1.2;
+    letter-spacing: 0px;
+    margin-top: 4.4375rem;
+    padding-left: 1.875rem;
+}
+.bannarTextList li {
+    list-style: disc;
+}
+.bannarTextList li:nth-child(2) {
+    margin-top: 2.8125rem;
+    margin-bottom: 4.4375rem;
+}
 
 /* 产品介绍 */
 .product {

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/css/knowledgeField.css

@@ -0,0 +1,408 @@
+.knowledgeFieldCon {
+  position: relative;
+  background: #f6f7fb;
+  height: 100%;
+  padding-top: 4.5rem;
+  display: flex;
+}
+.knowledgeFieldCon .knowledgeField {
+  flex: 1;
+  margin: 2.1875rem;
+  background: #fff;
+  border-radius: 0.25rem;
+  display: flex;
+  flex-direction: column;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header {
+  height: 4.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 1.5rem;
+  border-bottom: 0.0625rem solid #ededed;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .knowledgeInput {
+  width: 25rem;
+  height: 2.625rem;
+  box-sizing: border-box;
+  background: #f4f4f4;
+  border-radius: 2.625rem;
+  border: 1px solid #fff;
+  padding: 0 1.25rem;
+  margin-right: 0.8125rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .knowledgeInput:focus {
+  border: 0.0625rem solid #3396fb;
+  outline: none;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .searchButton {
+  width: 7.1875rem;
+  height: 2.8125rem;
+  background: #3396fb;
+  border-radius: 0.375rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+  font-size: 1.125rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .knowledgeField-header-text {
+  color: #000000;
+  font-family: Microsoft YaHei UI;
+  font-weight: bold;
+  font-size: 20px;
+  line-height: normal;
+  letter-spacing: 0px;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .elInput {
+  width: 25.8125rem;
+  margin-right: 0.8125rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .elInput .elSelect {
+  width: 5rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content {
+  padding: 0 1.5625rem;
+  margin: 1.875rem 0;
+  overflow-y: auto;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item {
+  display: flex;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .image {
+  width: 10.1875rem;
+  height: 6.8125rem;
+  margin-right: 1.25rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .textContent {
+  width: 100.5rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .textContent div {
+  color: #000000;
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 20px;
+  line-height: normal;
+  letter-spacing: 0px;
+  padding-bottom: 0.875rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .textContent p {
+  color: #7b7b7b;
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 16px;
+  height: 2.5rem;
+  line-height: normal;
+  letter-spacing: 0px;
+  display: -webkit-box;
+  /* 必须设置为弹性盒模型 */
+  -webkit-box-orient: vertical;
+  /* 设置盒子的排列方式为垂直 */
+  overflow: hidden;
+  /* 隐藏超出的文本 */
+  -webkit-line-clamp: 2;
+  /* 限制显示2行 */
+  text-overflow: ellipsis;
+  /* 超出的部分显示省略号 */
+  margin-bottom: 0.625rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .textContent span {
+  color: #3396fb;
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 16px;
+  line-height: normal;
+  letter-spacing: 0px;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-bottom {
+  padding: 1.5625rem 0;
+  font-size: 1rem !important;
+}
+.knowledgeFieldCon .knowledgeDetails {
+  padding: 1.25rem 2.1875rem;
+  display: flex;
+  justify-content: space-between;
+  position: relative;
+}
+.knowledgeFieldCon .knowledgeDetails .returnIcon {
+  position: absolute;
+  left: 4.0625rem;
+  top: 2.8125rem;
+  font-size: 1.5625rem;
+  z-index: 2;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeDetails .returnIcon:hover {
+  color: #3396fb;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left {
+  width: 92.75rem;
+  background: #fff;
+  display: flex;
+  flex-direction: column;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-title {
+  color: #000000;
+  font-family: Microsoft YaHei UI;
+  font-weight: bold;
+  font-size: 1.5rem;
+  line-height: normal;
+  letter-spacing: 0px;
+  text-align: center;
+  padding-top: 1.5rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con {
+  padding: 0 1.875rem 0.9375rem 1.875rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .distribution {
+  width: 33%;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .timeContent {
+  font-size: 1rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .timeContent p {
+  color: #7b7b7b;
+  margin-right: 1rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .timeContent span {
+  color: #000000;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .readUse .text {
+  font-size: 1rem;
+  margin-right: 1rem;
+  color: #7b7b7b;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .readUse .jumpToImg {
+  width: 8.75rem;
+  height: 2.5rem;
+  font-size: 1rem;
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 0.375rem;
+  background: linear-gradient(180deg, #3597fb 0%, #39e5ff 100%);
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con li {
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 1rem;
+  line-height: normal;
+  margin-right: 2.0625rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .grey {
+  color: #7b7b7b;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .blue {
+  color: #3396fb;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .hypertextContent {
+  background: #f6f6f6;
+  padding: 1.875rem;
+  overflow-y: auto;
+  margin: 0 1.875rem;
+  flex: 1;
+  font-size: 1rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-bottom {
+  padding: 1.25rem 0;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right {
+  width: 22.625rem;
+  padding-left: 1.875rem;
+  display: flex;
+  flex-direction: column;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestArticles {
+  width: 100%;
+  height: 20.75rem;
+  background: #fff;
+  margin-bottom: 1.25rem;
+  padding: 1.25rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .relatedRecommendations {
+  flex: 1;
+  background: #fff;
+  padding: 1.25rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .knowledgeDetails-right-title {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .knowledgeDetails-right-title div {
+  font-size: 1rem;
+  color: #000000;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .knowledgeDetails-right-title span {
+  font-size: 0.875rem;
+  color: #3878ff;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .line {
+  width: 100%;
+  height: 1px;
+  background: #ededed;
+  margin: 0.5625rem 0 0.875rem 0;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList {
+  width: 100%;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 1rem;
+  border: 1px solid #fff;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item:hover {
+  border: 1px solid #409eff;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item:hover .latestList-item-text {
+  color: #3396fb;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item:last-child {
+  margin-bottom: 0;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item .latestList-item-image {
+  width: 6.25rem;
+  height: 4.5rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item .latestList-item-text {
+  width: 11.25rem;
+  font-size: 0.875rem;
+  color: #000000;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item .latestList-item-text .data {
+  color: #c7c7c7;
+  text-align: right;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item .latestList-item-text .latestList-item-text-title {
+  line-height: 1.125rem;
+  height: 3.5625rem;
+  display: -webkit-box;
+  /* 必须设置为弹性盒模型 */
+  -webkit-box-orient: vertical;
+  /* 设置盒子的排列方式为垂直 */
+  overflow: hidden;
+  /* 隐藏超出的文本 */
+  -webkit-line-clamp: 3;
+  /* 限制显示2行 */
+  text-overflow: ellipsis;
+  /* 超出的部分显示省略号 */
+}
+.knowledgeFieldCon .flex1 {
+  flex: 1;
+}
+.knowledgeFieldCon .flex {
+  display: flex;
+}
+.knowledgeFieldCon .flex-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.knowledgeFieldCon img {
+  width: 100%;
+  height: 100%;
+}
+.knowledgeFieldCon .wh100 {
+  width: 100%;
+  height: 100%;
+}
+.knowledgeFieldCon .linkButton {
+  color: #3396fb;
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 1rem;
+  line-height: normal;
+  letter-spacing: 0px;
+  cursor: pointer;
+  position: relative;
+  z-index: 2;
+}
+.knowledgeFieldCon .dividingLine {
+  height: 0.0625rem;
+  background: #dcdfe6;
+  margin: 1.25rem 0;
+}
+.knowledgeFieldCon .pagination {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 0.625rem;
+}
+.knowledgeFieldCon .pagination button {
+  padding: 0.3125rem 0.625rem;
+  cursor: pointer;
+  background-color: #007bff;
+  color: white;
+  border: 0.0625rem solid #007bff;
+  border-radius: 0.3125rem;
+}
+.knowledgeFieldCon .pagination button:disabled {
+  background-color: #fff;
+  border-color: #d6d6d6;
+  cursor: not-allowed;
+  color: #000000;
+}
+.knowledgeFieldCon .pagination ul {
+  list-style-type: none;
+  display: flex;
+  gap: 0.3125rem;
+}
+.knowledgeFieldCon .pagination li {
+  padding: 0.3125rem 0.625rem;
+  cursor: pointer;
+  border: 0.0625rem solid #d6d6d6;
+  border-radius: 0.3125rem;
+}
+.knowledgeFieldCon .pagination li.active {
+  background-color: #007bff;
+  background: #007bff;
+  color: white;
+}
+.knowledgeFieldCon .pagination li:hover {
+  background-color: #007bff;
+  color: white;
+}
+.knowledgeFieldCon .pagination button {
+  padding: 0.3125rem 0.625rem;
+  margin: 0 0.3125rem;
+}
+.knowledgeFieldCon .paginationInput {
+  width: 3.75rem;
+  height: 2rem;
+  text-align: center;
+  border-radius: 0.1875rem;
+  background: #ffffff;
+  border: 0.0625rem solid #d6d6d6;
+  margin: 0 0.5rem;
+}
+.knowledgeFieldCon .paginationInput:focus {
+  border: 0.0625rem solid #3396fb;
+  outline: none;
+}
+.knowledgeFieldCon .paginationButton {
+  width: 3.75rem;
+  height: 2rem;
+  border-radius: 0.1875rem;
+  background: #f6f6f6;
+  border: 0.0625rem solid #d6d6d6;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 1rem;
+  color: #363636;
+  margin: 0 0.5rem;
+}
+.knowledgeFieldCon .paginationButton:hover {
+  background: #3396fb;
+  color: #fff;
+  border-color: #3396fb;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/css/knowledgeField.less

@@ -0,0 +1,422 @@
+.knowledgeFieldCon {
+  position: relative;
+  background: #f6f7fb;
+  height: 100%;
+  padding-top: 4.5rem;
+  display: flex;
+  // 知识园地
+  .knowledgeField {
+    flex: 1;
+    margin: 2.1875rem;
+    background: #fff;
+    border-radius: 0.25rem;
+    display: flex;
+    flex-direction: column;
+    .knowledgeField-header {
+      height: 4.5rem;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 1.5rem;
+      border-bottom: 0.0625rem solid #ededed;
+      .knowledgeInput {
+        width: 25rem;
+        height: 2.625rem;
+        box-sizing: border-box;
+        background: #f4f4f4;
+        border-radius: 2.625rem;
+        border: 1px solid #fff;
+        padding: 0 1.25rem;
+        margin-right: 0.8125rem;
+        &:focus {
+          border: 0.0625rem solid #3396fb;
+          outline: none;
+        }
+      }
+      .searchButton {
+        width: 7.1875rem;
+        height: 2.8125rem;
+        background: #3396fb;
+        border-radius: 0.375rem;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: #fff;
+        font-size: 1.125rem;
+      }
+      .knowledgeField-header-text {
+        color: #000000;
+        font-family: Microsoft YaHei UI;
+        font-weight: bold;
+        font-size: 20px;
+        line-height: normal;
+        letter-spacing: 0px;
+      }
+      .elInput {
+        width: 25.8125rem;
+        margin-right: 0.8125rem;
+        .elSelect {
+          width: 5rem;
+        }
+      }
+    }
+
+    .knowledgeField-content {
+      padding: 0 1.5625rem;
+      margin: 1.875rem 0;
+      overflow-y: auto;
+
+      .knowledgeField-content-item {
+        display: flex;
+        .image {
+          width: 10.1875rem;
+          height: 6.8125rem;
+          margin-right: 1.25rem;
+        }
+        .textContent {
+          width: 100.5rem;
+          div {
+            color: #000000;
+            font-family: Microsoft YaHei UI;
+            font-weight: regular;
+            font-size: 20px;
+            line-height: normal;
+            letter-spacing: 0px;
+            padding-bottom: 0.875rem;
+          }
+          p {
+            color: #7b7b7b;
+            font-family: Microsoft YaHei UI;
+            font-weight: regular;
+            font-size: 16px;
+            height: 2.5rem;
+            line-height: normal;
+            letter-spacing: 0px;
+            display: -webkit-box; /* 必须设置为弹性盒模型 */
+            -webkit-box-orient: vertical; /* 设置盒子的排列方式为垂直 */
+            overflow: hidden; /* 隐藏超出的文本 */
+            -webkit-line-clamp: 2; /* 限制显示2行 */
+            text-overflow: ellipsis; /* 超出的部分显示省略号 */
+            margin-bottom: 0.625rem;
+          }
+          span {
+            color: #3396fb;
+            font-family: Microsoft YaHei UI;
+            font-weight: regular;
+            font-size: 16px;
+            line-height: normal;
+            letter-spacing: 0px;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+
+    .knowledgeField-bottom {
+      padding: 1.5625rem 0;
+      font-size: 1rem !important;
+    }
+  }
+
+  // 知识详情
+  .knowledgeDetails {
+    padding: 1.25rem 2.1875rem;
+    display: flex;
+    justify-content: space-between;
+    position: relative;
+    .returnIcon {
+      position: absolute;
+      left: 4.0625rem;
+      top: 2.8125rem;
+      font-size: 1.5625rem;
+      z-index: 2;
+      cursor: pointer;
+    }
+    .returnIcon:hover {
+      color: #3396fb;
+    }
+
+    .knowledgeDetails-left {
+      width: 92.75rem;
+      background: #fff;
+      display: flex;
+      flex-direction: column;
+
+      .knowledgeDetails-left-title {
+        color: #000000;
+        font-family: Microsoft YaHei UI;
+        font-weight: bold;
+        font-size: 1.5rem;
+        line-height: normal;
+        letter-spacing: 0px;
+        text-align: center;
+        padding-top: 1.5rem;
+      }
+
+      .knowledgeDetails-left-con {
+        padding: 0 1.875rem 0.9375rem 1.875rem;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        .distribution {
+          width: 33%;
+        }
+        .timeContent {
+          font-size: 1rem;
+          p {
+            color: #7b7b7b;
+            margin-right: 1rem;
+          }
+          span {
+            color: #000000;
+          }
+        }
+        .readUse {
+          .text {
+            font-size: 1rem;
+            margin-right: 1rem;
+            color: #7b7b7b;
+          }
+          .jumpToImg {
+            width: 8.75rem;
+            height: 2.5rem;
+            font-size: 1rem;
+            color: #fff;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-radius: .375rem;
+            background: linear-gradient(180deg, #3597fb 0%, #39e5ff 100%);
+          }
+        }
+        li {
+          font-family: Microsoft YaHei UI;
+          font-weight: regular;
+          font-size: 1rem;
+          line-height: normal;
+          margin-right: 2.0625rem;
+        }
+        .grey {
+          color: #7b7b7b;
+        }
+        .blue {
+          color: #3396fb;
+        }
+      }
+
+      .hypertextContent {
+        background: #f6f6f6;
+        padding: 1.875rem;
+        overflow-y: auto;
+        margin: 0 1.875rem;
+        flex: 1;
+        font-size: 1rem;
+      }
+
+      .knowledgeDetails-left-bottom {
+        padding: 1.25rem 0;
+      }
+    }
+
+    .knowledgeDetails-right {
+      width: 22.625rem;
+      padding-left: 1.875rem;
+      display: flex;
+      flex-direction: column;
+      .latestArticles {
+        width: 100%;
+        height: 20.75rem;
+        background: #fff;
+        margin-bottom: 1.25rem;
+        padding: 1.25rem;
+      }
+      .relatedRecommendations {
+        flex: 1;
+        background: #fff;
+        padding: 1.25rem;
+      }
+      .knowledgeDetails-right-title {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        div {
+          font-size: 1rem;
+          color: #000000;
+        }
+        span {
+          font-size: 0.875rem;
+          color: #3878ff;
+          cursor: pointer;
+        }
+      }
+      .line {
+        width: 100%;
+        height: 1px;
+        background: #ededed;
+        margin: 0.5625rem 0 0.875rem 0;
+      }
+      .latestList {
+        width: 100%;
+        .latestList-item {
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          margin-bottom: 1rem;
+          border: 1px solid #fff;
+          cursor: pointer;
+          &:hover {
+            border: 1px solid #409eff;
+            .latestList-item-text {
+              color: #3396fb;
+            }
+          }
+          &:last-child {
+            margin-bottom: 0;
+          }
+          .latestList-item-image {
+            width: 6.25rem;
+            height: 4.5rem;
+          }
+          .latestList-item-text {
+            width: 11.25rem;
+            font-size: 0.875rem;
+            color: #000000;
+            .data {
+              color: #c7c7c7;
+              text-align: right;
+            }
+            .latestList-item-text-title {
+              line-height: 1.125rem;
+              height: 3.5625rem;
+              display: -webkit-box; /* 必须设置为弹性盒模型 */
+              -webkit-box-orient: vertical; /* 设置盒子的排列方式为垂直 */
+              overflow: hidden; /* 隐藏超出的文本 */
+              -webkit-line-clamp: 3; /* 限制显示2行 */
+              text-overflow: ellipsis; /* 超出的部分显示省略号 */
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .flex1 {
+    flex: 1;
+  }
+  .flex {
+    display: flex;
+  }
+  .flex-center {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  img {
+    width: 100%;
+    height: 100%;
+  }
+  .wh100 {
+    width: 100%;
+    height: 100%;
+  }
+
+  .linkButton {
+    color: #3396fb;
+    font-family: Microsoft YaHei UI;
+    font-weight: regular;
+    font-size: 1rem;
+    line-height: normal;
+    letter-spacing: 0px;
+    cursor: pointer;
+    position: relative;
+    z-index: 2;
+  }
+
+  .dividingLine {
+    height: 0.0625rem;
+    background: #dcdfe6;
+    margin: 1.25rem 0;
+  }
+
+  .pagination {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 0.625rem;
+  }
+
+  .pagination button {
+    padding: 0.3125rem 0.625rem;
+    cursor: pointer;
+    background-color: #007bff;
+    color: white;
+    border: 0.0625rem solid #007bff;
+    border-radius: 0.3125rem;
+  }
+
+  .pagination button:disabled {
+    background-color: #fff;
+    border-color: #d6d6d6;
+    cursor: not-allowed;
+    color: #000000;
+  }
+
+  .pagination ul {
+    list-style-type: none;
+    display: flex;
+    gap: 0.3125rem;
+  }
+
+  .pagination li {
+    padding: 0.3125rem 0.625rem;
+    cursor: pointer;
+    border: 0.0625rem solid #d6d6d6;
+    border-radius: 0.3125rem;
+  }
+
+  .pagination li.active {
+    background-color: #007bff;
+    background: #007bff;
+    color: white;
+  }
+
+  .pagination li:hover {
+    background-color: #007bff;
+    color: white;
+  }
+  .pagination button {
+    padding: 0.3125rem 0.625rem;
+    margin: 0 0.3125rem;
+  }
+  .paginationInput {
+    width: 3.75rem;
+    height: 2rem;
+    text-align: center;
+    border-radius: 0.1875rem;
+    background: #ffffff;
+    border: 0.0625rem solid #d6d6d6;
+    margin: 0 0.5rem;
+    &:focus {
+      border: 0.0625rem solid #3396fb;
+      outline: none;
+    }
+  }
+  .paginationButton {
+    width: 3.75rem;
+    height: 2rem;
+    border-radius: 0.1875rem;
+    background: #f6f6f6;
+    border: 0.0625rem solid #d6d6d6;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 1rem;
+    color: #363636;
+    margin: 0 0.5rem;
+    &:hover {
+      background: #3396fb;
+      color: #fff;
+      border-color: #3396fb;
+    }
+  }
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/index.html

@@ -16,8 +16,8 @@
     <script src="js/jquery1.42.min.js"></script>
     <script src="js/jquery.SuperSlide.2.1.3.js"></script>
     <!-- 统计文件 -->
-    <script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script>
-    <script>LA.init({id: "Jk62Sh8gvUhl1xcU",ck: "Jk62Sh8gvUhl1xcU"})</script>
+    <!-- <script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script>
+    <script>LA.init({id: "Jk62Sh8gvUhl1xcU",ck: "Jk62Sh8gvUhl1xcU"})</script> -->
     <script>
         let str = (navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)) ? 'app': 'pc';
         let url = window.location.href
@@ -56,26 +56,26 @@
     </div>
 
     <!-- 轮播图 -->
-    <div class="bannar" style="position: relative;background: #000000;height: 902px;">
-        <!-- <img src="./image/bannar1.jpg" style="width: 100%;" alt=""> -->
-        <!-- <img src="./image/bannar7.jpg" style="width: 100%;" alt="" class="bannarIMgGamOne"> -->
-        <img src="./image/bannar9.gif" alt="" class="bannarIMgGam">
+    <div class="bannar" style="position: relative;background: #ffffff;height: 100vh">
+        <img src="./image/bannar10.png" alt="" class="bannarIMgGam">
         <div class="bannarTxt">
-            <div class="bannarTil">工时管家</div>
+            <div class="bannarTil">专业团队用<span>工时管家</span></div>
             <div class="bannarRz">
-                <div class="bannarRzBox" style="border: 0.125rem solid #00b050;">
-                    <img src="./image/ions/green.png" alt="">
+                <div class="bannarRzBox" style="border: 0.125rem solid #00B050;">
+                    <img src="./image/ions/greenIcon.png" alt="">
                     通过ISO27001：2013信息安全认证
                 </div>
-                <div class="bannarRzBox" style="border: 0.125rem solid #00b0f0;">
-                    <img src="./image/ions/blue.png" alt="">
+                <div class="bannarRzBox" style="border: 0.125rem solid #3396FB;background: #3396FB19;">
+                    <img src="./image/ions/blueIcon.png" alt="">
                     通过ISO9001：2015质量体系认证
                 </div>
             </div>
-            <div class="bannarTilP">·提供最全面的项目工时统计解决方案·</div>
-            <!-- <a href="javascript:;" id="anqiye">
-                <img src="./image/qiyeweix.png" referrerpolicy="unsafe-url" alt="企业微信">
-            </a> -->
+            <div class="bannarTextList">
+                <ul>
+                    <li>提供最全面的项目工时统计解决方案</li>
+                    <li>满足小团队项目管理需求 / 大公司IPO财务分摊需求</li>
+                </ul>
+            </div>
             <a href="javascript:;" id="zhuce"><img src="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=register&c=white&s=large" srcset="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=register&c=white&s=large@2x 2x" referrerpolicy="unsafe-url" alt="企业微信"></a>
             <a href="javascript:;" id="anqiye"><img src="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=install&c=white&s=large" srcset="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=install&c=white&s=large@2x 2x" referrerpolicy="unsafe-url" alt="企业微信"></a>
             <div class="homeAdiv">

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/js/iframe.js

@@ -1,11 +1,14 @@
 const iframe = document.getElementById("headerIframe");
 let observer = null
 const backcolor = {
+  index: { background: '#fff', color: '#1C1C28', logo: './image/logos.jpg' },
   project: { background: '#F6FEF9', color: '#3C86DF', logo: './image/logos.jpg' },
   mobile: { background: 'none', color: '#000', logo: './image/logos.jpg' },
   about: { background: 'none', color: '#000', logo: './image/logos.jpg' },
   dynamic: { background: 'none', color: '#000', logo: './image/logos.jpg' },
-  customerNew: { background: '#fff', color: '#000', logo: './image/logos.jpg' }
+  customerNew: { background: '#fff', color: '#000', logo: './image/logos.jpg' },
+  knowledgeField: { background: '#fff', color: '#000', logo: './image/logos.jpg' },
+  noLinkAvailable: { background: '#fff', color: '#000', logo: './image/logos.jpg' }
 }
 
 function removeListener() {
@@ -15,7 +18,6 @@ function removeListener() {
 }
 function reinitIframe() {
   if (iframe) {
-      console.log('开始执行')
       const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
       const iframeBody = iframeDocument.body
       observer = new MutationObserver(function(mutationsList, observer) {
@@ -32,20 +34,22 @@ function handleScroll() {
   const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
   let imgElement = iframeDocument.getElementById('logo');
   let headerItems = iframeDocument.querySelectorAll('.header-item')
+  let headerView = iframeDocument.querySelector('.headerView')
   const urls = window.location.href
-  const filed = urls.match(/\/([^\/]+)\.html$/) && urls.match(/\/([^\/]+)\.html$/)[1];
+  const filed = urls.match(/\/([^\/]+)\.html$/) && urls.match(/\/([^\/]+)\.html$/)[1] || 'noLinkAvailable';
+  console.log(filed, '<==== filed')
   if(scrollYnma > 1) {
-    iframe.style.background = '#fff'
+    headerView.style.background = '#fff'
     imgElement.src = './image/logos.jpg'
-    iframe.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.2)';
+    headerView.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.2)';
     headerItems.forEach(function(item) {
       item.style.color = '#000'; // 设置你想要的字体颜色
     });
     return
   }
   console.log(backcolor[filed], filed)
-  iframe.style.background = (backcolor[filed] && backcolor[filed].background) || 'none'
-  iframe.style.boxShadow = '0 0 0 rgba(0, 0, 0, 0)';
+  headerView.style.background = (backcolor[filed] && backcolor[filed].background) || 'none'
+  headerView.style.boxShadow = '0 0 0 rgba(0, 0, 0, 0)';
   imgElement.src = (backcolor[filed] && backcolor[filed].logo) || './image/logos.png'
   headerItems.forEach(function(item) {
     item.style.color = (backcolor[filed] && backcolor[filed].color) || '#fff'; // 设置你想要的字体颜色

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/knowledge.ftl

@@ -0,0 +1,151 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta name="keywords"
+    content="工时管理，工时统计，工时填报，项目成本统计，生产工时管理系统，工时成本管理，工时管理软件，研发工时管理系统，企业工时管理系统，项目工时统计，项目工时统计软件，项目工时统计系统，工时统计系统，工时统计表" />
+  <meta name="description" content="工时管家提供专业的工时填报和统计报表。支持PC和手机端。可按项目，部门，岗位等多维度统计成本。" />
+  <title>工时管家-专注工时管理，手机移动填报，核算项目投入人力成本，企业IPO利器！</title>
+  <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext"
+    rel="stylesheet">
+  <link href="/css/bootstrap.css" rel="stylesheet">
+  <link href="/css/font-awesome.css" rel="stylesheet">
+  <link href="/css/swiper.css" rel="stylesheet">
+  <link href="/css/magnific-popup.css" rel="stylesheet">
+  <link href="/css/styles.css" rel="stylesheet">
+  <link href="/css/reset.css" rel="stylesheet">
+  <link href="/css/tongyong.css" rel="stylesheet" >
+  <link href="/css/knowledgeField.css" rel="stylesheet" >
+</head>
+
+<body>
+  <iframe id="headerIframe" src="/moduleView/header.html" class="iframeClass" onLoad="reinitIframe();"></iframe>
+  <div class="knowledgeFieldCon">
+    <div v-loading="detailsSwitchingLoading" class="wh100 flex">
+      <div class="knowledgeField">
+        <div class="knowledgeField-header">
+          <div class="knowledgeField-header-text">知识园地</div>
+          <div class="flex">
+            <input id="knowledgeInput" type="text" class="knowledgeInput" placeholder="请输入关键字搜索">
+            <button class="searchButton" onclick="search()">搜索</button>
+          </div>
+        </div>
+        <div class="flex1 knowledgeField-content">
+          <#list knowledgeFieldTableList as item>
+            <div>
+              <div class="knowledgeField-content-item">
+                <div class="image"><img src="data:image;base64,${item.baseImage}" class="wh100" class="wh100"></img>
+                </div>
+                <div class="textContent">
+                  <div>${ item.title }</div>
+                  <p>${ item.profile }</p>
+                  <button class="linkButton" onclick="learnMore(${item.id})">了解详情></button>
+                </div>
+              </div>
+              <div class="dividingLine"></div>
+            </div>
+          </#list>
+        </div>
+        <div class="knowledgeField-bottom flex-center">
+          <div class="pagination">
+            <button class="prev" onclick="goToPage(currentPage - 1)">上一页</button>
+            <ul id="page-list">
+              <!-- 动态生成页码 -->
+            </ul>
+            <button class="next" onclick="goToPage(currentPage + 1)">下一页</button>
+          </div>
+          <div class="flex-center">
+            到第
+            <input type="number" class="paginationInput" min="0" id="paginationInput">
+            页
+          </div>
+          <button onClick="confirmJump()" class="paginationButton">确定</button>
+        </div>
+      </div>
+    </div>
+  </div>
+</body>
+<script src="/js/js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
+<script src="/js/js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
+<script src="/js/js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
+<script src="/js/js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
+<script src="/js/js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
+<script src="/js/js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
+<script src="/js/js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
+<script src="/js/js/scripts.js"></script>
+<script src="/js/iframe.js"></script>
+
+<script>
+  // 获取当前页面的 URL 参数
+  const params = new URLSearchParams(window.location.search);
+
+  // 将参数转换为一个对象
+  const paramObj = {};
+  params.forEach((value, key) => {
+    paramObj[key] = value;
+  });
+
+  // 获取当前页面地址的参数
+  const { pageIndex = 1, pageSize = 10 } = params;
+
+  let total = ${total}
+  let totalPages = Math.ceil(total / pageSize); // 总页数
+  let currentSize = pageSize;
+  let currentPage = pageIndex; // 当前页
+  const knowledgeUrl = '/articleTemplate/pageList'
+  const knowledgeDetails = '/articleTemplate/articleDetail'
+  const fixedParameters = '?pageIndex=' + currentPage + '&pageSize=' + currentSize + '&info=' // 分页固定参数
+
+  function search() {
+    const inputVal = document.getElementById("knowledgeInput").value;
+    window.location.href = knowledgeUrl + fixedParameters + inputVal
+  }
+  function learnMore(id) {
+    window.location.href = knowledgeDetails + `?id=` + id
+  }
+  function confirmJump() {
+    let inputVal = document.getElementById("paginationInput").value;
+    if(inputVal <= 0) {
+      inputVal = 1
+    }
+    if(inputVal > totalPages) {
+      inputVal = totalPages
+    }
+    if(!inputVal) {
+      return
+    }
+    window.location.href = knowledgeUrl + '?pageIndex=' + inputVal + '&pageSize=' + currentSize
+  }
+
+  // 初始化分页组件
+  function initPagination() {
+    const pageList = document.getElementById('page-list');
+    pageList.innerHTML = ''; // 清空之前的页码
+
+    for (let i = 1; i <= totalPages; i++) {
+      const li = document.createElement('li');
+      li.textContent = i;
+      li.classList.toggle('active', i === currentPage); // 设置当前页的样式
+      li.onclick = () => goToPage(i);
+      pageList.appendChild(li);
+    }
+
+    // 更新按钮的禁用状态
+    document.querySelector('.prev').disabled = currentPage === 1;
+    document.querySelector('.next').disabled = currentPage === totalPages;
+  }
+
+  // 跳转到指定页面
+  function goToPage(page) {
+    window.location.href = knowledgeUrl + '?pageIndex=' + page + '&pageSize=' + currentSize
+  }
+
+  // 初始化分页
+  initPagination();
+</script>
+
+</html>

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/knowledgeDetails.ftl

@@ -0,0 +1,165 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta name="keywords"
+    content="工时管理，工时统计，工时填报，项目成本统计，生产工时管理系统，工时成本管理，工时管理软件，研发工时管理系统，企业工时管理系统，项目工时统计，项目工时统计软件，项目工时统计系统，工时统计系统，工时统计表" />
+  <meta name="description" content="工时管家提供专业的工时填报和统计报表。支持PC和手机端。可按项目，部门，岗位等多维度统计成本。" />
+  <title>工时管家-专注工时管理，手机移动填报，核算项目投入人力成本，企业IPO利器！</title>
+  <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext"
+    rel="stylesheet">
+  <link href="/css/bootstrap.css" rel="stylesheet">
+  <link href="/css/font-awesome.css" rel="stylesheet">
+  <link href="/css/swiper.css" rel="stylesheet">
+  <link href="/css/magnific-popup.css" rel="stylesheet">
+  <link href="/css/styles.css" rel="stylesheet">
+  <link href="/css/reset.css" rel="stylesheet" >
+  <link href="/css/tongyong.css" rel="stylesheet">
+  <link href="/css/knowledgeField.css" rel="stylesheet" >
+</head>
+
+<body>
+  <iframe id="headerIframe" src="/moduleView/header.html" class="iframeClass" onload="reinitIframe();"></iframe>
+  <div class="knowledgeFieldCon">
+    <div v-if="isItForDetails" class="knowledgeDetails">
+      <div class="returnIcon" id="returnIcon">
+        ◀
+      </div>
+      <div class="knowledgeDetails-left">
+        <div class="knowledgeDetails-left-title">${article.title}</div>
+        <div class="dividingLine"></div>
+        <div class="knowledgeDetails-left-con">
+          <div class="flex distribution">
+            <ul class="flex">
+              <li class="grey">标签：</li>
+              <#list categoryNameList as item>
+                <li class="blue">${item}</li>
+              </#list>
+            </ul>
+          </div>
+          <div class="flex-center distribution timeContent">
+            <p>发布时间</p>
+            <span>${ article.createTime }</span>
+          </div>
+          <div class="flex-center distribution readUse" style="justify-content: flex-end;">
+            <div class="text">推荐使用:</div>
+            <#if article?exists && article.productId?exists>
+              <#if article.productId == "1">
+                <div class="jumpToImg" id="imgClick">工时管家</div>
+              <#elseif article.productId == "2">
+                <div class="jumpToImg" id="imgClick">随访管家</div>
+              <#elseif article.productId == "3">
+                <div class="jumpToImg" id="imgClick">项目管家</div>
+              <#elseif article.productId == "4">
+                <div class="jumpToImg" id="imgClick">客户管家</div>
+              <#elseif article.productId == "5">
+                <div class="jumpToImg" id="imgClick">生产车间管家</div>
+              <#else>
+                <div class="jumpToImg">敬请期待</div>
+              </#if>
+            <#else>
+              <div class="jumpToImg">敬请期待</div>
+            </#if>
+
+          </div>
+        </div>
+        <div class="hypertextContent" id="hypertextContent">
+          ${ article.content }
+        </div>
+        <div class="knowledgeDetails-left-bottom flex-center"></div>
+      </div>
+      <div class="knowledgeDetails-right">
+        <div class="latestArticles">
+          <div class="knowledgeDetails-right-title">
+            <div>最新文章</div>
+            <buttom class="linkButton" onclick="toKnowledge()">查看更多></buttom>
+          </div>
+          <div class="line"></div>
+          <div class="latestList">
+            <#list latestList as item>
+              <div class="latestList-item" data-item='${item.id}'>
+                <div class="latestList-item-image">
+                  <img src="data:image;base64,${item.baseImage}" class="wh100"></img>
+                </div>
+                <div class="latestList-item-text">
+                  <div class="latestList-item-text-title">${ item.title }</div>
+                  <div class="data">${ item.createTime }</div>
+                </div>
+              </div>
+            </#list>
+          </div>
+        </div>
+        <div class="relatedRecommendations">
+          <div class="knowledgeDetails-right-title">
+            <div>相关推荐</div>
+            <buttom class="linkButton" onclick="toKnowledge()">查看更多></buttom>
+          </div>
+          <div class="line"></div>
+          <div class="latestList">
+            <#list relatedList as item>
+              <div class="latestList-item" data-item='${item.id}'>
+                <div class="latestList-item-image">
+                  <img src="data:image;base64,${item.baseImage}" class="wh100"></img>
+                </div>
+                <div class="latestList-item-text">
+                  <div class="latestList-item-text-title">${ item.title }</div>
+                  <div class="data">${item.createTime}</div>
+                </div>
+              </div>
+            </#list>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</body>
+<script src="/js/js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
+<script src="/js/js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
+<script src="/js/js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
+<script src="/js/js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
+<script src="/js/js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
+<script src="/js/js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
+<script src="/js/js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
+<script src="/js/js/scripts.js"></script>
+
+<script>
+  const knowledgeDetails = '/articleTemplate/articleDetail'
+  function toKnowledge() {
+    window.location.href = `/articleTemplate/pageList?pageIndex=1&pageSize=10`
+  }
+  $('#returnIcon').click(function () {
+    window.history.back()
+  })
+
+  $('#imgClick').click(function () {
+    const id = ${article.productId}
+    const jumpObject = {
+      '1': 'http://worktime.ttkuaiban.com/#/login',
+      '2': 'http://clinic.ttkuaiban.com/#/login',
+      '3': 'http://worktime.ttkuaiban.com/#/login',
+      '4': 'http://crm.ttkuaiban.com/login',
+      '5': 'http://workshop.ttkuaiban.com'
+    }
+    if (id) {
+      window.location.href = jumpObject[id]
+    }
+  })
+
+  document.addEventListener("DOMContentLoaded", function () {
+    const items = document.querySelectorAll('.latestList-item');
+    items.forEach(item => {
+      item.addEventListener('click', function () {
+        const itemData = item.getAttribute('data-item');
+        console.log('点击了', itemData)
+        window.location.href = knowledgeDetails + `?id=` + itemData
+      });
+    });
+  });
+</script>
+<script src="/js/iframe.js"></script>
+
+</html>

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/knowledgeField copy.html

@@ -0,0 +1,328 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta name="keywords"
+    content="工时管理，工时统计，工时填报，项目成本统计，生产工时管理系统，工时成本管理，工时管理软件，研发工时管理系统，企业工时管理系统，项目工时统计，项目工时统计软件，项目工时统计系统，工时统计系统，工时统计表" />
+  <meta name="description" content="工时管家提供专业的工时填报和统计报表。支持PC和手机端。可按项目，部门，岗位等多维度统计成本。" />
+  <title>工时管家-专注工时管理，手机移动填报，核算项目投入人力成本，企业IPO利器！</title>
+  <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext"
+    rel="stylesheet">
+  <link href="css/bootstrap.css" rel="stylesheet">
+  <link href="css/font-awesome.css" rel="stylesheet">
+  <link href="css/swiper.css" rel="stylesheet">
+  <link href="css/magnific-popup.css" rel="stylesheet">
+  <link href="css/styles.css" rel="stylesheet">
+  <link rel="stylesheet" href="css/reset.css">
+  <link rel="stylesheet" href="css/tongyong.css">
+  <link rel="stylesheet" href="css/knowledgeField.css">
+  <!-- 底部重写 -->
+  <link rel="stylesheet" href="css/bottom.css">
+
+  <link rel="stylesheet" href="./css/element-uiCss.css">
+  <script src="./js/vue.min.js"></script>
+  <script src="./js/element-ui.js"></script>
+</head>
+
+<body data-spy="scroll" data-target=".fixed-top">
+  <div class="spinner-wrapper">
+    <div class="spinner">
+      <div class="bounce1"></div>
+      <div class="bounce2"></div>
+      <div class="bounce3"></div>
+    </div>
+  </div>
+
+  <!-- 头部 -->
+  <iframe id="headerIframe" src="./moduleView/header.html" class="iframeClass" onLoad="reinitIframe();"></iframe>
+  <!-- 主体内容 -->
+  <div class="knowledgeFieldCon" id="app">
+    <div v-loading="detailsSwitchingLoading" class="wh100 flex">
+      <!-- 知识园地 -->
+      <div class="knowledgeField" v-if="!isItForDetails">
+        <div class="knowledgeField-header">
+          <div class="knowledgeField-header-text">知识园地</div>
+          <div class="flex">
+            <el-input placeholder="请输入内容" v-model.trim="info" size="small" class="elInput"
+              @keyup.enter="getKnowledgeFieldTable()">
+            </el-input>
+            <el-button type="primary" size="mini" @click="getKnowledgeFieldTable()">确定</el-button>
+          </div>
+        </div>
+        <div class="flex1 knowledgeField-content" v-loading="knowledgeFieldTableLoading">
+          <div v-for="(item,index) in knowledgeFieldTableList" :key="index">
+            <div class="knowledgeField-content-item">
+              <div class="image"><el-image :src="item.coverImg" class="wh100"></el-image></div>
+              <div class="textContent">
+                <div>{{ item.title }}</div>
+                <p>{{ item.profile }}</p>
+                <span @click="learnMore(item, true)">了解详情></span>
+              </div>
+            </div>
+            <el-divider v-if="index < knowledgeFieldTableList.length - 1"></el-divider>
+          </div>
+        </div>
+        <div class="knowledgeField-bottom flex-center">
+          <el-pagination background layout="total, prev, pager, next, sizes" :page-sizes="[4, 8, 12, 20]"
+            :page-size="pageSize" :current-page.sync="pageIndex" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange" :total="total">
+          </el-pagination>
+        </div>
+      </div>
+
+      <!-- 知识详情 -->
+      <div v-if="isItForDetails" class="knowledgeDetails">
+        <div class="returnIcon" @click="back()">
+          <i class="el-icon-arrow-left"></i>
+        </div>
+        <div class="knowledgeDetails-left">
+          <div class="knowledgeDetails-left-title">{{ articleDetails.title }}</div>
+          <el-divider></el-divider>
+          <div class="knowledgeDetails-left-con">
+            <div class="flex distribution">
+              <ul class="flex">
+                <li class="grey">标签：</li>
+                <li class="blue" v-for="(item, index) in articleDetails.categoryNamesList" :key="index">{{ item }}</li>
+              </ul>
+            </div>
+            <div class="flex-center distribution timeContent">
+              <p>发布时间</p>
+              <span>{{ articleDetails.createTime }}</span>
+            </div>
+            <div class="flex-center distribution readUse" style="justify-content: flex-end;">
+              <div class="text">推荐使用:</div>
+              <div><img src="./image/detailWork.png" alt=""></div>
+            </div>
+          </div>
+          <div class="hypertextContent" v-html="articleDetails.content">
+
+          </div>
+          <div class="knowledgeDetails-left-bottom flex-center"></div>
+        </div>
+        <div class="knowledgeDetails-right">
+          <div class="latestArticles">
+            <div class="knowledgeDetails-right-title">
+              <div>最新文章</div>
+              <span @click="learnMore({}, false, true)">查看更多></span>
+            </div>
+            <div class="line"></div>
+            <div class="latestList">
+              <div class="latestList-item" v-for="(item, index) in latestArticles" :key="index"
+                @click="detailsJump(item)">
+                <div class="latestList-item-image">
+                  <el-image :src="item.coverImg" class="wh100"></el-image>
+                </div>
+                <div class="latestList-item-text">
+                  <div class="latestList-item-text-title">{{ item.title }}</div>
+                  <div class="data">{{ item.createTime }}</div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="relatedRecommendations">
+            <div class="knowledgeDetails-right-title">
+              <div>相关推荐</div>
+              <span @click="learnMore({}, false, true)">查看更多></span>
+            </div>
+            <div class="line"></div>
+            <div class="latestList">
+              <div class="latestList-item" v-for="(item, index) in relatedRecommendations" :key="index"
+                @click="detailsJump(item)">
+                <div class="latestList-item-image">
+                  <el-image :src="item.coverImg" class="wh100"></el-image>
+                </div>
+                <div class="latestList-item-text">
+                  <div class="latestList-item-text-title">{{ item.title }}</div>
+                  <div class="data">{{ item.createTime }}</div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Scripts -->
+  <script src="js/js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
+  <script src="js/js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
+  <script src="js/js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
+  <script src="js/js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
+  <script src="js/js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
+  <script src="js/js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
+  <script src="js/js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
+  <script src="js/js/scripts.js"></script>
+  <script>
+    new Vue({
+      el: "#app",
+      data: {
+        info: '',
+        pageIndex: 1,
+        pageSize: 4,
+        total: 0,
+        // requestPrefix: 'http://192.168.2.17:8080',
+        requestPrefix: 'http://47.101.180.183:9049',
+        // requestPrefix: '',
+        knowledgeFieldTableList: [],
+        latestArticles: [],
+        relatedRecommendations: [],
+        detailRow: {},
+        articleDetails: {},
+        isItForDetails: false,
+        knowledgeFieldTableLoading: false,
+        detailsSwitchingLoading: false,
+      },
+      methods: {
+        getArticleDetails() {
+          const url = `${this.requestPrefix}/article/getArticleById`
+          const params = { id: this.detailRow.id }
+          this.httpRequest(this.addQueryParams(url, params)).then(res => {
+            const row = {
+              ...res.data,
+              categoryNamesList: res.data.categoryNames ? res.data.categoryNames.split(',') : []
+            };
+            this.articleDetails = row
+          })
+        },
+        getLatestArticles() {
+          const url = `${this.requestPrefix}/article/latestList`;
+          const params = { id: this.detailRow.id }
+          this.httpRequest(this.addQueryParams(url, params)).then(res => {
+            this.latestArticles = res.data.map(item => {
+              if(item.coverImg) {
+                item.coverImg = `data:image/jpeg;base64, ${item.coverImg}`
+              }
+              return { ...item }
+            })
+          })
+        },
+        getRelatedRecommendations() {
+          const url = `${this.requestPrefix}/article/relatedList`
+          const params = { id: this.detailRow.id }
+          this.httpRequest(this.addQueryParams(url, params)).then(res => {
+            this.relatedRecommendations = res.data.map(item => {
+              if(item.coverImg) {
+                item.coverImg = `data:image/jpeg;base64, ${item.coverImg}`
+              }
+              return { ...item }
+            })
+          })
+        },
+        getKnowledgeFieldTable() {
+          const url = `${this.requestPrefix}/article/pageList`
+          const params = { pageIndex: this.pageIndex, pageSize: this.pageSize, info: this.info }
+          this.knowledgeFieldTableLoading = true
+          this.httpRequest(this.addQueryParams(url, params)).then(res => {
+            const { total = 0, data = [] } = res
+            data.forEach(item => {
+              if(item.coverImg) {
+                item.coverImg = `data:image/jpeg;base64, ${item.coverImg}`
+              }
+            })
+            this.total = total
+            this.knowledgeFieldTableList = [...data]
+          }).finally(() => {
+            this.knowledgeFieldTableLoading = false
+          }).catch(err => {
+            console.log(err, '<==== 请求失败')
+          })
+        },
+        back() {
+          this.detailRow = {}
+          this.detailsSwitchingLoading = true
+          setTimeout(() => {
+            this.isItForDetails = false
+          }, 500)
+          setTimeout(() => {
+            this.detailsSwitchingLoading = false
+          }, 1000)
+        },
+        detailsJump(item) {
+          this.detailRow = item
+          this.detailsSwitchingLoading = true
+          this.getArticleDetails()
+          this.getLatestArticles()
+          this.getRelatedRecommendations()
+          setTimeout(() => {
+            this.detailsSwitchingLoading = false
+          }, 1000)
+        },
+        learnMore(item, flag = false, reset = false) {
+          this.detailRow = item
+          this.detailsSwitchingLoading = true
+          if (reset) {
+            this.pageIndex = 1
+            this.pageSize = 4
+            this.info = ''
+            this.getKnowledgeFieldTable()
+          }
+          if (flag) {
+            this.getArticleDetails()
+            this.getLatestArticles()
+            this.getRelatedRecommendations()
+          }
+          setTimeout(() => {
+            this.isItForDetails = flag
+          }, 500)
+          setTimeout(() => {
+            this.detailsSwitchingLoading = false
+          }, 1000)
+        },
+        handleSizeChange(val) {
+          this.pageIndex = 1
+          this.pageSize = val
+          this.getKnowledgeFieldTable()
+        },
+        handleCurrentChange(val) {
+          this.pageIndex = val
+          this.getKnowledgeFieldTable()
+        },
+        // 封装请求接口
+        httpRequest(url, options = {}, method = 'GET') {
+          // 默认配置
+          const defaultOptions = {
+            method,
+            headers: {
+              'Content-Type': 'application/json',
+            },
+            body: null,
+          };
+
+          const requestOptions = { ...defaultOptions, ...options };
+
+          if (requestOptions.body && typeof requestOptions.body !== 'string') {
+            requestOptions.body = JSON.stringify(requestOptions.body);
+          }
+          return fetch(url, requestOptions)
+            .then(response => {
+              if (!response.ok) {
+                throw new Error(`HTTP错误: ${response.status}`);
+              }
+              return response.json();
+            })
+            .catch(error => {
+              console.error('请求失败:', error);
+              throw error;
+            });
+        },
+        addQueryParams(url, params) {
+          const urlWithParams = new URL(url);
+          Object.keys(params).forEach(key => {
+            urlWithParams.searchParams.append(key, params[key]);
+          });
+          return urlWithParams.toString();
+        }
+      },
+      mounted: function () {
+        this.getKnowledgeFieldTable()
+      }
+    })
+  </script>
+  <script src="js/iframe.js"></script>
+</body>
+
+</html>

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/knowledgeField.html

@@ -0,0 +1,328 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+  <meta name="keywords"
+    content="工时管理，工时统计，工时填报，项目成本统计，生产工时管理系统，工时成本管理，工时管理软件，研发工时管理系统，企业工时管理系统，项目工时统计，项目工时统计软件，项目工时统计系统，工时统计系统，工时统计表" />
+  <meta name="description" content="工时管家提供专业的工时填报和统计报表。支持PC和手机端。可按项目，部门，岗位等多维度统计成本。" />
+  <title>工时管家-专注工时管理，手机移动填报，核算项目投入人力成本，企业IPO利器！</title>
+  <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext"
+    rel="stylesheet">
+  <link href="css/bootstrap.css" rel="stylesheet">
+  <link href="css/font-awesome.css" rel="stylesheet">
+  <link href="css/swiper.css" rel="stylesheet">
+  <link href="css/magnific-popup.css" rel="stylesheet">
+  <link href="css/styles.css" rel="stylesheet">
+  <link rel="stylesheet" href="css/reset.css">
+  <link rel="stylesheet" href="css/tongyong.css">
+  <link rel="stylesheet" href="css/knowledgeField.css">
+  <!-- 底部重写 -->
+  <link rel="stylesheet" href="css/bottom.css">
+
+  <link rel="stylesheet" href="./css/element-uiCss.css">
+  <script src="./js/vue.min.js"></script>
+  <script src="./js/element-ui.js"></script>
+</head>
+
+<body data-spy="scroll" data-target=".fixed-top">
+  <div class="spinner-wrapper">
+    <div class="spinner">
+      <div class="bounce1"></div>
+      <div class="bounce2"></div>
+      <div class="bounce3"></div>
+    </div>
+  </div>
+
+  <!-- 头部 -->
+  <iframe id="headerIframe" src="./moduleView/header.html" class="iframeClass" onLoad="reinitIframe();"></iframe>
+  <!-- 主体内容 -->
+  <div class="knowledgeFieldCon" id="app">
+    <div v-loading="detailsSwitchingLoading" class="wh100 flex">
+      <!-- 知识园地 -->
+      <div class="knowledgeField" v-if="!isItForDetails">
+        <div class="knowledgeField-header">
+          <div class="knowledgeField-header-text">知识园地</div>
+          <div class="flex">
+            <el-input placeholder="请输入内容" v-model.trim="info" size="small" class="elInput"
+              @keyup.enter="getKnowledgeFieldTable()">
+            </el-input>
+            <el-button type="primary" size="mini" @click="getKnowledgeFieldTable()">确定</el-button>
+          </div>
+        </div>
+        <div class="flex1 knowledgeField-content" v-loading="knowledgeFieldTableLoading">
+          <div v-for="(item,index) in knowledgeFieldTableList" :key="index">
+            <div class="knowledgeField-content-item">
+              <div class="image"><el-image :src="item.coverImg" class="wh100"></el-image></div>
+              <div class="textContent">
+                <div>{{ item.title }}</div>
+                <p>{{ item.profile }}</p>
+                <span @click="learnMore(item, true)">了解详情></span>
+              </div>
+            </div>
+            <el-divider v-if="index < knowledgeFieldTableList.length - 1"></el-divider>
+          </div>
+        </div>
+        <div class="knowledgeField-bottom flex-center">
+          <el-pagination background layout="total, prev, pager, next, sizes" :page-sizes="[4, 8, 12, 20]"
+            :page-size="pageSize" :current-page.sync="pageIndex" @size-change="handleSizeChange"
+            @current-change="handleCurrentChange" :total="total">
+          </el-pagination>
+        </div>
+      </div>
+
+      <!-- 知识详情 -->
+      <div v-if="isItForDetails" class="knowledgeDetails">
+        <div class="returnIcon" @click="back()">
+          <i class="el-icon-arrow-left"></i>
+        </div>
+        <div class="knowledgeDetails-left">
+          <div class="knowledgeDetails-left-title">{{ articleDetails.title }}</div>
+          <el-divider></el-divider>
+          <div class="knowledgeDetails-left-con">
+            <div class="flex distribution">
+              <ul class="flex">
+                <li class="grey">标签：</li>
+                <li class="blue" v-for="(item, index) in articleDetails.categoryNamesList" :key="index">{{ item }}</li>
+              </ul>
+            </div>
+            <div class="flex-center distribution timeContent">
+              <p>发布时间</p>
+              <span>{{ articleDetails.createTime }}</span>
+            </div>
+            <div class="flex-center distribution readUse" style="justify-content: flex-end;">
+              <div class="text">推荐使用:</div>
+              <div><img src="./image/detailWork.png" alt=""></div>
+            </div>
+          </div>
+          <div class="hypertextContent" v-html="articleDetails.content">
+
+          </div>
+          <div class="knowledgeDetails-left-bottom flex-center"></div>
+        </div>
+        <div class="knowledgeDetails-right">
+          <div class="latestArticles">
+            <div class="knowledgeDetails-right-title">
+              <div>最新文章</div>
+              <span @click="learnMore({}, false, true)">查看更多></span>
+            </div>
+            <div class="line"></div>
+            <div class="latestList">
+              <div class="latestList-item" v-for="(item, index) in latestArticles" :key="index"
+                @click="detailsJump(item)">
+                <div class="latestList-item-image">
+                  <el-image :src="item.coverImg" class="wh100"></el-image>
+                </div>
+                <div class="latestList-item-text">
+                  <div class="latestList-item-text-title">{{ item.title }}</div>
+                  <div class="data">{{ item.createTime }}</div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="relatedRecommendations">
+            <div class="knowledgeDetails-right-title">
+              <div>相关推荐</div>
+              <span @click="learnMore({}, false, true)">查看更多></span>
+            </div>
+            <div class="line"></div>
+            <div class="latestList">
+              <div class="latestList-item" v-for="(item, index) in relatedRecommendations" :key="index"
+                @click="detailsJump(item)">
+                <div class="latestList-item-image">
+                  <el-image :src="item.coverImg" class="wh100"></el-image>
+                </div>
+                <div class="latestList-item-text">
+                  <div class="latestList-item-text-title">{{ item.title }}</div>
+                  <div class="data">{{ item.createTime }}</div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Scripts -->
+  <script src="js/js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
+  <script src="js/js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
+  <script src="js/js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
+  <script src="js/js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
+  <script src="js/js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
+  <script src="js/js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
+  <script src="js/js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
+  <script src="js/js/scripts.js"></script>
+  <script>
+    new Vue({
+      el: "#app",
+      data: {
+        info: '',
+        pageIndex: 1,
+        pageSize: 4,
+        total: 0,
+        // requestPrefix: 'http://192.168.2.17:8080',
+        requestPrefix: 'http://47.101.180.183:9049',
+        // requestPrefix: '',
+        knowledgeFieldTableList: [],
+        latestArticles: [],
+        relatedRecommendations: [],
+        detailRow: {},
+        articleDetails: {},
+        isItForDetails: false,
+        knowledgeFieldTableLoading: false,
+        detailsSwitchingLoading: false,
+      },
+      methods: {
+        getArticleDetails() {
+          const url = `${this.requestPrefix}/article/getArticleById`
+          const params = { id: this.detailRow.id }
+          this.httpRequest(this.addQueryParams(url, params)).then(res => {
+            const row = {
+              ...res.data,
+              categoryNamesList: res.data.categoryNames ? res.data.categoryNames.split(',') : []
+            };
+            this.articleDetails = row
+          })
+        },
+        getLatestArticles() {
+          const url = `${this.requestPrefix}/article/latestList`;
+          const params = { id: this.detailRow.id }
+          this.httpRequest(this.addQueryParams(url, params)).then(res => {
+            this.latestArticles = res.data.map(item => {
+              if(item.coverImg) {
+                item.coverImg = `data:image/jpeg;base64, ${item.coverImg}`
+              }
+              return { ...item }
+            })
+          })
+        },
+        getRelatedRecommendations() {
+          const url = `${this.requestPrefix}/article/relatedList`
+          const params = { id: this.detailRow.id }
+          this.httpRequest(this.addQueryParams(url, params)).then(res => {
+            this.relatedRecommendations = res.data.map(item => {
+              if(item.coverImg) {
+                item.coverImg = `data:image/jpeg;base64, ${item.coverImg}`
+              }
+              return { ...item }
+            })
+          })
+        },
+        getKnowledgeFieldTable() {
+          const url = `${this.requestPrefix}/article/pageList`
+          const params = { pageIndex: this.pageIndex, pageSize: this.pageSize, info: this.info }
+          this.knowledgeFieldTableLoading = true
+          this.httpRequest(this.addQueryParams(url, params)).then(res => {
+            const { total = 0, data = [] } = res
+            data.forEach(item => {
+              if(item.coverImg) {
+                item.coverImg = `data:image/jpeg;base64, ${item.coverImg}`
+              }
+            })
+            this.total = total
+            this.knowledgeFieldTableList = [...data]
+          }).finally(() => {
+            this.knowledgeFieldTableLoading = false
+          }).catch(err => {
+            console.log(err, '<==== 请求失败')
+          })
+        },
+        back() {
+          this.detailRow = {}
+          this.detailsSwitchingLoading = true
+          setTimeout(() => {
+            this.isItForDetails = false
+          }, 500)
+          setTimeout(() => {
+            this.detailsSwitchingLoading = false
+          }, 1000)
+        },
+        detailsJump(item) {
+          this.detailRow = item
+          this.detailsSwitchingLoading = true
+          this.getArticleDetails()
+          this.getLatestArticles()
+          this.getRelatedRecommendations()
+          setTimeout(() => {
+            this.detailsSwitchingLoading = false
+          }, 1000)
+        },
+        learnMore(item, flag = false, reset = false) {
+          this.detailRow = item
+          this.detailsSwitchingLoading = true
+          if (reset) {
+            this.pageIndex = 1
+            this.pageSize = 4
+            this.info = ''
+            this.getKnowledgeFieldTable()
+          }
+          if (flag) {
+            this.getArticleDetails()
+            this.getLatestArticles()
+            this.getRelatedRecommendations()
+          }
+          setTimeout(() => {
+            this.isItForDetails = flag
+          }, 500)
+          setTimeout(() => {
+            this.detailsSwitchingLoading = false
+          }, 1000)
+        },
+        handleSizeChange(val) {
+          this.pageIndex = 1
+          this.pageSize = val
+          this.getKnowledgeFieldTable()
+        },
+        handleCurrentChange(val) {
+          this.pageIndex = val
+          this.getKnowledgeFieldTable()
+        },
+        // 封装请求接口
+        httpRequest(url, options = {}, method = 'GET') {
+          // 默认配置
+          const defaultOptions = {
+            method,
+            headers: {
+              'Content-Type': 'application/json',
+            },
+            body: null,
+          };
+
+          const requestOptions = { ...defaultOptions, ...options };
+
+          if (requestOptions.body && typeof requestOptions.body !== 'string') {
+            requestOptions.body = JSON.stringify(requestOptions.body);
+          }
+          return fetch(url, requestOptions)
+            .then(response => {
+              if (!response.ok) {
+                throw new Error(`HTTP错误: ${response.status}`);
+              }
+              return response.json();
+            })
+            .catch(error => {
+              console.error('请求失败:', error);
+              throw error;
+            });
+        },
+        addQueryParams(url, params) {
+          const urlWithParams = new URL(url);
+          Object.keys(params).forEach(key => {
+            urlWithParams.searchParams.append(key, params[key]);
+          });
+          return urlWithParams.toString();
+        }
+      },
+      mounted: function () {
+        this.getKnowledgeFieldTable()
+      }
+    })
+  </script>
+  <script src="js/iframe.js"></script>
+</body>
+
+</html>

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/moduleView/css/header.css

@@ -2,8 +2,8 @@
   width: 100%;
 }
 .headerView {
-  width: 101.25rem;
-  height: 5rem;
+  padding: 0 6.25rem;
+  height: 4.5rem;
   margin: auto;
   display: flex;
   align-items: center;
@@ -19,6 +19,7 @@
 .headerView .headerView-left .header-logo,
 .headerView .headerView-right .header-logo {
   width: 6.875rem;
+  padding-right: 5.625rem;
 }
 .headerView .headerView-left .header-list,
 .headerView .headerView-right .header-list {
@@ -29,8 +30,8 @@
 }
 .headerView .headerView-left .header-list .header-item,
 .headerView .headerView-right .header-list .header-item {
-  margin-right: 2rem;
-  font-size: 1.125rem;
+  margin-right: 3.75rem;
+  font-size: 1rem;
   height: 100%;
   display: flex;
   align-items: center;
@@ -42,14 +43,24 @@
   display: flex;
   align-items: center;
   height: 3.5rem;
+  border-bottom: 0.0125rem solid rgba(0, 0, 0, 0);
 }
 .headerView .headerView-left .header-list .header-item::last-child,
 .headerView .headerView-right .header-list .header-item::last-child {
   margin-right: 0;
 }
+.headerView .headerView-left .header-list .productRectangle span,
+.headerView .headerView-right .header-list .productRectangle span {
+  display: block;
+  display: flex;
+  align-items: center;
+  height: 3.5rem;
+  border-bottom: 0.0125rem solid rgba(0, 0, 0, 0);
+}
 .headerView .headerView-left .header-list .item-hover,
 .headerView .headerView-right .header-list .item-hover {
-  border-bottom: 0.125rem solid #37b8ff;
+  color: #3396FB;
+  border-bottom: 0.125rem solid #3396FB !important;
 }
 .headerView .headerView-left .header-list a,
 .headerView .headerView-right .header-list a {
@@ -63,39 +74,54 @@
   height: 100%;
 }
 .headerProduct {
-  width: 100%;
+  width: 16.5rem;
   padding-bottom: 20px;
-  border-top: 0.0625rem solid #dcdfe6;
   background: #fff;
+  border: 1px solid #FFFFFF;
+  box-shadow: 0px 0px 20px 0px #00000019;
+  position: relative;
+  left: 320px;
 }
 .headerProduct .content {
-  width: 100rem;
-  display: flex;
-  margin: auto;
+  width: 100%;
 }
 .headerProduct .content .product {
-  width: 48%;
+  width: 100%;
   font-size: 1.125rem;
 }
 .headerProduct .content .product .product-title {
-  display: flex;
-  padding: 1.25rem 0 0.9375rem 1rem;
-  align-items: center;
-  border-bottom: 0.0625rem solid #dcdfe6;
+  color: #3396FB;
+  font-family: Microsoft YaHei UI;
+  font-weight: bold;
+  font-size: 1rem;
+  line-height: normal;
+  letter-spacing: 0px;
+  padding: 1rem 0 1.125rem 1.125rem;
 }
 .headerProduct .content .product .hove {
-  background: #f0f4ff;
-  color: #3370ff;
+  background: #3396FB;
+  color: #fff;
 }
 .headerProduct .content .product .product-item {
-  margin-top: 0.625rem;
-  width: 7.5rem;
-  padding: 0.625rem 1.25rem;
-  border-radius: 0.25rem;
+  width: 100%;
+  height: 2.625rem;
+  display: flex;
+  align-items: center;
+  font-size: 1rem;
+  padding-left: 1.375rem;
+  box-sizing: border-box;
+}
+.headerProduct .content .product .product-item img {
+  width: 1.25rem;
+  height: 1.25rem;
+  padding-right: 0.625rem;
 }
 .headerProduct .content .product .product-item a {
   display: block;
+  width: 100%;
   height: 100%;
+  display: flex;
+  align-items: center;
   color: inherit;
   text-decoration: none;
 }

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/moduleView/css/header.less

@@ -2,8 +2,8 @@
   width: 100%;
 }
 .headerView {
-  width: 101.25rem;
-  height: 5rem;
+  padding: 0 6.25rem;
+  height: 4.5rem;
   margin: auto;
   display: flex;
   align-items: center;
@@ -16,6 +16,7 @@
     height: 100%;
     .header-logo {
       width: 6.875rem;
+      padding-right: 5.625rem;
     }
     .header-list {
       display: flex;
@@ -23,8 +24,8 @@
       height: 100%;
       margin-left: 2rem;
       .header-item {
-        margin-right: 2rem;
-        font-size: 1.125rem;
+        margin-right: 3.75rem;
+        font-size: 1rem;
         height: 100%;
         display: flex;
         align-items: center;
@@ -34,14 +35,26 @@
           display: flex;
           align-items: center;
           height: 3.5rem;
+          border-bottom: .0125rem solid rgba(0, 0, 0, 0);
         }
         &::last-child {
           margin-right: 0;
         }
       }
 
+      .productRectangle {
+        span {
+          display: block;
+          display: flex;
+          align-items: center;
+          height: 3.5rem;
+          border-bottom: .0125rem solid rgba(0, 0, 0, 0);
+        }
+      }
+
       .item-hover {
-        border-bottom: 0.125rem solid #37b8ff;
+        color: #3396FB;
+        border-bottom: 0.125rem solid #3396FB !important;
       }
 
       a {
@@ -60,36 +73,52 @@
 }
 
 .headerProduct {
-  width: 100%;
+  width: 16.5rem;
   padding-bottom: 20px;
-  border-top: 0.0625rem solid #dcdfe6;
   background: #fff;
+  border: 1px solid #FFFFFF;
+  box-shadow: 0px 0px 20px 0px #00000019;
+  position: relative;
+  left: 320px;
   .content {
-    width: 100rem;
-    display: flex;
-    margin: auto;
+    width: 100%;
     .product {
-      width: 48%;
+      width: 100%;
       font-size: 1.125rem;
       .product-title {
-        display: flex;
-        padding: 1.25rem 0 0.9375rem 1rem;
-        align-items: center;
-        border-bottom: 0.0625rem solid #dcdfe6;
+        color: #3396FB;
+        font-family: Microsoft YaHei UI;
+        font-weight: bold;
+        font-size: 1rem;
+        line-height: normal;
+        letter-spacing: 0px;
+        padding: 1rem 0 1.125rem 1.125rem;
       }
       .hove {
-        background: #f0f4ff;
-        color: #3370ff;
+        background: #3396FB;
+        color: #fff;
       }
       .product-item {
-        margin-top: 0.625rem;
-        width: 7.5rem;
-        padding: 0.625rem 1.25rem;
-        border-radius: 0.25rem;
+        width: 100%;
+        height: 2.625rem;
+        display: flex;
+        align-items: center;
+        font-size: 1rem;
+        padding-left: 1.375rem;
+        box-sizing: border-box;
+
+        img {
+          width: 1.25rem;
+          height: 1.25rem;
+          padding-right: .625rem;
+        }
 
         a {
           display: block;
+          width: 100%;
           height: 100%;
+          display: flex;
+          align-items: center;
           color: inherit;
           text-decoration: none;
         }

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/static/moduleView/header.html

@@ -20,7 +20,7 @@
           <!-- <img src="./image/logo.png" class="img" alt=""> -->
         </div>
         <div class="header-list" @mouseleave="mouseleave('left')">
-          <div class="header-item" @mouseenter="mouseenter('product', true)" @mouseleave="mouseleave('product')">产品矩阵</div>
+          <div class="header-item productRectangle" @mouseenter="mouseenter('product', true)" @mouseleave="mouseleave('product')"><span :class="`${ productFlag && 'item-hover' }`">产品矩阵</span></div>
           <div v-for="(item, index) in leftItemList" :key="index" @mouseenter="mouseenter('left', index)" :class="`${item.class}`">
             <a :href="item.value" target="_top" :class="`${ leftItemIndex == index ? 'item-hover' : '' }`"> {{ item.label }} </a>
           </div>
@@ -44,6 +44,7 @@
           <div class="product-title">火石企业办公套件</div>
           <div class="product-list" @mouseleave="mouseleave('other')">
             <div :class="`product-item ${otherItemIndex == index ? 'hove' : ''}`" v-for="(item, index) in otherList" :key="index" @click="toPath(item)" @mouseenter="mouseenter('other', index)">
+              <img :src="otherItemIndex == index ? item.hoverIcon : item.icon" alt="">
               <a :href="item.path" target="_top">{{ item.label }}</a>
             </div>
           </div>
@@ -63,18 +64,19 @@
           productTimer: null,
           leftItemList: [
             { label: '客户评价', value: '../index.html#customer', class: 'header-item' },
-            { label: '手机版', value: '../mobile.html', class: 'header-item' },
+            { label: '手机版222', value: '../mobile.html', class: 'header-item' },
             { label: '产品定价', value: '../index.html#pricing', class: 'header-item' },
             { label: '关于我们', value: '../about.html', class: 'header-item' },
             { label: '企业动态', value: '../dynamic.html', class: 'header-item' },
+            { label: '知识园地', value: '/articleTemplate/pageList?pageIndex=1&pageSize=10', class: 'header-item' },
           ],
           otherList: [
-            { label: '工时管家', path: '../index.html' },
-            { label: '随访管家', path: '../followup.html' },
-            { label: '项目管家', path: '../project.html' },
-            { label: '客户管家', path: '../customerNew.html' },
-            { label: '生产车间管家', path: '../workshop.html' },
-          ],
+            { label: '工时管家', path: '../index.html', icon: './image/icon/client.png', hoverIcon: './image/icon/workHourHover.png' },
+            { label: '随访管家', path: '../followup.html', icon: './image/icon/client.png', hoverIcon: './image/icon/workHourHover.png' },
+            { label: '项目管家', path: '../project.html', icon: './image/icon/project.png', hoverIcon: './image/icon/workHourHover.png' },
+            { label: '客户管家', path: '../customerNew.html', icon: './image/icon/follow.png', hoverIcon: './image/icon/workHourHover.png' },
+            { label: '生产车间管家', path: '../workshop.html', icon: './image/icon/production.png', hoverIcon: './image/icon/workHourHover.png' },
+         ],
           showRight: true,
           urlFiled: 'index',
           rightCilckUrl: {

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/about.html

@@ -0,0 +1,130 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <meta name="keywords"
+        content="工时管理，工时统计，工时填报，项目成本统计，生产工时管理系统，工时成本管理，工时管理软件，研发工时管理系统，企业工时管理系统，项目工时统计，项目工时统计软件，项目工时统计系统，工时统计系统，工时统计表" />
+    <meta name="description" content="工时管家提供专业的工时填报和统计报表。支持PC和手机端。可按项目，部门，岗位等多维度统计成本。" />
+    <title>工时管家-专注工时管理，手机移动填报，核算项目投入人力成本，企业IPO利器！</title>
+    <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
+    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700&display=swap&subset=latin-ext"
+        rel="stylesheet">
+    <link href="css/bootstrap.css" rel="stylesheet">
+    <!-- <link href="css/fontawesome-all.css" rel="stylesheet"> -->
+    <link href="css/font-awesome.css" rel="stylesheet">
+    <link href="css/swiper.css" rel="stylesheet">
+    <link href="css/magnific-popup.css" rel="stylesheet">
+    <link href="css/styles.css" rel="stylesheet">
+    <link rel="icon" href="images/favicon.png">
+    <link rel="stylesheet" href="css/reset.css">
+    <link rel="stylesheet" href="css/tongyong.css">
+    <!-- 底部重写 -->
+    <link rel="stylesheet" href="css/bottom.css">
+    <script type="text/javascript"
+        src="http://api.map.baidu.com/api?v=3.0&ak=IHxdPMrTZDs915Ohej7C3ItcPWZcMjDn"></script>
+    <script>
+        var _hmt = _hmt || [];
+        (function () {
+            var hm = document.createElement("script");
+            hm.src = "https://hm.baidu.com/hm.js?db6f9072933f13477e2679fb672a8761";
+            var s = document.getElementsByTagName("script")[0];
+            s.parentNode.insertBefore(hm, s);
+        })();
+    </script>
+</head>
+
+<body data-spy="scroll" data-target=".fixed-top">
+    <div class="spinner-wrapper">
+        <div class="spinner">
+            <div class="bounce1"></div>
+            <div class="bounce2"></div>
+            <div class="bounce3"></div>
+        </div>
+    </div>
+    <!-- 头部 -->
+    <iframe id="headerIframe" src="./moduleView/header.html" class="iframeClass" onLoad="reinitIframe();"></iframe>
+
+    <div id="details1" class="basic-1" style="padding-bottom: 0;">
+        <div class="container">
+            <div class="row">
+                <div class="col-lg-6">
+                    <div class="image-container">
+                        <img class="img-fluid" src="images/place.jpg" alt="alternative">
+                    </div>
+                </div>
+                <div class="col-lg-6">
+                    <div class="text-container">
+                        <h2>公司介绍</h2>
+                        <p>
+                            南京火石闪信网络科技有限公司成立于2016年，坐落于六朝古都南京，是一家专注于企业办公和管理领域的国家高新技术企业。我们致力于通过互联网思维帮助企业完成数字化转型，为企业提高了工作效率，降低运营成本。
+                            <br>
+                            我们自主研发了云团队研发管理平台，快办团队协作管理软件和工时管家系统。使用客户遍布全国，软件获得了广泛好评。公司一直在技术方向不断积累和创新，获得了16项软著，3项专利。
+                            <br>
+                            南京火石闪信秉承“热情服务，卓越创新”的精神，不断完善产品和服务，为客户创造价值。
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div id="us_content_cetificate">
+        <div class="container">
+            <div class="row">
+                <h2>资质证书</h2>
+                <div class="cetificate_gallery" style="margin-top:10px;">
+                    <div><img alt="资质证书" src="images/gaoxin.jpg" /></div>
+                    <div><img alt="资质证书" src="images/smy.jpg" /></div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <div id="details" class="basic-1">
+        <div class="container">
+            <div class="row">
+                <div class="col-lg-6">
+                    <div class="text-container" style="text-align: left;">
+                        <h2>联系我们</h2>
+                        <p>
+                            邮编：211001<br>
+                            地址：南京市江宁区秣周东路12号未来网络小镇4号楼U403室<br>
+                            联系电话：15895914665<br>
+                            邮箱：quyueting@huoshishanxin.com<br>
+                            QQ: 3052894409<br>
+                        </p>
+                    </div>
+                </div>
+                <div class="col-lg-6">
+                    <div id="container">
+
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- 底部 -->
+    <iframe id="bottomIframe" src="./moduleView/bottom.html" class="resetIframe resetIframebtn"></iframe>
+
+    <!-- Scripts -->
+    <script src="js/js/jquery.min.js"></script> <!-- jQuery for Bootstrap's JavaScript plugins -->
+    <script src="js/js/popper.min.js"></script> <!-- Popper tooltip library for Bootstrap -->
+    <script src="js/js/bootstrap.min.js"></script> <!-- Bootstrap framework -->
+    <script src="js/js/jquery.easing.min.js"></script> <!-- jQuery Easing for smooth scrolling between anchors -->
+    <script src="js/js/swiper.min.js"></script> <!-- Swiper for image and text sliders -->
+    <script src="js/js/jquery.magnific-popup.js"></script> <!-- Magnific Popup for lightboxes -->
+    <script src="js/js/validator.min.js"></script> <!-- Validator.js - Bootstrap plugin that validates forms -->
+    <script src="js/js/scripts.js"></script> <!-- Custom scripts -->
+    <script src="js/iframe.js"></script>
+    <script type="text/javascript">
+        var map = new BMap.Map("container");
+        map.centerAndZoom(new BMap.Point(118.834423, 31.874552), 15);
+        map.addOverlay(new BMap.Marker(new BMap.Point(118.834423, 31.874552)));
+        map.addControl(new BMap.NavigationControl());
+    </script>
+</body>
+
+</html>

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/articleList.ftl

@@ -1,23 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <title>文章</title>
-</head>
-<body>
-<table border="1">
-    <tr>
-        <td>编号</td>
-        <td>文章标题</td>
-        <td>文章内容</td>
-    </tr>
-    <#list articles as item>
-        <tr>
-            <td>${item.id}</td>
-            <td>${item.title}</td>
-            <td>${item.content}</td>
-        </tr>
-    </#list>
-</table>
-</body>
-</html>

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/bottom.css

@@ -0,0 +1,64 @@
+/* 底部重写 */
+.indexBottom {
+    background: #20a0ff;
+    padding: 4rem 0;
+    margin-top: -2px !important;
+}
+.indexBottomBox {
+    display: flex;
+    justify-content: space-between;
+    width: 70rem;
+    margin: auto;
+}
+.indexBottomBox_box {
+    width: 70rem;
+    display: flex;
+}
+.indexBottomBox_one {
+    margin-right: 9rem;
+}
+.indexBottomBox_one .indexBottomBox_one_til, .indexBottomBox_video .indexBottomBox_one_til, .contactUs .indexBottomBox_one_til{
+    font-size: 1.35rem;
+    color: #fff;
+    font-weight: bold;
+    margin-bottom: 1.35rem;
+}
+.indexBottomBox_one div {
+    font-size: 1rem;
+    color: #fff;
+    margin-bottom: 1rem;
+}
+.indexBottomBox_video {
+    width: 14rem;
+}
+.indexBottomBox_video_box {
+    width: 100%;
+    height: 8rem;
+    cursor: pointer;
+}
+.indexBottomBox_video_box img{
+    width: 100%;
+    height: 100%;
+}
+.contactUs {
+    margin-left: 9rem;
+}
+.contactUs_box_img {
+    width: 8rem;
+    height: 8rem;
+}
+.contactUs_box_img img{
+    width: 100%;
+    height: 100%;
+}
+.contactUs_box_tex {
+    text-align: center;
+    line-height: 2rem;
+    font-size: 1rem;
+    color: #fff;
+    width: 100%;
+}
+
+.copyright {
+    border-color: #fff !important;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/customer.css

@@ -0,0 +1,881 @@
+@charset "utf-8";
+
+html {font-size: 10px; -webkit-text-size-adjust:none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
+@media screen and (min-width:320px){html{font-size:    10px;}}
+@media screen and (min-width:360px){html{font-size: 11.25px;}}
+@media screen and (min-width:375px){html{font-size: 11.7px;}}
+@media screen and (min-width:480px){html{font-size:    15px;}}
+@media screen and (min-width:414px){html{font-size:  13px;}}
+@media screen and (min-width:560px){html{font-size:  17.5px;}}
+@media screen and (min-width:640px){html{font-size:    20px;}}
+
+.contentes {
+    width: 81.25rem;
+    margin: auto;
+    position: relative;
+}
+.contentes img {
+    width: 100%;
+    height: 100%;
+}
+/* 质询图标 */
+.consulting {
+    width: 3.125rem;
+    height: 3.125rem;
+    border-radius: 50%;
+    background: #fff;
+    position: fixed;
+    bottom: 3.75rem;
+    right: 6.25rem;
+    z-index: 4;
+    box-shadow: 0 0 1.25rem 0px #cbcbcb;
+    cursor:pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.consulting:hover {
+    background: #3396FB;
+}
+.conImgConImg {
+    width: 2.5rem;
+    height: 2.5rem;
+    position: relative;
+    margin-top: 1.5625rem;
+    margin-left: 1.125rem;
+}
+.conImgConImg img{
+    width: 100%;
+}
+/* 咨询 */
+.zhixun {
+    display: block;
+    position: fixed;
+    bottom: 7.5rem;
+    right: 2.5rem;
+    padding: 1rem;
+    background: #fff;
+    box-shadow: .1875rem .1875rem .625rem #ccc;
+    z-index: 99999999;
+    text-align: center;
+}
+.zhixun p {
+    margin: 8px 0;
+}
+.zhixun img {
+    width: 8rem;
+}
+
+.tabOn {
+    background: #fff;
+    color: #20a0ff !important;
+}
+.white{
+    background: #fff !important;
+}
+/* 产品介绍 */
+.product {
+    width: 100%;
+    position: fixed;
+    z-index: 10;
+    top: 6.25rem;
+    left: 0;
+    background: #fff;
+    height: 20.75rem;
+    border-top: .0625rem solid rgb(163, 163, 163);
+    box-shadow: 1px 3px 5px 0px #ddd;
+}
+.connont {
+    width: 81.25rem;
+    margin: auto;
+}
+
+.tils::before {
+    content:"";
+    height: .125rem;
+    width: 100%;
+    bottom: 0rem;
+    left: 0;
+    background: #37B8FF;
+    position: absolute;
+}
+/* 导航下拉 */
+.management {
+    margin-top: 1.25rem;
+    width: 33.75rem;
+    font-size: 1rem;
+}
+.management h3 {
+    width: 100%;
+    font-size: 1rem;
+    font-weight: normal;
+    color: #333333;
+    line-height: 2.5rem;
+    border-bottom: .0625rem solid rgb(180, 180, 180);
+    margin-left: 1.25rem;
+}
+.management ul {
+    margin-top: .625rem;
+    width: 11.25rem;
+}
+.management li{
+    margin-top: .625rem;
+    line-height: 2.5rem;
+    cursor:pointer;
+    padding-left: 1.25rem;
+}
+.management a {
+    color: #333;
+}
+.management li:hover {
+    background: #F0F4FF;
+    border-radius: .625rem;
+    color: #3370FF;
+}
+
+/* js锁添加的样式 */
+.tils::before {
+    content:"";
+    height: .125rem;
+    width: 100%;
+    bottom: 0rem;
+    left: 0;
+    background: #37B8FF;
+    position: absolute;
+}
+.hanAll {
+    background: #fff !important;
+    box-shadow: .0625rem .1875rem .3125rem 0px #ddd;
+}
+.abc .til {
+    color: #fff !important;
+}
+.abc .til a{
+    color: #fff !important;
+}
+.navigationBarBack {
+    /* background: #f6fef9; */
+    background-color:transparent !important;
+}
+.navigationBar {
+    box-shadow:none;
+}
+.navigationTitle a {
+    color: #333 !important;
+}
+.navigationTitle {
+    color: #333 !important;
+}
+
+/* bannar */
+.bannar {
+    width: 100%;
+    height: 100vh;
+    margin: auto;
+    position: relative;
+    overflow: hidden;
+    display: flex;
+    justify-content: center;
+}
+.bannar img {
+    /* width: 100%; */
+    height: 100%;
+}
+.bannarCon {
+    position: absolute;
+    z-index: 1;
+    top: 15.625rem;
+    left:  50%;
+    width: 81.25rem;
+    margin-left: -40.625rem;
+}
+.bannarConTil {
+    font-size: 7.625rem;
+    font-weight: bold;
+    color: #fff;
+    letter-spacing: .9375rem;
+}
+.bannarConTilP  {
+    font-size: 1.5rem;
+    color: #fefeff;
+    letter-spacing: .375rem;
+    margin-top: 2.5rem;
+    margin-bottom: 10.3125rem;
+    font-style: italic;
+}
+.bannBtn {
+    width: 12.5rem;
+    height: 3.875rem;
+    border-radius: 3.875rem;
+    border: .125rem solid #fff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 1.375rem;
+}
+.bannarCon a {
+    color: #fff;
+    letter-spacing: .1875rem;
+}
+
+/* 客户管家 */
+.collaborationTeam {
+    width: 100%;
+    background: #ffffff;
+    height: 250vh;
+}
+.collTeam {
+    height: 100vh;
+    box-sizing: border-box;
+    position: sticky;
+    top: 6.375rem;
+    background: url(../image/customer/beijing.jpg) no-repeat center;
+    /* background-size: 100% 114%; */
+}
+.collCent {
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    box-sizing: border-box;
+    padding-top: 12.5rem;
+}
+.collCentDiv {
+
+}
+.collCentImg {
+    width: 8.125rem;
+    height: 8.125rem;
+    position: relative;
+    z-index: 2;
+}
+.collCentFonts {
+    font-size: 2.25rem;
+    color: #333;
+    overflow: hidden;
+    width: 100%;
+    /* padding-left: 2.5rem; */
+    text-align: center;
+    padding-top: 1.5625rem;
+}
+.collCentFonts span {
+    color: #5e95f8;
+}
+
+/* 核心功能 */
+.coreFunctionTiyle {
+    margin: auto;
+}
+.coreFunctionTiyle h2 {
+    font-size: 50px;
+    color: #5e5e5e;
+    text-align: center;
+    margin: auto;
+    /* font-weight: normal; */
+    padding: 5.3125rem 0 1rem 0;
+}
+.coreFunctionTiyle span {
+    color: #5e95f8;
+}
+.coreFunctionTiyle p {
+    font-size: 1.25rem;
+    color: #cdc1aa;
+    text-align: center;
+    margin: auto;
+    padding-bottom: 2.625rem;
+}
+.coreFunctionCon {
+    display: flex;
+    width: 95rem;
+    justify-content: center;
+}
+.coreFunctionConLeft {
+    display: inline-block;
+    width: 21.875rem;
+    background: #f5f6f8;
+    border-radius: .625rem;
+    box-sizing: border-box;
+    padding: 0 2.1875rem;
+}
+.coreFunctionConLeft h3 { 
+    font-weight: normal;
+    color: #a9acfa;
+    font-size: 2.625rem;
+    padding: 2.8125rem 0 4.0625rem 0;
+}
+.coreFunctionConLeft span {
+    display: block;
+    margin: auto;
+    width: 10.9375rem;
+    height: 10.9375rem;
+}
+.coreFunctionConLeft span img {
+    width: 100%;
+    height: 100%;
+}
+.coreFunctionConLeft p {
+    font-size: 1.375rem;
+    color: #a0a0a2;
+    text-align: center;
+    line-height: 1.75rem;
+    padding: 2.25rem 0 2.375rem 0;
+}
+.coreFunctionConRiht {
+    display: inline-block;
+    margin-left: 3.75rem;
+}
+.coreFunctionConRihtCon {
+    width: 21.25rem;
+    font-family: '宋体';
+    margin-bottom: 2.1875rem;
+    display: flex;
+}
+.coreFunctionConRihtCon:last-child {
+    margin-bottom: 0;
+}
+.coreImg {
+    width: 6.5625rem;
+    display: inline-block;
+    height: 6.5625rem;
+    margin-right: 1.375rem;
+}
+.coreImg img{
+    width: 100%;
+    height: 100%;
+    display: inline-block;
+}
+.coreFunctionConRihtCon h4 {
+    font-weight: normal;
+    font-size: 1.5625rem;
+    color: #a9acfa;
+    padding-bottom: 1.125rem;
+}
+.coreFunctionConRihtCon p {
+    font-size: 1.25rem;
+    color: #595959;
+    line-height: 1.375rem;
+}
+.coreFunctionConRihtCon span {
+    display: inline-block;
+    font-size: 1.0625rem;
+    color: #3830a6;
+    margin-top: 1.5rem;
+}
+
+.coreLeft {
+    box-shadow: 0 0 8px 4px #dfdfdf;
+}
+
+/* 各类需求 */
+.kindsNeeds {
+    margin-top: 9.6875rem;
+    display: flex;
+    width: 95rem;
+    justify-content: center;
+}
+.kindsNeedsLeft {
+    position: relative;
+    width: 66.875rem;
+    height: 38.125rem;
+}
+.kindsNeedsLeft img {
+    width: 100%;
+    height: 100%;
+}
+.kindsNeedsRight {
+    width: 8rem;
+    padding-left: 1rem;
+    font-family: '黑体';
+    font-weight: 600;
+}
+.kindsNeedsRight p {
+    font-size: 2.625rem;
+    width: 3.125rem;
+    color: #5e5e5e;
+    line-height: 2.875rem;
+}
+.kindsNeedsRight span {
+    display: block;
+    width: 3.125rem;
+    color: #5e95f8;
+    font-size: 3.125rem;
+    line-height: 3.625rem;
+}
+
+.kindsNeedsPointTil {
+    font-size: 1.375rem;
+    color: #3e4045;
+    display: flex;
+    align-items: center;
+    margin-bottom: 1.5rem;
+    letter-spacing: .125rem;
+}
+.kindsNeedsPointTil span {
+    width: .75rem;
+    height: 2.25rem;
+    border-radius: .75rem;
+    display: inline-block;
+    margin-right: .625rem;
+}
+.kindsNeedsPointCon {
+    font-size: 1.0625rem;
+    color: #b4a281;
+    display: flex;
+    align-items: center;
+    margin-bottom: 1.125rem;
+    letter-spacing: .125rem;
+}
+.kindsNeedsPointCon span {
+    width: .75rem;
+    height: .75rem;
+    border-radius: .75rem;
+    display: inline-block;
+    margin-right: .625rem;
+}
+.green {
+    position: absolute;
+    top: 8.625rem;
+    left: 7.9375rem;
+}
+.green span {
+    background: #6ecd7c;
+}
+.yellow {
+    position: absolute;
+    top: 8.625rem;
+    left: 25.3125rem; 
+}
+.yellow span {
+    background: #fccd4b;
+}
+.red {
+    position: absolute;
+    top: 21.125rem;
+    left: 7.9375rem;
+}
+.red span {
+    background: #ed6a70;
+}
+.blue {
+    position: absolute;
+    top: 21.125rem;
+    left: 25.3125rem; 
+}
+.blue span {
+    background: #5e95f8;
+}
+.purple {
+    position: absolute;
+    top: 15rem;
+    right: 6rem; 
+}
+.purple span {
+    background: #a7ade8;
+}
+
+/* 渐变色 */
+.gradient {
+    background: linear-gradient(#fff, #ece7ea);
+    padding: 4.875rem 0 2.5rem 0      ;
+}
+
+/* 特色展示 */
+.specialShow {
+    width: 75rem;
+    margin: auto;
+}
+.specialShowTil {
+    position: relative;
+    height: 7rem;
+    margin-left: 6.5rem;
+}
+.specialShowTil h2 {
+    font-size: 3.125rem;
+    font-weight: normal;
+    font-family: '黑体';
+    color: #5e5e5e;
+    letter-spacing: 8px;
+}
+.specialShowTil h2 span {
+    color: #5e95f8;
+}
+.specialShowProgressbar {
+    position: absolute;
+    left: 7.5rem;
+    top: 5.3125rem;
+}
+.specialShowProgressbar div {
+    width: 15.9375rem;
+    height: .1875rem;
+    background: #d6d6d6;
+    position: relative;
+}
+.specialShowProgressbar span {
+    display: inline-block;
+    /* width: 13.75rem; */
+    height: .1875rem;
+    background: #20a0ff;
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+.specialShowProgressbar p {
+    font-size: 1rem;
+    position: absolute;
+    top: .625rem;
+    left: 11.25rem;
+}
+.specialShowCon {
+    display: flex;
+    justify-content: space-between;
+}
+.specialShowConLeft {
+    width: 14rem;
+    text-align: center;
+    margin-left: 1.5rem;
+}
+.specialShowConLeft li{
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    width: 100%;
+    height: 2rem;
+    font-size: 1.25rem;
+    color: #a0a0a2;
+    margin-bottom: 1.4375rem;
+    cursor: pointer;
+}
+.specialShowConLeft div {
+    position: relative;
+    width: 100%;
+    height: .25rem;
+    background: #efefef;
+}
+.specialShowConLeft span {
+    display: inline-block;
+    width: 12.625rem;
+    height: .25rem;
+    position: absolute;
+    top: 0;
+    left: 0;
+    background: #eae5db;
+}
+.specialShowConLeft .on {
+    color: #5e95f8;
+}
+.specialShowConLeft .on span {
+    background: #c4d8fc;
+    width: 12.625rem;
+    height: .25rem;
+}
+.specialShowConright {
+    position: relative;
+    width: 57.1875rem;
+    box-sizing: border-box;
+    padding-top: 1.25rem;
+}
+.specialShowConrightImg {
+    width: 46.25rem;
+    height: 28.125rem;
+}
+.specialShowConrightImg img, .dynamicImg img, .indusIonImg img {
+    width: 100%;
+    height: 100%;
+}
+.dynamicImg {
+    width: 49.375rem;
+    height: 27.8125rem;
+    position: absolute;
+    top: 5.625rem;
+    right: 0;
+}
+
+/* 行业解决方案 */
+.industry {
+    margin-top: 3.4375rem;
+}
+.industry h2 {
+    font-size: 3.125rem;
+    color: #5e5e5e;
+    text-align: center;
+    margin-bottom: 1.875rem;
+    font-weight: normal;
+    letter-spacing: .875rem;
+}
+.industry h2 span {
+    color: #5e95f8;
+}
+.industryCon {
+    display: flex;
+    justify-content: space-between;
+    width: 75rem;
+    margin: auto;
+}
+.industryConLeft {
+    width: 28.4375rem;
+    height: 34.0625rem;
+    background: #fff;
+    border-radius: .625rem;
+    box-sizing: border-box;
+    display: flex;
+    padding: 1.125rem 4.375rem 2.25rem 4.375rem;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    align-content: space-between;
+}
+.industryConRight {
+    display: flex;
+    flex-wrap: wrap;
+    width: 43.4375rem;;
+    align-content: space-between;
+}
+.industryConRight .industryConRightCon {
+    width: 43.4375rem;
+    height: 15.3125rem;
+    background: #fff;
+    border-radius: .625rem;
+    box-sizing: border-box;
+    padding: 4.25rem 6.875rem 3.75rem 7.5rem;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+.indusIon {
+    display: flex;
+    width: 6.875rem;
+    flex-wrap: wrap;
+    justify-content: center;
+}
+.indusIon .indusIonImg {
+    width: 6.25rem;
+    height: 4.875rem;
+}
+.indusIon p{
+    font-size: 22px;
+    color: #595959;
+    margin-top: .875rem;
+    letter-spacing: .25rem;
+}
+.industRightConIon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-wrap: wrap;
+    width: 4.8125rem;
+    height: 7rem;
+}
+.indusConIonImg {
+    width: 4.8125rem;
+    height: 4.8125rem;
+}
+.indusConIonImg img {
+    width: 100%;
+    height: 100%;
+}
+.industRightConIon p {
+    font-size: 1.375rem;
+    color: #595959;
+    letter-spacing: .25rem;
+}
+.industryConLeft, .industryConRightCon {
+    box-shadow: 0px .1875rem .625rem .25rem #cfcfcf;
+}
+
+/* 客户评价 */
+.evaluation {
+    width: 79.375rem;
+    background: #fff;
+    margin: auto;
+    position: relative;
+    padding-bottom: 6.875rem;
+}
+.evaluationLogo {
+    width: 75.8125rem;
+    height: 5.375rem;
+    margin: auto;
+    margin-top: .625rem;
+    margin-bottom: 3.125rem;
+}
+.evaluationLogo img {
+    width: 100%;
+    height: 100%;
+}
+.evaluationC {
+    position: relative;
+    width: 79.375rem;
+    margin: auto;
+}
+.evaluationCon {
+    width: 68.75rem;
+    overflow: hidden;
+    margin: auto;
+}
+.evaluationConIkun {
+    width: 275rem;
+    display: flex;
+    position: relative;
+}
+.evaluationConLi {
+    width: 68.75rem;
+    /* display: inline-block; */
+    display: flex;
+    justify-content: space-between;
+}
+.evaluationConLiLeft .evaluationConLiRight {
+    display: inline-block;
+}
+.evaluationConLi .evaluationConLiLeft {
+    width: 38rem;
+    height: 24.9375rem;
+}
+.evaluationConLiLeft img {
+    width: 100%;
+    height: 100%;
+}
+.evaluationConLiRight {
+    width: 22.75rem;
+}
+.evaluationConLiRight h3 {
+    font-weight: normal;
+    font-size: 3.125rem;
+    color: #474747;
+    letter-spacing: .25rem;
+    padding: 1.75rem 0 3.4375rem 0;
+    position: relative;
+}
+.evaluationConLiRight p {
+    line-height: 1.875rem;
+    font-size: 1rem;
+    color: #3e4045;
+}
+.evaluationConLiRightBtn {
+    display: flex;
+    align-items: center;
+    width: 13rem;
+    background: #b4a281;
+    margin-top: 2rem;
+    height: 3.4375rem;
+    color: #fff;
+    cursor: pointer;
+}
+.evaluationConLiRightBtn span {
+    text-align: center;
+    width: 10.25rem;
+    border-right: 2px solid #fff;
+    line-height: 3.4375rem;
+    font-size: 1.375rem;
+    letter-spacing: .25rem;
+}
+.evaluationConLiRightBtn img {
+    display: inline-block;
+    width: .8125rem;
+    height: .9375rem;
+    margin-left: .875rem;
+}
+.zuo {
+    position: absolute;
+    top: 6.875rem;
+    left: 0;
+}
+.you {
+    position: absolute;
+    top: 6.875rem;
+    right: 0;
+}
+.zuo, .you {
+    width: 1.875rem;
+    height: 2.625rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: #3e4045;
+    cursor: pointer;
+}
+.zuo img, .you img {
+    width: .5rem;
+    height: 1.0625rem;
+}
+.zuo:hover, .you:hover{
+    background: #b3a280;
+}
+.zhis {
+    cursor: not-allowed;
+}
+
+/* 底部 */
+.footer-frame {
+	width: 100%;
+	height: 24px;
+}
+
+.footer {
+	padding-top: 48px;
+	padding-bottom: 8px;
+	background-color: #20a0ff;
+    margin-top: -0.125rem;
+}
+
+.footer .footer-col {
+	margin-bottom: 36px;
+}
+
+.footer h4 {
+	margin-bottom: 10px;
+	color: #fff;
+}
+
+.footer .list-unstyled,
+.footer p {
+	color: #f3f7fd;
+}
+
+.footer .footer-col.middle .list-unstyled .fas {
+	color: #fff;
+	font-size: 8px;
+	line-height: 24px;
+}
+
+.footer .footer-col.middle .list-unstyled .media-body {
+	margin-left: 8px;
+}
+
+.footer .footer-col.last .list-unstyled .fas {
+	color: #fff;
+	font-size: 14px;
+	line-height: 24px;
+}
+
+.footer .footer-col.last .list-unstyled .media-body {
+	margin-left: 10px;
+}
+
+.footer .footer-col.last .list-unstyled .fas.fa-globe {
+	margin-left: 16px;
+	margin-right: 10px;
+}
+
+.navbar {
+    padding: 0 !important;
+}
+
+.ulss {
+    display: inline-block;
+}
+.alss {
+    display: flex;
+    justify-content: space-around;
+    width: 87.5rem;
+    margin: auto;
+}
+.footsst {
+    background: #fff;
+}
+
+.copyright {
+    width: 100%;
+    text-align: center;
+    line-height: 2.5rem;
+    color: #fff;
+    font-size: 1rem;
+    background: #20a0ff;
+    border-top: 1px solid #565656;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/customerNew/customerNew.css

@@ -0,0 +1,539 @@
+.bannar {
+  width: 100%;
+  height: 57.5rem;
+  position: relative;
+}
+
+.bannar .bannar_text_btn {
+  display: inline-block;
+  line-height: 1;
+  white-space: nowrap;
+  cursor: pointer;
+  background: #fff;
+  border: 1px solid #dcdfe6;
+  color: #606266;
+  text-align: center;
+  box-sizing: border-box;
+  outline: none;
+  margin: 0;
+  transition: .1s;
+  font-weight: 500;
+  padding: 1.25rem 1.875rem;
+  border-radius: 4px;
+  position: absolute;
+  color: #fff;
+  background-color: #409eff;
+  border-color: #409eff;
+  bottom: 4rem;
+  left: 10rem;
+}
+
+.bannar .bannar_text_btn a {
+  color: #fff;
+  font-size: 1.5rem;
+}
+
+.bannar .bannar_text {
+  position: absolute;
+  left: 9.875rem;
+  bottom: 9.375rem;
+}
+
+.bannar .bannar_text .bannar_text_item {
+  font-family: PingFangSC, PingFang SC;
+  font-size: 34px;
+  color: #5c5d61;
+  line-height: 4.375rem;
+}
+
+.bannar .bannar_text .bannar_text_title {
+  font-size: 5.625rem;
+  color: #12174e;
+  margin-bottom: 3.75rem;
+}
+
+.customer_integration {
+  width: 100%;
+  height: 51.875rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.customer_integration .customer_integration_conter {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.customer_integration .customer_integration_conter .integrationImg {
+  width: 180px;
+  height: 180px;
+  padding-bottom: 0.625rem;
+  margin: auto;
+}
+
+.customer_integration .customer_integration_conter .integrationImg img {
+  width: 100%;
+  height: 100%;
+}
+
+.customer_integration .customer_integration_conter .integrationText {
+  font-size: 34px;
+  color: #354155;
+}
+
+.core {
+  background: #f8f9ff;
+  width: 100%;
+  position: relative;
+  padding: 6.25rem 0 6rem 0;
+}
+
+.core .core-title {
+  color: #000000;
+  font-size: 3.125rem;
+  padding-bottom: 1.4375rem;
+  text-align: center;
+}
+
+.core .core-text {
+  color: #5a5a5a;
+  font-size: 1.625rem;
+  text-align: center;
+}
+
+.core .core-content {
+  padding-top: 4.875rem;
+  width: 100rem;
+  height: 41.25rem;
+  margin: auto;
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+}
+
+.core .core-content .core-content-item {
+  width: 31.875rem;
+  height: 18.75rem;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  background: #fff;
+  position: relative;
+  box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.06);
+}
+
+.core .core-content .core-content-item .item-img {
+  width: 14.375rem;
+  height: 14.375rem;
+  position: absolute;
+  top: 0.875rem;
+  right: 3.75rem;
+}
+
+.core .core-content .core-content-item .item-img img {
+  width: 100%;
+  height: 100%;
+}
+
+.core .core-content .core-content-item .item-text {
+  height: 4.125rem;
+  display: flex;
+  align-items: center;
+  line-height: 2.0625rem;
+  font-size: 1.5rem;
+  color: #5a5a5a;
+  padding: 1.625rem 0 1.75rem 2.3125rem;
+  position: relative;
+  z-index: 1;
+}
+
+.core .core-content .core-content-item .item-title {
+  font-size: 2rem;
+  color: #000000;
+  padding-left: 2.3125rem;
+}
+
+.demand {
+  background: #fff;
+  width: 100%;
+  height: 62.5rem;
+  padding: 7.0625rem 0 7.75rem 0;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-content: space-around;
+}
+
+.demand .demand-title {
+  width: 100%;
+  text-align: center;
+  font-size: 3.125rem;
+  color: #000000;
+}
+
+.demand .demand-content {
+  position: relative;
+  width: 59.375rem;
+  height: 46.875rem;
+  padding-bottom: 1.375rem;
+}
+
+.demand .demand-content .demand-item {
+  position: absolute;
+}
+
+.demand .demand-content .demand-item .demand-item-title {
+  display: flex;
+  align-items: center;
+  font-size: 1.75rem;
+  color: #000000;
+}
+
+.demand .demand-content .demand-item .demand-item-title .item-title-img {
+  width: 2.5rem;
+  height: 2.5rem;
+}
+
+.demand .demand-content .demand-item .demand-item-text {
+  font-weight: 500;
+  font-size: 1.375rem;
+  color: #5a5a5a;
+  line-height: 2.25rem;
+  padding-top: 0.25rem;
+}
+
+.demand .demand-content .orientation1 {
+  top: 2.75rem;
+  left: -6.875rem;
+}
+
+.demand .demand-content .orientation2 {
+  top: 2.75rem;
+  right: -11.75rem;
+}
+
+.demand .demand-content .orientation3 {
+  top: 17.875rem;
+  left: -23.75rem;
+}
+
+.demand .demand-content .orientation4 {
+  top: 17.875rem;
+  right: -22.625rem;
+}
+
+.demand .demand-content .orientation5 {
+  bottom: 2rem;
+  left: -6.4375rem;
+}
+
+.demand .demand-content .orientation6 {
+  bottom: 2rem;
+  right: -4.0625rem;
+}
+
+.demand img {
+  width: 100%;
+  height: 100%;
+}
+
+.exhibition {
+  width: 100%;
+  padding: 6rem 0;
+  background: #f8f9ff;
+}
+
+.exhibition .exhibition-title {
+  text-align: center;
+  font-size: 3.125rem;
+  line-height: 4.375rem;
+  padding-bottom: 1.6875rem;
+}
+
+.exhibition .exhibition-content {
+  width: 103.5625rem;
+  margin: auto;
+  display: flex;
+  justify-content: space-between;
+}
+
+.exhibition .exhibition-content .exhibition-item {
+  display: flex;
+}
+
+.exhibition .exhibition-content .exhibition-item .exhibition-item-line {
+  width: 0.125rem;
+  height: 55rem;
+  background: #979797;
+  position: relative;
+}
+
+.exhibition .exhibition-content .exhibition-item .exhibition-item-line .optFor {
+  width: 0.3125rem;
+  height: 5rem;
+  background: #3f76f7;
+  position: relative;
+  left: 50%;
+  transform: translateX(-50%);
+  transition: 0.5s;
+}
+
+.exhibition .exhibition-content .exhibition-item .exhibition-item-text {
+  padding-left: 1.75rem;
+}
+
+.exhibition .exhibition-content .exhibition-item .exhibition-item-text .text {
+  height: 5rem;
+  display: flex;
+  align-items: center;
+  color: #6f7b8f;
+  font-size: 1.75rem;
+  cursor: pointer;
+}
+
+.exhibition .exhibition-content .exhibition-item .exhibition-item-text .text-On {
+  color: #000000;
+}
+
+.exhibition .exhibition-content .exhibition-show {
+  margin-top: 4.375rem;
+  width: 90.625rem;
+  height: 48.75rem;
+  background: url("../../image/customerNew/characteristicDisplay.png") no-repeat;
+  background-size: cover;
+  position: relative;
+}
+
+.exhibition .exhibition-content .exhibition-show .exhibition-show-carouselImage {
+  position: absolute;
+  top: 3.8125rem;
+  left: 11.0625rem;
+  width: 67.0625rem;
+  height: 37.6875rem;
+}
+
+.exhibition .exhibition-content .exhibition-show .exhibition-show-carouselImage img {
+  width: 100%;
+  height: 100%;
+}
+
+.solution {
+  padding: 7.375rem 0 0 0;
+  background: #fff;
+}
+
+.solution .solution-title {
+  font-size: 3.125rem;
+  color: #000000;
+  line-height: 4.375rem;
+  text-align: center;
+  margin-bottom: 8.125rem;
+}
+
+.solution .solution-content {
+  width: 101.125rem;
+  height: 40.625rem;
+  display: flex;
+  justify-content: space-between;
+  flex-wrap: wrap;
+  margin: auto;
+}
+
+.solution .solution-content .solution-item {
+  width: 18.75rem;
+  height: 18.75rem;
+  margin-right: 1.5625rem;
+  border-radius: 0.25rem;
+  overflow: hidden;
+  box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.06);
+}
+
+.solution .solution-content .solution-item:nth-child(5n) {
+  margin-right: 0;
+}
+
+.solution .solution-content .solution-item:nth-child(2) .solution-item-title {
+  background: #58c1f1;
+}
+
+.solution .solution-content .solution-item:nth-child(4) .solution-item-title {
+  background: #58c1f1;
+}
+
+.solution .solution-content .solution-item:nth-child(7) .solution-item-title {
+  background: #58c1f1;
+}
+
+.solution .solution-content .solution-item:nth-child(9) .solution-item-title {
+  background: #58c1f1;
+}
+
+.solution .solution-content .solution-item .solution-item-title {
+  width: 100%;
+  height: 5.625rem;
+  font-size: 1.75rem;
+  color: #fff;
+  display: flex;
+  padding-left: 1.25rem;
+  align-items: center;
+  background: #20a0ff;
+  box-sizing: border-box;
+}
+
+.solution .solution-content .solution-item .solution-item-text {
+  width: 100%;
+  height: 13.125rem;
+  font-size: 1.5rem;
+  line-height: 2.0625rem;
+  color: #5a5a5a;
+  padding: 2.125rem 1.25rem;
+  box-sizing: border-box;
+}
+
+.customerReviews {
+  padding: 6.25rem 0 7.5rem 0;
+  background: #fff;
+}
+
+.customerReviews .customerReviews-title {
+  font-size: 3.125rem;
+  color: #000000;
+  line-height: 4.375rem;
+  text-align: center;
+  margin-bottom: 7.6875rem;
+}
+
+.customerReviews .customerReviews-content {
+  width: 100rem;
+  height: 37.5rem;
+  margin: auto;
+  position: relative;
+}
+
+.customerReviews .customerReviews-content .carousel-item-box {
+  width: 100%;
+  height: 100%;
+  position: relative;
+}
+
+.customerReviews .customerReviews-content .carousel-item-box .carousel-item-title,
+.customerReviews .customerReviews-content .carousel-item-box .carousel-item-text {
+  position: absolute;
+  left: 5.875rem;
+  z-index: 1;
+  color: #255980;
+  font-weight: 500;
+  line-height: 5rem;
+}
+
+.customerReviews .customerReviews-content .carousel-item-box .carousel-item-title {
+  font-size: 2rem;
+  top: 2.875rem;
+}
+
+.customerReviews .customerReviews-content .carousel-item-box .carousel-item-text {
+  top: 8.125rem;
+  font-size: 1.625rem;
+}
+
+.customerReviews .customerReviews-content .carouselImage {
+  width: 100%;
+  height: 100%;
+  border-radius: 0.375rem;
+  overflow: hidden;
+}
+
+.customerReviews .customerReviews-content .carouselImage img {
+  width: 100%;
+  height: 100%;
+}
+
+.customerReviews .icon {
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 5rem;
+  height: 5rem;
+  cursor: pointer;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.customerReviews .icon img {
+  width: 75%;
+  height: 75%;
+}
+
+.customerReviews .left {
+  left: -7.1875rem;
+}
+
+.customerReviews .right {
+  right: -7.1875rem;
+}
+
+/* 咨询 */
+.zhixun {
+  display: block;
+  position: fixed;
+  bottom: 7.5rem;
+  right: 2.5rem;
+  padding: 1rem;
+  background: #fff;
+  box-shadow: 0.1875rem 0.1875rem 0.625rem #ccc;
+  z-index: 99999999;
+  text-align: center;
+}
+
+.zhixun p {
+  margin: 8px 0;
+}
+
+.zhixun img {
+  width: 8rem;
+}
+
+.tabOn {
+  background: #fff;
+  color: #20a0ff !important;
+}
+
+.white {
+  background: #fff !important;
+}
+
+/* 质询图标 */
+.consulting {
+  width: 3.125rem;
+  height: 3.125rem;
+  border-radius: 50%;
+  background: #fff;
+  position: fixed;
+  bottom: 3.75rem;
+  right: 6.25rem;
+  z-index: 4;
+  box-shadow: 0 0 1.25rem 0px #cbcbcb;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.consulting:hover {
+  background: #3396fb;
+}
+
+.conImgConImg {
+  width: 2.5rem;
+  height: 2.5rem;
+  position: relative;
+  margin-top: 1.5625rem;
+  margin-left: 1.125rem;
+}
+
+.conImgConImg img {
+  width: 100%;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/customerNew/customerNew.less

@@ -0,0 +1,448 @@
+.bannar {
+  width: 100%;
+  height: 57.5rem;
+  position: relative;
+  .bannar_text {
+    position: absolute;
+    left: 9.875rem;
+    bottom: 4.375rem;
+    .bannar_text_item {
+      font-family: PingFangSC, PingFang SC;
+      font-size: 34px;
+      color: #5c5d61;
+      line-height: 4.375rem;
+    }
+    .bannar_text_title {
+      font-size: 5.625rem;
+      color: #12174e;
+      margin-bottom: 3.75rem;
+    }
+  }
+}
+
+// 客户一体化
+.customer_integration {
+  width: 100%;
+  height: 51.875rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  .customer_integration_conter {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    .integrationImg {
+      width: 180px;
+      height: 180px;
+      padding-bottom: 0.625rem;
+      margin: auto;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .integrationText {
+      font-size: 34px;
+      color: #354155;
+    }
+  }
+}
+
+// 核心功能
+.core {
+  background: #f8f9ff;
+  width: 100%;
+  position: relative;
+  padding: 6.25rem 0 6rem 0;
+  .core-title {
+    color: #000000;
+    font-size: 3.125rem;
+    padding-bottom: 1.4375rem;
+    text-align: center;
+  }
+  .core-text {
+    color: #5a5a5a;
+    font-size: 1.625rem;
+    text-align: center;
+  }
+  .core-content {
+    padding-top: 4.875rem;
+    width: 100rem;
+    height: 41.25rem;
+    margin: auto;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    .core-content-item {
+      width: 31.875rem;
+      height: 18.75rem;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-end;
+      background: #fff;
+      position: relative;
+      box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.06);
+      .item-img {
+        width: 14.375rem;
+        height: 14.375rem;
+        position: absolute;
+        top: 0.875rem;
+        right: 3.75rem;
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      }
+      .item-text {
+        height: 4.125rem;
+        display: flex;
+        align-items: center;
+        line-height: 2.0625rem;
+        font-size: 1.5rem;
+        color: #5a5a5a;
+        padding: 1.625rem 0 1.75rem 2.3125rem;
+        position: relative;
+        z-index: 1;
+      }
+      .item-title {
+        font-size: 2rem;
+        color: #000000;
+        padding-left: 2.3125rem;
+      }
+    }
+  }
+}
+
+// 需求
+.demand {
+  background: #fff;
+  width: 100%;
+  height: 62.5rem;
+  padding: 7.0625rem 0 7.75rem 0;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-content: space-around;
+  .demand-title {
+    width: 100%;
+    text-align: center;
+    font-size: 3.125rem;
+    color: #000000;
+  }
+  .demand-content {
+    position: relative;
+    width: 59.375rem;
+    height: 46.875rem;
+    padding-bottom: 1.375rem;
+    .demand-item {
+      position: absolute;
+      .demand-item-title {
+        display: flex;
+        align-items: center;
+        font-size: 1.75rem;
+        color: #000000;
+        .item-title-img {
+          width: 2.5rem;
+          height: 2.5rem;
+        }
+      }
+      .demand-item-text {
+        font-weight: 500;
+        font-size: 1.375rem;
+        color: #5a5a5a;
+        line-height: 2.25rem;
+        padding-top: 0.25rem;
+      }
+    }
+    .orientation1 {
+      top: 2.75rem;
+      left: -6.875rem;
+    }
+    .orientation2 {
+      top: 2.75rem;
+      right: -11.75rem;
+    }
+    .orientation3 {
+      top: 17.875rem;
+      left: -23.75rem;
+    }
+    .orientation4 {
+      top: 17.875rem;
+      right: -22.625rem;
+    }
+    .orientation5 {
+      bottom: 2rem;
+      left: -6.4375rem;
+    }
+    .orientation6 {
+      bottom: 2rem;
+      right: -4.0625rem;
+    }
+  }
+  img {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+// 特色展示
+.exhibition {
+  width: 100%;
+  padding: 6rem 0;
+  background: #f8f9ff;
+  .exhibition-title {
+    text-align: center;
+    font-size: 3.125rem;
+    line-height: 4.375rem;
+    padding-bottom: 1.6875rem;
+  }
+  .exhibition-content {
+    width: 103.5625rem;
+    margin: auto;
+    display: flex;
+    justify-content: space-between;
+    .exhibition-item {
+      display: flex;
+      .exhibition-item-line {
+        width: 0.125rem;
+        height: 55rem;
+        background: #979797;
+        position: relative;
+        .optFor {
+          width: 0.3125rem;
+          height: 5rem;
+          background: #3f76f7;
+          position: relative;
+          left: 50%;
+          transform: translateX(-50%);
+          transition: 0.5s;
+        }
+      }
+      .exhibition-item-text {
+        padding-left: 1.75rem;
+        .text {
+          height: 5rem;
+          display: flex;
+          align-items: center;
+          color: #6f7b8f;
+          font-size: 1.75rem;
+          cursor: pointer;
+        }
+        .text-On {
+          color: #000000;
+        }
+      }
+    }
+    .exhibition-show {
+      margin-top: 4.375rem;
+      width: 90.625rem;
+      height: 48.75rem;
+      background: url("../../image/customerNew/characteristicDisplay.png")
+        no-repeat;
+      background-size: cover;
+      position: relative;
+      .exhibition-show-carouselImage {
+        position: absolute;
+        top: 3.8125rem;
+        left: 11.0625rem;
+        width: 67.0625rem;
+        height: 37.6875rem;
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      } 
+    }
+  }
+}
+
+// 行业解决方案
+.solution {
+  padding: 7.375rem 0 0 0;
+  background: #fff;
+  .solution-title {
+    font-size: 3.125rem;
+    color: #000000;
+    line-height: 4.375rem;
+    text-align: center;
+    margin-bottom: 8.125rem;
+  }
+  .solution-content {
+    width: 101.125rem;
+    height: 40.625rem;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    margin: auto;
+    .solution-item {
+      width: 18.75rem;
+      height: 18.75rem;
+      margin-right: 1.5625rem;
+      border-radius: 0.25rem;
+      overflow: hidden;
+      box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.06);
+      &:nth-child(5n) {
+        margin-right: 0;
+      }
+      &:nth-child(2) .solution-item-title {
+        background: #58c1f1;
+      }
+      &:nth-child(4) .solution-item-title {
+        background: #58c1f1;
+      }
+      &:nth-child(7) .solution-item-title {
+        background: #58c1f1;
+      }
+      &:nth-child(9) .solution-item-title {
+        background: #58c1f1;
+      }
+      .solution-item-title {
+        width: 100%;
+        height: 5.625rem;
+        font-size: 1.75rem;
+        color: #fff;
+        display: flex;
+        padding-left: 1.25rem;
+        align-items: center;
+        background: #20a0ff;
+        box-sizing: border-box;
+      }
+      .solution-item-text {
+        width: 100%;
+        height: 13.125rem;
+        font-size: 1.5rem;
+        line-height: 2.0625rem;
+        color: #5a5a5a;
+        padding: 2.125rem 1.25rem;
+        box-sizing: border-box;
+      }
+    }
+  }
+}
+
+// 客户评价
+.customerReviews {
+  padding: 6.25rem 0 7.5rem 0;
+  background: #fff;
+  .customerReviews-title {
+    font-size: 3.125rem;
+    color: #000000;
+    line-height: 4.375rem;
+    text-align: center;
+    margin-bottom: 7.6875rem;
+  }
+  .customerReviews-content {
+    width: 100rem;
+    height: 37.5rem;
+    margin: auto;
+    position: relative;
+    .carousel-item-box {
+      width: 100%;
+      height: 100%;
+      position: relative;
+      .carousel-item-title,  .carousel-item-text {
+        position: absolute;
+        left: 5.875rem;
+        z-index: 1;
+        color: #255980;
+        font-weight: 500;
+        line-height: 5rem;
+      }
+      .carousel-item-title {
+        font-size: 2rem;
+        top: 2.875rem;
+      }
+      .carousel-item-text {
+        top: 8.125rem;
+        font-size: 1.625rem;
+      }
+    }
+    .carouselImage {
+      width: 100%;
+      height: 100%;
+      border-radius: 0.375rem;
+      overflow: hidden;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+  .icon {
+    position: absolute;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 5rem;
+    height: 5rem;
+    cursor: pointer;
+    top: 50%;
+    transform: translateY(-50%);
+    img {
+      width: 75%;
+      height: 75%;
+    }
+  }
+  .left {
+    left: -7.1875rem;
+  }
+  .right {
+    right: -7.1875rem;
+  }
+}
+
+/* 咨询 */
+.zhixun {
+  display: block;
+  position: fixed;
+  bottom: 7.5rem;
+  right: 2.5rem;
+  padding: 1rem;
+  background: #fff;
+  box-shadow: 0.1875rem 0.1875rem 0.625rem #ccc;
+  z-index: 99999999;
+  text-align: center;
+}
+.zhixun p {
+  margin: 8px 0;
+}
+.zhixun img {
+  width: 8rem;
+}
+
+.tabOn {
+  background: #fff;
+  color: #20a0ff !important;
+}
+.white {
+  background: #fff !important;
+}
+/* 质询图标 */
+.consulting {
+  width: 3.125rem;
+  height: 3.125rem;
+  border-radius: 50%;
+  background: #fff;
+  position: fixed;
+  bottom: 3.75rem;
+  right: 6.25rem;
+  z-index: 4;
+  box-shadow: 0 0 1.25rem 0px #cbcbcb;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.consulting:hover {
+  background: #3396fb;
+}
+.conImgConImg {
+  width: 2.5rem;
+  height: 2.5rem;
+  position: relative;
+  margin-top: 1.5625rem;
+  margin-left: 1.125rem;
+}
+.conImgConImg img {
+  width: 100%;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/default.css

@@ -0,0 +1,255 @@
+@charset "utf-8";
+
+/* CSS Document */
+body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
+form,fieldset,input,textarea,p,blockquote,th,td,img { padding: 0; margin: 0; }
+fieldset,img { border: 0; }
+address,caption,cite,code,dfn,em,strong,th,var,i { font-weight: normal; font-style: normal; }
+ol,ul,li { list-style: none; }
+caption,th { text-align: left; }
+h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%; }
+q:before,q:after { content:''; }
+abbr,acronym { border: 0; }
+
+/*-- All --*/
+html{ min-width:1000px; }
+body{ color:#333;font:12px/20px Arial,"Microsoft YaHei","宋体",sans-serif; text-align:center; background:#fff;  }
+a{ color:#333; text-decoration:none; outline:none;}
+a:hover {color:#f00; text-decoration:underline; }
+table { border-collapse: collapse; border-spacing: 0; empty-cells:show; }
+table td,table th{ border:#ddd solid 1px; padding: 5px 0; }
+table th{ background:#39A4DC; color:#fff;  }
+table .new td{ color:#f60; font-weight:bold;  }
+
+
+/* css三角形 */
+.arrow,.arrow s { position:relative;  display:block; font-size: 0; line-height: 0; width: 0; height: 0; border-color:transparent; border-style:dashed; border-width:5px; }
+.arrowR,.arrowR s{ border-left-color:#aaa; border-left-style:solid; }
+.arrowR s{ border-left-color:#fff; position:absolute; left:-7px; top:-5px; }
+.arrowR:hover{ border-left-color:#f60;  }
+
+.arrowL,.arrowL s{ border-right-color:#aaa; border-right-style:solid; }
+.arrowL s{ border-right-color:#fff; position:absolute; right:-7px; top:-5px; }
+.arrowL:hover{ border-right-color:#f60;  }
+
+.arrowT,.arrowT s{ border-bottom-color:#aaa; border-bottom-style:solid; }
+.arrowT s{ border-bottom-color:#fff; position:absolute; left:-5px; top:-3px; }
+.arrowT:hover{ border-bottom-color:#f60;  }
+
+.arrowB,.arrowB s{ border-top-color:#aaa; border-top-style:solid; }
+.arrowB s{ border-top-color:#fff; position:absolute; left:-5px; bottom:-3px; }
+.arrowB:hover{ border-top-color:#f60;  }
+
+/* css圆形 */
+.circle{ line-height:100%; overflow:hidden;  font-family:Tahoma,Helvetica; font-size:18px; color:#aaa;  }
+.circle:hover{ color:#f60;  }
+
+/* 顶部导航条 */
+	#header{ width:100%; left:0; top:0; position:fixed; z-index:10;  height:32px; line-height:32px; color:#fff; text-align:left; overflow:hidden; }
+	#header .headerBg{ width:100%; height:32px; left:0; top:0; position:absolute; z-index:0; background:#000; filter:alpha(opacity=70);opacity:0.7;   }
+	#header a{ color:#fff;  }
+	#header #logo{ position:relative; z-index:1; display:inline-block; *display:inline; zoom:1; font-size:14px; margin-right:5px; padding-left:10px;   }
+	#header .nav{ position:relative; z-index:2; float:right; padding-right:10px; }
+	#header .nav a{ padding:0 10px;  }
+	#header .nav a.imp{ color:#ff0;  }
+	#header .title{ position:relative; z-index:1; height:32px; overflow:hidden;   }
+
+	#content{ margin:0 auto; padding:62px 30px 30px 30px;  position:relative; text-align:left; z-index:0; }
+	#footer{ height:34px; line-height:34px; text-align:center; }
+
+/* 首页 - index.html  ---------------------------------------------- */
+
+
+
+	.indBtn{ text-align:center; display:none;  }
+	.indBtn a{ vertical-align:middle; margin:15px 15px 0 0; display:inline-block; *display:inline; zoom:1; padding:14px 22px 3px 22px;  line-height:26px;
+		color:#bede9a; font-size:14px;
+		-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
+		background:#89c941;
+		background: -webkit-gradient(linear, 0 0, 0 bottom, from(#89c941), to(#72b238));
+		background: -webkit-linear-gradient(#89c941, #72b238);
+		background: -moz-linear-gradient(#89c941, #72b238);
+		background: -ms-linear-gradient(#89c941, #72b238);
+		background: -o-linear-gradient(#89c941, #72b238);
+		background: linear-gradient(#89c941, #72b238);
+		-pie-background: linear-gradient(#89c941, #72b238);
+		-webkit-box-shadow: #39591c 2px 2px 3px;
+		-moz-box-shadow: #39591c 2px 2px 3px;
+		box-shadow: #39591c 2px 2px 3px;
+	}
+	.indBtn a em{ font-size:30px; display:block; color:#fff;  }
+	.indIntro a:hover{ text-decoration:none; margin:11px 15px 0 0; }
+
+	.indTips{ position:fixed; _position:absolute; width:14px; right:0; top:90px; background:#333; padding:5px; line-height:18px; color:#fff; cursor:pointer;
+		-webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;
+	}
+	.indTips a{ color:#fff; text-decoration:none;   }
+	#indTips1{ display:none;  }
+	#ind2{ display:none;  }
+	#ind2 .topic{ font-size:60px; height:120px; line-height:120px;   }
+
+/* 参数 - param.html ---------------------------------------------- */
+	.paramPage .param{ width:100%;  margin-bottom:20px;  background:#fff;  }
+	.paramPage .param th{ text-align:center;  }
+	.paramPage .param td{ text-align:left; padding:5px 2px;   }
+	.paramPage .param .intro{ text-align:left;  }
+	.paramPage .param .link{ color:#39A4DC; text-decoration:underline;   }
+	.paramPage .param .t b{ color:#f60;  }
+	.paramPage .param i{ color:#f60;   }
+	.paramPage .param .on td{ background:#ffffaa;  }
+	/*.paramPage .param tr.n td{ color:#999;  }*/
+	.paramPage .intro a{ text-decoration:underline;  }
+	.paramPage .notice{ overflow:hidden;  text-align:left; padding-bottom:10px;  }
+	.paramPage .notice li{ width:120px; height:30px; line-height:30px; text-align:center; float:left; margin-right:10px; color:#fff; background:#666; cursor:pointer; }
+	.paramPage .notice .on{ background:#f60;   }
+
+
+/* 联系作者 ---------------------------------------------- */
+	#content .contact{ display:none;  color:#f60;  margin-bottom:20px;  }
+
+
+/* 案例 - demo.html ---------------------------------------------- */
+
+	.demoBox{  padding:0 20px 60px 20px;  background:#f2f2f2; border-bottom:3px dotted #ccc;   }
+	.demoBox .hd{ padding:40px 10px 0 10px;  }
+	.demoBox .hd h3{ font-size:30px; font-weight:bold; color:#39A4DC; line-height:60px; }
+	.demoBox .hd h3 span{ color:#ccc; font-style:italic; font-size:60px;  }
+	.demoBox .bd{ padding:20px; overflow:hidden; zoom:1;  }
+	.demoBox .bd .iframeWrap{ overflow:hidden; float:left;  }
+	.demoBox iframe{ width:100%; height:100%;  vertical-align:middle; }
+	.demoBox .botTit{ height:22px; line-height:22px; overflow:hidden; background:#eee; text-align:right; padding:5px 0; overflow:hidden; display:none; 
+	}
+	.demoBox .botTit em{ float:left; font-weight:bold; padding-left:10px;  }
+	.demoBox .botTit span a{ display:block; float:right; height:20px; line-height:20px; padding:0 5px; background:#f60; margin-right:10px; color:#fff; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; cursor:pointer; display:none;  }
+	.demoBox .botTit span a:hover{ text-decoration:none; background:#f60;  }
+
+	.params{ width:580px; height:100%; margin-left:20px; float:left; _display:inline; background:#fff; padding-bottom:10px; border:1px solid #ddd; }
+	.params table{ background:#fff;   }
+	.params table .tit td{ padding: 5px 10px; background:#39A4DC; color:#fff;    }
+	.params table td{ border:1px solid #fff;  }
+	.params table .n{  width: 153px; text-align:right;   }
+	.params table .new{ color:#f00;   }
+	.params table i{ color:#999;  }
+	.params p{ padding:10px 0 0 10px;  }
+	.params .curJsCode{ color:#f60; display:block; font-family:SimSun;  }
+
+	.rightNav{ position:fixed; width:140px;  right:0; top:100px; _position:absolute; text-align:left; cursor:pointer; background-image:url(about:blank);  }
+	.rightNav a{ display:block; position:relative; height:30px; line-height:30px; margin-bottom:2px; background:#fff; padding-right:10px; width:130px; overflow:hidden;  cursor:pointer; right:-110px; }
+	.rightNav a:hover{ text-decoration:none; color:#39A4DC;  }
+	.rightNav a:hover em{ background:#00b700}
+	.rightNav a em{ display:block; float:left; width:30px; background:#39A4DC; color:#fff; font-size:16px; text-align:center; margin-right:10px;}
+	.rightNav a.new em{ background:#f60;  }
+	.demoBox .iframeWrap{ width:452px;  }
+	.demoBox .iframeWrap iframe{ width:452px; height:232px;  background:url(images/loading.gif) center center no-repeat; }
+
+	#picScroll-left iframe{  height:174px;  }
+	#picScroll-top iframe{  height:415px;  }
+	#picMarquee-left iframe{  height:172px;  }
+	#picMarquee-top iframe{  height:415px;  }
+	#txtScroll-left iframe{  height:80px;  }
+	#txtScroll-top iframe{  height:182px;  }
+	#txtMarquee-left iframe{  height:107px;  }
+	#txtMarquee-top iframe{  height:184px;  }
+	#sideMenu iframe{  height:227px;  }
+
+
+	/* 隐藏代码盒子 */
+	#displayBox{ z-index:10; display:none; position:fixed; _position:absolute;   width:1000px; height:500px;   left:50%; top:60px; margin-left:-500px; background:#fff;
+	border:5px solid #eee; 
+	-webkit-box-shadow: #333 0 0 8px;
+	-moz-box-shadow: #333 0 0 8px;
+	box-shadow: #333 0 0 8px; }
+	#displayBox .hd{ height:30px; line-height:30px; background:#eee; padding:0 10px; position:relative;
+		background: -webkit-gradient(linear, 0 0, 0 bottom, from(#F7F7F7), to(#eee));
+		background: -webkit-linear-gradient(#F7F7F7, #eee);
+		background: -moz-linear-gradient(#F7F7F7, #eee);
+		background: -ms-linear-gradient(#F7F7F7, #eee);
+		background: -o-linear-gradient(#F7F7F7, #eee);
+		background: linear-gradient(#F7F7F7, #eee);
+	}
+	#displayBox .hd h3{ font-weight:bold; color:#39A4DC;  }
+	#displayBox .hd a{ display:block; position:absolute; right:10px; top:7px; width:20px; height:16px; line-height:16px; text-align:center;  background:#f60; color:#fff; cursor:pointer; }
+	#displayBox .hd a:hover{ text-decoration:none; }
+	#displayBox .bd{ padding:10px 0;  background:#fff;  }
+	#displayBox textarea{ width:458px; height:230px; padding:10px;  border:1px solid #ccc; display:block; }
+	#displayBox .bd p{ padding-top:10px;  }
+	#displayBox iframe{ width:1000px; height:440px; margin:0 auto;  }
+
+
+/* 扩展效果 ---------------------------------------------- */
+.authorWord{ margin-bottom:25px;   text-align:left; background:#fff; }
+.authorWord h3{ padding:0 20px;  height:30px;  font:normal 14px/30px "Microsoft YaHei"; overflow:hidden; cursor:pointer; border-bottom:1px dotted #ccc; }
+.authorWord h3 .arrow{ float:right; border-top-color:#fff; margin-top:11px;  }
+.authorWord .con{ padding:10px 20px; line-height:22px;  }
+.authorWord .con p{ margin-bottom:5px }
+.authorWord a{ color:#f60; text-decoration:underline;   }
+
+.demoList{ overflow:hidden; padding-top:10px;    }
+.demoList li{
+		position:relative;  cursor:pointer; float:left; width:160px;  text-align:center; margin:0 30px 30px 0; 
+		padding:4px 4px 0 4px; background:#e3e3e3; color:#000; 
+}
+.demoList li img{ display:block; width:160px; height:120px; background:url(images/loading.gif) center center no-repeat;  }
+.demoList li h3{ height:28px; line-height:28px;  }
+.demoList li.new i{ display:block; position:absolute; top:4px; right:4px; z-index:1; width:31px; height:31px;  background:url(images/new.png) 0 0 no-repeat;  }
+
+.demoList li.on{ 	
+	background:#666; color:#fff; 
+	-webkit-transform: translateY(-10px);
+	-moz-transform: translateY(-10px);
+	-o-transform: translateY(-10px);
+	-webkit-transition-duration:0.3s;
+	-o-transition-duration:0.3s;
+	-moz-transition-duration:0.3s;
+	}
+
+
+	.demoBoxEven{ background:#fff;  }
+	.demoBoxEven .demoList li{	 }
+	.demoBoxEven .demoList li.on{  background:#666; color:#fff;  }
+
+/* 如何使用 ---------------------------------------------- */
+.usePageDl{ width:1000px;  }
+.usePageDl dt h2{ font:normal 22px/150% "Microsoft YaHei"; _font-weight:bold; color:#39A4DC;  }
+.usePageDl dt h2 a{ color:#f60; text-decoration:underline;   }
+.usePageDl dt p{ padding:5px 0 10px 33px;  }
+.usePageDl dt p b{ color:#f60;  }
+.usePageDl dd{ margin-bottom:50px;  }
+.usePage .demoBox{ padding:0;  }
+.usePage .demoBox .bd .iframeWrap{ background:none;  }
+
+
+/* 下载页面 ----------------------------------------------- */
+.downLoadDl{ width:1000px;  }
+.downLoadDl dt h2{ font:normal 22px/150% "Microsoft YaHei"; _font-weight:bold; color:#39A4DC;  }
+.downLoadDl dt h2 a{ font-size:12px; color:#333; margin-left:20px; text-decoration:underline;    }
+.downLoadDl dd{ margin-bottom:50px; padding:10px 0;  }
+
+.dBtn{ cursor:pointer; display:block;  height:30px; line-height:30px; width:100px; text-align:center; font-size:16px;  background:#6ddb00; color:#fff; _font-weight:bold;
+	-webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;
+	-webkit-box-shadow: #666 1px 1px 2px;
+	-moz-box-shadow: #666 1px 1px 2px;
+	box-shadow: #666 1px 1px 2px;
+}
+.dBtn:hover{ text-decoration:none; background:#65ca00; color:#fff; margin-left:2px;   }
+.pBtn{ background:#FFA241; font-size:12px; }
+.pBtn:hover{ background:#ff8635;  }
+.pBtn i{ font-family:Arial; _font-weight:bold; font-size:20px; }
+
+.downPage .inculde{ margin-top:20px; padding:10px; border:1px dotted #eee; background:#f3f3f3;}
+.downPage .inculde li{ color:#666;  }
+.downPage .inculde em{ font-weight:bold; color:#333;  }
+.downPage .inculde h3{ font-size:14px; font-weight:bold; color:#c00; padding-bottom:10px  }
+.downPage .inculde a{ color:#39A4DC; text-decoration:underline; margin:0 2px;   }
+#whyPay p,#howPay p{ text-indent:20px; margin-bottom:10px  }
+
+.pay{ overflow:hidden; padding-bottom:5px; vertical-align:top;  }
+.pay .pBtn{ float:left;  }
+.pay p{ margin-left:120px;  }
+.pay p span{ color:#c00;  }
+.downPage .imp{ color:#c00; font-size:14px;  }
+
+/* 颜色代码 
+#39A4DC 浅蓝色
+
+*/

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/dynamic.css

@@ -0,0 +1,97 @@
+.enterpriseDynamics {
+  display: flex;
+  justify-content: center;
+  margin-top: 10em;
+}
+.enterpriseDynamics .content {
+  width: 1140px;
+}
+.enterpriseDynamics .bifJournal {
+  width: 100%;
+}
+.enterpriseDynamics .bifJournal .headline {
+  margin: 10px 0 20px 0;
+  font-size: 40px;
+}
+.enterpriseDynamics .bifJournal .eachItem {
+  margin-left: 60px;
+  border-bottom: 1px solid #D7D7D7;
+  padding: 30px 20px;
+  display: flex;
+  justify-content: space-between;
+}
+.enterpriseDynamics .bifJournal .eachItem .eachItemImg {
+  width: 260px;
+  height: 120px;
+  overflow: hidden;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.enterpriseDynamics .bifJournal .eachItem .eachItemImg img {
+  height: 180px;
+}
+.enterpriseDynamics .bifJournal .eachItem .eachItemRight {
+  margin-left: 40px;
+  flex: 1;
+}
+.enterpriseDynamics .bifJournal .eachItem .eachItemRight .eachItemRightTilt {
+  font-size: 25px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.enterpriseDynamics .bifJournal .eachItem .eachItemRight .eachItemRightText {
+  font-size: 18px;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  line-height: 22px;
+  height: 85px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  text-indent: 2em;
+  line-height: 30px;
+}
+.enterpriseDynamics .bifJournal .eachItem .eachItemRight .eachItemRightBum {
+  display: flex;
+  justify-content: space-between;
+  font-size: 16px;
+}
+.enterpriseDynamics .bifJournal .eachItem .eachItemRight .eachItemRightBum .ons {
+  color: #31B7F2;
+  cursor: pointer;
+}
+.enterpriseDynamics .bifJournal .paging {
+  display: flex;
+  justify-content: flex-end;
+  margin: 20px 0 30px 0;
+}
+.enterpriseDynamics .details {
+  margin: 20px 0px 40px 0;
+  min-height: 300px;
+}
+.enterpriseDynamics .details .detailsTil {
+  font-size: 26px;
+  text-align: center;
+  margin-bottom: 15px;
+  position: relative;
+}
+.enterpriseDynamics .details .detailsData {
+  display: flex;
+  justify-content: flex-end;
+  font-size: 18px;
+  margin-bottom: 15px;
+}
+.enterpriseDynamics .details .detailstext {
+  margin-top: 6px;
+  font-size: 18px;
+  line-height: 32px;
+  text-indent: 2em;
+}
+.enterpriseDynamics .details .detailsBack {
+  position: absolute;
+  left: 0;
+  top: 0;
+  color: #31B7F2;
+  cursor: pointer;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/dynamic.less

@@ -0,0 +1,90 @@
+.enterpriseDynamics {
+    display: flex;
+    justify-content: center;
+    margin-top: 10em;
+    .content {
+        width: 1140px;
+    }
+    .bifJournal {
+        width: 100%;
+        .headline {
+            margin: 10px 0 20px 0;
+            font-size: 40px;
+        }
+        .eachItem {
+            margin-left: 60px;
+            border-bottom: 1px solid #D7D7D7;
+            padding: 30px 20px;
+            display: flex;
+            justify-content: space-between;
+            .eachItemImg {
+                width: 260px;
+                height: 120px;
+                overflow: hidden;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                img {
+                    // width: 200px;
+                    height: 180px;
+                }
+            }
+            .eachItemRight {
+                margin-left: 40px;
+                flex: 1;
+                .eachItemRightTilt {
+                    font-size: 26px;
+                }
+                .eachItemRightText {
+                    font-size: 18px;
+                    margin-top: 10px;
+                    margin-bottom: 10px;
+                    line-height: 22px;
+                    height: 85px;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                }
+                .eachItemRightBum {
+                    display: flex;
+                    justify-content: space-between;
+                    font-size: 16px;
+                    .ons {
+                        color: #31B7F2;
+                        cursor: pointer;
+                    }
+                }
+            }
+        }
+        .paging {
+            display: flex;
+            justify-content: flex-end;
+            margin: 20px 0 30px 0;
+        }
+    }
+    .details {
+        margin: 20px 0px 40px 0;
+        min-height: 300px;
+        .detailsTil {
+            font-size: 26px;
+            text-align: center;
+            margin-bottom: 15px;
+            position: relative;
+        }
+        .detailsData {
+            display: flex;
+            justify-content: flex-end;
+            font-size: 18px;
+            margin-bottom: 15px;
+        }
+        .detailstext {
+            font-size: 18px;
+        }
+        .detailsBack {
+            position: absolute;
+            left: 0;
+            top: 0;
+            color: #31B7F2;
+            cursor: pointer;
+        }
+    }
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/followup.css

@@ -0,0 +1,810 @@
+@charset "utf-8";
+
+html {font-size: 10px; -webkit-text-size-adjust:none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
+@media screen and (min-width:320px){html{font-size:    10px;}}
+@media screen and (min-width:360px){html{font-size: 11.25px;}}
+@media screen and (min-width:375px){html{font-size: 11.7px;}}
+@media screen and (min-width:480px){html{font-size:    15px;}}
+@media screen and (min-width:414px){html{font-size:  13px;}}
+@media screen and (min-width:560px){html{font-size:  17.5px;}}
+@media screen and (min-width:640px){html{font-size:    20px;}}
+
+.contentes {
+    width: 81.25rem;
+    margin: auto;
+    position: relative;
+}
+.contentes img {
+    width: 100%;
+    height: 100%;
+}
+/* 质询图标 */
+.consulting {
+    width: 3.125rem;
+    height: 3.125rem;
+    border-radius: 50%;
+    background: #fff;
+    position: fixed;
+    bottom: 3.75rem;
+    right: 6.25rem;
+    z-index: 4;
+    box-shadow: 0 0 1.25rem 0px #cbcbcb;
+    cursor:pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.consulting:hover {
+    background: #3396FB;
+}
+.conImgConImg {
+    width: 2.5rem;
+    height: 2.5rem;
+    position: relative;
+    margin-top: 1.5625rem;
+    margin-left: 1.125rem;
+}
+.conImgConImg img{
+    width: 100%;
+}
+/* 咨询 */
+.zhixun {
+    display: block;
+    position: fixed;
+    bottom: 7.5rem;
+    right: 2.5rem;
+    padding: 1rem;
+    background: #fff;
+    box-shadow: .1875rem .1875rem .625rem #ccc;
+    z-index: 99999999;
+    text-align: center;
+}
+.zhixun p {
+    margin: 8px 0;
+}
+.zhixun img {
+    width: 8rem;
+}
+
+.tabOn {
+    background: #fff;
+    color: #20a0ff !important;
+}
+.white{
+    background: #fff !important;
+}
+/* 产品介绍 */
+.product {
+    width: 100%;
+    position: fixed;
+    z-index: 10;
+    top: 6.25rem;
+    left: 0;
+    background: #fff;
+    height: 20.75rem;
+    border-top: .0625rem solid rgb(163, 163, 163);
+    box-shadow: 1px 3px 5px 0px #ddd;
+}
+.connont {
+    width: 81.25rem;
+    margin: auto;
+}
+
+.tils::before {
+    content:"";
+    height: .125rem;
+    width: 100%;
+    bottom: 0rem;
+    left: 0;
+    background: #37B8FF;
+    position: absolute;
+}
+/* 导航下拉 */
+.management {
+    margin-top: 1.25rem;
+    width: 33.75rem;
+    font-size: 1rem;
+}
+.management h3 {
+    width: 100%;
+    font-size: 1rem;
+    font-weight: normal;
+    color: #333333;
+    line-height: 2.5rem;
+    border-bottom: .0625rem solid rgb(180, 180, 180);
+    margin-left: 1.25rem;
+}
+.management ul {
+    margin-top: .625rem;
+    width: 11.25rem;
+}
+.management li{
+    margin-top: .625rem;
+    line-height: 2.5rem;
+    cursor:pointer;
+    padding-left: 1.25rem;
+}
+.management a {
+    color: #333;
+}
+.management li:hover {
+    background: #F0F4FF;
+    border-radius: .625rem;
+    color: #3370FF;
+}
+
+/* js锁添加的样式 */
+.tils::before {
+    content:"";
+    height: .125rem;
+    width: 100%;
+    bottom: 1rem;
+    left: 0;
+    background: #37B8FF;
+    position: absolute;
+}
+.hanAll {
+    background: #fff !important;
+    box-shadow: .0625rem .1875rem .3125rem 0px #ddd;
+}
+.abc .til {
+    color: #fff !important;
+}
+.abc .til a{
+    color: #fff !important;
+}
+.navigationBarBack {
+    /* background: #f6fef9; */
+    background-color:transparent !important;
+}
+.navigationBar {
+    box-shadow:none;
+}
+.navigationTitle a {
+    color: #333 !important;
+}
+.navigationTitle {
+    color: #333 !important;
+}
+
+/* bannar */
+.bannar {
+    width: 100%;
+    margin: auto;
+    position: relative;
+}
+.bannar img {
+    width: 100%;
+}
+.bannarCon {
+    position: absolute;
+    z-index: 1;
+    top: 15.625rem;
+    left:  50%;
+    width: 81.25rem;
+    margin-left: -40.625rem;
+}
+.bannarConTil {
+    font-size: 3.75rem;
+    color: #fff;
+    letter-spacing: .375rem;
+}
+.bannarConTilP  {
+    font-size: 1.5rem;
+    color: #fff;
+    letter-spacing: .25rem;
+    margin-top: 2.5rem;
+    margin-bottom: 10.3125rem;
+}
+.bannBtn {
+    width: 12.5rem;
+    height: 3.875rem;
+    border-radius: 3.875rem;
+    border: .125rem solid #fff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    font-size: 1.375rem;
+}
+.bannarCon a {
+    color: #fff;
+    letter-spacing: .1875rem;
+}
+/* 随访管家 */
+.collaborationTeam {
+    width: 100%;
+    background: #ffffff;
+    height: 250vh;
+}
+.collTeam {
+    height: 100vh;
+    box-sizing: border-box;
+    position: sticky;
+    top: 6.375rem;
+    background: url(../image/followup/backk.jpg) no-repeat center;
+    background-size: 100% 114%;
+}
+.collCent {
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    box-sizing: border-box;
+    padding-top: 12.5rem;
+}
+.collCentDiv {
+
+}
+.collCentImg {
+    width: 8.125rem;
+    height: 8.125rem;
+    position: relative;
+    z-index: 2;
+}
+.collCentFonts {
+    font-size: 2.25rem;
+    color: #333;
+    overflow: hidden;
+    width: 100%;
+    /* padding-left: 2.5rem; */
+    text-align: center;
+    padding-top: 1.5625rem;
+}
+.collCentFonts span {
+    color: #5e95f8;
+}
+
+/* 专业流程 */
+.professional {
+    width: 100%;
+    background: #fbfefb;
+}
+.professionalBox {
+    position: relative;
+    width: 100%;
+    height: 46.25rem;
+    padding-top: 3.75rem;
+}
+.professionalBoxTil {
+    position: absolute;
+    font-size: 3.125rem;
+    font-family: '黑体';
+    line-height: 5.625rem;
+    padding-top: 2.5rem;
+}
+.professionalBoxTil span {
+    font-size: 4.0625rem;
+}
+.professionalBoxTil i {
+    font-style: normal;
+    color: #7669f6;
+}
+.professionalBoxTilRight {
+    position: relative;
+    width: 54.8rem;
+    height: 46.25rem;
+}
+.proList, .proListLeft {
+    font-size: 1.25rem;
+    color: #6b5cf5;
+    line-height: 2.5rem;
+}
+.proList {
+    position: absolute;
+    right: 0rem;
+    top: 8.2496rem
+}
+.proListLeft {
+    position: absolute;
+    left: 0;
+    bottom: 4.375rem;
+}
+.proList span, .proListLeft span {
+    display: inline-block;
+    margin-right: .625rem;
+    font-size: 1.875rem;
+}
+.collections {
+    width: 43.75rem;
+    height: 38.4375rem;
+    position: relative;
+}
+.huabanOne {
+    width: 10rem;
+    height: 15rem;
+    background-size: 100%;
+    margin: auto;
+    box-sizing: border-box;
+    padding-top: 2.5rem;
+}
+.huabanOne div {
+    text-align: center;
+    margin-top: .5rem;
+    font-size: 1.375rem;
+    font-family: '黑体';
+    color: #fff;
+}
+.rotating {
+    position:absolute;
+    top: 0;
+    left: 50%;
+    margin-left: 5rem;
+    height: 46.5rem;
+    margin: auto;
+    width: 10rem;
+}
+.huanOne {
+    background: url(../image/followup/huaban1.png) no-repeat center;
+}
+.huanOneIon {
+    background: url(../image/followup/huabanIon.png) no-repeat -295px 0;
+	width: 42px;
+	height: 41px;
+    margin: auto;
+}
+
+.huanTwo {
+    background: url(../image/followup/huaban2.png) no-repeat center;
+}
+.huanTwoIon {
+    background: url(../image/followup/huabanIon.png) no-repeat -517px -77px;
+	width: 44px;
+	height: 44px;
+    margin: auto;
+}
+
+.huanThere {
+    background: url(../image/followup/huaban3.png) no-repeat center;
+}
+.huanThereIon {
+    background: url(../image/followup/huabanIon.png) no-repeat -579px -303px;
+	width: 43px;
+	height: 46px;
+    margin: auto;
+}
+
+.huanFour {
+    background: url(../image/followup/huaban4.png) no-repeat center;
+}
+.huanFourIon {
+    background: url(../image/followup/huabanIon.png) no-repeat -467px -499px;
+	width: 45px;
+	height: 44px;
+    margin: auto;
+}
+
+.huanFive {
+    background: url(../image/followup/huaban2.png) no-repeat center;
+}
+.huanFiveIon {
+    background: url(../image/followup/huabanIon.png) no-repeat -130px -499px;
+	width: 55px;
+	height: 44px;
+    margin: auto;
+}
+
+.huanXis {
+    background: url(../image/followup/huaban3.png) no-repeat center;
+}
+.huanXisIon {
+    background: url(../image/followup/huabanIon.png) no-repeat 0 -307px;
+	width: 45px;
+	height: 46px;
+    margin: auto;
+}
+
+.huanSeven {
+    background: url(../image/followup/huaban1.png) no-repeat center;
+}
+.huanSevenIon {
+    background: url(../image/followup/huabanIon.png) no-repeat -68px -77px;
+	width: 46px;
+	height: 44px;
+    margin: auto;
+}
+
+/* 轻松管理 */
+.easyMan {
+    font-family: '黑体';
+}
+.easyMan h2{
+    width: 100%;
+    text-align: center;
+    font-size: 3.125rem;
+    color: #333333;
+    font-weight: normal;
+    margin: 3.75rem 0;
+}
+.easyMan span{
+    color: #6b5cf5;
+}
+.easyManBox {
+    width: 75rem;
+    height: 31.875rem;
+    margin: auto;
+    box-shadow: 4px 6px 20px 0px #c1c1c1;
+    margin-bottom: 6.875rem;
+    display: flex;
+    justify-content: flex-end;
+    box-sizing: border-box;
+    /* padding-top: 2.9375rem; */
+    position: relative;
+}
+.easyManBox img {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+.easyManBoxCon {
+    margin-top: 2.9375rem;
+    width: 39.1875rem;
+    height: 23.4375rem;
+    position: relative;
+    z-index: 1;
+    margin-right: 2rem;
+}
+.easyManBoxCon img{
+    width: 34.375rem;
+    height: 21.125rem;
+    position: absolute;
+    top: 2.125rem;
+    left: 2.8125rem;
+}
+.easyManBoxConCli {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+}
+.easyManBoxConCliOne {
+    width: 11.6875rem;
+    height: 4.125rem;
+    border-radius: .625rem;
+    overflow: hidden;
+    box-sizing: border-box;
+    background: #fff;
+    border: .0625rem solid #bebebe;
+    position: relative;
+    z-index: 1;
+    margin-bottom: 5.3125rem;
+    cursor: pointer;
+}
+.easyManBoxConCliOne span {
+    display: inline-block;
+    width: .875rem;
+    height: .875rem;
+    border-radius: 50%;
+    margin: .25rem 0 0 .875rem;
+    background: #fff;
+}
+.easyManBoxConCliOneTil {
+    width: 100%;
+    height: 1.25rem;
+}
+.easyManBoxConCliOneCen {
+    width: 100%;
+    text-align: center;
+    line-height: 2.5rem;
+    color: #595959;
+    font-size: 1.25rem;
+}
+.easyOn {
+    border: .0625rem solid #3475c5;
+}
+.easyOn span {
+    background: #3475c5;
+}
+.easyOn .easyManBoxConCliOneCen {
+    color: #ada6f9;
+}
+/* 随访管家 */
+.housekeeper {
+    background: #f3f3fd;
+    padding: 7.5rem 0;
+}
+.housekeeperCon {
+    height: 36.25rem;
+    width: 68.75rem;
+    /* margin: auto; */
+    border-radius: 1.25rem;
+    border: 1px solid #b3b3b3;
+    position: relative;
+    overflow: hidden;
+    background: #fff;
+    display: flex;
+    box-shadow: .125rem .125rem .625rem .0625rem #cfcfcf;;
+}
+.housekCon {
+    width: 75rem;
+    margin: auto;
+    position: relative;
+}
+.housekeeperConZuo {
+    display: inline-block;
+    width: 14.5rem;
+    border-right: .0625rem solid #e5e6e8;
+    background: #f7f8fa;
+    height: 36.25rem;
+}
+.housekeeperConZuoUl, .housekeeperConZuoLi {
+    display: flex;
+    align-items: center;
+    height: 4.5rem;
+    color: #333;
+    font-family: '黑体';
+    border-bottom: .0625rem solid #e5e6e8;
+}
+.housekeeperConZuoUl {
+    font-size: 1.5rem;
+    font-weight: bold;
+}
+.housekeeperConZuoLi {
+    font-size: 1rem;
+    cursor: pointer;
+}
+.housekeeperConZuoUl img, .housekeeperConZuoLi img{
+    width: 2.25rem;
+    height: 2.25rem;
+    margin: 0 .9375rem 0 1.375rem;
+}
+.housekeeperOn {
+    background: #e5e6e8;
+}
+.housekeeperConYou {
+    width: 54.0625rem;
+    display: inline-block;
+    height: 36.25rem;
+    background: url(../image/followup/huoLeft.jpg) no-repeat left;
+    background-size: 15.625rem 100%;
+    position: relative;
+}
+.housekeeperConYouTil {
+    font-size: 3.125rem;
+    color: #555555;
+    font-family: '黑体';
+    font-weight: bold;
+    position: absolute;
+    top: 50%;
+    margin-top: -6.125rem;
+    left: 3.75rem;
+}
+.housekeeperConYouTil span {
+    color: #6f5ff4;
+}
+.housekeeperConYouCon {
+    width: 38.75rem;
+    height: 35rem;
+    border-radius: 1.25rem;
+    overflow: hidden;
+    border: .0625rem solid #b3b3b3;
+    position: absolute;
+    right: .875rem;
+    top: .5625rem;
+    background: #f6f8f9;
+    box-shadow: .0625rem .0625rem .375rem 0 #d1d1d1
+}
+.housekeeperConYouConTli {
+    width: 100%;
+    background: #fff;
+    height: 3.75rem;
+    display: flex;
+    border-bottom: .0625rem solid #e5e6e8;
+    font-size: 1.375rem;
+    font-family: '黑体';
+    color: #6f5ff4;
+    align-items: center;
+    font-weight: bold;
+}
+.housekeeperConYouConTli img {
+    width: 1.25rem;
+    height: 1.25rem;
+    display: inline-block;
+    margin: 0 1.25rem;
+}
+.housekeeperConYouConBon {
+    width: 100%;
+    height: 31.25rem;
+    background: url(../image/followup/dibuBon.jpg) no-repeat bottom;
+    background-size: 100% 6.375rem;
+}
+.housekConImg {
+    width: 49.375rem;
+    height: 25.625rem;
+    position: absolute;
+    top: 5.75rem;
+    right: 0;
+    box-shadow: .25rem .1875rem 1.25rem .1875rem #d1d1d1;
+}
+.housekConImg img {
+    width: 100%;
+    height: 100%;
+}
+
+/* 客户评价 */
+.evaluation {
+    width: 100%;
+    height: 81.25rem;
+    background-image: linear-gradient(#fff, #d8cef6);
+}
+.evaluationKehuTil {
+    text-align: center;
+    font-family: '黑体';
+}
+.evaluationKehuTil h2 {
+    text-align: center;
+    font-size: 3.125rem;
+    font-weight: normal;
+    color: #1381ea;
+    padding: 3.5rem 0 .9375rem 0;
+}
+.evaluationKehuTil p {
+    text-align: center;
+    font-size: 1.625rem;
+    color: #595959;
+    margin-bottom: 5.5rem;
+}
+.evaluationKehuCon {
+    width: 76.25rem;
+    margin: auto;
+    display: flex;
+    justify-content: space-around;
+}
+.evaluationKehuConLi {
+    width: 16.875rem;
+    height: 28.5rem;
+    border-radius: 1.25rem;
+    overflow: hidden;
+    cursor: pointer;
+}
+.evaluationKehuConImg {
+    width: 10.6875rem;
+    height: 10.6875rem;
+    margin: auto;
+    border-radius: 10.6875rem;
+    margin-top: 3.125rem;
+    box-sizing: border-box;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.evaluationKehuCon h3 {
+    font-weight: normal;
+    font-family: '黑体';
+    font-size: 1.75rem;
+    margin-top: 1.5rem;
+    margin-bottom: 2.9375rem;
+    padding-left: 3rem;
+}
+.evaluationKehuCon p {
+    width: 100%;
+    font-size: 1rem;
+    color: #555555;
+    /* font-family: '黑体'; */
+    text-align: center;
+    line-height: 1.5rem;
+}
+.evaluationKehuConLi:hover {
+    background: #5931db;
+}
+.evaluationKehuConLi:hover img {
+    border: .3125rem solid #6bbdd9;
+    border-radius: 50%;
+}
+.evaluationKehuConLi:hover h3 {
+    color: #fff;
+}
+.evaluationKehuConLi:hover p {
+    color: #fff;
+}
+
+/* 产品定价 */
+.pricing {
+    width: 75rem;
+    margin: auto;
+    margin-top: 3.125rem;
+}
+.pricing h2 {
+    /* font-weight: normal; */
+    font-size: 2.8125rem;
+    color: #333;
+    margin-bottom: 2.8125rem;
+}
+.pricingsConTop {
+    display: flex;
+    flex-wrap: wrap;
+    box-shadow: 0 0 20px 1px #b1b1b1;
+    border-radius: .625rem;
+    /* border-bottom: 1px solid #333; */
+    /* border-right: 1px solid #333;  */
+}
+.pricingsConTop div {
+    color: #333333;
+    width: 50%;
+    line-height: 3.75rem;
+    text-align: center;
+    font-size: 1.25rem;
+    box-sizing: border-box;
+    border-top: 1px solid #939393;
+    /* border-left: 1px solid #333; */
+}
+
+
+/* 底部 */
+.footer-frame {
+	width: 100%;
+	height: 24px;
+}
+
+.footer {
+	padding-top: 48px;
+	padding-bottom: 8px;
+	background-color: #20a0ff;
+    margin-top: -0.125rem;
+}
+
+.footer .footer-col {
+	margin-bottom: 36px;
+}
+
+.footer h4 {
+	margin-bottom: 10px;
+	color: #fff;
+}
+
+.footer .list-unstyled,
+.footer p {
+	color: #f3f7fd;
+}
+
+.footer .footer-col.middle .list-unstyled .fas {
+	color: #fff;
+	font-size: 8px;
+	line-height: 24px;
+}
+
+.footer .footer-col.middle .list-unstyled .media-body {
+	margin-left: 8px;
+}
+
+.footer .footer-col.last .list-unstyled .fas {
+	color: #fff;
+	font-size: 14px;
+	line-height: 24px;
+}
+
+.footer .footer-col.last .list-unstyled .media-body {
+	margin-left: 10px;
+}
+
+.footer .footer-col.last .list-unstyled .fas.fa-globe {
+	margin-left: 16px;
+	margin-right: 10px;
+}
+
+.navbar {
+    padding: 0 !important;
+}
+
+.ulss {
+    display: inline-block;
+}
+.alss {
+    display: flex;
+    justify-content: space-around;
+    width: 87.5rem;
+    margin: auto;
+}
+.footsst {
+    background: #d7cef6;
+}
+
+.copyright {
+    width: 100%;
+    text-align: center;
+    line-height: 2.5rem;
+    color: #fff;
+    font-size: 1rem;
+    background: #20a0ff;
+    border-top: 1px solid #565656;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/homemovement/homemovement.css

@@ -0,0 +1,258 @@
+body {
+  min-width: 320px;
+  max-width: 750px;
+  margin: 0 auto;
+  background-color: #f2f4f7;
+  position: relative;
+}
+a {
+  text-decoration: none;
+  color: #707070;
+}
+@media screen and (min-width: 750px) {
+  html {
+    font-size: 37.5px !important;
+  }
+}
+img {
+    width: 100%;
+}
+
+.header_qw {
+    width: 3.7333rem;
+    margin-left: 4.1333rem;
+    height: .6667rem;
+}
+.header_qx {
+    width: 3.7333rem;
+    margin-left: .5333rem;
+    height: .6667rem;
+}
+.header_qw img, .header_qx img {
+    height: 100%;
+}
+/* 头部 */
+.header {
+    box-sizing: border-box;
+    height: 2.1333rem;
+    background: #fff;
+    position: fixed;
+    width: 100%;
+    top: 0;
+    left: 0;
+    padding: 0 .5333rem;
+    display: flex;
+    align-items: center;
+    z-index: 99;
+}
+.header_logo {
+    width: 2.5067rem;
+}
+.header_qiyeweix {
+    width: 3.7333rem;
+    margin-left: .5333rem;
+}
+.homepage {
+    margin-top: 2.1333rem;
+    padding: .8rem 0;
+    background: #000;
+    position: relative;
+    height: 10rem;
+}
+.homepage_img {
+    position: absolute;
+    width: 90%;
+    left: 5%;
+    right: 0;
+}
+.homepage_title {
+    font-size: .5333rem;
+    color: #fff;
+    letter-spacing: .1333rem;
+    text-align: center;
+    position: absolute;
+    top: 1.3333rem;
+    left: 2.1333rem;
+    z-index: 1;
+}
+.homepage_gsLogo {
+    width: .8rem;
+    position: absolute;
+    top: 1.2rem;
+    left: .8rem;
+}
+
+.reduction {
+    width: 100%;
+    height: 7.5rem;
+    background: url('../../image/gongshi.jpg') no-repeat;
+    background-size: 100%;
+    display: flex;
+    align-items: center;
+}
+.reduction_img {
+    width: 8.5rem;
+    margin: auto;
+    /* padding-top: 1.6rem; */
+}
+.examination {
+    padding: .8rem 0;
+    position: relative;
+}
+.examination_img {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+}
+.examination_img img {
+    height: 100%;
+}
+.examination_title {
+    position: relative;
+    z-index: 1;
+    text-align: center;
+    padding-bottom: .8rem;
+    font-size: .6667rem;
+}
+.get_job_focus {
+    position: relative;
+  }
+  .get_job_focus .swiper-container {
+    height: 100%;
+    width: 14.4rem;
+  }
+  .get_job_focus .swiper-slide {
+    text-align: center;
+    font-size: .48rem;
+    background: #fff;
+    /* Center slide text vertically */
+    flex-direction: column;
+    /* Center slide text vertically */
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    -webkit-align-items: center;
+    align-items: center;
+    transition: 300ms;
+    transform: scale(0.8);
+    opacity: 0.4;
+  }
+  .get_job_focus .swiper-slide a {
+    width: 9.013333rem;
+    height: 10.026667rem;
+  }
+  .get_job_focus .swiper-slide a img {
+    width: 100%;
+    height: 100%;
+  }
+  .get_job_focus .swiper-slide p {
+    width: 9.013333rem;
+    font-size: 0.666667rem;
+    margin-top: 0.64rem;
+    color: #333;
+  }
+  .get_job_focus .swiper-slide-active,
+  .get_job_focus .swiper-slide-duplicate-active {
+    transform: scale(1);
+    z-index: 999;
+    opacity: 1;
+  }
+  .get_job_focus .swiper-button-next,
+  .get_job_focus .swiper-button-prev {
+    outline: none;
+  }
+  .get_job_focus .swiper-button-next:after,
+  .get_job_focus .swiper-button-prev:after {
+    font-size: 1.066667rem;
+    color: #333;
+  }
+
+  .management {
+    padding: .8rem 0;
+    position: relative;
+    background: url('../../image/tabl.jpg') no-repeat;
+    background-size: 100% 100%;
+  }
+  .management_title {
+    font-size: .8rem;
+    margin-bottom: .2667rem;
+    text-align: center;
+    color: #fff;
+  }
+  .management_tex {
+    font-size: .4rem;
+    margin-bottom: .6667rem;
+    text-align: center;
+    color: #fff;
+  }
+
+  .management .study_fo {
+    padding: 0.266667rem;
+  }
+  .management .swiper-slide {
+    font-size: 18px;
+    background: #fff;
+    width: 7.733333rem;
+    height: 9.066667rem;
+    background-color: #fff;
+    border-radius: 0.266667rem;
+    box-shadow: 0 0px 10px rgba(0, 0, 0, 0.1);
+  }
+  .management .swiper-slide h5 {
+    font-size: 0.693333rem;
+    margin: 0.533333rem 0;
+    font-weight: 400;
+    padding: 0 0.266667rem;
+  }
+  .management .swiper-slide p {
+    font-size: .5333rem;
+    position: absolute;
+    bottom: .1333rem;
+    right: .8rem;
+    color: #1f1f1f;
+  }
+
+  .customer {
+    padding: .8rem .5333rem;
+    background: url('../../image/rke.jpg') no-repeat;
+    background-size: 100% 100%;
+  }
+  .customer_title {
+    font-size: .8rem;
+    text-align: center;
+    margin-bottom: .5333rem;
+  }
+
+  .foots {
+    background: #20A0FF;
+    padding: 1.3333rem 0;
+  }
+  .erweima {
+    width: 3.2rem;
+    margin: auto;
+  }
+  .erweima_text {
+    text-align: center;
+    font-size: .48rem;
+    color:#fff;
+    margin-top: .2667rem;
+    margin-bottom: 30px;
+  }
+  .erweima_haoma {
+    padding: 1.3333rem 0 0 0;
+    font-size: .48rem;
+    text-align: center;
+    width: 17.3333rem;
+    margin: auto;
+    border-top: .0267rem solid #fff;
+    color: #fff;
+  }

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/homemovement/normalize.css

@@ -0,0 +1,404 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+  line-height             : 1.15;
+  /* 1 */
+  -webkit-text-size-adjust: 100%;
+  /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+  margin: 0;
+}
+
+/**
+ * Render the `main` element consistently in IE.
+ */
+
+main {
+  display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+  font-size: 2em;
+  margin   : 0.67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+  box-sizing: content-box;
+  /* 1 */
+  height    : 0;
+  /* 1 */
+  overflow  : visible;
+  /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+  font-family: monospace, monospace;
+  /* 1 */
+  font-size  : 1em;
+  /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+  border-bottom  : none;
+  /* 1 */
+  text-decoration: underline;
+  /* 2 */
+  text-decoration: underline dotted;
+  /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+  font-family: monospace, monospace;
+  /* 1 */
+  font-size  : 1em;
+  /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+  font-size     : 75%;
+  line-height   : 0;
+  position      : relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+  border-style: none;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit;
+  /* 1 */
+  font-size  : 100%;
+  /* 1 */
+  line-height: 1.15;
+  /* 1 */
+  margin     : 0;
+  /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input {
+  /* 1 */
+  overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select {
+  /* 1 */
+  text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding     : 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+  padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+  box-sizing : border-box;
+  /* 1 */
+  color      : inherit;
+  /* 2 */
+  display    : table;
+  /* 1 */
+  max-width  : 100%;
+  /* 1 */
+  padding    : 0;
+  /* 3 */
+  white-space: normal;
+  /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+  vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box;
+  /* 1 */
+  padding   : 0;
+  /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+  -webkit-appearance: textfield;
+  /* 1 */
+  outline-offset    : -2px;
+  /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  /* 1 */
+  font              : inherit;
+  /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+  display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+  display: list-item;
+}
+
+/* Misc
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+  display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+  display: none;
+}
+
+input {
+  border    : none;
+  outline   : none;
+  background: none;
+}
+
+ul,
+li {
+  padding   : 0;
+  list-style: none;
+}
+
+p {
+  margin: 0;
+}
+
+img {
+  display: block;
+  width  : 100%;
+}
+
+* {
+  box-sizing: border-box;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/knowledgeField.css

@@ -0,0 +1,408 @@
+.knowledgeFieldCon {
+  position: relative;
+  background: #f6f7fb;
+  height: 100%;
+  padding-top: 4.5rem;
+  display: flex;
+}
+.knowledgeFieldCon .knowledgeField {
+  flex: 1;
+  margin: 2.1875rem;
+  background: #fff;
+  border-radius: 0.25rem;
+  display: flex;
+  flex-direction: column;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header {
+  height: 4.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 1.5rem;
+  border-bottom: 0.0625rem solid #ededed;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .knowledgeInput {
+  width: 25rem;
+  height: 2.625rem;
+  box-sizing: border-box;
+  background: #f4f4f4;
+  border-radius: 2.625rem;
+  border: 1px solid #fff;
+  padding: 0 1.25rem;
+  margin-right: 0.8125rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .knowledgeInput:focus {
+  border: 0.0625rem solid #3396fb;
+  outline: none;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .searchButton {
+  width: 7.1875rem;
+  height: 2.8125rem;
+  background: #3396fb;
+  border-radius: 0.375rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+  font-size: 1.125rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .knowledgeField-header-text {
+  color: #000000;
+  font-family: Microsoft YaHei UI;
+  font-weight: bold;
+  font-size: 20px;
+  line-height: normal;
+  letter-spacing: 0px;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .elInput {
+  width: 25.8125rem;
+  margin-right: 0.8125rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-header .elInput .elSelect {
+  width: 5rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content {
+  padding: 0 1.5625rem;
+  margin: 1.875rem 0;
+  overflow-y: auto;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item {
+  display: flex;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .image {
+  width: 10.1875rem;
+  height: 6.8125rem;
+  margin-right: 1.25rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .textContent {
+  width: 100.5rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .textContent div {
+  color: #000000;
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 20px;
+  line-height: normal;
+  letter-spacing: 0px;
+  padding-bottom: 0.875rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .textContent p {
+  color: #7b7b7b;
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 16px;
+  height: 2.5rem;
+  line-height: normal;
+  letter-spacing: 0px;
+  display: -webkit-box;
+  /* 必须设置为弹性盒模型 */
+  -webkit-box-orient: vertical;
+  /* 设置盒子的排列方式为垂直 */
+  overflow: hidden;
+  /* 隐藏超出的文本 */
+  -webkit-line-clamp: 2;
+  /* 限制显示2行 */
+  text-overflow: ellipsis;
+  /* 超出的部分显示省略号 */
+  margin-bottom: 0.625rem;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-content .knowledgeField-content-item .textContent span {
+  color: #3396fb;
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 16px;
+  line-height: normal;
+  letter-spacing: 0px;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeField .knowledgeField-bottom {
+  padding: 1.5625rem 0;
+  font-size: 1rem !important;
+}
+.knowledgeFieldCon .knowledgeDetails {
+  padding: 1.25rem 2.1875rem;
+  display: flex;
+  justify-content: space-between;
+  position: relative;
+}
+.knowledgeFieldCon .knowledgeDetails .returnIcon {
+  position: absolute;
+  left: 4.0625rem;
+  top: 2.8125rem;
+  font-size: 1.5625rem;
+  z-index: 2;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeDetails .returnIcon:hover {
+  color: #3396fb;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left {
+  width: 92.75rem;
+  background: #fff;
+  display: flex;
+  flex-direction: column;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-title {
+  color: #000000;
+  font-family: Microsoft YaHei UI;
+  font-weight: bold;
+  font-size: 1.5rem;
+  line-height: normal;
+  letter-spacing: 0px;
+  text-align: center;
+  padding-top: 1.5rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con {
+  padding: 0 1.875rem 0.9375rem 1.875rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .distribution {
+  width: 33%;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .timeContent {
+  font-size: 1rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .timeContent p {
+  color: #7b7b7b;
+  margin-right: 1rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .timeContent span {
+  color: #000000;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .readUse .text {
+  font-size: 1rem;
+  margin-right: 1rem;
+  color: #7b7b7b;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .readUse .jumpToImg {
+  width: 8.75rem;
+  height: 2.5rem;
+  font-size: 1rem;
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 0.375rem;
+  background: linear-gradient(180deg, #3597fb 0%, #39e5ff 100%);
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con li {
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 1rem;
+  line-height: normal;
+  margin-right: 2.0625rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .grey {
+  color: #7b7b7b;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-con .blue {
+  color: #3396fb;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .hypertextContent {
+  background: #f6f6f6;
+  padding: 1.875rem;
+  overflow-y: auto;
+  margin: 0 1.875rem;
+  flex: 1;
+  font-size: 1rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-left .knowledgeDetails-left-bottom {
+  padding: 1.25rem 0;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right {
+  width: 22.625rem;
+  padding-left: 1.875rem;
+  display: flex;
+  flex-direction: column;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestArticles {
+  width: 100%;
+  height: 20.75rem;
+  background: #fff;
+  margin-bottom: 1.25rem;
+  padding: 1.25rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .relatedRecommendations {
+  flex: 1;
+  background: #fff;
+  padding: 1.25rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .knowledgeDetails-right-title {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .knowledgeDetails-right-title div {
+  font-size: 1rem;
+  color: #000000;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .knowledgeDetails-right-title span {
+  font-size: 0.875rem;
+  color: #3878ff;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .line {
+  width: 100%;
+  height: 1px;
+  background: #ededed;
+  margin: 0.5625rem 0 0.875rem 0;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList {
+  width: 100%;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: 1rem;
+  border: 1px solid #fff;
+  cursor: pointer;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item:hover {
+  border: 1px solid #409eff;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item:hover .latestList-item-text {
+  color: #3396fb;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item:last-child {
+  margin-bottom: 0;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item .latestList-item-image {
+  width: 6.25rem;
+  height: 4.5rem;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item .latestList-item-text {
+  width: 11.25rem;
+  font-size: 0.875rem;
+  color: #000000;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item .latestList-item-text .data {
+  color: #c7c7c7;
+  text-align: right;
+}
+.knowledgeFieldCon .knowledgeDetails .knowledgeDetails-right .latestList .latestList-item .latestList-item-text .latestList-item-text-title {
+  line-height: 1.125rem;
+  height: 3.5625rem;
+  display: -webkit-box;
+  /* 必须设置为弹性盒模型 */
+  -webkit-box-orient: vertical;
+  /* 设置盒子的排列方式为垂直 */
+  overflow: hidden;
+  /* 隐藏超出的文本 */
+  -webkit-line-clamp: 3;
+  /* 限制显示2行 */
+  text-overflow: ellipsis;
+  /* 超出的部分显示省略号 */
+}
+.knowledgeFieldCon .flex1 {
+  flex: 1;
+}
+.knowledgeFieldCon .flex {
+  display: flex;
+}
+.knowledgeFieldCon .flex-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.knowledgeFieldCon img {
+  width: 100%;
+  height: 100%;
+}
+.knowledgeFieldCon .wh100 {
+  width: 100%;
+  height: 100%;
+}
+.knowledgeFieldCon .linkButton {
+  color: #3396fb;
+  font-family: Microsoft YaHei UI;
+  font-weight: regular;
+  font-size: 1rem;
+  line-height: normal;
+  letter-spacing: 0px;
+  cursor: pointer;
+  position: relative;
+  z-index: 2;
+}
+.knowledgeFieldCon .dividingLine {
+  height: 0.0625rem;
+  background: #dcdfe6;
+  margin: 1.25rem 0;
+}
+.knowledgeFieldCon .pagination {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 0.625rem;
+}
+.knowledgeFieldCon .pagination button {
+  padding: 0.3125rem 0.625rem;
+  cursor: pointer;
+  background-color: #007bff;
+  color: white;
+  border: 0.0625rem solid #007bff;
+  border-radius: 0.3125rem;
+}
+.knowledgeFieldCon .pagination button:disabled {
+  background-color: #fff;
+  border-color: #d6d6d6;
+  cursor: not-allowed;
+  color: #000000;
+}
+.knowledgeFieldCon .pagination ul {
+  list-style-type: none;
+  display: flex;
+  gap: 0.3125rem;
+}
+.knowledgeFieldCon .pagination li {
+  padding: 0.3125rem 0.625rem;
+  cursor: pointer;
+  border: 0.0625rem solid #d6d6d6;
+  border-radius: 0.3125rem;
+}
+.knowledgeFieldCon .pagination li.active {
+  background-color: #007bff;
+  background: #007bff;
+  color: white;
+}
+.knowledgeFieldCon .pagination li:hover {
+  background-color: #007bff;
+  color: white;
+}
+.knowledgeFieldCon .pagination button {
+  padding: 0.3125rem 0.625rem;
+  margin: 0 0.3125rem;
+}
+.knowledgeFieldCon .paginationInput {
+  width: 3.75rem;
+  height: 2rem;
+  text-align: center;
+  border-radius: 0.1875rem;
+  background: #ffffff;
+  border: 0.0625rem solid #d6d6d6;
+  margin: 0 0.5rem;
+}
+.knowledgeFieldCon .paginationInput:focus {
+  border: 0.0625rem solid #3396fb;
+  outline: none;
+}
+.knowledgeFieldCon .paginationButton {
+  width: 3.75rem;
+  height: 2rem;
+  border-radius: 0.1875rem;
+  background: #f6f6f6;
+  border: 0.0625rem solid #d6d6d6;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 1rem;
+  color: #363636;
+  margin: 0 0.5rem;
+}
+.knowledgeFieldCon .paginationButton:hover {
+  background: #3396fb;
+  color: #fff;
+  border-color: #3396fb;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/knowledgeField.less

@@ -0,0 +1,422 @@
+.knowledgeFieldCon {
+  position: relative;
+  background: #f6f7fb;
+  height: 100%;
+  padding-top: 4.5rem;
+  display: flex;
+  // 知识园地
+  .knowledgeField {
+    flex: 1;
+    margin: 2.1875rem;
+    background: #fff;
+    border-radius: 0.25rem;
+    display: flex;
+    flex-direction: column;
+    .knowledgeField-header {
+      height: 4.5rem;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 1.5rem;
+      border-bottom: 0.0625rem solid #ededed;
+      .knowledgeInput {
+        width: 25rem;
+        height: 2.625rem;
+        box-sizing: border-box;
+        background: #f4f4f4;
+        border-radius: 2.625rem;
+        border: 1px solid #fff;
+        padding: 0 1.25rem;
+        margin-right: 0.8125rem;
+        &:focus {
+          border: 0.0625rem solid #3396fb;
+          outline: none;
+        }
+      }
+      .searchButton {
+        width: 7.1875rem;
+        height: 2.8125rem;
+        background: #3396fb;
+        border-radius: 0.375rem;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        color: #fff;
+        font-size: 1.125rem;
+      }
+      .knowledgeField-header-text {
+        color: #000000;
+        font-family: Microsoft YaHei UI;
+        font-weight: bold;
+        font-size: 20px;
+        line-height: normal;
+        letter-spacing: 0px;
+      }
+      .elInput {
+        width: 25.8125rem;
+        margin-right: 0.8125rem;
+        .elSelect {
+          width: 5rem;
+        }
+      }
+    }
+
+    .knowledgeField-content {
+      padding: 0 1.5625rem;
+      margin: 1.875rem 0;
+      overflow-y: auto;
+
+      .knowledgeField-content-item {
+        display: flex;
+        .image {
+          width: 10.1875rem;
+          height: 6.8125rem;
+          margin-right: 1.25rem;
+        }
+        .textContent {
+          width: 100.5rem;
+          div {
+            color: #000000;
+            font-family: Microsoft YaHei UI;
+            font-weight: regular;
+            font-size: 20px;
+            line-height: normal;
+            letter-spacing: 0px;
+            padding-bottom: 0.875rem;
+          }
+          p {
+            color: #7b7b7b;
+            font-family: Microsoft YaHei UI;
+            font-weight: regular;
+            font-size: 16px;
+            height: 2.5rem;
+            line-height: normal;
+            letter-spacing: 0px;
+            display: -webkit-box; /* 必须设置为弹性盒模型 */
+            -webkit-box-orient: vertical; /* 设置盒子的排列方式为垂直 */
+            overflow: hidden; /* 隐藏超出的文本 */
+            -webkit-line-clamp: 2; /* 限制显示2行 */
+            text-overflow: ellipsis; /* 超出的部分显示省略号 */
+            margin-bottom: 0.625rem;
+          }
+          span {
+            color: #3396fb;
+            font-family: Microsoft YaHei UI;
+            font-weight: regular;
+            font-size: 16px;
+            line-height: normal;
+            letter-spacing: 0px;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+
+    .knowledgeField-bottom {
+      padding: 1.5625rem 0;
+      font-size: 1rem !important;
+    }
+  }
+
+  // 知识详情
+  .knowledgeDetails {
+    padding: 1.25rem 2.1875rem;
+    display: flex;
+    justify-content: space-between;
+    position: relative;
+    .returnIcon {
+      position: absolute;
+      left: 4.0625rem;
+      top: 2.8125rem;
+      font-size: 1.5625rem;
+      z-index: 2;
+      cursor: pointer;
+    }
+    .returnIcon:hover {
+      color: #3396fb;
+    }
+
+    .knowledgeDetails-left {
+      width: 92.75rem;
+      background: #fff;
+      display: flex;
+      flex-direction: column;
+
+      .knowledgeDetails-left-title {
+        color: #000000;
+        font-family: Microsoft YaHei UI;
+        font-weight: bold;
+        font-size: 1.5rem;
+        line-height: normal;
+        letter-spacing: 0px;
+        text-align: center;
+        padding-top: 1.5rem;
+      }
+
+      .knowledgeDetails-left-con {
+        padding: 0 1.875rem 0.9375rem 1.875rem;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        .distribution {
+          width: 33%;
+        }
+        .timeContent {
+          font-size: 1rem;
+          p {
+            color: #7b7b7b;
+            margin-right: 1rem;
+          }
+          span {
+            color: #000000;
+          }
+        }
+        .readUse {
+          .text {
+            font-size: 1rem;
+            margin-right: 1rem;
+            color: #7b7b7b;
+          }
+          .jumpToImg {
+            width: 8.75rem;
+            height: 2.5rem;
+            font-size: 1rem;
+            color: #fff;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-radius: .375rem;
+            background: linear-gradient(180deg, #3597fb 0%, #39e5ff 100%);
+          }
+        }
+        li {
+          font-family: Microsoft YaHei UI;
+          font-weight: regular;
+          font-size: 1rem;
+          line-height: normal;
+          margin-right: 2.0625rem;
+        }
+        .grey {
+          color: #7b7b7b;
+        }
+        .blue {
+          color: #3396fb;
+        }
+      }
+
+      .hypertextContent {
+        background: #f6f6f6;
+        padding: 1.875rem;
+        overflow-y: auto;
+        margin: 0 1.875rem;
+        flex: 1;
+        font-size: 1rem;
+      }
+
+      .knowledgeDetails-left-bottom {
+        padding: 1.25rem 0;
+      }
+    }
+
+    .knowledgeDetails-right {
+      width: 22.625rem;
+      padding-left: 1.875rem;
+      display: flex;
+      flex-direction: column;
+      .latestArticles {
+        width: 100%;
+        height: 20.75rem;
+        background: #fff;
+        margin-bottom: 1.25rem;
+        padding: 1.25rem;
+      }
+      .relatedRecommendations {
+        flex: 1;
+        background: #fff;
+        padding: 1.25rem;
+      }
+      .knowledgeDetails-right-title {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        div {
+          font-size: 1rem;
+          color: #000000;
+        }
+        span {
+          font-size: 0.875rem;
+          color: #3878ff;
+          cursor: pointer;
+        }
+      }
+      .line {
+        width: 100%;
+        height: 1px;
+        background: #ededed;
+        margin: 0.5625rem 0 0.875rem 0;
+      }
+      .latestList {
+        width: 100%;
+        .latestList-item {
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          margin-bottom: 1rem;
+          border: 1px solid #fff;
+          cursor: pointer;
+          &:hover {
+            border: 1px solid #409eff;
+            .latestList-item-text {
+              color: #3396fb;
+            }
+          }
+          &:last-child {
+            margin-bottom: 0;
+          }
+          .latestList-item-image {
+            width: 6.25rem;
+            height: 4.5rem;
+          }
+          .latestList-item-text {
+            width: 11.25rem;
+            font-size: 0.875rem;
+            color: #000000;
+            .data {
+              color: #c7c7c7;
+              text-align: right;
+            }
+            .latestList-item-text-title {
+              line-height: 1.125rem;
+              height: 3.5625rem;
+              display: -webkit-box; /* 必须设置为弹性盒模型 */
+              -webkit-box-orient: vertical; /* 设置盒子的排列方式为垂直 */
+              overflow: hidden; /* 隐藏超出的文本 */
+              -webkit-line-clamp: 3; /* 限制显示2行 */
+              text-overflow: ellipsis; /* 超出的部分显示省略号 */
+            }
+          }
+        }
+      }
+    }
+  }
+
+  .flex1 {
+    flex: 1;
+  }
+  .flex {
+    display: flex;
+  }
+  .flex-center {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+  img {
+    width: 100%;
+    height: 100%;
+  }
+  .wh100 {
+    width: 100%;
+    height: 100%;
+  }
+
+  .linkButton {
+    color: #3396fb;
+    font-family: Microsoft YaHei UI;
+    font-weight: regular;
+    font-size: 1rem;
+    line-height: normal;
+    letter-spacing: 0px;
+    cursor: pointer;
+    position: relative;
+    z-index: 2;
+  }
+
+  .dividingLine {
+    height: 0.0625rem;
+    background: #dcdfe6;
+    margin: 1.25rem 0;
+  }
+
+  .pagination {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 0.625rem;
+  }
+
+  .pagination button {
+    padding: 0.3125rem 0.625rem;
+    cursor: pointer;
+    background-color: #007bff;
+    color: white;
+    border: 0.0625rem solid #007bff;
+    border-radius: 0.3125rem;
+  }
+
+  .pagination button:disabled {
+    background-color: #fff;
+    border-color: #d6d6d6;
+    cursor: not-allowed;
+    color: #000000;
+  }
+
+  .pagination ul {
+    list-style-type: none;
+    display: flex;
+    gap: 0.3125rem;
+  }
+
+  .pagination li {
+    padding: 0.3125rem 0.625rem;
+    cursor: pointer;
+    border: 0.0625rem solid #d6d6d6;
+    border-radius: 0.3125rem;
+  }
+
+  .pagination li.active {
+    background-color: #007bff;
+    background: #007bff;
+    color: white;
+  }
+
+  .pagination li:hover {
+    background-color: #007bff;
+    color: white;
+  }
+  .pagination button {
+    padding: 0.3125rem 0.625rem;
+    margin: 0 0.3125rem;
+  }
+  .paginationInput {
+    width: 3.75rem;
+    height: 2rem;
+    text-align: center;
+    border-radius: 0.1875rem;
+    background: #ffffff;
+    border: 0.0625rem solid #d6d6d6;
+    margin: 0 0.5rem;
+    &:focus {
+      border: 0.0625rem solid #3396fb;
+      outline: none;
+    }
+  }
+  .paginationButton {
+    width: 3.75rem;
+    height: 2rem;
+    border-radius: 0.1875rem;
+    background: #f6f6f6;
+    border: 0.0625rem solid #d6d6d6;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 1rem;
+    color: #363636;
+    margin: 0 0.5rem;
+    &:hover {
+      background: #3396fb;
+      color: #fff;
+      border-color: #3396fb;
+    }
+  }
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/magnific-popup.css

@@ -0,0 +1,351 @@
+/* Magnific Popup CSS */
+.mfp-bg {
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1042;
+  overflow: hidden;
+  position: fixed;
+  background: #0b0b0b;
+  opacity: 0.8; }
+
+.mfp-wrap {
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1043;
+  position: fixed;
+  outline: none !important;
+  -webkit-backface-visibility: hidden; }
+
+.mfp-container {
+  text-align: center;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  padding: 0 8px;
+  box-sizing: border-box; }
+
+.mfp-container:before {
+  content: '';
+  display: inline-block;
+  height: 100%;
+  vertical-align: middle; }
+
+.mfp-align-top .mfp-container:before {
+  display: none; }
+
+.mfp-content {
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+  margin: 0 auto;
+  text-align: left;
+  z-index: 1045; }
+
+.mfp-inline-holder .mfp-content,
+.mfp-ajax-holder .mfp-content {
+  width: 100%;
+  cursor: auto; }
+
+.mfp-ajax-cur {
+  cursor: progress; }
+
+.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
+  cursor: -moz-zoom-out;
+  cursor: -webkit-zoom-out;
+  cursor: zoom-out; }
+
+.mfp-zoom {
+  cursor: pointer;
+  cursor: -webkit-zoom-in;
+  cursor: -moz-zoom-in;
+  cursor: zoom-in; }
+
+.mfp-auto-cursor .mfp-content {
+  cursor: auto; }
+
+.mfp-close,
+.mfp-arrow,
+.mfp-preloader,
+.mfp-counter {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none; }
+
+.mfp-loading.mfp-figure {
+  display: none; }
+
+.mfp-hide {
+  display: none !important; }
+
+.mfp-preloader {
+  color: #CCC;
+  position: absolute;
+  top: 50%;
+  width: auto;
+  text-align: center;
+  margin-top: -0.8em;
+  left: 8px;
+  right: 8px;
+  z-index: 1044; }
+  .mfp-preloader a {
+    color: #CCC; }
+    .mfp-preloader a:hover {
+      color: #FFF; }
+
+.mfp-s-ready .mfp-preloader {
+  display: none; }
+
+.mfp-s-error .mfp-content {
+  display: none; }
+
+button.mfp-close,
+button.mfp-arrow {
+  overflow: visible;
+  cursor: pointer;
+  background: transparent;
+  border: 0;
+  -webkit-appearance: none;
+  display: block;
+  outline: none;
+  padding: 0;
+  z-index: 1046;
+  box-shadow: none;
+  touch-action: manipulation; }
+
+button::-moz-focus-inner {
+  padding: 0;
+  border: 0; }
+
+.mfp-close {
+  width: 44px;
+  height: 44px;
+  line-height: 44px;
+  position: absolute;
+  right: 0;
+  top: 0;
+  text-decoration: none;
+  text-align: center;
+  opacity: 0.65;
+  padding: 0 0 18px 10px;
+  color: #FFF;
+  font-style: normal;
+  font-size: 28px;
+  font-family: Arial, Baskerville, monospace; }
+  .mfp-close:hover,
+  .mfp-close:focus {
+    opacity: 1; }
+  .mfp-close:active {
+    top: 1px; }
+
+.mfp-close-btn-in .mfp-close {
+  color: #333; }
+
+.mfp-image-holder .mfp-close,
+.mfp-iframe-holder .mfp-close {
+  color: #FFF;
+  right: -6px;
+  text-align: right;
+  padding-right: 6px;
+  width: 100%; }
+
+.mfp-counter {
+  position: absolute;
+  top: 0;
+  right: 0;
+  color: #CCC;
+  font-size: 12px;
+  line-height: 18px;
+  white-space: nowrap; }
+
+.mfp-arrow {
+  position: absolute;
+  opacity: 0.65;
+  margin: 0;
+  top: 50%;
+  margin-top: -55px;
+  padding: 0;
+  width: 90px;
+  height: 110px;
+  -webkit-tap-highlight-color: transparent; }
+  .mfp-arrow:active {
+    margin-top: -54px; }
+  .mfp-arrow:hover,
+  .mfp-arrow:focus {
+    opacity: 1; }
+  .mfp-arrow:before,
+  .mfp-arrow:after {
+    content: '';
+    display: block;
+    width: 0;
+    height: 0;
+    position: absolute;
+    left: 0;
+    top: 0;
+    margin-top: 35px;
+    margin-left: 35px;
+    border: medium inset transparent; }
+  .mfp-arrow:after {
+    border-top-width: 13px;
+    border-bottom-width: 13px;
+    top: 8px; }
+  .mfp-arrow:before {
+    border-top-width: 21px;
+    border-bottom-width: 21px;
+    opacity: 0.7; }
+
+.mfp-arrow-left {
+  left: 0; }
+  .mfp-arrow-left:after {
+    border-right: 17px solid #FFF;
+    margin-left: 31px; }
+  .mfp-arrow-left:before {
+    margin-left: 25px;
+    border-right: 27px solid #3F3F3F; }
+
+.mfp-arrow-right {
+  right: 0; }
+  .mfp-arrow-right:after {
+    border-left: 17px solid #FFF;
+    margin-left: 39px; }
+  .mfp-arrow-right:before {
+    border-left: 27px solid #3F3F3F; }
+
+.mfp-iframe-holder {
+  padding-top: 40px;
+  padding-bottom: 40px; }
+  .mfp-iframe-holder .mfp-content {
+    line-height: 0;
+    width: 100%;
+    max-width: 900px; }
+  .mfp-iframe-holder .mfp-close {
+    top: -40px; }
+
+.mfp-iframe-scaler {
+  width: 100%;
+  height: 0;
+  overflow: hidden;
+  padding-top: 56.25%; }
+  .mfp-iframe-scaler iframe {
+    position: absolute;
+    display: block;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+    background: #000; }
+
+/* Main image in popup */
+img.mfp-img {
+  width: auto;
+  max-width: 100%;
+  height: auto;
+  display: block;
+  line-height: 0;
+  box-sizing: border-box;
+  padding: 40px 0 40px;
+  margin: 0 auto; }
+
+/* The shadow behind the image */
+.mfp-figure {
+  line-height: 0; }
+  .mfp-figure:after {
+    content: '';
+    position: absolute;
+    left: 0;
+    top: 40px;
+    bottom: 40px;
+    display: block;
+    right: 0;
+    width: auto;
+    height: auto;
+    z-index: -1;
+    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+    background: #444; }
+  .mfp-figure small {
+    color: #BDBDBD;
+    display: block;
+    font-size: 12px;
+    line-height: 14px; }
+  .mfp-figure figure {
+    margin: 0; }
+
+.mfp-bottom-bar {
+  margin-top: -36px;
+  position: absolute;
+  top: 100%;
+  left: 0;
+  width: 100%;
+  cursor: auto; }
+
+.mfp-title {
+  text-align: left;
+  line-height: 18px;
+  color: #F3F3F3;
+  word-wrap: break-word;
+  padding-right: 36px; }
+
+.mfp-image-holder .mfp-content {
+  max-width: 100%; }
+
+.mfp-gallery .mfp-image-holder .mfp-figure {
+  cursor: pointer; }
+
+@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
+  /**
+       * Remove all paddings around the image on small screen
+       */
+  .mfp-img-mobile .mfp-image-holder {
+    padding-left: 0;
+    padding-right: 0; }
+  .mfp-img-mobile img.mfp-img {
+    padding: 0; }
+  .mfp-img-mobile .mfp-figure:after {
+    top: 0;
+    bottom: 0; }
+  .mfp-img-mobile .mfp-figure small {
+    display: inline;
+    margin-left: 5px; }
+  .mfp-img-mobile .mfp-bottom-bar {
+    background: rgba(0, 0, 0, 0.6);
+    bottom: 0;
+    margin: 0;
+    top: auto;
+    padding: 3px 5px;
+    position: fixed;
+    box-sizing: border-box; }
+    .mfp-img-mobile .mfp-bottom-bar:empty {
+      padding: 0; }
+  .mfp-img-mobile .mfp-counter {
+    right: 5px;
+    top: 3px; }
+  .mfp-img-mobile .mfp-close {
+    top: 0;
+    right: 0;
+    width: 35px;
+    height: 35px;
+    line-height: 35px;
+    background: rgba(0, 0, 0, 0.6);
+    position: fixed;
+    text-align: center;
+    padding: 0; } }
+
+@media all and (max-width: 900px) {
+  .mfp-arrow {
+    -webkit-transform: scale(0.75);
+    transform: scale(0.75); }
+  .mfp-arrow-left {
+    -webkit-transform-origin: 0;
+    transform-origin: 0; }
+  .mfp-arrow-right {
+    -webkit-transform-origin: 100%;
+    transform-origin: 100%; }
+  .mfp-container {
+    padding-left: 6px;
+    padding-right: 6px; } }

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/projectt.css

@@ -0,0 +1,905 @@
+@charset "utf-8";
+
+html {font-size: 10px; -webkit-text-size-adjust:none; -webkit-tap-highlight-color: rgba(0,0,0,0);}
+@media screen and (min-width:320px){html{font-size:    10px;}}
+@media screen and (min-width:360px){html{font-size: 11.25px;}}
+@media screen and (min-width:375px){html{font-size: 11.7px;}}
+@media screen and (min-width:480px){html{font-size:    15px;}}
+@media screen and (min-width:414px){html{font-size:  13px;}}
+@media screen and (min-width:560px){html{font-size:  17.5px;}}
+@media screen and (min-width:640px){html{font-size:    20px;}}
+
+.contentes {
+    width: 81.25rem;
+    margin: auto;
+    position: relative;
+}
+.contentes img {
+    width: 100%;
+    height: 100%;
+}
+
+.bor {
+    box-shadow: 0 0 .5rem .75rem #e6e9ef;
+}
+.bannar {
+    position: relative;
+}
+.bannarText {
+    position: absolute;
+    left: 10.75rem;
+    top: 11rem;
+}
+.bannarText h4 {
+    font-size: 3.4375rem;
+    font-family: '黑体';
+    letter-spacing: 5px;
+}
+.bannarText p {
+    font-size: 18px;
+    font-style: oblique;
+    color: #afafaf;
+    letter-spacing: 5px;
+    margin-top: 1.875rem;
+}
+.bannarText a {
+    color: #fff;
+}
+.bannarText div {
+    width: 145px;
+    line-height: 48px;
+    background: #FB674B;
+    letter-spacing: 3px;
+    text-align: center;
+    margin-top: 42px;
+    font-size: 21px;
+    border-radius: 10px;
+}
+
+
+/* 团队协作 */
+.collaborationTeam {
+    width: 100%;
+    background: #ffffff;
+    height: 250vh;
+}
+.collTeam {
+    height: 100vh;
+    box-sizing: border-box;
+    position: sticky;
+    top: 6.375rem;
+}
+.collCent {
+    height: 40rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.collCentImg {
+    width: 7.5rem;
+    height: 8.75rem;
+    margin-right: 3.125rem;
+    position: relative;
+    z-index: 2;
+}
+.collCentFonts {
+    font-size: 2.25rem;
+    color: #333;
+    overflow: hidden;
+    width: 32.5rem;
+    padding-left: 2.5rem;
+}
+.collCentFonts span {
+    color: #5e95f8;
+}
+
+/* 项目模板 */
+.templateProject {
+    width: 100%;
+    background: #fafbfd;
+    height: 300vh;
+}
+.templat{
+    height: 100vh;
+    box-sizing: border-box;
+    position: sticky;
+    top: 6.375rem;
+    overflow: hidden;
+}
+.templat h2 {
+    font-size: 2.25rem;
+    color: #333;
+    padding: 2.5rem 0 2.4rem 0;
+    text-align: center;
+    font-weight: normal;
+    letter-spacing: .3125rem
+}
+.templat span {
+    font-size: 3rem;
+    color: #01bea8;
+}
+.templat i {
+    font-style: normal;
+    font-size: 3rem;
+    color: #3dc9ff;
+}
+.templatCon {
+    position: relative;
+}
+.templatOne, .templatTwo, .templatThree, .templatFour {
+    border-radius: .625rem;
+}
+.templatOne {
+    width: 17.625rem;
+    height: 32.25rem;
+    position: absolute;
+    z-index: 2;
+    right: 2.1875rem;
+    top: 3.125rem;
+}
+.templatTwo {
+    width: 58.3125rem;
+    height: 28.3125rem;
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    left: 11.4375rem;
+}
+.templatThree {
+    width: 19.4375rem;
+    height: 21.4375rem;
+    position: absolute;
+    z-index: 3;
+    top: 16.25rem;
+    right: 17.5rem;
+}
+.templatFour {
+    width: 27.125rem;
+    height: 16.5rem;
+    position: absolute;
+    z-index: 2;
+    left: 2.8125rem;
+    top: 17.5rem;
+}
+
+/* 跨部门 */
+.acrossDepartments {
+    background: #ffffff;
+    position: relative;
+    z-index: 3;
+}
+.acrossDepartments h2{
+    font-size: 2.25rem;
+    font-weight: normal;
+    color: #333;
+    letter-spacing: .3125rem;
+    padding: 2.1875rem 0 150px 0;
+}
+.acrossDepartments span {
+    color: #01bea8;
+}
+.acrossCon {
+    display: flex;
+    justify-content: space-around;
+    padding-bottom: 8.75rem;
+}
+.acrossConOne, .acrossConTwo {
+    width: 20.25rem;
+    height: 20.1875rem;
+    position: relative;
+}
+.acrossConOne {
+    background: url(../image/projectImg/acrossLeft.jpg) no-repeat center;
+    background-size: 100% 100%;
+}
+.acrossConTwo {
+    background: url(../image/projectImg/acrossRight.jpg) no-repeat center;
+    background-size: 100% 100%;
+}
+.acrossIonsOne {
+    width: 7.5rem;
+    height: 7.5rem;
+    border: .0625rem solid #e0efee;
+    border-radius: 50%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: absolute;
+    transition: all 0.5s;
+    cursor:pointer;
+}
+.acrossIonsOne:hover {
+    transform: scale(1.2);
+}
+.acsTop {
+    background: linear-gradient(to top,#1de7e5,#4ab8f9);
+}
+.acsBon {
+    background: linear-gradient(to top,#4ab8f9,#1de7e5);
+}
+.acsLeft {
+    background: linear-gradient(to right,#4ab8f9,#1de7e5);
+}
+.acsRight {
+    background: linear-gradient(to right,#1de7e5,#4ab8f9);
+}
+
+.acsTops {
+    background: linear-gradient(to top,#82a6d7,#55749f);
+}
+.acsBons {
+    background: linear-gradient(to top,#55749f,#82a6d7);
+}
+.acsLefts {
+    background: linear-gradient(to right,#55749f,#82a6d7);
+}
+.acsRights {
+    background: linear-gradient(to right,#82a6d7,#55749f);
+}
+.acrossIonsTwo {
+    width: 6.875rem;
+    height: 6.875rem;
+    border-radius: 50%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.acrossIonsThree {
+    width: 5.4375rem;
+    height: 5.4375rem;
+    border-radius: 50%;
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    background: #ffffff;
+}
+.acrossIonsThree p {
+    font-size: 1rem;
+    width: 100%;
+    text-align: center;
+    color: #333;
+    margin-top: 22px;
+    margin-bottom: 20px;
+}
+.acrossIonsThree div {
+    width: 1.875rem;
+    height: 1.875rem;
+    margin-top: -1.5625rem;
+}
+
+/* 新版跨部门 */
+.multipleRoles {
+    background: #ffffff;
+    position: relative;
+    z-index: 3;
+    padding: 4.6875rem 0 6.25rem 0;
+}
+.multCons {
+    display: flex;
+    justify-content: space-between;
+}
+.multipleRolesLeft, .multipleRolesRight {
+    width: 50%;
+    box-sizing: border-box;
+    position: relative;
+}
+.muDiv {
+    display: inline-block;
+    font-size: 2.375rem;
+    color: #333333;
+    font-family: '黑体';
+}
+.muDiv span {
+    color: #f3ac47;
+    font-size: 2.625rem;
+    text-align: center;
+}
+.muRoLezc {
+    float: left;
+    margin-left: 10.9375rem;
+}
+.muRoLetd {
+    padding-top: 4.375rem;
+    padding-left: 2.8125rem;
+}
+.outerRing {
+    width: 31.25rem;
+    height: 31.25rem;
+    padding-top: 1.25rem;
+    position: relative;
+}
+.outerRingNei {
+    position: absolute;
+    width: 16.25rem;
+    height: 16.25rem;
+    top: 50%;
+    left: 50%;
+    margin-left: -8.125rem;
+    margin-top: -8.125rem;
+}
+.multipWaiCont {
+    width: 4.6875rem;
+    height: 4.6875rem;
+    background: #3c86df;
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: .9375rem;
+}
+.multipWaiCont div {
+    width: 2.1875rem;
+    height: 2.1875rem;
+}
+.multipWai {
+    width: 4.6875rem;
+    position: absolute;
+}
+.multipWai p {
+    width: 100%;
+    text-align: center;
+    font-size: 1.125rem;
+    color: #333;
+}
+
+/* 支持多种行业和场景使用 */
+.industryScenario {
+    background: #ffffff;
+}
+.industryScenario h2 {
+    text-align: center;
+    font-size: 2.25rem;
+    color: #333;
+    margin-top: 1.875rem;
+    font-weight: normal;
+}
+.industryScenario h2 p {
+    font-size: 1.125rem;
+    color: #666666;
+    margin-top: 1.25rem;
+}
+.industryCon {
+    width: 100%;
+    margin-top: 1.5625rem;
+    margin-bottom: 40px;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+}
+.industryConOverlap {
+    width: 24.375rem;
+    height: 16.75rem;
+    background: #f5f5f5;
+    border-radius: .3125rem;
+    box-sizing: border-box;
+    padding: 2.8125rem 2.625rem 0 2.625rem;
+    margin-bottom: 3.125rem;
+    box-shadow: 9px 8px 11px #e9e9e9;
+}
+.industryConOverlapTil {
+    font-size: 1.5rem;
+    color: #333;
+    line-height: 2.5rem;
+    display: flex;
+    justify-content: center;
+}
+.industryConOverlapTil div {
+    width: 11.25rem;
+    height: 2.5rem;
+    display: inline-block;
+    margin-right: .625rem;
+    border-radius: 2.5rem;
+    text-align: center;
+    margin-left: -0.625rem;
+    color: #ffffff;
+}
+.industryConOverlapTil p {
+    display: inline-block;
+}
+.industryConOverlapTex {
+    font-size: 1.5rem;
+    color: #666666;
+    font-family: 宋体;
+    margin-top: .9375rem;
+    line-height: 1.875rem;
+}
+.industryConOverlapBtn {
+    font-size: 1.125rem;
+    margin-top: 1.875rem;
+    margin-left: -0.75rem;
+}
+
+/* 用户评价 */
+.userEvaluation {
+    background: #4a65ac;
+    width: 100%;
+    overflow: hidden;
+    position: relative;
+}
+.userEvaluationzuobian {
+    width: 33rem;
+    height: 100%;
+    background: #4a65ac;
+    position: absolute;
+    z-index: 2;
+    top: 0%;
+    left: 0%;
+}
+.inBlock {
+    display: inline-block;
+}
+.userEvaluationLeft {
+    margin-right: 10.625rem;
+    float: left;
+    position: relative;
+    z-index: 3;
+}
+.userEvaluationLeft h2 {
+    font-size: 3.125rem;
+    color: #ffffff;
+    font-weight: normal;
+    margin-top: 8.75rem;
+    margin-bottom: 2.1875rem;
+}
+.userEvaluationLeft p {
+    font-size: 1rem;
+    color: #ffffff;
+}
+.userEvaluationLeft div {
+    width: 10rem;
+    height: 3.125rem;
+    border-radius: 3.125rem;
+    border: .125rem solid #ffffff;
+    text-align: center;
+    line-height: 50px;
+    font-size: 1.125rem;
+    color: #ffffff;
+    margin-top: 6.25rem;
+    margin-bottom: 10.25rem;
+    background: #3f5697;
+}
+.userEvaluationRight {
+    width: 4100px;
+    display: flex;
+    /* justify-content: space-between; */
+    position: relative;
+    margin-top: 9.1875rem;
+    margin-bottom: 7.5rem;
+}
+.userEvaluationRightCon {
+    width: 23.125rem;
+    height: 18.4375rem;
+    background: #fff;
+    border-radius: .625rem;
+    padding: 2.1875rem;
+    box-sizing: border-box;
+    position: relative;
+    margin-right: 1.875rem;
+}
+.userEvaluationRightConIMg {
+    width: 7.5rem;
+    height: 7.5rem;
+    border-radius: 50%;
+    position: absolute;
+    top: -3.75rem;
+    left: 2.1875rem;
+    /* background: red; */
+    overflow: hidden;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: #fff;
+    border: 1px solid #bdbdbd;
+}
+.userEvaluationRightConTex {
+
+}
+.userEvaluationRightConTex p{
+    font-size: 1.75rem;
+    color: #333;
+    margin-top: 3.75rem;
+    margin-bottom: 1.125rem;
+}
+.userEvaluationRightConTex span {
+    font-size: .875rem;
+    color: #666666;
+    line-height: 1.5625rem;
+}
+.userKongz {
+    width: 46.25rem;
+}
+
+.kehusab {
+    width: 10rem;
+    padding: -2.5rem 0 0 0;
+    display: flex;
+    justify-content: space-between;
+    margin-top: -60px;
+    margin-bottom: 40px;
+}
+.kehuLefts, .kehuRights {
+    width: 3.75rem;
+    height: 3.75rem;
+    border-radius: 50%;
+    background: #fff;
+    text-align: center;
+    line-height: 4.375rem;
+    display: inline-block;
+    position: relative;
+    cursor:pointer;
+}
+.kehusab img {
+    width: 1.25rem;
+    height: 1.25rem;
+}
+.kehusab .zhis {
+    cursor: not-allowed !important;
+}
+
+/* 新产品定价 */
+.pricingsCon {
+   width: 62.5rem;
+    margin: auto;
+}
+.pricingsConTop {
+    display: flex;
+    flex-wrap: wrap;
+    box-shadow: 0 0 20px 1px #b1b1b1;
+    border-radius: .625rem;
+    /* border-bottom: 1px solid #333; */
+    /* border-right: 1px solid #333;  */
+}
+.pricingsConTop div {
+    color: #333333;
+    width: 50%;
+    line-height: 3.75rem;
+    text-align: center;
+    font-size: 1.25rem;
+    box-sizing: border-box;
+    border-top: 1px solid #939393;
+    /* border-left: 1px solid #333; */
+}
+
+/* 产品定价 */
+.pricings {
+    width: 100%;
+    max-width: 120rem;
+    height: 58.8125rem;
+    margin: auto;
+    /* background: url(../image/dingj.jpg) no-repeat center; */
+    /* background-size: 120rem 58.8125rem; */
+}
+.pri {
+    display: flex;
+    justify-content: space-between;
+    width: 78rem;
+    margin: auto;
+}
+.tooltipTis {
+    width: 75rem;
+    margin: auto;
+    text-align: center;
+    font-size: 1.75rem;
+    position: relative;
+    top: -3.125rem;
+    /* transform: translate(100rem,0); */
+}
+.tooltipTisFillCons {
+    animation: moves 2s;
+    animation-fill-mode: both; 
+}
+
+@keyframes moves {
+    0%{
+        transform: translate(100rem,0);
+    }
+    100%{
+        transform: translate(0,0);
+    }
+} 
+.li {
+    text-align: center;
+    background: #fff;
+    padding: 10px;
+    box-shadow: 0rem .0625rem 1.25rem 0rem #c8c8c8;
+    cursor: pointer;
+    transition: all  .25s  ease-in;
+}
+.li_con {
+    width: 240px;
+    height: 168px;
+    background: #f3f3f3;
+    box-sizing: border-box;
+    padding-top: 46px;
+}
+.li_con div {
+    width: 100%;
+    text-align: center;
+    font-size: 24px;
+    color: #565656;
+    margin-bottom: 22px;
+}
+.li_con div span{
+    font-size: 28px;
+}
+.li li {
+    width: 100%;
+    height: 32px;
+    font-size: 14.4px;
+    line-height: 32px;
+    text-align: center;
+    list-style-type:none;
+    color: #b5b0b0;
+}
+.li li:nth-child(2n) {
+    background: #f3f3f3;
+}
+.btn {
+    width: 140px;
+    height: 40px;
+    margin: auto;
+    background-image: url(../image/xg.png);
+    background-size: 100% 100%;
+    margin-bottom: 19.2px;
+    border: 0;
+    background-repeat: no-repeat;
+}
+.li:hover {
+    transform:translateY(-1.25rem);
+}
+.li:hover .btn{
+    background: url(../image/xgs.png);
+    background-size: 100% 100%;
+    background-repeat:no-repeat;
+}
+.li:hover .li_con{
+    background: linear-gradient(to left,#4daefe,#01f1fe);
+}
+.li:hover .li_con div{
+    color: #fff;
+}
+.btn a {
+    display: inline-block;
+    width: 100%;
+    height: 100%;
+}
+.al a{
+    color: #407be7 !important;
+}
+.al {
+    position: relative;
+}
+.al::after {
+    content: '';
+    width: 100%;
+    height: 3px;
+    background: #407be7;
+    position: absolute;
+    bottom: -20px;
+    left: 0;
+}
+.pricings h2 {
+    font-size: 2.625rem;
+    color: #333;
+    padding: 6.25rem 5rem 4rem 5rem;
+}
+
+/* 底部 */
+.footer-frame {
+	width: 100%;
+	height: 24px;
+}
+
+.footer {
+	padding-top: 48px;
+	padding-bottom: 8px;
+	background-color: #20a0ff;
+    margin-top: -0.125rem;
+}
+
+.footer .footer-col {
+	margin-bottom: 36px;
+}
+
+.footer h4 {
+	margin-bottom: 10px;
+	color: #fff;
+}
+
+.footer .list-unstyled,
+.footer p {
+	color: #f3f7fd;
+}
+
+.footer .footer-col.middle .list-unstyled .fas {
+	color: #fff;
+	font-size: 8px;
+	line-height: 24px;
+}
+
+.footer .footer-col.middle .list-unstyled .media-body {
+	margin-left: 8px;
+}
+
+.footer .footer-col.last .list-unstyled .fas {
+	color: #fff;
+	font-size: 14px;
+	line-height: 24px;
+}
+
+.footer .footer-col.last .list-unstyled .media-body {
+	margin-left: 10px;
+}
+
+.footer .footer-col.last .list-unstyled .fas.fa-globe {
+	margin-left: 16px;
+	margin-right: 10px;
+}
+
+.navbar {
+    padding: 0 !important;
+}
+
+.ulss {
+    display: inline-block;
+}
+.alss {
+    display: flex;
+    justify-content: space-around;
+    width: 87.5rem;
+    margin: auto;
+}
+
+.copyright {
+    width: 100%;
+    text-align: center;
+    line-height: 2.5rem;
+    color: #fff;
+    font-size: 1rem;
+    background: #20a0ff;
+    border-top: 1px solid #565656;
+}
+
+/* 质询图标 */
+.consulting {
+    width: 3.125rem;
+    height: 3.125rem;
+    border-radius: 50%;
+    background: #fff;
+    position: fixed;
+    bottom: 3.75rem;
+    right: 6.25rem;
+    z-index: 4;
+    box-shadow: 0 0 1.25rem 0px #cbcbcb;
+    cursor:pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+.consulting:hover {
+    background: #3396FB;
+}
+.conImgConImg {
+    width: 2.5rem;
+    height: 2.5rem;
+    position: relative;
+    margin-top: 1.5625rem;
+    margin-left: 1.125rem;
+}
+.conImgConImg img{
+    width: 100%;
+}
+
+/* 咨询 */
+.zhixun {
+    display: block;
+    position: fixed;
+    bottom: 7.5rem;
+    right: 2.5rem;
+    padding: 1rem;
+    background: #fff;
+    box-shadow: .1875rem .1875rem .625rem #ccc;
+    z-index: 99999999;
+    text-align: center;
+}
+.zhixun p {
+    margin: 8px 0;
+}
+.zhixun img {
+    width: 8rem;
+}
+
+.tabOn {
+    background: #fff;
+    color: #20a0ff !important;
+}
+
+/* 产品介绍 */
+.product {
+    width: 100%;
+    position: fixed;
+    z-index: 10;
+    top: 6.25rem;
+    left: 0;
+    background: #fff;
+    height: 20.75rem;
+    border-top: .0625rem solid rgb(163, 163, 163);
+    box-shadow: 1px 3px 5px 0px #ddd;
+}
+.connont {
+    width: 81.25rem;
+    margin: auto;
+}
+
+.tils::before {
+    content:"";
+    height: .125rem;
+    width: 100%;
+    bottom: 0;
+    left: 0;
+    background: #37B8FF;
+    position: absolute;
+}
+/* 导航下拉 */
+.management {
+    margin-top: 1.25rem;
+    width: 33.75rem;
+    font-size: 1rem;
+}
+.management h3 {
+    width: 100%;
+    font-size: 1rem;
+    font-weight: normal;
+    color: #333333;
+    line-height: 2.5rem;
+    border-bottom: .0625rem solid rgb(180, 180, 180);
+    margin-left: 1.25rem;
+}
+.management ul {
+    margin-top: .625rem;
+    width: 11.25rem;
+}
+.management li{
+    margin-top: .625rem;
+    line-height: 2.5rem;
+    cursor:pointer;
+    padding-left: 1.25rem;
+}
+.management a {
+    color: #333;
+}
+.management li:hover {
+    background: #F0F4FF;
+    border-radius: .625rem;
+    color: #3370FF;
+}
+
+/* js锁添加的样式 */
+.tils::before {
+    content:"";
+    height: .125rem;
+    width: 100%;
+    bottom: 0rem;
+    left: 0;
+    background: #37B8FF;
+    position: absolute;
+}
+.hanAll {
+    background: #fff !important;
+    box-shadow: .0625rem .1875rem .3125rem 0px #ddd;
+}
+.abc .til {
+    color: #3c86df !important;
+}
+.abc .til a{
+    color: #3c86df !important;
+}
+.navigationBarBack {
+    background: #f6fef9;
+}
+.navigationTitle a {
+    color: #333 !important;
+}
+.navigationTitle {
+    color: #333 !important;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/reset.css

@@ -0,0 +1,105 @@
+/* 重置样式 */
+body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
+dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
+pre, /* text formatting elements 文本格式元素 */
+form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
+th, td /* table elements 表格元素 */ {
+  margin: 0;
+  padding: 0;
+}
+body {background:#fff}   /* 重置body 页面背景为白色 */
+body,th,td,input,select,textarea,button {  /* 重置页面文字属性 */
+      font-size:12px;line-height:1 ;font-family:"微软雅黑", "黑体","宋体";
+}
+
+/** css重置样式标签的样式 **/
+/* h1 { font-size: 18px;}
+h2 { font-size: 16px; }
+h3 { font-size: 14px; }
+h4, h5, h6 { font-size: 100%; } */
+address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal}  /* 将斜体扶正*/
+code, kbd, pre, samp { font-family: courier new, courier, monospace; } /* 统一等宽字体 */
+small { font-size: 12px; } /* 小于 12px 的中文很难阅读，让 small 正常化 */
+
+dl,ul,ol,menu,li {list-style:none}   /* 重置类表前导符号为onne,menu在HTML5中有效 */
+
+a {text-decoration:none}  /* 重置链接a标签样式*/
+a:active, a:hover {text-decoration:none}   /* 重置链接a标签的鼠标滑动效果 */
+
+/* 取消a标签点击后的虚线框 */
+a {outline: none;}  
+
+/** 设置页面文字等在拖动鼠标选中情况下的背景色与文字颜色 **/
+/* 
+::selection {color: #fff;background-color: #4C6E78;}    
+::-moz-selection {color: #fff;background-color: #4C6E78;} 
+*/
+
+legend { color: #000; } /* for ie6 */
+fieldset,img {border:0 none}  /* 重置fieldset（表单分组）、图片的边框为0*/
+button, input, select, textarea { 
+     font-size: 100%; /* 使得表单元素在ie下能继承字体大小， */
+     vertical-align:middle;  /* 重置表单控件垂直居中*/
+} 
+/* 注：optgroup 无法扶正 */
+
+/* 重置表单button按钮效果 */
+button {border:0 none;background-color:transparent;cursor:pointer}
+caption {display:none;}    /* 重置表格标题为隐藏 */
+table {width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed;}    /* 重置table属性 */
+
+/* 企业微信标识 */
+.tobuimgs {
+  width: 130px;
+  display: flex;
+  justify-items: center;
+}
+.tobuimgs a img {
+  width: 130px !important;
+  height: 58px !important;
+}
+
+/* 公共样式 */
+.iframeClass {
+  width: 100%;
+  background: none;
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 99;
+  border: 0;
+  overflow: hidden;
+}
+
+.resetIframe {
+  width: 100%;
+  background: none;
+  border: 0;
+}
+.resetIframebtn {
+  height: 30.5rem;
+}
+
+::-webkit-scrollbar {
+  width: 0px; /* 设置滚动条宽度 */
+}
+
+::-webkit-scrollbar-button {
+  height: 0;
+  background-color: #ccc; /* 按钮背景颜色 */
+}
+
+::-webkit-scrollbar-track {
+  background-color: #f1f1f1;
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: #888; 
+  border-radius: 5px; 
+}
+::-webkit-scrollbar-thumb:hover {
+  background-color: #555; 
+}
+::-webkit-scrollbar-thumb:active {
+  background-color: #333;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/revision.css

@@ -0,0 +1,665 @@
+.pricing {
+    background: #f3f7fd;
+    padding: 7.876rem 0 2.25rem 0; 
+}
+.scheme {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 2.55rem;
+}
+.subject {
+    display: flex;
+    justify-content: space-around;
+}
+
+.common {
+    width: 32%;
+    box-sizing: border-box;
+    border: 1px solid #dddddd;
+    /* display: flex; */
+    /* flex-direction: column-reverse; */
+    background: #ffffff;
+    transition:all 1s ease-out;
+}
+.subject a {
+    color: #fff;
+    text-decoration:none
+}
+.common .upper {
+    text-align: center;
+    padding-top: 2.2rem;
+    border-bottom: 1px solid #dddddd;
+    position: relative;
+}
+.common .upper span {
+    display: inline-block;
+    width: 6rem;
+    height: 2rem;
+    background: #03a9f5;
+    line-height: 2rem;
+    color: #ffffff;
+    margin-top: .4rem;
+    margin-bottom: 1.6rem;
+    transition:all 0.5s ease-out;
+}
+
+.sale::after {
+    content: "*热销*";
+    position: absolute;
+    top: .4rem;
+    left: 43%;
+    font-size: 14px;
+    color: #15c381;
+}
+
+.common .upper p {
+    margin-bottom: 0.75rem;
+}
+
+.middle {
+    padding: 1.6rem 1.2rem 0 1.2rem;
+    height: 16rem;
+    border-bottom: 1px solid #dddddd;
+}
+.middle i, .whole i {
+    display: inline-block;
+    margin-right: .4rem;
+}
+
+.whole {
+    height: 32rem;
+    padding: 1.6rem 1.2rem 0 1.2rem;
+}
+
+.total {
+    color: #f26522;
+}
+
+.customization {
+    text-align: center;
+    margin: 6.6rem 0 3.2rem 0;
+}
+
+.simple:hover, .basics:hover, .specialty:hover{
+    cursor:pointer;
+    background: #eafdf3;
+    border: 1px dashed #5abf87;
+    transform:scale(1.05);
+}
+.simple:hover .upper span, .basics:hover .upper span, .specialty:hover .upper span {
+    background: #f0483e;
+}
+
+/* 弹出层样式 */
+.popups {
+    position: absolute;
+    /* background: ; */
+}
+
+/* 使用说明样式 */
+.instructions {
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, .7);
+    position: fixed;
+    top: 0;
+    z-index: 9999;
+}
+.popup {
+    width: 40rem;
+    height: 20rem;
+    margin: auto;
+    box-sizing: border-box;
+    background: #fff;
+    margin-top: 8.333333rem;
+    position: relative;
+    z-index: 999999999999999999999;
+}
+.use {
+    padding: 1rem;
+    height: 3.5rem;
+}
+.use h5 {
+    float: left;
+}
+.use span {
+    float: right;
+    cursor:pointer;
+}
+.use span:hover {
+    color: red;
+}
+.docums {
+    padding: 3rem 1rem 0 1rem;
+}
+
+/* 新写的 */
+.indx {
+	font-size: 1.375rem;
+	color: #fff;
+	width: 34.375rem;
+	margin-top: 23rem;
+	text-align: left;
+	margin-left: 38.625rem;
+    line-height: 35px;
+    margin-bottom: 1.5rem;
+}
+.ald {
+    display: flex;
+    /* justify-content: flex-end; */
+}
+.all {
+    width: 15rem;
+    height: 5rem;
+    background: #fff;
+    color: #4bd0ff;
+    font-size: 1.625rem;
+}
+.allsal {
+    width: 15rem;
+    line-height: 5rem;
+    background: #fff;
+    text-align: center;
+    border-radius: 5rem;
+    text-decoration: none;
+    margin: 0 4.375rem 1.875rem 0;
+    font-size: 1.625rem;
+    font-weight: bold;
+    color: #2fc9ff !important;
+}
+.allsal:hover {
+    text-decoration: none;
+    cursor:pointer;
+}
+.navbar-custom .navbar-brand.logo-image img {
+    /* width: 4.4375rem;
+	height: 1.75rem; */
+	width: 8.875rem;
+	height: 3.0625rem;
+}
+.tabls {
+    position: relative;
+    display: flex;
+    /* width: 41.875rem; */
+    justify-content: flex-end;
+    margin-top: -12px;
+}
+.tabls div {
+    margin-left: 3.4375rem;
+}
+.tabls div a {
+    text-decoration: none;
+    font-size: 1.125rem;
+    color: #5e5e5e;
+}
+.tabls div a:hover {
+    text-decoration: none;
+}
+.navbar-custom.top-nav-collapse {
+    background-color: #fff !important;
+}
+.product {
+    width: 100%;
+    background: #fff;
+    text-align: center;
+}
+.pro_tops {
+    padding-top: 8.625rem;
+    padding-bottom: 3.75rem;
+}
+.pro_tops h2 {
+    font-size: 2.5rem;
+    color: #666666;
+}
+.pro_tops p {
+    font-size: 1.125rem;
+    margin-top: 1rem;
+    margin-bottom: 1.8125rem;
+}
+.pro_tops div {
+    font-size: 1.125rem; 
+    line-height: 2.5rem;
+    width: 55.625rem;
+    margin: auto;
+}
+.pro_con {
+    display: flex;
+    justify-content: center;
+}
+.pro_con img {
+    width: 82.3125rem;
+    height: 26.25rem;
+}
+.process { 
+    background: #fff;
+    text-align: center;
+    width: 80rem;
+    margin:auto;
+    position: relative;
+}
+.process_til {
+    padding: 5.9375rem 0 6.25rem 0;
+}
+.process_til h2 {
+    font-size: 2.5rem;
+    color: #666666;
+}
+.process_til p {
+    font-size: 1.125rem;
+    color: #666666;
+    margin-top: 1rem;
+}
+.process_con {
+    display: flex;
+    justify-content: space-between;
+    position: relative;
+}
+.process_ctn {
+    width: 14.875rem;
+    height: 19.25rem;
+    border: .0625rem solid #aeaeae;
+    border-radius: .9375rem;
+    position: relative;
+    cursor:pointer;
+}
+.process_ctn:hover {
+    border: .0625rem solid #1296db;
+}
+.process_ctn:hover h4{
+    color:#1296db;
+}
+.process_ctn:hover span{
+    background:#1296db;
+}
+.xm1:hover .pro_im1{
+    background-image: url(../images/img/xmcj.png);
+}
+.xm2:hover .pro_im2{
+    background-image: url(../images/img/ygtbs.png);
+}
+.xm3:hover .pro_im3{
+    background-image: url(../images/img/xmjls.png);
+}
+.xm4:hover .pro_im4{
+    background-image: url(../images/img/hzsjs.png);
+}
+.xm5:hover .pro_im5{
+    background-image: url(../images/img/tjbs.png);
+}
+.pro_im1 {
+    width: 7.5rem;
+    height: 5rem;
+    background-image: url(../images/img/xmcjs.png);
+    background-size: 100%;
+    position: absolute;
+    top: -2.5rem;
+    left: 3.75rem;
+}
+.pro_im2 {
+    width: 7.5rem;
+    height: 5rem;
+    background-image: url(../images/img/ygtb.png);
+    background-size: 100%;
+    position: absolute;
+    top: -2.5rem;
+    left: 3.75rem;
+}
+.pro_im3 {
+    width: 7.5rem;
+    height: 5rem;
+    background-image: url(../images/img/xmjl.png);
+    background-size: 100%;
+    position: absolute;
+    top: -2.5rem;
+    left: 3.75rem;
+}
+.pro_im4 {
+    width: 7.5rem;
+    height: 5rem;
+    background-image: url(../images/img/hzsj.png);
+    background-size: 100%;
+    position: absolute;
+    top: -2.5rem;
+    left: 3.75rem;
+}
+.pro_im5 {
+    width: 7.5rem;
+    height: 5rem;
+    background-image: url(../images/img/tjb.png);
+    background-size: 100%;
+    position: absolute;
+    top: -2.5rem;
+    left: 3.75rem;
+}
+.process_ctn h4 {
+    padding-top: 3.4375rem;
+    font-size: 1.625rem;
+    color: #434343;
+    padding-bottom: 0.5rem;
+}
+.process_ctn span {
+    /* margin-top: 1.25rem; */
+    height: .3125rem;
+    display: block;
+    background: #aeaeae;
+    margin: auto;
+    width: 3.75rem;
+}
+.alp {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-wrap: wrap;
+}
+.alp p {
+    font-size: 1.375rem;
+    color: #7a7a7a;
+    width: 100%;
+    text-align: center;
+    margin-bottom: 1rem;
+}
+.features {
+    text-align: center;
+    margin-top: 1.875rem;
+}
+.chul {
+    display: flex;
+    justify-content: space-between;
+    width: 75rem;
+    margin: auto;
+    flex-wrap: wrap;
+}
+
+.chul div {
+    width: 13.75rem;
+    height: 5.3125rem;
+    background: #fff;
+    box-shadow: 0px 1px 5px #888888;
+    font-size: 1.5rem;
+    color: #666666;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 1.125rem;
+    cursor: pointer;
+}
+.chul div img {
+    width: 2.25rem;
+    height: 2.375rem;
+    margin-right: 1.5rem;
+}
+.chul .on {
+    box-shadow: 0px 0px 0px #fff;
+    border: .125rem solid #107bff;
+}
+.feat_bottom {
+    margin-top: 1.75rem;
+    text-align: center;
+}
+.feat_bottom h5 {
+    font-size: 1.5rem;
+    color: #666666;
+    padding-bottom: 1.875rem;
+}
+.lis {
+    width: 62.5rem;
+    height: 30.75rem;
+    margin: auto;
+}
+.feat {
+    width: 100%;
+    height: 30.75rem;
+    overflow: hidden;
+    margin: auto;
+    background-image: url(../images/img/bj.png);
+    background-size:100% 100%
+}
+.lis img {
+    width: 100%;
+    height: 100%;
+}
+.show {
+    display: block;
+}
+.hide {
+    display: none;
+}
+.rectangular {
+    text-align: center;
+}
+.rect_con {
+    width: 80.9375rem;
+    height: 17.5rem;
+    margin: auto;
+}
+.rect_con img {
+    width: 100%;
+    height: 100%;
+}
+.advantage {
+    text-align: center;
+}
+.advant_con {
+    width: 75.1875rem;
+    height: 43.625rem;
+    margin: auto;
+}
+.advant_con img {
+    width: 100%;
+    height: 100%;
+    margin-left: 6.25rem;
+}
+.customer {
+    text-align: center;
+}
+.aldd {
+    padding-top: 0;
+    padding-bottom: 0;
+}
+
+/* 测试 */
+.containerss{
+    width:1000px;
+    height:450px;
+    overflow:hidden;
+    position:relative;
+    margin:0 auto;
+}
+.listss{
+    width:3000px;
+    height:450px;
+    position:absolute;
+    
+}
+.listss img{
+    width:1000px;
+    height:450px;
+    float:left;
+}
+.buttss{
+    width:300px;
+    height:20px;
+    position:absolute;
+    left: 456px;
+    bottom:-30px;
+    cursor:pointer;
+}
+.buttss span{
+    width: .75rem;
+    height: .75rem;
+    border-radius: 50%;
+    position: relative;
+    border: 1px solid #000;
+    display: inline-block;
+    margin-right: 1.25rem;
+}
+.arrows{
+    width: 2.5rem;
+    height: 60px;
+    position: absolute;
+    top: 42%;
+    cursor: pointer
+}
+.lefts{
+    left: 0;
+}
+.rights{
+    right: 0;
+}
+.ons i::after {
+    content: '';
+    width: .5rem;
+    height: .5rem;
+    background: #000;
+    border-radius: 50%;
+    position: absolute;
+    top: 1px;
+    left: 1px;
+}
+.cust {
+    text-align: center;
+    margin-top: 3.125rem;
+}
+.cust h6 {
+    font-size: 1.875rem;
+    color: #393939;
+    margin-bottom: 1.625rem;
+}
+.cust p {
+    width: 48.75rem;
+    margin: auto;
+    font-size: 1.5rem;
+    color: #7f7f7f;
+    line-height: 2.625rem;
+}
+.pricings {
+    text-align: center;
+}
+.pri {
+    display: flex;
+    justify-content: space-between;
+    width: 94rem;
+    margin: auto;
+}
+.li {
+    text-align: center;
+    background: #fff;
+    padding: .625rem;
+    box-shadow: 0px 1px 20px 0px #c8c8c8;
+    cursor: pointer;
+    transition: all  .25s  ease-in;
+}
+.li_con {
+    width: 21.875rem;
+    height: 17.5rem;
+    background: #f3f3f3;
+    box-sizing: border-box;
+    padding-top: 4.875rem;
+    /* display: flex;
+    align-items: center;
+    flex-wrap: wrap; */
+}
+.li_con div {
+    width: 100%;
+    text-align: center;
+    font-size: 2.375rem;
+    color: #565656;
+    margin-bottom: 2.375rem;
+}
+.li_con div span{
+    font-size: 3.75rem;
+}
+.li li {
+    width: 100%;
+    height: 3rem;
+    font-size: 1.125rem;
+    line-height: 3rem;
+    text-align: center;
+    list-style-type:none;
+    color: #b5b0b0;
+}
+.li li:nth-child(2n) {
+    background: #f3f3f3;
+}
+.btn {
+    width: 11.875rem;
+    height: 3rem;
+    margin: auto;
+    background-image: url(../images/img/xg.png);
+    background-size: 100%;
+    margin-bottom: .625rem;
+    border:0;
+    background-repeat:no-repeat;
+}
+.li:hover {
+    /* position: relative;
+    top: -1.25rem; */
+    transform:translateY(-20px);
+}
+.li:hover .btn{
+    background: url(../images/img/xgs.png);
+    background-repeat:no-repeat;
+}
+.li:hover .li_con{
+    background: linear-gradient(to left,#4daefe,#01f1fe);
+}
+.li:hover .li_con div{
+    color: #fff;
+}
+.btn a {
+    display: inline-block;
+    width: 100%;
+    height: 100%;
+}
+.al a{
+    color: #407be7 !important;
+}
+.al {
+    position: relative;
+}
+.al::after {
+    content: '';
+    width: 100%;
+    height: .1875rem;
+    background: #407be7;
+    position: absolute;
+    bottom: -1.25rem;
+    left: 0;
+}
+.pro_con_pl {
+    width: 79.6875rem;
+    height: 13.375rem;
+    margin: auto;
+}
+.pro_con_pl img {
+    width: 116%;
+    height: 100%;
+    margin-left: -8%;
+}
+.service2s {
+	display: block;
+	position: fixed;
+	top: 10.8rem;
+	/* bottom: 10rem; */
+	right: 0;
+	padding: 1rem;
+	background: #fff;
+	box-shadow: 3px 3px 10px #ccc;
+	z-index: 99999999;
+	text-align: center;
+}
+.service2s img {
+	width: 8rem;
+}
+
+.service2s p {
+	margin-bottom: 0;
+	margin: 0.5rem 0;
+}
+
+.service2s p:last-child {
+	color: #20a0ff;
+}
+.aplll {
+	margin-left: 20%;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/tongyong.css

@@ -0,0 +1,77 @@
+.navigationBar {
+    width: 100%;
+    height: 6.375rem;
+    position: relative;
+    box-shadow: 1px 3px 5px 0px #ddd;
+}
+.navigationBarBack {
+    width: 100%;
+    position: absolute;
+    height: 100%;
+    top: 0;
+    left: 0;
+    background: #fff;
+    color: #595959 !important;
+}
+.navigationTitle {
+    max-width: 81.25rem;
+    height: 6.375rem;
+    margin: auto;
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: space-between
+}
+.navigationTitle img {
+    width: 8.125rem;
+    height: 3.625rem;
+}
+.navigationUl {
+    margin-left: 2.5rem;
+}
+.navigationUl a {
+    color: #5e95f8 !important;
+}
+.navigationUl li {
+    margin: 0 .625rem;
+}
+.navigationUl, .navigationUl li{
+    display: inline-block;
+    font-size: 1rem;
+}
+.inBlock {
+    display: inline-block;
+}
+.flexs {
+    display: flex;
+    align-items: center;
+}
+.fonsColorBai, .fonsColorBai a{
+    color: #595959 !important;
+    width: 100%;
+    height: 100%;
+    display: inline-block;
+}
+.fonsColorHei, .fonsColorHei a{
+    color: #333;
+}
+.til {
+    height: 4rem;
+    line-height: 4rem;
+    position: relative;
+    overflow: hidden;
+    cursor: pointer;
+}
+.headers {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    z-index: 9999999;
+}
+.ons a {
+    border-bottom: 2px solid #37B8FF;
+}
+.til:hover a {
+    border-bottom: .125rem solid #37B8FF;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/css/workshop/workshop.css

@@ -0,0 +1,373 @@
+/* 在原来的 customer 的样式基础上覆盖 */
+.collTeam {
+    background: url(../../image/workshopimage/wokeTime.png) no-repeat;
+    background-size: 100% 100%;
+}
+
+
+/* 公共样式 */
+* {
+    box-sizing: border-box;
+}
+
+.tils::before {
+    height: 0 !important;
+}
+
+.content {
+    width: 1200px;    
+    margin: auto;
+    position: relative;
+    z-index: 1;
+}
+
+.moduleTitle {
+    padding-bottom: 24px;
+}
+.moduleTitle .title {
+    width: 100%;
+    font-size: 48px;
+    color: #333;
+    margin-bottom: 20px;
+    text-align: center;
+}
+.moduleTitle .subTitle {
+    width: 100%;
+    font-size: 18px;
+    color: #666666;
+    text-align: center;
+}
+.moduleTitle span {
+    color: #2162e4;
+}
+
+
+/* 车间管理 */
+.shopManagement {
+    background: url(../../image/workshopimage/shopMan_back.png) no-repeat;
+    background-size: 100% 100%;
+    padding: 90px 0 160px 0;
+    position: relative;
+    top: -6px;
+} 
+.shopManagement .shopManagementContent {
+    width: 100%;
+    height: 580px;
+    position: relative;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: flex-end;
+    background: url(../../image/workshopimage/shopManagementContent.png) no-repeat;
+    background-size: 100% 570px;
+}
+.shopManagement .shopManagementContent .serialNumber {
+    display: flex;
+    margin: 0 auto;
+    padding-left: 72px;
+}
+.shopManagement .shopManagementContent .serialNumber div {
+    width: 210px;
+    height: 60px;
+    color: #fff;
+    font-size: 16px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: url(../../image/workshopimage/rightImg.png) no-repeat;
+    background-size: 100% 100%;
+    position: relative;
+}
+
+.shopManagementContent .serialNumber div:first-child {
+    left: 0;
+}
+
+.shopManagement .shopManagementContent .serialNumber .on {
+    background: url(../../image/workshopimage/rightImgHover.png) no-repeat;
+    background-size: 100% 100%;
+}
+
+.shopManagement .shopManagementContent .shopManagementList {
+    position: relative;
+    width: 100%;
+    height: 428px;
+    top: -30px;
+}
+.shopManagement .shopManagementContent .shopManagementList .module {
+    width: 252px;
+    height: 307px;
+    border: 1px solid #fff;
+    background: linear-gradient(180deg, #ebf4ff 0%, #ffffff 100%);
+    padding: 24px;
+}
+.shopManagement .shopManagementContent .shopManagementList .module img {
+    width: 64px;
+    height: 64px;
+}
+.shopManagement .shopManagementContent .shopManagementList .module .module_title {
+    font-size: 20px;
+    color: #404041;
+    margin: 15px 0 35px 0;
+}
+.shopManagement .shopManagementContent .shopManagementList .module .module_text {
+    font-size: 16px;
+    color: #707070;
+    margin: 0 0 26px 0;
+    padding-left: 18px;
+    position: relative;
+}
+.shopManagement .shopManagementContent .shopManagementList .module .module_text::after {
+    content: '';
+    width: 8px;
+    height: 8px;
+    border-radius: 50%;
+    background: #2162e4;
+    position: absolute;
+    left: 0;
+    top: 6px;
+}
+.moduleOne, .moduleTwo, .moduleThree, .moduleFo {
+    position: absolute;
+}
+.moduleOne {
+    left: 0;
+    top: 0;
+}
+.moduleTwo {
+    left: 315px;
+    bottom: 0;
+}
+.moduleThree {
+    right: 315px;
+    bottom: 0;
+}
+.moduleFo {
+    right: 0;
+    top: 0;
+}
+
+/* 零门槛 */
+.zeroThreshold {
+    width: 100%;
+    background: #f6fafd;
+    padding-bottom: 80px;
+    position: relative;
+    margin-top: -6px;
+}
+
+.zeroThreshold .zeroThresholdContent {
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+}
+.zeroThresholdContentList {
+    width: 370px;
+    height: 200px;
+    padding: 28px 0 20px 0;
+    border-radius: 20px;
+    background: #2162E4;
+    box-shadow: 0px 9px 16px 0px rgba(153, 153, 153, 0.5);
+    position: relative;
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    margin-bottom: 40px;
+}
+.zeroThresholdContentList_on {
+    background: none !important;
+    box-shadow: none;
+}
+.zeroThresholdContentList_on .zeroThresholdContentList_title, .zeroThresholdContentList_on .zeroThresholdContentList_text {
+    color: #333333;
+}
+.zeroThresholdContentList_Img {
+    width: 200px;
+    height: 200px;
+    position: absolute;
+    top: 0;
+    left: 50%;
+    margin-left: -100px;
+}
+.zeroThresholdContentListImg {
+    width: 50px;
+    height: 50px;
+}
+.zeroThresholdContentList_title {
+    width: 100%;
+    text-align: center;
+    height: 24px;
+    font-size: 20px;
+    color: #fff;
+}
+.zeroThresholdContentList_text {
+    width: 100%;
+    text-align: center;
+    height: 24px;
+    font-size: 16px;
+    color: #fff;
+}
+
+/* 电脑端 */
+.computer {
+    padding-top: 112px;
+    background: url(../../image/workshopimage/Group.png) no-repeat;
+    background-size: 837px 380px;
+    background-position: right bottom;
+}
+.computerOns {
+    background: none;
+}
+.computer .contentTab {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 50px;
+}
+.computer .on {
+    color: #fff !important;
+    background: #2162E4;
+}
+.computer .contentTab div {
+    width: 160px;
+    height: 50px;
+    margin-right: 18px;
+    font-size: 16px;
+    color: #666666;
+    border-radius: 4px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    cursor: pointer;
+}
+.computer .contentTab img {
+    width: 24px;
+    height: 24px;
+    margin-right: 10px;
+}
+.computer_main {
+    width: 100%;
+    height: 540px;
+    position: relative;
+}
+.computer_main .con {
+    position: absolute;
+}
+.computer_left_title{
+    font-size: 30px;
+    color: #2162E4;
+    display: flex;
+    align-items: center;
+}
+.computer_left_title img {
+    width: 36px;
+    height: 36px;
+    margin-right: 16px;
+    margin-top: 50px;
+    margin-bottom: 36px;
+    position: relative;
+    top: -4px;
+}
+.computer_left_List {
+    position: relative;
+    padding-left: 66px;
+    margin-bottom: 40px;
+}
+.computer_left_List .computerLeft_title {
+    font-size: 22px;
+    color: #333333;
+    margin-bottom: 16px;
+}
+.computer_left_List .computerLeft_text {
+    font-size: 14px;
+    color: #666666;
+} 
+.computer_left_List .computerLeft_title::after {
+    content: '';
+    width: 4px;
+    height: 100%;
+    background: #2162E4;
+    position: absolute;
+    left: 46px;
+}
+.computer_left_Btn {
+    margin: 106px 0 0 40px;
+    font-size: 16px;
+    color: #fff;
+    width: 150px;
+    height: 48px;
+    border-radius: 4px;
+    background: #2162E4;
+}
+.computer_left_Btn a {
+    color: #fff;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.computer_right img{
+    width: 765px;
+    height: 410px;
+}
+
+/* 移动端 */
+.mobileTerminal {
+    padding-top: 114px;
+    background: #F6FAFD;
+    position: relative;
+}
+.mobileTerminal .mobileTerminal_Img {
+    width: 100%;
+    height: 755px;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+}
+.mobileTerminal_project {
+    margin-top: 40px;
+    margin-bottom: 25px;
+    padding-left: 50px;
+}
+.mobileTerminalProject {
+    display: flex;
+    align-items: center;
+    margin-bottom: 15px;
+}
+.mobileTerminalProject .left {
+    font-size: 16px;
+    color: #000;
+    margin-right: 10px;
+    width: 75px;
+}
+.mobileTerminalProject .right {
+    display: flex;
+    align-items: center;
+}
+.mobileTerminalProject .right div {
+    width: 177px;
+    height: 44px;
+    font-size: 16px;
+    color: #ffffff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: url(../../image/workshopimage/rightImg.png) no-repeat;
+    background-size: 100% 100%;
+    position: relative;
+}
+.mobileTerminalProject .right .on {
+    background: url(../../image/workshopimage/rightImgHover.png) no-repeat;
+    background-size: 100% 100%;
+}
+.mobileTerminal_ImgList {
+    display: flex;
+    justify-content: space-between;
+    padding: 0 40px;
+}
+.mobileTerminal_ImgList img {
+    width: 310px;
+    height: 600px;
+    margin: 33px 0 60px 0;
+}

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/followup.html

@@ -0,0 +1,352 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="keywords" content="随访管理,数据统计,随访流程,阶段数据审核,随访日历,随访管理,文件上传" />
+    <meta name="description" content="随访报表-随访管家是一款集患者资料收集整理、随访计划执行和数据统计分析功能于一体的医患服务系统。添加患者"/>
+    <title>随访管理|随访日历|随访报表-随访管家是一款集患者资料收集整理、随访计划执行和数据统计分析功能于一体的医患服务系统。添加患者|访视记录|随访审核|随访报表！</title>
+    <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
+    <link href="css/styles.css" rel="stylesheet">
+    <link rel="stylesheet" href="css/tongyong.css">
+    <link rel="stylesheet" href="css/reset.css">
+    <link rel="stylesheet" href="css/followup.css">
+    <!-- 底部重写 -->
+    <link rel="stylesheet" href="css/bottom.css">
+    <script src="./js/jquery1.42.min.js"></script>
+</head>
+<body data-spy="scroll" data-target=".fixed-top" id="body">
+    <div class="spinner-wrapper">
+        <div class="spinner">
+            <div class="bounce1"></div>
+            <div class="bounce2"></div>
+            <div class="bounce3"></div>
+        </div>
+    </div>
+    <!-- 头部 -->
+    <iframe id="headerIframe" src="./moduleView/header.html" class="iframeClass" onLoad="reinitIframe();"></iframe>
+
+    <!-- 咨询客服 -->
+    <div class="zhixun" id="zhixun" style="display: none">
+        <p>微信扫码咨询</p>
+        <img src="./image/codecopy.jpg" alt="">
+        <p><span style="color: #595959;">客服QQ：</span>3052894409</p>
+    </div>
+    <!-- 咨询的图标 -->
+    <div class="consulting" id="consulting">
+        <img id="consultigImg" src="./image/ions/kefu2.png" alt="">
+    </div>
+
+    <!-- 产品介绍 -->
+    <div class="product" id="product" style="display: none">
+        <div class="connont">
+            <div style="display: flex;">
+                <div class="management">
+                    <h3>管家</h3>
+                    <ul>
+                        <a href="./index.html"><li>工时管家</li></a>
+                        <a href="./followup.html"><li>随访管家</li></a>
+                        <a href="./project.html"><li>项目管家</li></a>
+                        <a href="./customer.html"><li>客户管家</li></a>
+                        <a href="./workshop.html"><li>生产车间管家</li></a>
+                    </ul>
+                </div>
+                <div></div>
+                <div></div>
+            </div>
+        </div>
+    </div>
+    <!-- bannar图片 -->
+    <div class="bannar">
+        <img src="./image/followup/bannar.png" alt="">
+        <div class="bannarCon">
+            <div class="bannarConTil">
+                全面管理临床随访数据
+            </div>
+            <div class="bannarConTilP">
+                ·信息安全可靠，更符合CRO/SMO行业的工作流程·
+            </div>
+            <a href="http://clinic.ttkuaiban.com/#/register">
+                <div class="bannBtn">注册</div>
+            </a>
+        </div>
+    </div>
+
+    <!-- 智能随访 -->
+    <div class="collaborationTeam" id="collaborationTeam">
+        <div class="collTeam">
+            <div class="contentes">
+                <div class="collCent" id="collCentImg" style="transform:translate(0, 250px)">
+                    <div class="collCentImg collCentDiv"><img src="./image/followup/suifang.png" alt=""></div>
+                    <div class="collCentFonts collCentDiv"><div id="collCentFonts" style="opacity: 0;">· 智能随访 只需一个 <span>随访管家</span></div></div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- 专业流程 -->
+    <div class="professional">
+        <div class="contentes" style="padding: 0 1.25rem;">
+            <div class="professionalBox">
+                <div class="professionalBoxTil"><span>专业</span>的解决方案，<br/>覆盖<i>全业务</i>流程</div>
+                <div style="display: flex;justify-content: flex-end;">
+                    <div class="professionalBoxTilRight">
+                        <div class="proList">
+                            <div><span>·</span>立项</div>
+                            <div><span>·</span>伦理</div>
+                            <div><span>·</span>遗传办</div>
+                            <div><span>·</span>启动会</div>
+                        </div>
+                        <div class="collections">
+                            <div class="rotating">
+                                    <div class="huabanOne huanOne">
+                                        <div class="huanOneIon"></div>
+                                        <div>
+                                            关<br/>中<br/>心<br/>管<br/>理
+                                        </div>
+                                    </div>
+                            </div>
+                            <div class="rotating" style="transform: rotate(45deg);">
+                                    <div class="huabanOne huanTwo" style="transform: translate(15px, 0);">
+                                        <div class="huanTwoIon" style="transform: rotate(-45deg);"></div>
+                                        <div style="transform: rotate(-45deg);">
+                                            启<br/>动<br/>管<br/>理
+                                        </div>
+                                    </div>
+                            </div>
+                            <div class="rotating" style="transform: rotate(90deg);">
+                                    <div class="huabanOne huanThere" style="transform: translate(35px, 0);">
+                                        <div class="huanThereIon" style="transform: rotate(-90deg);"></div>
+                                        <div style="transform: rotate(-90deg);margin-top: -15px;">
+                                            资<br/>质<br/>管<br/>理
+                                        </div>
+                                    </div>
+                            </div>
+                            <div class="rotating" style="transform: rotate(146.2deg);height: 46.125rem;">
+                                    <div class="huabanOne huanFour" style="transform: rotate(-10deg);">
+                                        <div class="huanFourIon" style="transform: rotate(-136.2deg);"></div>
+                                        <div style="transform: rotate(-136.2deg);">
+                                            其<br/>它<br/>管<br/>理
+                                        </div>
+                                    </div>
+                            </div>
+                            <div class="rotating" style="transform: rotate(212.6deg);height: 45.8125rem;">
+                                    <div class="huabanOne huanFive" style="transform: rotate(13deg);">
+                                        <div class="huanFiveIon" style="transform: rotate(-225.6deg);"></div>
+                                        <div style="transform: rotate(-225.6deg);">
+                                            入<br/>组<br/>随<br/>访
+                                        </div>
+                                    </div>
+                            </div>
+                            <div class="rotating" style="transform: rotate(270deg);">
+                                    <div class="huabanOne huanXis" style="transform: translate(-35px, 0);">
+                                        <div class="huanXisIon" style="transform: rotate(-270deg);"></div>
+                                        <div style="transform: rotate(-270deg);margin-top: -15px;">
+                                            数<br/>据<br/>清<br/>理
+                                        </div>
+                                    </div>
+                            </div>
+                            <div class="rotating" style="transform: rotate(315deg);">
+                                    <div class="huabanOne huanSeven" style="transform: translate(-15px, 0);">
+                                        <div class="huanSevenIon" style="transform: rotate(-315deg);"></div>
+                                        <div style="transform: rotate(-315deg);">
+                                            质<br/>控<br/>管<br/>理
+                                        </div>
+                                    </div>
+                            </div>
+                        </div>
+                        <div class="proListLeft">
+                            <div>首例入组<span>·</span></div>
+                            <div>入组完成<span>·</span></div>
+                            <div>随访开展<span>·</span></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- 轻松管理 -->
+    <div class="easyMan">
+        <h2>随访过程<span>轻松管理</span>，CRC填报，管理者审核</h2>
+        <div class="easyManBox">
+            <img id="easyManBoxConImg" src="./image/followup/qing1.png" alt="">
+            <div class="easyManBoxCon">
+                <img src="./image/followup/imgg.png" alt="">
+                <div class="easyManBoxConCli" id="easyManBoxConCli">
+
+                    <div class="easyManBoxConCliOne easyOn">
+                        <div class="easyManBoxConCliOneTil" style="background: #d8dbe1;"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">筛选期</div>
+                    </div>
+
+                    <div class="easyManBoxConCliOne" style="opacity: 0;cursor:default">
+                        <div class="easyManBoxConCliOneTil"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">筛选期</div>
+                    </div>
+
+                    <div class="easyManBoxConCliOne">
+                        <div class="easyManBoxConCliOneTil" style="background: #fa71a5;"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">V2访视（d7）</div>
+                    </div>
+
+                    <div class="easyManBoxConCliOne">
+                        <div class="easyManBoxConCliOneTil" style="background: #a2c9a5;"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">导入期</div>
+                    </div>
+
+                    <div class="easyManBoxConCliOne">
+                        <div class="easyManBoxConCliOneTil" style="background: #84abdd;"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">首次给药/治疗</div>
+                    </div>
+
+                    <div class="easyManBoxConCliOne">
+                        <div class="easyManBoxConCliOneTil" style="background: #d4d2fc;"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">V3访视（d14）</div>
+                    </div>
+
+                    <div class="easyManBoxConCliOne">
+                        <div class="easyManBoxConCliOneTil" style="background: #f8b86e;"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">基线图</div>
+                    </div>
+
+                    <div class="easyManBoxConCliOne" style="opacity: 0;cursor:default">
+                        <div class="easyManBoxConCliOneTil"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">筛选期</div>
+                    </div>
+
+                    <div class="easyManBoxConCliOne">
+                        <div class="easyManBoxConCliOneTil" style="background: #66d5cf;"><span></span></div>
+                        <div class="easyManBoxConCliOneCen">V...访视</div>
+                    </div>
+
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- 随访管家 -->
+    <div class="housekeeper">
+        <div class="housekCon">
+            <div class="housekeeperCon">
+                <div class="housekeeperConZuo" id="housekeeperConZuo">
+                    <div class="housekeeperConZuoUl">
+                        <img src="./image/followup/shuiOne.png" alt="">
+                        随访管家
+                    </div>
+
+                    <div class="housekeeperConZuoLi housekeeperOn">
+                        <img src="./image/followup/shuiTwo.png" alt="">
+                        手机填报，云端审核
+                    </div>
+                    <div class="housekeeperConZuoLi">
+                        <img src="./image/followup/shuiThree.png" alt="">
+                        每月奖金，一键核算
+                    </div>
+                    <div class="housekeeperConZuoLi">
+                        <img src="./image/followup/shuiFour.png" alt="">
+                        单据加密，自动打码
+                    </div>
+                    <div class="housekeeperConZuoLi">
+                        <img src="./image/followup/shuiFive.png" alt="">
+                        随访报表，数据清晰
+                    </div>
+                    <div class="housekeeperConZuoLi">
+                        <img src="./image/followup/shuiSix.png" alt="">
+                        随访模板，自由定制
+                    </div>
+                    <!-- <div class="housekeeperConZuoLi">
+                        <img src="./image/followup/shuiSeven.png" alt="">
+                        角色权限，专业定制
+                    </div> -->
+                </div>
+
+                <div class="housekeeperConYou">
+                    <div class="housekeeperConYouTil">产<br/>品<br/><span> 特<br/> 色</span></div>
+                    <div class="housekeeperConYouCon">
+                        <div class="housekeeperConYouConTli">
+                            <img src="./image/followup/huoConTilIon.png" alt="">
+                            <span id="housekeeperrText">手机填报，云端审核</span> 
+                        </div>
+                        <div class="housekeeperConYouConBon">
+                            
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="housekConImg">
+                <img src="./image/followup/suifangs1.png" id="housekConImg" alt="">
+            </div>
+        </div>
+    </div>
+
+    <!-- 客户评价 -->
+    <div class="evaluation">
+        <div class="evaluationKehu" id="customer">
+            <div class="evaluationKehuTil">
+                <h2>客户评价</h2>
+                <p>用户好评如潮,众多药研参与者使用</p>
+            </div>
+            <div class="evaluationKehuCon">
+                <div class="evaluationKehuConLi">
+                    <div class="evaluationKehuConImg">
+                        <img src="./image/followup/toxOne.png" alt="">
+                    </div>
+                    <h3>张经理</h3>
+                    <p>随访管家是一款集患者资料收集整理、随访计划执行、和数据统计分析功能于一体的医患服务系统，帮助医院规范随访工作，提高随访效率，提升医疗水平，提高患者依从度。</p>
+                </div>
+                <div class="evaluationKehuConLi">
+                    <div class="evaluationKehuConImg">
+                        <img src="./image/followup/toxTwo.png" alt="">
+                    </div>
+                    <h3>闵主任</h3>
+                    <p>优化随访工作流程、减轻随访工作人员劳动强度、提升随访工作效率。帮助医生或者医院从繁重无序的随访工作中解放出来。</p>
+                </div>
+                <div class="evaluationKehuConLi">
+                    <div class="evaluationKehuConImg">
+                        <img src="./image/followup/toxFour.png" alt="">
+                    </div>
+                    <h3>闫经理</h3>
+                    <p>随访时间和随访内容都是由系统自动生成并由系统自动提醒，使随访工作更加规范化。随访工作的记录都保存到系统中，随访工作评价更加的科学化。</p>
+                </div>
+                <div class="evaluationKehuConLi">
+                    <div class="evaluationKehuConImg">
+                        <img src="./image/followup/toxFive.png" alt="">
+                    </div>
+                    <h3>王部长</h3>
+                    <p>不做没意义的评价，不做没有严肃性的数字，不做没有信服力的结论，倍市得系统的精准定位与其开放的系统架构使得这些有据可依</p>
+                </div>
+            </div>
+        </div>
+
+        <!-- 产品定价 -->
+        <div class="pricing" id="pricing">
+            <h2>产品定价</h2>
+            <div class="pricingsConTop" style="margin-top: 3.125rem;">
+                <div style="border-top: 0px solid #333;">人数</div>
+                <div style="border-top: 0px solid #333;">价格</div>
+                <div>1-100</div>
+                <div>299/人/年</div>
+                <div>100-200</div>
+                <div>269/人/年</div>
+                <div>200-300</div>
+                <div>239/人/年</div>
+                <div>300-500</div>
+                <div>199/人/年</div>
+                <div>500+</div>
+                <div>待定</div>
+            </div>
+        </div>
+    </div>
+
+    <!-- 底部 -->
+    <iframe id="bottomIframe" src="./moduleView/bottom.html" class="resetIframe resetIframebtn" style="height: 24.2rem"></iframe>
+
+</body>
+<script src="js/js/jquery.min.js"></script>
+<script src="js/js/scripts.js"></script>
+<script src="./js/followup.js"></script>
+<!-- <script src="./js/one.js"></script> -->
+<script src="js/iframe.js"></script>
+</html>

fhKeeper/formulahousekeeper/webttkuaiban/src/main/resources/templates/homemovement.html

@@ -0,0 +1,266 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" />
+    <title>工时管家</title>
+    <link rel="stylesheet" href="./css/homemovement/normalize.css" />
+    <!-- 先引入css文件 放到自己css文件的上面 -->
+    <link rel="stylesheet" href="./css/homemovement/swiper.min.css" />
+    <link rel="stylesheet" href="./css/homemovement/homemovement.css" />
+    <script src="js/jquery1.42.min.js"></script>
+</head>
+<body>
+    <section class="warp">
+        <!-- 头部 -->
+        <div class="header">
+            <div class="header_logo"><img src="./image/logo.jpg" alt=""></div>
+            <div class="header_qiyeweix"><a href="https://open.work.weixin.qq.com" target="_blank"><img src="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=isp&c=white&s=medium" srcset="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=isp&c=white&s=medium@2x 2x" referrerpolicy="unsafe-url" alt="企业微信"></a></div>
+            <div class="header_qw"><a href="javascript:;" id="zhuce"><img src="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=register&c=white&s=large" srcset="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=register&c=white&s=large@2x 2x" referrerpolicy="unsafe-url" alt="企业微信"></a></div>
+            <div class="header_qx"><a href="javascript:;" id="anqiye"><img src="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=install&c=white&s=large" srcset="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=install&c=white&s=large@2x 2x" referrerpolicy="unsafe-url" alt="企业微信"></a></div>
+        </div>
+
+        <div class="homepage">
+            <div class="homepage_img">
+                <img src="./image/bannar9.gif" alt="">
+            </div>
+            <div class="homepage_gsLogo">
+                <img src="./image/gsgj.png" alt="">
+            </div>
+            <div class="homepage_title">工时管家</div>
+        </div>
+
+        <div class="reduction">
+            <div class="reduction_img">
+                <img src="./image/huajian.png" alt="">
+            </div>
+        </div>
+
+        <div class="examination">
+            <div class="examination_title">填报、审批、统计分分钟搞定</div>
+            <div class="examination_img"><img src="./image/fill.jpg" alt=""></div>
+            <div class="get_job_focus">
+              <!-- Swiper -->
+              <div class="swiper-container get_job_fo">
+                <div class="swiper-wrapper">
+                  <div class="swiper-slide">
+                    <img src="./image/yidong/xmcj.png" alt="" />
+                  </div>
+                  <div class="swiper-slide">
+                    <img src="./image/yidong/ygtb.png" alt="" />
+                  </div>
+                  <div class="swiper-slide">
+                    <img src="./image/yidong/xmjlsh.png" alt="" />
+                  </div>
+                  <div class="swiper-slide">
+                    <img src="./image/yidong/hzsj.png" alt="" />
+                  </div>
+                  <div class="swiper-slide">
+                    <img src="./image/yidong/sctjb.png" alt="" />
+                  </div>
+                </div>
+              </div>
+              <!-- Add Arrows 根据需求这个代码放到 container外面 添加左右箭头-->
+              <div class="swiper-button-next"></div>
+              <div class="swiper-button-prev"></div>
+            </div>
+        </div>
+
+        <div class="management">
+            <div class="management_title">强大的功能，轻松的管理</div>
+            <div class="management_tex">提供便捷且全面的工时填报、审核和统计功能，围绕企业成本管理提供一站式解决方案</div>
+
+            <div class="swiper-container study_fo">
+              <div class="swiper-wrapper">
+                <div class="swiper-slide">
+                  <img src="./image/gs1.jpg" alt="" />
+                  <p>工时填报</p>
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/gs2.jpg" alt="" />
+                  <p>报告查看</p>
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/gs3.jpg" alt="" />
+                  <p>工时审批</p>
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/gs4.jpg" alt="" />
+                  <p>项目管理</p>
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/gs5.jpg" alt="" />
+                  <p>成本统计</p>
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/gs6.jpg" alt="" />
+                  <p>财务核算</p>
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/gs7.jpg" alt="" />
+                  <p>客户管理</p>
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/gs8.jpg" alt="" />
+                  <p>费用报销</p>
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/gs9.jpg" alt="" />
+                  <p>工程管理</p>
+                </div>
+                <div class="swiper-slide">
+                    <img src="./image/gs10.jpg" alt="" />
+                    <p>审批流</p>
+                </div>
+              </div>
+              <!-- Add Pagination -->
+              <div class="swiper-pagination"></div>
+            </div>
+        </div>
+
+        <div class="customer">
+            <div class="customer_title">来自客户的认可</div>
+            <div class="swiper-container customer_fo">
+              <div class="swiper-wrapper">
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg0.png" alt="" />
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg1.png" alt="" />
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg2.png" alt="" />
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg3.png" alt="" />
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg4.png" alt="" />
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg5.png" alt="" />
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg6.png" alt="" />
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg7.png" alt="" />
+                </div>
+                <div class="swiper-slide">
+                  <img src="./image/yidong/ggg8.png" alt="" />
+                </div>
+              </div>
+              <!-- Add Pagination -->
+              <div class="swiper-pagination"></div>
+            </div>
+        </div>
+
+        <div class="foots">
+            <div class="erweima">
+                <img src="./image/gzh.jpg" alt="">
+            </div>
+            <div class="erweima_text">工时管家官方客服</div>
+            <div class="erweima_haoma">Copyright©2016 南京火石闪信网络科技有限公司     苏ICP备18064522号-1</div>
+        </div>
+    </section>
+</body>
+<script src="./js/homemovement/flexible.js"></script>
+<!-- 比如引入js文件 -->
+<script src="./js/homemovement/swiper.min.js"></script>
+<script>
+    // 第一个函数里面是 就业指导轮播图
+    (function () {
+      var swiper = new Swiper(".get_job_fo", {
+        // 能够显示的 slider的个数
+        slidesPerView: 2,
+        // 每一个slide之间的距离
+        spaceBetween: 30,
+        centeredSlides: true,
+        loop: true,
+        // 添加左右箭头
+        navigation: {
+          nextEl: ".swiper-button-next",
+          prevEl: ".swiper-button-prev",
+        },
+      });
+    })();
+    // 第二个函数的轮播图
+    (function () {
+      //  如果有多个轮播图最好修改下 swiper-container
+      var swiper = new Swiper(".study_fo", {
+        // 我们可以可以看看到的是 2个半
+        slidesPerView: 1,
+        spaceBetween: 20,
+      });
+    })();
+    // 第三个函数的轮播图
+    (function () {
+      //  如果有多个轮播图最好修改下 swiper-container
+      var swiper = new Swiper(".customer_fo", {
+        // 我们可以可以看看到的是 2个半
+        slidesPerView: 2.2,
+        spaceBetween: 20,
+      });
+    })();
+  </script>
+  <script>
+    $('#anqiye').click(function() {
+        console.log('我被点击率')
+        // $.ajax({
+        //     type : "GET",
+        //     // url : "http://192.168.2.97:10010/wxcorp/getPreAuthCode",
+        //     url : "http://worktime.ttkuaiban.com/api/wxcorp/getPreAuthCode",
+        //     dataType : "jsonp",
+        //     jsonp: "jsoncallback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
+        //     jsonpCallback:"jsoncallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
+        //     success : function(data){
+        //         console.log(data);
+        //     },
+        //     error:function(){
+        //         alert('请求失败');
+        //     }
+        // });
+        // function jsoncallback(data) {
+        //     console.log(data)
+        // }
+
+        $.ajax({
+            type : "GET",
+            url : "https://worktime.ttkuaiban.com/api/wxcorp/getPreAuthCode",
+            success : function(data){
+                let suiteId = 'ww4e237fd6abb635af'
+                let huidiao = 'https://worktime.ttkuaiban.com/api/wxcorp/installFromWebsite'
+                let url = `https://open.work.weixin.qq.com/3rdapp/install?suite_id=${suiteId}&pre_auth_code=${data.data.code}&redirect_uri=${huidiao}&state=4`
+                window.location.href = url
+            },
+            error:function(){
+                alert('请求失败');
+            }
+        });
+
+    })
+
+    $('#zhuce').click(function() {
+        $.ajax({
+            type : "GET",
+            url : "https://worktime.ttkuaiban.com/api/wxcorp/getRegisterCode",
+            success : function(data){
+                if(data.code == 'ok') {
+                    let url = `https://open.work.weixin.qq.com/3rdservice/wework/register?register_code=${data.data.code}`
+                    if(data.data.code != undefined  && data.data.code != 'undefined') {
+                        window.location.href = url
+                    }
+                } else {
+                    console.log(data)
+                    alert(data.msg)
+                }
+            },
+            error:function(){
+                alert('请求失败');
+            }
+        });
+
+    })
+</script>
+</html>