wewe

2025-06-16 19:01:34 +08:00 · 2025-06-16 19:01:34 +08:00 · 61eeaf35b8
commit 61eeaf35b8
parent ad74161e4d
427 changed files with 21458 additions and 0 deletions
--- a/.env.development
+++ b/.env.development
@ -0,0 +1,7 @@
+NODE_ENV = development
+
+//VUE_APP_BASEURL = 'http://huhang-admin.mujiwork.cn'
+
+VUE_APP_BASEURL = '/api'
+
+VUE_APP_CDN = './'
--- a/.env.muji
+++ b/.env.muji
@ -0,0 +1,7 @@
+NODE_ENV = muji
+
+//VUE_APP_BASEURL = 'http://huhang-admin.mujiwork.cn'
+
+VUE_APP_BASEURL = 'https://hadmin.mujiwork.cn/'
+
+VUE_APP_CDN = 'https://cdn.mujiwork.com/huhang/mobile/'
--- a/.env.production
+++ b/.env.production
@ -0,0 +1,5 @@
+NODE_ENV = production
+
+VUE_APP_BASEURL = ''
+
+VUE_APP_CDN = 'https://img.novots.com/huhang/mobile/'
--- a/.env.test
+++ b/.env.test
@ -0,0 +1,7 @@
+NODE_ENV = test
+
+//VUE_APP_BASEURL = 'http://huhang-admin.mujiwork.cn'
+
+VUE_APP_BASEURL = 'http://dev.novots.com'
+
+VUE_APP_CDN = 'http://cdn.mujiwork.com/huhang/mobile/'
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -0,0 +1,14 @@
+// @see https://eslint.bootcss.com/docs/rules/
+
+module.exports = {
+  rules: {
+    "vue/multi-word-component-names": "off" 
+  },
+  parserOptions: {
+    parser: "babel-eslint",
+    ecmaVersion: 2017,  
+    sourceType: "module",
+    allowImportExportEverywhere: true,
+    codeFrame: false,  // 关闭解析错误提示
+  }
+};
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/babel.config.js
+++ b/babel.config.js
@ -0,0 +1,5 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+}
--- a/jsconfig.json
+++ b/jsconfig.json
@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "module": "esnext",
+    "baseUrl": "./",
+    "moduleResolution": "node",
+    "paths": {
+      "@/*": [
+        "src/*"
+      ]
+    },
+    "lib": [
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ]
+  }
+}
--- a/package.json
+++ b/package.json
@ -0,0 +1,63 @@
+{
+  "name": "website",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build",
+    "lint": "vue-cli-service lint",
+    "devBuild": "vue-cli-service build --mode development",
+    "testBuild": "vue-cli-service build --mode test",
+    "prodBuild": "vue-cli-service build --mode production",
+    "mjBuild": "vue-cli-service build --mode muji"
+  },
+  "dependencies": {
+    "axios": "^1.6.2",
+    "babel-polyfill": "^6.26.0",
+    "classlist-polyfill": "^1.2.0",
+    "core-js": "^3.8.3",
+    "element-ui": "^2.15.14",
+    "moment": "^2.29.4",
+    "vant": "^2.12.47",
+    "vue": "^2.6.14",
+    "vue-amap": "^0.5.10",
+    "vue-awesome-swiper": "^4.0.1",
+    "vue-lazyload": "^1.3.3",
+    "vue-meta-info": "^0.1.7",
+    "vue-router": "^3.0.3"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.12.16",
+    "@babel/eslint-parser": "^7.12.16",
+    "@vue/cli-plugin-babel": "~5.0.0",
+    "@vue/cli-plugin-eslint": "~5.0.0",
+    "@vue/cli-service": "~5.0.0",
+    "eslint": "^7.32.0",
+    "eslint-plugin-vue": "^8.0.3",
+    "less": "^3.9.0",
+    "less-loader": "^5.0.0",
+    "sass": "^1.69.5",
+    "sass-loader": "^13.3.2",
+    "swiper": "^2.7.6",
+    "vue-template-compiler": "^2.6.14"
+  },
+  "eslintConfig": {
+    "root": true,
+    "env": {
+      "node": true
+    },
+    "extends": [
+      "plugin:vue/essential",
+      "eslint:recommended"
+    ],
+    "parserOptions": {
+      "parser": "@babel/eslint-parser"
+    },
+    "rules": {}
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not dead"
+  ]
+}
--- a/public/index.html
+++ b/public/index.html
@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <title>护航科技股份有限公司】—IT外包|IT服务|IT运维|helpdesk|IT基础架构服务|IT巡检|IT维护</title>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
+  <meta name="theme-color" content="#000000" />
+  <meta data-vue-meta-info="true" name="keywords" content="桌面运维、运维外包、桌面外包、网络安全、服务外包、网络运维、网络维护、设备维护">
+  <meta data-vue-meta-info="true" name="description" content="护航科技股份有限公司，专注于全方位的IT服务，包括IT外包，IT运维，helpdesk，基础架构，系统集成、自有产品研发和行业应用解决方案等，已成为客户最信赖、最具实力的IT合作伙伴。">
+  <!-- <link rel="stylesheet" href="//at.alicdn.com/t/font_3151601_c8vop7v9ce.css"> -->
+  <script>
+    // 异步统计
+    !function(p){"use strict";!function(t){var s=window,e=document,i=p,c="".concat("https:"===e.location.protocol?"https://":"http://","sdk.51.la/js-sdk-pro.min.js"),n=e.createElement("script"),r=e.getElementsByTagName("script")[0];n.type="text/javascript",n.setAttribute("charset","UTF-8"),n.async=!0,n.src=c,n.id="LA_COLLECT",i.d=n;var o=function(){s.LA.ids.push(i)};s.LA?s.LA.ids&&o():(s.LA=p,s.LA.ids=[],o()),r.parentNode.insertBefore(n,r)}()}({id:"JcsxVtY54HXCV46t",ck:"60480",hashMode: true});
+  </script>
+  <!-- <script>
+     // 异步监控
+    !(function(c,i,e,b){
+    var h=i.createElement("script");
+    var f=i.getElementsByTagName("script")[0];
+    h.type="text/javascript";
+    h.crossorigin=true;
+    h.onload=function(){new c[b]["Monitor"]().init({id:"JbE5xTdZzGZkNCMX"});};
+    f.parentNode.insertBefore(h,f);h.src=e;})(window,document,"https://sdk.51.la/perf/js-sdk-perf.min.js","LingQue");
+  </script> -->
+
+  <!-- 同步监控 -->
+  <script src="https://sdk.51.la/perf/js-sdk-perf.min.js" crossorigin="anonymous"></script>
+  <script>
+    new LingQue.Monitor().init({id:"JcsxVtY54HXCV46t",sendSuspicious:true,sendSpaPv:true});
+  </script>
+</head>
+
+<body class="my">
+  <div id="app"></div>
+</body>
+<!-- 手淘适配方案 -->
+<script>
+  !function (e, t) {
+    var n = t.documentElement,
+      d = e.devicePixelRatio || 1;
+    function i() {
+      var e = document.body.clientWidth / 7.5;
+      n.style.fontSize = e + "px"
+    }
+    if (
+      function e() {
+        t.body ? t.body.style.fontSize = "16px" : t.addEventListener("DOMContentLoaded", e)
+        // t.body ? '' : t.addEventListener("DOMContentLoaded", e)
+      }(),
+        i(),
+        e.addEventListener("resize", i), e.addEventListener("pageshow",
+        function (e) {
+          e.persisted && i()
+        }),
+      2 <= d
+    ) {
+      var o = t.createElement("body"),
+        a = t.createElement("div");
+      a.style.border = ".5px solid transparent",
+        o.appendChild(a),
+        n.appendChild(o),
+      1 === a.offsetHeight && n.classList.add("hairlines"),
+        n.removeChild(o)
+    }
+  }(window, document)
+</script>
+</html>
--- a/src/App.vue
+++ b/src/App.vue
@ -0,0 +1,25 @@
+<script setup >
+// This starter template is using Vue 3 <script setup> SFCs
+// Check out https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup
+// import HelloWorld from './components/HelloWorld.vue'
+</script>
+
+<template>
+  <!-- <img alt="Vue logo" src="./assets/logo.png" /> -->
+  <!-- <HelloWorld msg="Hello Vue 3 + TypeScript + Vite" /> -->
+  <router-view></router-view>
+</template>
+
+<style>
+#app {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  /* text-align: center; */
+  /* color: #2c3e50; */
+  /* margin-top: 60px; */
+  height: 100%;
+  overflow-x: hidden;
+   
+}
+</style>
--- a/src/assets/css/iconfont.css
+++ b/src/assets/css/iconfont.css
@ -0,0 +1,59 @@
+@font-face {
+  font-family: "iconfont"; /* Project id 2914224 */
+  src: url('//at.alicdn.com/t/font_2914224_y82ol8e100h.woff2?t=1637303909890') format('woff2'),
+       url('//at.alicdn.com/t/font_2914224_y82ol8e100h.woff?t=1637303909890') format('woff'),
+       url('//at.alicdn.com/t/font_2914224_y82ol8e100h.ttf?t=1637303909890') format('truetype'),
+       url('//at.alicdn.com/t/font_2914224_y82ol8e100h.svg?t=1637303909890#iconfont') format('svg');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-hezuoshengtai:before {
+  content: "\e6c3";
+}
+
+.icon-jichujiagoupingtai:before {
+  content: "\e6c4";
+}
+
+.icon-fuwuguanlitixijianshe:before {
+  content: "\e6c5";
+}
+
+.icon-xiangxia:before {
+  content: "\e6c6";
+}
+
+.icon-kehuwendangzhongxin:before {
+  content: "\e6c7";
+}
+
+.icon-kehuanli:before {
+  content: "\e6c8";
+}
+
+.icon-jichengyushishifuwu:before {
+  content: "\e6c9";
+}
+
+.icon-ITSS:before {
+  content: "\e6ca";
+}
+
+.icon-xinxianquantixijianshe:before {
+  content: "\e6cb";
+}
+
+.icon-yunfuwu:before {
+  content: "\e6cc";
+}
+
+.icon-ITSSpeixunfuwu:before {
+  content: "\e6cd";
+}
--- a/src/assets/css/index.css
+++ b/src/assets/css/index.css
@ -0,0 +1,114 @@
+* {
+   margin: 0;
+   padding: 0;
+   box-sizing: border-box;
+   /* font-size: 14px; */
+   font-family: Avenir, Helvetica, Arial, sans-serif;
+  
+   
+}
+html {
+   height: 100%;
+   background-color: #f1f4fa;
+}
+body {
+   height: 100%;
+   max-width: 750px;
+   margin: 0 auto!important;
+   color: #303133;
+
+}
+div,
+ul,
+li,h1,h2,h3,h4,h5,h6,p {
+   box-sizing: border-box;
+   position: relative;
+   z-index: 1;
+}
+li {
+   list-style: none;
+}
+
+.main-container {
+   font-size: 0.18rem;
+}
+
+
+
+.admin-container {
+   padding: 20px;
+   background-color: #fff;
+   font-size: 16px;
+}
+.container-centent{
+   padding: 0 .26rem;
+}
+.title-sub{
+   text-align: center;
+   font-size: .38rem;
+   font-weight: 500;
+   color: #001D2D;
+   line-height: .62rem;
+   margin-bottom: .4rem;
+   
+}
+.title-sub span{
+   display: inline-block;
+   width: .36rem;
+   height: .36rem;
+   position: relative;
+   top: .04rem;
+}
+.title-sub span:first-child{
+   background: #E1EAFD;
+}
+.title-sub span:last-child{
+   background: #ECF4E3;
+}
+.custom-indicator {
+   position: absolute;
+   right: 5px;
+   bottom: 5px;
+   padding: 2px 5px;
+   font-size: 12px;
+   color: #fff;
+   background: rgba(0, 0, 0, 0.1);
+ }
+ .title-sub2{
+   text-align: left;
+   font-size: .32rem;
+   margin-bottom: .16rem;
+   margin-top: .3rem;
+   
+}
+.title-sub2 span{
+   width: .32rem;
+   height: .32rem;
+   top: .06rem;
+}
+
+.html-content{
+   width: 100%;
+   
+}
+.html-content img{
+   max-width: 100%;
+   height: auto;
+}
+.html-content p{
+   max-width: 100%;
+   /* line-height: .44rem; */
+}
+
+
+.span-class{
+   font-size: .4rem;
+   color: #12BEC3;
+   font-weight: bold;
+ }
+ .span-class-i{
+   color: #12BEC3;
+ }
+ .my-loading .el-icon-loading{
+    font-size: 40px;
+ }
--- a/src/assets/image/hu_rq.png
+++ b/src/assets/image/hu_rq.png
--- a/src/assets/image/icon_r.png
+++ b/src/assets/image/icon_r.png
--- a/src/assets/image/logo.png
+++ b/src/assets/image/logo.png
--- a/src/assets/image/service.png
+++ b/src/assets/image/service.png
--- a/src/assets/image/user.png
+++ b/src/assets/image/user.png
--- a/src/assets/js/eventBus.js
+++ b/src/assets/js/eventBus.js
@ -0,0 +1,6 @@
+import Vue from 'vue';
+
+// 使用 Event Bus
+const bus = new Vue();
+
+export default bus;
--- a/src/assets/js/fitter.js
+++ b/src/assets/js/fitter.js
@ -0,0 +1 @@
+
--- a/src/assets/theme/fonts/element-icons.ttf
+++ b/src/assets/theme/fonts/element-icons.ttf
--- a/src/assets/theme/fonts/element-icons.woff
+++ b/src/assets/theme/fonts/element-icons.woff
--- a/src/assets/theme/index.css
+++ b/src/assets/theme/index.css
--- a/src/components/Footer.vue
+++ b/src/components/Footer.vue
@ -0,0 +1,174 @@
+<template>
+  <div class="footer-container">
+    <div class="footer-box">
+      <van-row gutter="10">
+        <van-col span="8">
+          <div class="footer-nav">
+            <span>公司介绍</span>
+            <ul>
+              <li @click="goLink('/about')">公司概况</li>
+              <li @click="goLink('/about')">发展历程</li>
+              <li @click="goLink('/index_2')">荣誉资质</li>
+            </ul>
+          </div>
+          <div class="footer-nav">
+            <span>公司动态</span>
+            <ul>
+              <li @click="goLink('/about_2')">新闻</li>
+              <li @click="goLink('/apply')">案例</li>
+            </ul>
+          </div>
+          <div class="footer-nav">
+            <span>加入我们</span>
+            <ul>
+              <li @click="goLink('/about_3')">社会招聘</li>
+              <li @click="goLink('/about_3')">校园招聘</li>
+              <li @click="goLink('/it3')">ITSS培训</li>
+            </ul>
+          </div>
+        </van-col>
+        <van-col span="16" style="text-align: right;">
+          <div class="footer-call">
+            <ul>
+              <li>售前咨询热线 &nbsp;&nbsp;&nbsp; 400-612-6010</li>
+              <li>售后投诉热线 &nbsp;&nbsp;&nbsp; 400-612-6010</li>
+              <li>ITSS课程咨询 &nbsp;&nbsp;&nbsp; 400-612-6010</li>
+              <li>邮箱 &nbsp;&nbsp;&nbsp; marketing@novots.com</li>
+            </ul>
+          </div>
+          <div class="hu-rq">
+            <img src="../assets/image/hu_rq.png" />
+            <div>搜索“护航科技”或扫码<br />关注护航科技，了解更多信息</div>
+          </div>
+        </van-col>
+      </van-row>
+    </div>
+
+    <div class="footer_mian">
+      <span class="fl"
+        ><a href="https://beian.miit.gov.cn/" target="blank"
+          >京 ICP备13007157号 </a
+        >京 公网安备110108400789号</span
+      >
+      <br />
+      <span class="fl">
+        版权所有 护航科技
+        <font>Copyright © Novots Technologies Limited All Right Reserved</font>
+      </span>
+    </div>
+
+  </div>
+</template>
+<script>
+export default {
+  components: {
+    // Fold,
+    // Expand,
+  },
+  data() {
+    return {
+      actIndex: "",
+    };
+  },
+  created() {
+    this.actIndex = this.$router.path;
+  },
+  methods: {
+    goLink(path) {
+      this.$router.push(path);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.footer-container {
+  overflow: hidden;
+  padding: 0.36rem;
+  background-color: #25283b;
+  // text-align: center;
+  z-index: 0;
+  .footer_mian {
+    border-top: 1px solid rgba(255,255,255,0.6);
+    padding-top: 20px;
+    color: #fff;
+    margin-top: 10px;
+    line-height: 22px;
+    font-size: 14px;
+    span {
+      color: #fff;
+      a {
+        color: #fff;
+       text-decoration: underline;
+      }
+    }
+  }
+}
+.footer-box {
+  //   width: auto;
+  overflow: hidden;
+
+  .hu-rq {
+    // position: absolute;
+    // right: 0;
+    // top: 0;
+    display: inline-block;
+    margin-top: .3rem;
+    text-align: center;
+    img {
+      width: 2.4rem;
+    }
+    div {
+      font-size: 0.28rem;
+      font-weight: 400;
+      color: #ffffff;
+      line-height: 0.44rem;
+      margin-top: 0.24rem;
+    }
+  }
+  .footer-nav {
+    text-align: left;
+    margin-bottom: 0.3rem;
+    span {
+      font-size: 0.32rem;
+      // font-weight: 600;
+      color: #ffffff;
+      margin-bottom: 0.1rem;
+      display: block;
+      // line-height: .32rem;
+    }
+    ul {
+      padding-top: 0.08rem;
+    }
+    li {
+      font-size: 0.28rem;
+      font-weight: 400;
+      color: #ffffff;
+      line-height: 0.44rem;
+      opacity: 0.8;
+      cursor: pointer;
+      // margin-bottom: .18rem;
+    }
+  }
+  .footer-call {
+    margin-right: 0;
+    margin-top: .1rem;
+    display: inline-block;
+    // display: flex;
+    // align-items: center;
+    //   height: 1.6rem;
+    ul {
+      
+    }
+    li {
+      font-size: 0.26rem;
+      font-weight: 400;
+      color: #ffffff;
+      line-height: 0.32rem;
+      opacity: 0.8;
+      margin-bottom: 0.18rem;
+      text-align: left;
+    }
+  }
+}
+</style>
--- a/src/components/Form.vue
+++ b/src/components/Form.vue
@ -0,0 +1,250 @@
+<template>
+  <div class="index-form">
+    <!-- <div class="hu-it">
+      项目咨询<br />
+      PROJECT CONSULTING
+    </div> -->
+    <div class="server">
+      <h3>项目咨询</h3>
+      <p class="sub">PROJECT CONSULTING</p>
+
+      <van-form @submit="onSubmit">
+        <van-field
+          v-model="form.need"
+          label="需求"
+          name="need"
+          placeholder=""
+          type="textarea"
+          :rules="[{ required: true, message: '请填写您的需求' }]"
+        />
+        <van-field
+          v-model="form.name"
+          name="name"
+          label="姓名"
+          placeholder=""
+          :rules="[{ required: true, message: '请填写您的姓名' }]"
+        />
+        <van-field
+          v-model="form.email"
+          name="email"
+          label="邮箱"
+          placeholder=""
+          :rules="[{ required: true, message: '请填写您的邮箱' }]"
+        />
+        <van-field
+          v-model="form.phone"
+          name="phone"
+          label="联系电话"
+          placeholder=""
+          :rules="[{ required: true, message: '请填写您的联系电话' }]"
+        />
+        <van-field
+          v-model="form.city"
+          name="city"
+          label="省份"
+          placeholder=""
+          :rules="[{ required: true, message: '请填写您所在省份' }]"
+        />
+        <van-field
+          v-model="form.company"
+          name="company"
+          label="公司名称"
+          placeholder=""
+          :rules="[{ required: true, message: '请填写您的公司名称' }]"
+        />
+        <van-field
+          v-model="form.postion"
+          name="postion"
+          label="职务"
+          placeholder=""
+          :rules="[{ required: true, message: '请填写您的职务' }]"
+        />
+        <div style="margin-left: 16px; margin-top: 0.3rem">
+          <van-checkbox
+            v-model="checked"
+            shape="square"
+            icon-size=".30rem"
+            checked-color="#39a9ed"
+            style="margin-bottom: 0.12rem"
+            >我已阅读护航科技公司《用户协议》和《隐私政策》</van-checkbox
+          >
+          <van-checkbox
+            v-model="checked2"
+            shape="square"
+            icon-size=".30rem"
+            checked-color="#39a9ed"
+            >愿意通过电子邮件接收来自护航科技的咨询和信息</van-checkbox
+          >
+        </div>
+
+        <div style="margin: 16px">
+          <van-button round block type="info" native-type="submit"
+            >联系我们</van-button
+          >
+        </div>
+      </van-form>
+    </div>
+  </div>
+</template>
+<script>
+import api from "@/http/api";
+export default {
+  data() {
+    return {
+      checked: true,
+      checked2: true,
+      form: {
+        need: "",
+        name: "",
+        email: "",
+        phone: "",
+        city: "",
+        company: "",
+        postion: "",
+        form: 1,
+      },
+    };
+  },
+  mounted() {},
+  methods: {
+    onSubmit(values) {
+      console.log("submit", values);
+      api.postDate(this.form).then(() => {
+        Toast.success("提交成功");
+        // this.$message({
+        //   type: "success",
+        //   message: `提交成功`,
+        // });
+      });
+    },
+    // save() {
+    //   if (this.form.need == "") {
+    //     this.$message({
+    //       type: "warning",
+    //       message: `请输入描述`,
+    //     });
+    //     return;
+    //   }
+    //   if (this.form.name == "") {
+    //     this.$message({
+    //       type: "warning",
+    //       message: `请输入姓名`,
+    //     });
+    //     return;
+    //   }
+    //   if (this.form.email == "") {
+    //     this.$message({
+    //       type: "warning",
+    //       message: `请输入邮箱`,
+    //     });
+    //     return;
+    //   }
+    //   if (this.form.phone == "") {
+    //     this.$message({
+    //       type: "warning",
+    //       message: `请输入电话`,
+    //     });
+    //     return;
+    //   }
+    //   if (this.form.city == "") {
+    //     this.$message({
+    //       type: "warning",
+    //       message: `请输入省份`,
+    //     });
+    //     return;
+    //   }
+    //   if (this.form.company == "") {
+    //     this.$message({
+    //       type: "warning",
+    //       message: `请输入公司名称`,
+    //     });
+    //     return;
+    //   }
+    //   if (this.form.postion == "") {
+    //     this.$message({
+    //       type: "warning",
+    //       message: `请输入职位`,
+    //     });
+    //     return;
+    //   }
+    //   api.postDate(this.form).then(() => {
+    //     this.$message({
+    //       type: "success",
+    //       message: `提交成功`,
+    //     });
+    //   });
+    // },
+  },
+};
+</script>
+<style lang="less" scoped>
+.index-form {
+  // padding: 0.5rem 1.2rem 0.65rem 1.2rem;
+  .server {
+    margin-top: 0.6rem;
+    position: relative;
+    h3 {
+      font-size: 0.45rem;
+      text-align: center;
+      letter-spacing: 0.04rem;
+      margin-bottom: 0.16rem;
+      color: #303133;
+    }
+    .sub{
+        font-size: .32rem;
+        color: #12BEC3;
+        text-align: center;
+        margin-bottom: .2rem;
+      }
+  }
+  .hu-it {
+    font-size: 0.42rem;
+    font-weight: 500;
+    color: #001d2d;
+    line-height: 0.62rem;
+    position: relative;
+  }
+  .block {
+    .form-item {
+      border-bottom: 1px solid #dadada;
+      height: 0.88rem;
+      position: relative;
+      span {
+        // font-size: .18rem;
+        font-weight: bold;
+        color: #042030;
+        position: absolute;
+        line-height: 0.88rem;
+        left: 0;
+        top: 0;
+        display: inline-block;
+
+        i {
+          position: relative;
+          color: #e02020;
+          margin-right: 0.04rem;
+        }
+      }
+      input {
+        width: 100%;
+        height: 100%;
+        border: 0;
+        background-color: rgba(0, 0, 0, 0);
+        text-indent: 1.25rem;
+        outline: none;
+        // font-size: .18rem;
+      }
+    }
+  }
+  ::v-deep .van-button--info {
+    // background: linear-gradient(to right,var(--primary) 0%,var(--success) 100%);
+    background: linear-gradient(to right, #39a9ed 0%, #6eecf3 100%);
+    border: 0;
+    box-shadow: 0.06667rem 0.06667rem 0.10667rem #12bec34d,
+      -0.06667rem -0.06667rem 0.10667rem #fffc;
+  }
+  ::v-deep van-button__text {
+    color: #fff;
+  }
+}
+</style>
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@ -0,0 +1,186 @@
+<template>
+  <div class="header-box">
+    <div class="logo">
+      <img src="../assets/image/logo.png" @click="toLink('')" />
+    </div>
+    <div class="meun-icon">
+      <van-icon class="my-icon" name="wap-nav" @click="open" />
+    </div>
+     <!-- <van-popup v-model="show" position="left" :style="{ height: '100%', width: '40%' }" >
+      
+     </van-popup> -->
+     <div class="menus" v-show="show">
+      <ul>
+        <li v-for="(item, index) in navList" :class="{active: actIndex == index}" @click="toLink(index)" >
+          {{item.text}}
+        </li>
+        <li :class="{active: actIndex == -1}" @click="toLink(-1)">
+          企业动态
+        </li>
+      </ul>
+      <van-icon class="my-close" name="close" @click="show = false" />
+     </div>
+     <!-- <div class="menus2" v-show="show">
+      <van-collapse v-model="activeName" accordion v-for="(item, index) in navList">
+        <van-collapse-item :title="item.text" :name="index">内容</van-collapse-item>
+      </van-collapse>
+      <van-icon class="my-close" name="close" @click="show = false" />
+     </div> -->
+  </div>
+</template>
+<script>
+import bus from "@/assets/js/eventBus";
+import api from "@/http/api";
+
+export default {
+  computed: {
+    pathData() {
+      return this.$route;
+    },
+
+  },
+  data() {
+    return {
+      show: false,
+      activeKey: 0,
+      navList: JSON.parse(JSON.parse(window.localStorage.homeData)).navList,
+      actIndex: 0,
+      activeName:'',
+    };
+  },
+  watch: {},
+  methods: {
+    toLink(index){
+      this.actIndex = index;
+      this.show = false;
+      if(index == -1){
+        this.$router.push('/about_2')
+      }else{
+        this.navList.forEach((item, i) => {
+          if(i == index){
+            this.$router.push(item.url)
+          }
+        })
+      }
+      
+    },
+    open(){
+      this.show = true
+      if(this.$route.path == '/' || '' || false){
+        this.actIndex = 0
+        return
+      }
+      if(this.$route.path == '/about_2'){
+        this.actIndex = -1
+        return
+      }
+      this.navList.forEach((item, i) => {
+        if(item.url == this.$route.path){
+          this.actIndex = i
+        }
+      })
+    }
+  },
+
+  mounted() {
+    console.log( JSON.parse(JSON.parse(window.localStorage.homeData)))
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.header-box {
+  height: 100%;
+  .logo{
+    width: 2rem;
+    float: left;
+    position: relative;
+    height: 100%;
+    img{
+      width: 100%;
+      position: absolute;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+  }
+  .meun-icon{
+    float: right;
+    position: relative;
+    height: 100%;
+    font-size: .42rem;
+    .my-icon{
+      position: relative;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+  }
+  .menus{
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    z-index: 9999;
+    background: rgba(255,255,255,.7);
+    backdrop-filter: blur(0.26667rem);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    ul{
+      width: 80%;
+    }
+    li{
+      text-align: center;
+      height: 0.6rem;
+      line-height: .6rem;
+      margin: 0.1rem 0;
+      font-size: .30rem;
+    }
+    .active{
+      color: #12BEC3;
+    }
+    .my-close{
+      position: absolute;
+      bottom: 2rem;
+      left: 50%;
+      transform: translateX(-50%);
+      font-size: .6rem;
+      color: #12BEC3;
+    }
+  }
+  .menus2{
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    z-index: 9999;
+    background: rgba(255,255,255,.7);
+    backdrop-filter: blur(0.26667rem);
+    // display: flex;
+    // justify-content: center;
+    // align-items: center;
+    ul{
+      width: 80%;
+    }
+    li{
+      // text-align: center;
+      height: 0.6rem;
+      line-height: .6rem;
+      margin: 0.1rem 0;
+      font-size: .30rem;
+    }
+    .active{
+      color: #12BEC3;
+    }
+    .my-close{
+      position: absolute;
+      bottom: 2rem;
+      left: 50%;
+      transform: translateX(-50%);
+      font-size: .6rem;
+      color: #12BEC3;
+    }
+  }
+}
+</style>
--- a/src/components/Main.vue
+++ b/src/components/Main.vue
@ -0,0 +1,156 @@
+<template>
+  <div class="main-container">
+    <div class="main-content">
+      <div class="header">
+        <Header />
+      </div>
+      <div class="content">
+        <keep-alive>
+          <router-view></router-view>
+        </keep-alive>
+      </div>
+      <div class="footer" v-show="isUs">
+        <Footer />
+      </div>
+      <div class="TABBER">
+        <TabBer />
+      </div>
+      <div>
+        <Service />
+      </div>
+      <el-dialog :visible.sync="dialogVisible" :close-on-click-modal="false" :show-close="true" width="86%" center
+      :lock-scroll="false" append-to-body>
+      <template #title>
+        <span style="opacity: 0;">标题</span>
+      </template>
+      <div class="dialog-content">
+        <h2 style="text-align: center;margin-bottom: 0.2rem;">护航科技股份有限公司严正声明</h2>
+        <p>
+          近期，发现不法分子冒用我司名义，通过伪造公章、营业执照，搭建虚假网站、APP，在微信群、QQ群等社交平台实施诈骗，诱骗公众转账。此类行为已涉嫌违反《中华人民共和国刑法》第二百六十六条诈骗罪、第二百八十条伪造、变造、买卖国家机关公文、证件、印章罪之规定，不仅严重侵害我司企业名称权、商标权等合法权益，更对社会公众财产安全造成重大威胁。
+        </p>
+        <p>我司严正声明如下：</p>
+        <p>1、护航科技从没有开发或上线过任何APP软件，任何以“护航科技APP”名义进行谋利的软件，均是骗子，提醒公众切勿上当受骗。</p>
+        <p>2、从未开展任何线上线下资金募集、转账交易活动。</p>
+        <p>3、官方业务仅通过官网（https://www.novots.com/index）及授权机构办理。</p>
+        <p>4、正规业务资金往来均通过企业对公账户，绝不要求私人转账。</p>
+        <p>请公众通过官方渠道核实业务真实性，谨防受骗。如遇可疑情况，请立即报警或联系我司（电话：400-612-6010）。我司将依法追究侵权者法律责任。</p>
+
+        <p style="text-align: right;">护航科技股份有限公司</p>
+        <p style="text-align: right;">2025 年4 月 25 日</p>
+      </div>
+    </el-dialog>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+import Header from "./Header.vue";
+import Footer from "./Footer.vue";
+import TabBer from "./tabBer.vue";
+import Service from "./Service.vue";
+import api from "../http/api";
+
+export default {
+  components: { Header, Footer, TabBer, Service },
+  data() {
+    return {
+      isUs: true,
+      PagekeyWords:
+        "桌面运维、运维外包、桌面外包、网络安全、服务外包、网络运维、网络维护、设备维护",
+      PageDescription:
+        "护航科技股份有限公司，专注于全方位的IT服务，包括IT外包，IT运维，helpdesk，基础架构，系统集成、自有产品研发和行业应用解决方案等，已成为客户最信赖、最具实力的IT合作伙伴。",
+      PageTitle:
+        "护航科技股份有限公司】—IT外包|IT服务|IT运维|helpdesk|IT基础架构服务|IT巡检|IT维护",
+      dialogVisible: true,
+    };
+  },
+  methods: {},
+  computed: {
+    path() {
+      return this.$route.path;
+    },
+  },
+  watch: {
+    path(a) {
+      console.log(a);
+      if (a == "/contactUs") {
+        this.isUs = false;
+      } else {
+        this.isUs = true;
+      }
+    },
+  },
+  metaInfo() {
+    return {
+      title: this.PageTitle,
+      meta: [
+        {
+          name: "keyWords",
+          content: this.PagekeyWords,
+        },
+        {
+          name: "description",
+          content: this.PageDescription,
+        },
+      ],
+    };
+  },
+  created() { },
+  mounted() {
+    api.seo().then((res) => {
+      console.log(res);
+      this.PageTitle = res.data.reseoHome.metaTitle;
+      this.PagekeyWords = res.data.reseoHome.metaKey;
+      this.PageDescription = res.data.reseoHome.metaDesc;
+    });
+
+    api.getHome().then((res) => {
+      window.localStorage.homeData = JSON.stringify(
+        res.data.resettingDict.settings
+      );
+    });
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main-container {
+  // height: 100vh;
+  // overflow: hidden;
+  font-size: 14px;
+  position: relative;
+  background-color: #fff;
+  padding-bottom: 1rem;
+
+  .header {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    background: #fff;
+    height: 1rem;
+    z-index: 999;
+    padding: 0 0.26rem;
+    box-shadow: 1px 2px 10px #12bec34d, -0.06667rem -0.06667rem 0.10667rem #fffc;
+  }
+
+  .content {
+    padding-top: 1rem;
+    padding: 1rem 0rem 0.3rem 0rem;
+    min-height: 100vh;
+  }
+
+  .footer {
+    z-index: 0;
+  }
+
+  
+}
+.dialog-content {
+    p {
+      line-height: 0.4rem;
+      text-indent: 2em;
+    }
+  }
+</style>
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@ -0,0 +1,48 @@
+<template>
+<div>
+  <van-nav-bar
+  :title="title"
+  left-text="返回"
+  left-arrow
+  @click-left="onClickLeft"
+/>
+</div>
+</template>
+<script>
+
+
+export default {
+  
+  data() {
+    return {
+        title:''
+     
+    };
+  },
+  computed:{
+      path(){
+          return this.$route.path
+      }
+  },
+  watch: {
+      path(){
+          this.title = this.$route.meta.title
+      }
+  },
+  methods: {
+      onClickLeft(){
+          this.$router.back()
+      },
+   
+  },
+
+  mounted() {
+      this.title = this.$route.meta.title
+    // console.log(this.$route.meta.title)
+  },
+};
+</script>
+
+<style lang="less" scoped>
+
+</style>
--- a/src/components/Service.vue
+++ b/src/components/Service.vue
@ -0,0 +1,80 @@
+
+<template>
+    <div>
+        <van-popup v-model="show" :style="{ height: '100%',width: '100%' }" class="my-popup" >
+            <van-icon name="close" class="my-close" @click="show = false" />
+            <Form />
+        </van-popup>
+
+        <div class="service" @click="show = true">
+            <div>
+                <img src="@/assets/image/service.png" />
+                <span>咨询</span>
+            </div>
+        </div>
+    </div>
+</template>
+<script>
+import Form from './Form.vue';
+
+
+export default {
+    data() {
+        return {
+            show: false
+        };
+    },
+    computed: {},
+    watch: {},
+    methods: {},
+    mounted() {
+    },
+    components: { Form }
+};
+</script>
+
+<style lang="less" scoped>
+.service {
+    position: fixed;
+    z-index: 999;
+    right: .26rem;
+    bottom: 1.2rem;
+    width: 1.04rem;
+    height: 1.04rem;
+    border-radius: 50%;
+    color: #fff;
+    background-color: #12BEC3;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    box-shadow: 0px 5px 10px 0px rgba(0, 49, 75, 0.1);
+    opacity: .88;
+    div {
+        text-align: center;
+
+        span {
+            font-size: 12px;
+        }
+    }
+
+    img {
+        width: .54rem;
+        display: block;
+        margin: auto;
+    }
+}
+.my-popup{
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 8px;
+    .my-close{
+        position: absolute;
+        font-size: .58rem;
+        z-index: 999;
+        top: 1.5rem;
+        color: #6eecf3;
+        right: .3rem;
+    }
+}
+</style>
--- a/src/components/Sidebar.vue
+++ b/src/components/Sidebar.vue
@ -0,0 +1,213 @@
+<template>
+  <div class="sidebar">
+    <el-menu
+      active-text-color="#234883"
+      :default-active="actIndex"
+      text-color="#fff"
+      router
+      @open="handleOpen"
+      @close="handleClose"
+      :collapse="isCollapse"
+      background-color="rgba(0,0,0,0)"
+    >
+      <div class="logo" @click="goIndex">
+        <!-- <img src="../../assets/image/logo.png" /> -->
+        AutoMan
+      </div>
+      <el-menu-item index="/">
+        <div class="menu-bg">
+          <i class="el-icon-house"></i>
+          <span>首页</span>
+        </div>
+      </el-menu-item>
+      <el-menu-item index="/conify">
+        <div class="menu-bg">
+          <i class="el-icon-setting"></i>
+          <span>系统配置</span>
+        </div>
+      </el-menu-item>
+      <el-menu-item index="/appStore">
+        <div class="menu-bg">
+          <i class="el-icon-sold-out"></i>
+          <span>应用市场</span>
+        </div>
+      </el-menu-item>
+      <el-submenu index="1">
+        <template slot="title">
+          <i class="el-icon-user"></i>
+          <span>用户中心</span>
+        </template>
+        <el-menu-item index="/me">
+          <div class="menu-bg">我的信息</div>
+        </el-menu-item>
+        <el-menu-item index="/spread">
+          <div class="menu-bg">推广信息</div>
+        </el-menu-item>
+        <!-- <el-menu-item index="/">消费明细</el-menu-item> -->
+      </el-submenu>
+      <!-- <el-submenu index="2">
+          <template slot="title">
+            <i class="el-icon-service"></i>
+            <span>帮助中心</span>
+          </template>
+          <el-menu-item index="/">联系我们</el-menu-item>
+          <el-menu-item index="/">帮助文档</el-menu-item>
+         </el-submenu> -->
+    </el-menu>
+  </div>
+</template>
+<script>
+// import emitter from "../../../assets/js/eventBus"
+export default {
+  components: {},
+  methods: {
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath);
+    },
+    handleClose(key, keyPath) {
+      console.log(key, keyPath);
+    },
+    goIndex() {
+      this.$router.push("/");
+    },
+    
+  },
+  computed:{
+    path(){
+      return this.$route.path
+    }
+  },
+  watch:{
+    path(a){
+      this.actIndex = a
+    }
+  },
+  created() {
+    this.actIndex = this.path;
+  },
+  data() {
+    return {
+      isCollapse: false,
+      actIndex: "",
+    };
+  },
+};
+</script>
+
+<style scoped>
+.sidebar {
+  flex: none;
+  overflow: hidden;
+}
+.el-menu-item {
+  padding: 0;
+}
+.logo {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 60px;
+  cursor: pointer;
+  color: #fff;
+}
+.logo img {
+  width: 120px;
+}
+.el-menu-vertical-demo:not(.el-menu--collapse) {
+  width: 200px;
+  min-height: 400px;
+}
+.sidebar {
+  height: 100%;
+}
+.el-menu {
+  border: 0;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0);
+}
+
+.el-menu-item i {
+  position: relative;
+  top: -2px;
+  display: inline-block;
+}
+.el-menu-item span {
+  margin-left: 4px;
+}
+
+.el-menu-item:hover:hover {
+  background-color: rgba(0, 0, 0, 0) !important;
+}
+::v-deep .el-submenu__title:hover {
+  background-color: rgba(0, 0, 0, 0) !important;
+}
+
+.is-active .menu-bg {
+  background: #fff;
+  padding-left: 20px;
+}
+.is-active .menu-bg::before {
+  opacity: 1;
+}
+.is-active .menu-bg::after {
+  opacity: 1;
+}
+.is-active .el-menu .menu-bg {
+  background: rgba(0, 0, 0, 0);
+}
+.is-active .el-menu .menu-bg::before {
+  opacity: 0;
+}
+.is-active .el-menu .menu-bg::after {
+  opacity: 0;
+}
+.is-active .el-menu .is-active .menu-bg {
+  background: #fff;
+  padding-left: 35px;
+}
+.is-active .el-menu .is-active .menu-bg::before {
+  opacity: 1;
+}
+.is-active .el-menu .is-active .menu-bg::after {
+  opacity: 1;
+}
+.el-menu-item {
+  padding-left: 5px !important;
+  background-color: rgba(0, 0, 0, 0) !important;
+}
+.el-menu--inline .menu-bg {
+  padding-left: 30px;
+}
+.menu-bg {
+  height: 100%;
+  border-bottom-left-radius: 50px;
+  border-top-left-radius: 50px;
+  padding: 0 15px;
+  transition: all 0.3s;
+  position: relative;
+}
+.menu-bg::before {
+  width: 20px;
+  height: 12px;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  content: "";
+  position: absolute;
+  right: 0;
+  top: -12px;
+  background-image: url("../assets/image/round.png");
+  opacity: 0;
+}
+.menu-bg::after {
+  width: 20px;
+  height: 12px;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  content: "";
+  position: absolute;
+  right: 0;
+  bottom: -12px;
+  background-image: url("../assets/image/round-1.png");
+  opacity: 0;
+}
+</style>
--- a/src/components/tabBer.vue
+++ b/src/components/tabBer.vue
@ -0,0 +1,41 @@
+
+<template>
+<!-- <router-view /> -->
+    <van-tabbar route>
+        <van-tabbar-item replace to="/index" icon="home-o">首页</van-tabbar-item>
+        <van-tabbar-item replace to="/itService" icon="like-o">服务</van-tabbar-item>
+        <van-tabbar-item replace to="/product" icon="diamond-o">产品</van-tabbar-item>
+        <van-tabbar-item replace to="/contactUs" icon="friends-o">合作</van-tabbar-item>
+    </van-tabbar>
+</template>
+<script>
+
+
+export default {
+
+    data() {
+        return {
+
+        };
+    },
+    computed: {
+        path() {
+        }
+    },
+    watch: {
+        path() {
+        }
+    },
+    methods: {
+        onClickLeft() {
+        },
+
+    },
+
+    mounted() {
+    },
+};
+</script>
+
+<style lang="less" scoped>
+</style>
--- a/src/components/wrap.vue
+++ b/src/components/wrap.vue
@ -0,0 +1,36 @@
+<template>
+  <div class="wrap-container">
+    <NavBar />
+    <keep-alive>
+      <router-view></router-view>
+    </keep-alive>
+    <Footer />
+  </div>
+</template>
+
+<script >
+import NavBar from "./NavBar.vue";
+import Footer from "./Footer.vue";
+export default {
+  components: { NavBar, Footer},
+  data() {
+    return {};
+  },
+  methods: {
+    
+  },
+  mounted() {
+    
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.wrap-container {
+  
+  position: relative;
+  background-color: #fff;
+ 
+ 
+}
+</style>
--- a/src/filters/Filters.js
+++ b/src/filters/Filters.js
@ -0,0 +1,217 @@
+// import state from '@/store/state'
+import moment from 'moment'
+
+//图片加前缀
+// export const ImageCdn = (text) => {
+//   return process.env.VUE_APP_CDN_BASEURL + text
+// }
+// 没有数据返回--
+const formatText = (val) => {
+  if (val == '' || val == undefined || val == null) {
+    return '--'
+  }
+  return val
+}
+
+// 没有数据返回0
+const formatZero = (val) => {
+  if (val == '' || val == undefined || val == null) {
+    return 0
+  }
+  return val
+}
+
+const payDate = (val) => {
+  if (val == 7) {
+    return val + '天'
+  }
+  if (val > 7 && val < 40) {
+    return '月'
+  }
+  if (val > 40) {
+    return '年'
+  }
+  return val
+}
+
+const toFixed2 = (val) => {
+  let str = val.toFixed(2)
+  return str
+}
+
+const percent2 = (val) => {
+  if (val == '' || val == undefined || val == null) {
+    return '--'
+  }
+  let str = Math.round(val * 10000) / 100 + '%'
+
+  return str
+}
+
+// 日期格式化年月日
+const formatYYYYMMDD = (value) => {
+  if (!value) {
+    return '--'
+  } else {
+    let str = moment(value).format('YYYY-MM-DD')
+    return str
+  }
+}
+
+// 字符串转数组
+const strArr = (value) => {
+  if (!value) {
+    return '--'
+  } else {
+    let arr = JSON.parse(value)
+    let str = ''
+    arr.map((item, index) => {
+      str += item + '/'
+    })
+    str = str.substring(0, str.length - 1)
+    return str
+  }
+}
+
+const phoneFormat = (value) => {
+  if (!value) {
+    return '--'
+  } else {
+    let str = value
+    return str.substring(0, 3) + '****' + str.substring(7, str.length)
+  }
+}
+
+// 分转元 保留2位小数
+export const toDecimal2 = (num) => {
+  let x = +num / 100
+  var f = parseFloat(x + '')
+  if (isNaN(f)) {
+    return '0'
+  }
+  var f = Math.round(x * 100) / 100
+  var s = f.toString()
+  var rs = s.indexOf('.')
+  if (rs < 0) {
+    rs = s.length
+    s += '.'
+  }
+  while (s.length <= rs + 2) {
+    s += '0'
+  }
+  return s
+}
+
+export const priceUppercase = (money) => {
+  var cnNums = new Array('零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖') //汉字的数字
+  var cnIntRadice = new Array('', '拾', '佰', '仟') //基本单位
+  var cnIntUnits = new Array('', '万', '亿', '兆') //对应整数部分扩展单位
+  var cnDecUnits = new Array('角', '分', '毫', '厘') //对应小数部分单位
+  //var cnInteger = "整"; //整数金额时后面跟的字符
+  var cnIntLast = '元' //整型完以后的单位
+  var maxNum = 999999999999999.9999 //最大处理的数字
+
+  var IntegerNum //金额整数部分
+  var DecimalNum //金额小数部分
+  var ChineseStr = '' //输出的中文金额字符串
+  var parts //分离金额后用的数组，预定义
+  if (money == '') {
+    return ''
+  }
+  money = parseFloat(money)
+  if (money >= maxNum) {
+    // $.alert('超出最大处理数字');
+    return ''
+  }
+  if (money == 0) {
+    //ChineseStr = cnNums[0]+cnIntLast+cnInteger;
+    ChineseStr = cnNums[0] + cnIntLast
+    //document.getElementById("show").value=ChineseStr;
+    return ChineseStr
+  }
+  money = money.toString() //转换为字符串
+  if (money.indexOf('.') == -1) {
+    IntegerNum = money
+    DecimalNum = ''
+    cnIntLast = '元整'
+  } else {
+    parts = money.split('.')
+    IntegerNum = parts[0]
+    DecimalNum = parts[1].substr(0, 4)
+  }
+  let zeroCount = 0
+  let IntLen = 0
+  let n
+  let p
+  let m
+  let q
+  let decLen = 0
+  if (parseInt(IntegerNum, 10) > 0) {
+    //获取整型部分转换
+    zeroCount = 0
+    IntLen = IntegerNum.length
+    for (var i = 0; i < IntLen; i++) {
+      n = IntegerNum.substr(i, 1)
+      p = IntLen - i - 1
+      q = p / 4
+      m = p % 4
+      if (n == '0') {
+        zeroCount++
+      } else {
+        if (zeroCount > 0) {
+          ChineseStr += cnNums[0]
+        }
+        zeroCount = 0 //归零
+        ChineseStr += cnNums[parseInt(n)] + cnIntRadice[m]
+      }
+      if (m == 0 && zeroCount < 4) {
+        ChineseStr += cnIntUnits[q]
+      }
+    }
+    ChineseStr += cnIntLast
+    //整型部分处理完毕
+  }
+  if (DecimalNum != '') {
+    //小数部分
+    decLen = DecimalNum.length
+    for (i = 0; i < decLen; i++) {
+      n = DecimalNum.substr(i, 1)
+      if (n != '0') {
+        ChineseStr += cnNums[Number(n)] + cnDecUnits[i]
+      }
+    }
+  }
+  if (ChineseStr == '') {
+    //ChineseStr += cnNums[0]+cnIntLast+cnInteger;
+    ChineseStr += cnNums[0] + cnIntLast
+  } /* else if( DecimalNum == '' ){
+            ChineseStr += cnInteger;
+            ChineseStr += cnInteger;
+        } */
+  return ChineseStr
+}
+//删除版本的V字符
+export const deleteV = function(text) {
+  let str = text
+    ? text
+        .replace(' ', '')
+        .replace('V', '')
+        .replace('v', '')
+    : text
+  return text
+}
+
+// 手机号中间加****
+export const telChange = function(tel) {
+  tel = '' + tel
+  let newTel = tel.substr(0, 3) + '****' + tel.substr(7)
+  return newTel
+}
+
+//流程管理图片处理
+const processIcon = function(data, type) {
+  let int = parseInt(data)
+ 
+}
+
+export { formatText, toFixed2, percent2, formatYYYYMMDD, strArr, phoneFormat, payDate, processIcon, formatZero }
--- a/src/http/api.js
+++ b/src/http/api.js
@ -0,0 +1,290 @@
+// import {Get, Post} from "./request";
+import request from "./axios";
+let scroll = 0
+/** Get请求Url参数拼接 */
+function judgeParam(param) {
+    var str = "?";
+    for (var i in param) {
+        if (param[i] !== -1) {
+            str += i + "=" + param[i] + "&";
+        }
+    }
+    var str2 = str.substring(0, str.length - 1);
+    return str2;
+}
+//blob转化file
+function blobToFile(blob, num, filename) {
+    blob.lastModifiedDate = Date.now();
+    if (!filename) {//若无文件名则取当前时间戳
+      filename = Date.parse(new Date()) + '+' + num + '.jpg';
+    }
+    let file = new File([blob], filename, { type: "image/jpeg", lastModified: Date.now() });
+    // blob.name = fileName;
+    console.log(file)
+    return file;
+};
+const api = {
+    login(body) {
+        return request
+            .post('/api/v1/login', body)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    qiniuToken() {
+        return request
+            .get('/api/v1/token')
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    upImage64(body, num) {
+        let file = blobToFile(body, num)
+        let formData = new FormData();
+        formData.append('file', file);
+        return request
+            .post('/api/v1/image', formData)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    getTable(url, body) {
+        return request
+            .get(`/api/${url}` + judgeParam(body))
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    addData(url, body) {
+        return request
+            .post(`/api/v1/${url}`, body)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    dataInfo(url, body) {
+        return request
+            .get(`/api/v1/${url}/${body}`)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    dataEdit(url, body) {
+        return request
+            .patch(`/api/v1/${url}/${body.id}`, body.data)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    dataDelete(url, body) {
+        return request
+            .delete(`/api/v1/${url}/${body}`)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    deleteSelect(body) {
+        console.log(body)
+        return request
+            .post(`/api/v1/delete`, body)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    postDate(body) {
+        return request
+            .post(`/api/consult/createConsult`, body)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    services() {
+        return request
+            .get(`/api/pubadvantage/getAdvantageList`)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    servicesUp(body) {
+        return request
+            .patch(`/api/v1/services/${body.id}`, body.data)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    getHome() {
+        return request
+            .get(`/api/pubsettingDict/findSettingDcit?ID=1`)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    homeUp(body) {
+        return request
+            .patch(`/api/v1/home/195454129470967808`, body)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    boss(body) {
+        return request
+            .patch(`/api/v1/home/195454129470967808`, body)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    // 文档下载
+    download(str, name) {
+        // let name = "123.jpg";
+        let url = str;
+        let suffix = url.substring(url.lastIndexOf("."), url.length);
+        let ajax = new XMLHttpRequest();
+        ajax.open("GET", url, true);
+        ajax.responseType = 'blob';
+        ajax.onload = function (e) {
+            let url = window.URL.createObjectURL(ajax.response);
+            let a = document.createElement('a');
+            a.href = url;
+            a.download = name;
+            a.click()
+        };
+        ajax.send();
+    },
+    // 文档预览
+    wordPreview(url) {
+        let suffix = url.substring(url.lastIndexOf("."), url.length);
+        console.log(suffix)
+        // return
+        if(suffix == '.docx' || suffix == '.ppt' || suffix == '.xls'|| suffix == 'xlsx' || suffix == '.doc' || suffix == '.txt'){
+            var xurl = "https://view.officeapps.live.com/op/view.aspx?src=";
+            xurl += encodeURIComponent(url);
+            var ops = {
+                "_pdf": true, //word/excel文档尝试以pdf方式显示，默认false
+                // "_watermark": "XDOC文档预览", //水印文本，显示水印
+                // "_saveable": false, //是否允许保存PDF，默认true
+                // "_printable": false, //是否允许打印PDF，默认true
+                // "_copyable": false, //是否允许选择复制内容，默认true
+                // "_toolbar": false, //是否显示底部工具条，默认true
+                // "_title": "文档预览", //自定义标题
+                // "_expire": 30, //预览链接有效期，单位分钟，默认永久有效
+                // "_limit": "1,3", //限制页数，如：“5”表示只显示前5页，“2,5”表示从第2页开始的5页，对pdf/doc/docx/ppt/pptx有效
+            };//传入预览参数
+            for (var a in ops) {
+                xurl += "&" + encodeURIComponent(a) + "=" + encodeURIComponent(ops[a]);
+            }
+            window.open(xurl);
+        }else{
+            window.open(url);
+        }
+        
+    },
+    numbers(){
+        return request
+            .get(`/api/v1/numbers`)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    getBtags(){
+        return request
+            .get(`/api/v1/btags`)
+            .then((res) => {
+                return res
+            })
+            .catch(function (error) {
+                throw error
+            })
+    },
+    //字符串转base64
+    encode(str) {
+        // 对字符串进行编码
+        var encode = encodeURI(str);
+        // 对编码的字符串转化base64
+        var base64 = btoa(encode);
+        return base64;
+     },
+     // base64转字符串
+     decode(base64) {
+        // 对base64转编码
+        var decode = atob(base64);
+        // 编码转字符串
+        var str = decodeURI(decode);
+        return str;
+     },
+     
+     news(body){
+        return request
+        .get(`/api/pubinfo/findInfo?ID=${body}`)
+        .then((res) => {
+            return res
+        })
+        .catch(function (error) {
+            throw error
+        })
+     },
+     setScroll(data){
+        window.localStorage.scroll = data
+     },
+     getScroll(){
+         return window.localStorage.scroll
+     },
+     seo(){
+        return request
+        .get(`/api/seoHome/findSeoHome?ID=1`)
+        .then((res) => {
+            return res
+        })
+        .catch(function (error) {
+            throw error
+        })
+     }
+}
+export default api
--- a/src/http/axios.js
+++ b/src/http/axios.js
@ -0,0 +1,57 @@
+import axios from 'axios';
+// import QS from 'qs'; // 引入qs模块，用来序列化post类型的数据，后面会提到
+// import { Message } from 'element-ui';
+import { Toast } from 'vant';
+const path = process.env.NODE_ENV === 'development' ? '/api' : '';
+const service = axios.create({
+   baseURL: path,
+   timeout: 30000 // 请求超时时间
+});
+
+
+service.interceptors.request.use(
+   (config) => {
+      config.headers['x-token'] = window.localStorage.token || ''
+      return config
+   },
+   error => {
+      console.log(error)
+      Promise.reject(console.error);
+   }
+)
+service.interceptors.response.use(
+   response => {
+      const res = response.data
+      if(res.code == 1015){
+         window.location.href = window.location.origin + '/login'
+      }
+      if(res.code == 1006){
+         // Message.error(res.msg);
+         window.location.href = window.location.origin + '/login'
+      }
+      if(res.code == 0){
+         return res
+      } else {
+         Toast.fail(res.msg);
+         // Message.error(res.msg);
+         return Promise.reject('error')
+      }
+      // if (res.code === 200) {
+      //     return response.data
+      // } else {
+      //     if(res.code === 401){
+      //         window.localStorage.removeItem('token')
+      //         window.localStorage.removeItem('userInfo')
+      //         window.location.href = window.location.origin + '/login'
+      //         return
+      //     }
+      //     return Promise.reject('error')
+      // }
+   },
+   error => {
+      return Promise.reject(error)
+   }
+
+)
+
+export default service
--- a/src/main.js
+++ b/src/main.js
@ -0,0 +1,71 @@
+import Vue from 'vue'
+import App from './App.vue'
+import router from './router'
+import ElementUI from 'element-ui';
+import 'element-ui/lib/theme-chalk/index.css'; // 默认主题
+// import './assets/theme/index.css' //自定义主题
+// import "animate.css";
+
+import Vant from 'vant';
+import 'vant/lib/index.css';
+Vue.use(Vant);
+import 'babel-polyfill';
+import './assets/css/iconfont.css'
+import './assets/css/index.css'
+import './assets/js/fitter.js'
+// import api from './http/api'
+Vue.use(ElementUI);
+
+import * as Filters from './filters/Filters'
+
+//图片懒加载插件
+// import vueLazy from 'vue-lazyload'
+// Vue.use(vueLazy)
+
+import { Lazyload } from 'vant';
+
+Vue.use(Lazyload);
+
+
+import MetaInfo from 'vue-meta-info';
+Vue.use(MetaInfo);
+Vue.config.productionTip = false;
+
+import VueAMap from 'vue-amap';
+// import { lazyAMapApiLoaderInstance } from 'vue-amap';
+Vue.use(VueAMap);
+VueAMap.initAMapApiLoader({
+    key: 'dda7ab288f7fafb799771df908aa1550',
+    plugin: ['AMap.Autocomplete', 'AMap.PlaceSearch', 'AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PolyEditor', 'AMap.CircleEditor'],
+    // 默认高德 sdk 版本为 1.4.4
+    v: '1.4.4'
+  });
+
+
+
+import api from './http/api'
+router.beforeEach((to, from, next) => {
+    const homeData = window.localStorage.homeData
+    if(!homeData){
+        api.getHome().then((res) => {
+            window.localStorage.homeData = JSON.stringify(res.data.resettingDict.settings);
+            next();
+        });
+    } else {
+        next();
+    }
+})
+router.afterEach((to) => {
+    // gtag('config', 'UA-ID', {'page_path': to.fullPath});
+    // ga('set', 'page', to.path)
+    // ga('send', 'pageview')
+})
+
+Object.keys(Filters).forEach((key) => {
+    Vue.filter(key, Filters[key])
+  })
+new Vue({
+    router,
+    render: h => h(App)
+}).$mount('#app');
+
--- a/src/router/index.js
+++ b/src/router/index.js
@ -0,0 +1,239 @@
+import Vue from 'vue';
+import Router from 'vue-router';
+
+Vue.use(Router);
+
+export default new Router({
+    mode: 'hash',
+    scrollBehavior (to, from, savedPosition) {
+        if (savedPosition) {
+          return savedPosition
+        } else {
+          return { x: 0, y: 0 }
+        }
+      },
+    routes: [
+       
+    {
+        path: '/login',
+        component: () => import('@/views/login/login.vue'),
+        meta: { title: '登录' },
+    }, 
+    
+    {
+        path: '/',
+        // redirect: '/index',
+        component: () => import('@/components/Main.vue'),
+        meta: { title: ''},
+        children: [
+            {
+                path: '/',
+                component: () => import('@/views/index/index.vue'),
+                meta: { title: '' },
+            }, 
+            {
+                path: '/index',
+                component: () => import('@/views/index/index.vue'),
+                meta: { title: ''},
+            }, 
+           
+            {
+                path: '/itService',
+                component: () => import('@/views/itServer/itServer.vue'),
+                meta: { title: ''},
+            },
+            
+            {
+                path: '/product',
+                component: () => import('@/views/product/product.vue'),
+                meta: { title: ''},
+            }, 
+            
+            {
+                path: '/solution',
+                component: () => import('@/views/solution/solution.vue'),
+                meta: { title: ''},
+            }, 
+            
+            {
+                path: '/apply',
+                component: () => import('@/views/apply/apply.vue'),
+                meta: { title: '', },
+            },
+            
+
+            {
+                path: '/about',
+                component: () => import('@/views/about/about.vue'),
+                meta: { title: '', },
+            },
+            {
+                path:'/contactUs',
+                component: () => import('@/views/contactUs/contactUs.vue'),
+                meta: { title: '', },
+            },
+            {
+                path: '/index_1',
+                component: () => import('@/views/index/childs/index_1/index.vue'),
+                meta: { title: '文档中心', proPath: '/index' },
+            },
+            {
+                path: '/index_2',
+                component: () => import('@/views/index/childs/index_2/index.vue'),
+                meta: { title: '企业资质', proPath: '/index' },
+            },
+            {
+                path: '/it1',
+                component: () => import('@/views/itServer/childs/index_1/index.vue'),
+                meta: { title: 'IT 基础架构服务', proPath: '/itService', power: false },
+            },
+            {
+                path: '/it2',
+                component: () => import('@/views/itServer/childs/index_2/index.vue'),
+                meta: { title: '云服务', proPath: '/itService', power: false },
+            },
+            {
+                path: '/it3',
+                component: () => import('@/views/itServer/childs/index_3/index.vue'),
+                meta: { title: 'ITSS 培训服务', proPath: '/itService', power: false },
+            },
+            {
+                path: '/it4',
+                component: () => import('@/views/itServer/childs/index_4/index.vue'),
+                meta: { title: 'IT 系统集成与实施服务', proPath: '/itService', power: false },
+            },
+            {
+                path: '/it5',
+                component: () => import('@/views/itServer/childs/index_5/index.vue'),
+                meta: { title: '信息安全体系建设', proPath: '/itService', power: false },
+            },
+            {
+                path: '/it6',
+                component: () => import('@/views/itServer/childs/index_6/index.vue'),
+                meta: { title: 'IT服务', proPath: '/itService', power: false },
+            }, 
+            {
+                path: '/pro1',
+                component: () => import('@/views/product/childs/index_1/index.vue'),
+                meta: { title: 'ITSM 管理工具', proPath: '/product', power: false },
+            },
+            {
+                path: '/pro2',
+                component: () => import('@/views/product/childs/index_2/index.vue'),
+                meta: { title: 'OA 协同办公工具', proPath: '/product', power: false },
+            },
+            {
+                path: '/pro3',
+                component: () => import('@/views/product/childs/index_3/index.vue'),
+                meta: { title: '数字化应用底座', proPath: '/product', power: false },
+            },
+            {
+                path: '/pro4',
+                component: () => import('@/views/product/childs/index_4/index.vue'),
+                meta: { title: '配置自动化核查', proPath: '/product', power: false },
+            },
+            {
+                path: '/pro5',
+                component: () => import('@/views/product/childs/index_5/index.vue'),
+                meta: { title: '软件成分分析及同源漏洞检测工具', proPath: '/product', power: false },
+            },
+            {
+                path: '/pro6',
+                component: () => import('@/views/product/childs/index_6/index.vue'),
+                meta: { title: '软件源代码缺陷检测工具', proPath: '/product', power: false },
+            },
+            {
+                path: '/anonymousLetter',
+                component: () => import('../views/product/childs/anonymousLetter/index.vue'),
+                meta: { title: '飞书平台定制化开发', proPath: '/product', power: false },
+            },
+            {
+                path: '/solu1',
+                component: () => import('@/views/solution/childs/index_1/index.vue'),
+                meta: { title: '终端运维管理解决方案', proPath: '/solution', power: false },
+            },
+            {
+                path: '/solu2',
+                component: () => import('@/views/solution/childs/index_2/index.vue'),
+                meta: { title: 'IT 服务管理解决方案', proPath: '/solution', power: false },
+            },
+            {
+                path: '/solu3',
+                component: () => import('@/views/solution/childs/index_3/index.vue'),
+                meta: { title: '呼叫中心解决方案', proPath: '/solution', power: false },
+            },
+            {
+                path: '/solu4',
+                component: () => import('@/views/solution/childs/index_4/index.vue'),
+                meta: { title: '数据中心运维咨询及服务解决方案', proPath: '/solution', power: false },
+            },
+            {
+                path: '/app1',
+                component: () => import('@/views/apply/childs/index_1/index.vue'),
+                meta: { title: '某知名运动品牌', proPath: '/apply', power: false },
+            },
+            {
+                path: '/app2',
+                component: () => import('@/views/apply/childs/index_2/index.vue'),
+                meta: { title: '某大型互联网教育集团', proPath: '/apply', power: false },
+            },
+            {
+                path: '/app3',
+                component: () => import('@/views/apply/childs/index_3/index.vue'),
+                meta: { title: '全球500强大型制造型企业', proPath: '/apply', power: false },
+            },
+            {
+                path: '/app4',
+                component: () => import('@/views/apply/childs/index_4/index.vue'),
+                meta: { title: '某大型综合类央企', proPath: '/apply', power: false },
+            },
+            {
+                path: '/about_3',
+                component: () => import('@/views/about/childs/index_3/index.vue'),
+                meta: { title: '加入我们', proPath: '/about', power: false },
+            },
+            {
+                path: '/about_2',
+                component: () => import('@/views/about/childs/index_2/index.vue'),
+                meta: { title: '企业动态', proPath: '/about', power: false },
+            },
+            {
+                path: '/info_detial',
+                component: () => import('@/views/about/childs/index_2/childs/index.vue'),
+                meta: { title: '企业动态', proPath: '/about', power: false },
+            },
+            {
+                path: '/about_4',
+                component: () => import('@/views/about/childs/index_4/index.vue'),
+                meta: { title: '联系我们', proPath: '/about', power: false },
+            },
+            {
+                path: '/join_info',
+                component: () => import('@/views/about/childs/index_3/childs/join_info.vue'),
+                meta: { title: '职位详情', proPath: '/about', power: false },
+            },
+            {
+                path: '/guard',
+                component: () => import('../views/guard/index.vue'),
+                meta: { title: '护航科技代码安全卫士', proPath: '/guard', power: false },
+            },
+            {
+                path: '/seek',
+                component: () => import('../views/seek/seek.vue'),
+                meta: { title: '免费咨询', proPath: '/seek', power: false },
+            }
+            
+        ]
+    },
+    // {
+    //     path: '/wrap',
+    //     // redirect: '/index',
+    //     component: () => import('@/components/wrap.vue'),
+    //     meta: { title: ''},
+    //     children:[
+            
+    //     ]
+    // }
+    
+]
+})
--- a/src/views/about/about.less
+++ b/src/views/about/about.less
@ -0,0 +1,623 @@
+.about-container {
+  overflow-x: hidden;
+  
+  .it-temp1 {
+    // height: 6.48rem;
+    // padding-left: 1.2rem;
+    // display: flex;
+    // align-items: center;
+    position: relative;
+
+    img {
+      // position: absolute;
+      width: 100%;
+      display: block;
+      // height: 100%;
+      // top:0;
+      // left: 0;
+      // z-index: 0;
+    }
+    .title {
+      font-size: 0.6rem;
+      font-weight: 500;
+      color: #001d2d;
+      line-height: 0.89rem;
+    }
+    .sub-title {
+      font-size: 0.24rem;
+      font-weight: 400;
+      color: #001d2d;
+      line-height: 0.36rem;
+    }
+  }
+  .index-temp2 {
+    padding-top: .4rem;
+    // background-color: #f2f2f2;
+    position: relative;
+    img {
+      position: absolute;
+      width: 6rem;
+      right: -.26rem;
+      top: 0;
+      z-index: 0;
+      opacity: .5;
+    }
+    .content {
+      padding: .2rem;
+      .title {
+        font-size: 0.36rem;
+        font-weight: 600;
+        color: #001d2d;
+        line-height: 0.36rem;
+        margin-bottom: 0.4rem;
+      }
+      .text {
+        font-size: 0.26rem;
+        font-weight: 400;
+        color: #606266;
+        line-height: 0.40rem;
+        // width: 7.49rem;
+        text-align: justify;
+        
+      }
+    }
+  }
+  .index-temp3 {
+    padding: 0rem ;
+    position: relative;
+    background-color: #fff;
+    overflow: hidden;
+    z-index: 0;
+    .bg-img {
+      width: 146%;
+      margin-left: -16.5%;
+    }
+  }
+  .index-temp4 {
+    padding: 0rem;
+    position: relative;
+    .bg-img {
+      position: absolute;
+      z-index: 0;
+      width: 6.51rem;
+      top: 0.6rem;
+      right: -.26rem;
+    }
+    // z-index: 0;
+    .item {
+      background-color: #fff;
+      border-radius: .12rem;
+      padding: 0.36rem 0.36rem;
+      box-sizing: border-box;
+      position: relative;
+      z-index: 1;
+      box-shadow: 0px 10px 40px 0px rgba(0, 49, 75, 0.1);
+      margin-bottom: .3rem;
+      overflow: hidden;
+      .icon {
+        position: relative;
+        float: left;
+        width: 1rem;
+        img {
+          width: 0.72rem;
+          position: relative;
+          z-index: 0;
+        }
+        span {
+          display: block;
+          position: absolute;
+          width: 0.72rem;
+          height: 0.72rem;
+          background-color: #78bd3a;
+          border-radius: 0.72rem;
+          top: 0;
+          left: 0.36rem;
+          opacity: 0.09;
+          z-index: 0;
+        }
+      }
+      .content{
+        float: right;
+        width: calc(100% - 1rem);
+        padding-left: .3rem;
+      }
+      .title {
+        font-size: 0.32rem;
+        font-weight: 400;
+        color: #001d2d;
+        line-height: 0.4rem;
+        padding-top: 0.1rem;
+        margin-bottom: 0.1rem;
+      }
+      .text {
+        font-size: 0.24rem;
+        font-weight: 400;
+        color: #606266;
+        line-height: 0.38rem;
+        // height: 1.2rem;
+        min-height: .8rem;
+        position: relative;
+        // margin-bottom: .2rem;
+        img {
+          position: absolute;
+          width: 0.72rem;
+          bottom: 0;
+          left: 0rem;
+        }
+      }
+    }
+    // .imgList {
+
+    // }
+  }
+
+  .index-temp5 {
+    padding-top: 0.4rem ;
+    position: relative;
+    // background-color: #fff;
+    .title-sub {
+      margin-bottom: 0rem;
+    }
+    .hu-it {
+      font-size: 0.42rem;
+      font-weight: 500;
+      color: #001d2d;
+      line-height: 0.62rem;
+    }
+    .block {
+      margin-top: 0.4rem;
+      .my-swipe {
+        margin-top: .3rem;
+    
+        .van-swipe-item {
+    
+          text-align: center;
+          background-color: #fff;
+          height: auto;
+    
+          .swiper-img {
+            height: 3rem;
+            width: auto;
+            margin: auto;
+            display: block;
+          }
+    
+          .title {
+            text-align: center;
+            line-height: .42rem;
+            font-size: .28rem;
+            margin-top: .2rem;
+          }
+        }
+    
+      }
+    }
+  }
+  .index-temp6 {
+    padding-top: 0.4rem ;
+    position: relative;
+    .content {
+      position: relative;
+      // width: 100%;
+      // overflow: auto;
+      // padding-right: 1.2rem;
+      // overflow: hidden;
+      .flex-content {
+        // display: flex;
+        padding-right: 1.2rem;
+        position: relative;
+        // left: 50px;
+      }
+      .scrollbar-demo-item {
+        flex-shrink: 0;
+        width: 4.2rem;
+        height: 3.6rem;
+        padding-right: 0.8rem;
+        padding-left: 0.02rem;
+      }
+      // .step {
+      //   height: 20px;
+      //   background: #000000;
+      //   position: absolute;
+      //   left: 0;
+      //   width: 100%;
+      //   top: 1.1rem;
+      // }
+      .swiper-content{
+        padding: .3rem;
+      }
+      .date-num {
+        position: relative;
+        font-size: 0.58rem;
+        font-weight: bold;
+        // line-height: 0.4rem;
+        letter-spacing: 0.01rem;
+        margin-bottom: .1rem;
+        font-family: Arial;
+        span {
+          // position: absolute;
+          // top: -.4rem;
+          // left: 0;
+          position: relative;
+          left: 2px;
+          display: block;
+          width: 0.24rem;
+          height: 0.24rem;
+          background-color: #6eb92c;
+          margin-bottom: 0.2rem;
+        }
+      }
+      img{
+        height: .24rem;
+      }
+      .ul-li {
+        margin-top: 0.3rem;
+        font-size: 0.28rem;
+        font-weight: 400;
+        // color: #606266;
+        line-height: 0.4rem;
+        text-align: justify;
+      }
+      // ul {
+      //   padding-left: 16px;
+      //   margin-top: 0.8rem;
+      //   li {
+      //     list-style: disc;
+      //     font-size: 0.18rem;
+      //     font-weight: 400;
+      //     color: #606266;
+      //     line-height: 0.3rem;
+      //   }
+      // }
+    }
+  }
+  .index-temp7 {
+    padding: 0.4rem .26rem;
+    position: relative;
+    .title-sub {
+      position: relative;
+      z-index: 1;
+      text-align: center;
+      font-size: 0.42rem;
+      font-weight: 500;
+      color: #001d2d;
+      line-height: 0.62rem;
+      margin-bottom: 0rem;
+      span {
+        display: inline-block;
+        width: 0.24rem;
+        height: 0.24rem;
+        position: relative;
+        top: -0.02rem;
+        &:first-child {
+          background: #e1eafd;
+        }
+        &:last-child {
+          background: #ecf4e3;
+        }
+      }
+    }
+    .content {
+      padding-top: 0.4rem;
+      overflow: hidden;
+    }
+    div {
+      font-size: 0.38rem;
+      font-weight: 400;
+      // color: #001d2d;
+      line-height: 0.44rem;
+      letter-spacing: 0.01rem;
+      margin-bottom: 0.12rem;
+    }
+    img {
+      width: 1.1rem;
+      margin-bottom: 0.12rem;
+    }
+    li {
+      font-size: 0.26rem;
+      font-weight: 400;
+      // color: #606266;
+      line-height: 0.38rem;
+      margin-bottom: 0.16rem;
+      color: #606266;
+    }
+  }
+  .index-temp8 {
+    padding: 0rem ;
+    .block {
+      border-radius: 0.4rem;
+      overflow: hidden;
+      cursor: pointer;
+      padding-bottom: 0.2rem;
+      &:hover {
+        box-shadow: 0px 10px 40px 0px rgba(0, 49, 75, 0.1);
+      }
+    }
+
+    img {
+      width: 100%;
+      margin-bottom: 0.2rem;
+    }
+    .title {
+      font-size: 0.28rem;
+      font-weight: 400;
+      color: #001d2d;
+      padding-left: 0.2rem;
+      margin-bottom: 0.14rem;
+    }
+    .text {
+      font-size: 0.18rem;
+      font-weight: 400;
+      color: #606266;
+      padding-left: 0.2rem;
+    }
+    .content {
+      margin-top: 0.6rem;
+      position: relative;
+      // width: 100%;
+      // overflow: auto;
+      // padding-right: 1.2rem;
+      .flex-content {
+        display: flex;
+        // padding-right: 1.2rem;
+      }
+      .scrollbar-demo-item {
+        flex-shrink: 0;
+        width: 100%;
+        // height: 3.6rem;
+        // padding-right: .8rem;
+        // padding-left: .02rem;
+        padding-bottom: 0.2rem;
+      }
+
+      .date-num {
+        position: relative;
+        font-size: 0.18rem;
+        color: #001d2d;
+        // line-height: .40rem;
+        letter-spacing: 0.01rem;
+        text-align: center;
+        cursor: pointer;
+        img {
+          width: 100%;
+          // height: 2.84rem;
+          height: 300px;
+          object-fit: contain;
+          margin-bottom: 0.2rem;
+        }
+        span{
+          padding-left: .16rem;
+          padding-right: .1rem;
+        }
+        .title{
+          display: block;
+          text-align: left;
+          font-size: .28rem;
+          height: 1.2rem;
+          font-weight: 500;
+          font-weight: 400;
+        }
+        .text{
+          font-size: .18rem;
+          color: #606266;
+          font-weight: 400;
+          margin-top: .1rem;
+          text-overflow: -o-ellipsis-lastline;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 2;
+          line-clamp: 2;
+          -webkit-box-orient: vertical;
+        }
+      }
+    }
+  }
+  .index-temp9 {
+    padding-top: .5rem;
+    padding-bottom: .4rem;
+    .block {
+      position: relative;
+    }
+    .num-img {
+      width: 100%;
+      height: auto;
+      position: relative;
+      z-index: 1;
+      margin-bottom: 0.2rem;
+      cursor: pointer;
+    }
+    .title {
+      position: absolute;
+      bottom: 0.8rem;
+      left: 0.3rem;
+      font-size: 0.28rem;
+      font-weight: 500;
+      color: #fff;
+      z-index: 1;
+    }
+
+    .step {
+      width: 1.2rem;
+    }
+    .van-row {
+      margin-bottom: 0.42rem;
+      &:last-child {
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  .more{
+    text-align: center;
+    font-size: .3rem;
+    padding-top: .3rem;
+    color: #12BEC3;
+  }
+}
+
+::v-deep .van-card{
+  padding: .16rem;
+  background-color: #fff;
+  box-shadow: 0px 10px 40px 0px rgba(0, 49, 75, 0.1);
+  border-radius: .08rem;
+}
+::v-deep .van-card__thumb img{
+  // border-radius: 0;
+}
+::v-deep .van-card__thumb{
+  margin-right: .2rem;
+  width: 1.8rem;
+  height: 1.8rem;
+}
+::v-deep .van-card__content{
+  // align-items: center;
+  // justify-content: center;
+  padding-top: .16rem;
+}
+::v-deep .van-card__title{
+  margin-bottom: .16rem;
+  font-size: .28rem;
+  line-height: .4rem;
+  max-height: 1rem;
+}
+::v-deep .van-card__desc{
+  font-size: .24rem;
+  line-height: 1;
+  max-height: none;
+}
+// ::v-deep .is-horizontal .van-scrollbar__thumb{
+//   // width: 15%!important;
+//   &::after{
+//     position: absolute;
+//     content: '';
+//     // background: url(./images/left.png)  no-repeat;
+//     left: 15%;
+//     width: 30px;
+//     height: 30px;
+//     top: 0;
+//     background-size: 30px 30px;
+//     // margin: 14px 0 0 15px;
+//   }
+//   &::before{
+//     position: absolute;
+//     content: '';
+//     // background: url(./images/right.png)  no-repeat;
+//     right: 15%;
+//     width: 30px;
+//     height: 30px;
+//     top: 0;
+//     background-size: 30px 30px;
+//     // margin: 14px 0 0 15px;
+//   }
+// }
+.my-swipe {
+  margin-top: .3rem;
+
+  .van-swipe-item {
+
+    text-align: center;
+    background-color: #fff;
+    height: auto;
+
+    .swiper-img {
+      height: 3rem;
+      width: auto;
+      margin: auto;
+      display: block;
+    }
+
+    .title {
+      text-align: center;
+      line-height: .42rem;
+      font-size: .28rem;
+      margin-top: .2rem;
+    }
+  }
+
+}
+
+// .el-carousel__item:nth-child(2n) {
+//   background-color: #ccc;
+// }
+
+// .el-carousel__item:nth-child(2n+1) {
+//   background-color: #fff;
+// }
+::v-deep .is-active {
+  box-shadow: 0px 10px 40px 0px rgba(0, 49, 75, 0.1);
+  // background-color: #fff;
+}
+
+::v-deep .is-active .img {
+  // box-shadow: 0px 10px 40px 0px rgba(0, 49, 75, 0.1);
+}
+
+::v-deep .el-carousel--horizontal {
+  // padding: 10px 0;
+  // overflow-x: clip;
+  padding: 40px 0;
+}
+.my-swipe {
+  margin-top: -.5rem;
+
+  .img {}
+
+  .swiperitem {
+    text-align: center;
+    background-color: #fff;
+    // box-shadow: 0px 10px 40px 0px rgba(0, 49, 75, 0.1);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 4px;
+    padding: 0 10px;
+
+  }
+
+  .swiper-img {
+    // height: auto;
+    // width: 80%;
+    margin: auto;
+    display: block;
+    max-height: 2.2rem;
+  }
+
+  .title {
+    text-align: center;
+    line-height: .42rem;
+    font-size: .24rem;
+    margin-top: .2rem;
+  }
+}
+
+.my-swipe-qu {
+  margin-top: .3rem;
+
+  img {
+    width: 100%;
+    height: auto;
+  }
+
+  .swiper-content {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    background-color: rgba(0, 0, 0, .4);
+    padding: .3rem .26rem;
+    text-align: left;
+
+    .title {
+      color: #fff;
+      font-size: .32rem;
+      margin-bottom: .18rem;
+    }
+
+    p {
+      color: #fff;
+      font-size: .28rem;
+    }
+  }
+}
--- a/src/views/about/about.vue
+++ b/src/views/about/about.vue
@ -0,0 +1,384 @@
+<template>
+  <div class="about-container">
+    <div class="it-temp1">
+      <img v-lazy="homeData.bannerList[4].image" />
+    </div>
+    <div class="container-centent">
+      <div class="index-temp2">
+        <div class="content">
+          <div class="title">助力企业创新并深化数字转型</div>
+          <div class="text">
+            护航科技股份有限公司（简称：护航科技），成立于 2005 年 7
+            月，是一家专注于 IT 服务的高科技企业。公司拥有丰富的全国 IT
+            资源，与多家国内 IT
+            厂商建立合作伙伴关系，设立了以北京、上海、武汉、广深、厦门 ,
+            成都为中心，覆盖全国 700 余个主要城市的业务网络。
+            <div style="height: 0.2rem" />
+            公司通过 ISO9001、ISO27001、ISO20000、ISO14001、ISO45001 以及 ITSS
+            成熟度一级等资质认证，致力于为生物医药、金融电信、生产制造、电广传媒、交通能源、互联网、教育、政府
+            / 军队等领域提供专业的 IT 服务。以“专业的 IT
+            服务管理体系”为核心，并利用高效的人工智能技术和自动化运维工具不断的追求
+            IT
+            场景的稳定性、安全性、可靠性。帮助行业及企业用户把信息技术应用转化为业务的驱动力，充分挖掘信息技术的能量，获得竞争的优势。
+            <div style="height: 0.2rem" />
+            2016
+            年，护航科技在新三板上市并进入了创新层，由此，护航科技也进入了一个迅猛发展的时期。
+          </div>
+        </div>
+        <img v-lazy="imgUrl.img1" alt="" />
+      </div>
+      <div class="index-temp3">
+        <img class="bg-img" v-lazy="imgUrl.img2" />
+        <!-- <div class="hu-it">
+        发展历程<br />
+        DEVELOPMENT PATH
+      </div>
+       -->
+      </div>
+      <div class="index-temp4">
+        <img class="bg-img" v-lazy="imgUrl.img3" alt="" />
+        <div class="title-sub">
+          <span></span>
+          护航科技企业文化
+          <span></span>
+        </div>
+        <div class="content">
+          <van-row :gutter="10">
+            <van-col :span="24">
+              <div class="item">
+                <div class="icon">
+                  <img src="./images/icon1.png" />
+                  <span></span>
+                </div>
+                <div class="content">
+                  <div class="title">愿景</div>
+                  <div class="text">
+                    成为客户最信赖、<br />
+                    最具实力的 IT 运营伙伴
+                    <!-- <img v-lazy="imgUrl.img11" /> -->
+                  </div>
+                </div>
+              </div>
+            </van-col>
+            <van-col :span="24">
+              <div class="item">
+                <div class="icon">
+                  <img src="./images/icon3.png" />
+                  <span></span>
+                </div>
+                <div class="content">
+                  <div class="title">使命</div>
+                  <div class="text">
+                    为客户提供全方位、高品质的系统运营服务，<br />
+                    帮助客户提高 IT 服务水平和运营效率
+                    <!-- <img v-lazy="imgUrl.img11" /> -->
+                  </div>
+                </div>
+              </div>
+            </van-col>
+            <van-col :span="24">
+              <div class="item">
+                <div class="icon">
+                  <img src="./images/icon3.png" />
+                  <span></span>
+                </div>
+                <div class="content">
+                  <div class="title">服务宗旨</div>
+                  <div class="text">
+                    专注、安全、可信赖
+                    <!-- <img v-lazy="imgUrl.img11" /> -->
+                  </div>
+                </div>
+              </div>
+            </van-col>
+          </van-row>
+        </div>
+      </div>
+      <div class="index-temp5">
+        <div class="title-sub">
+          <span></span>
+          企业资质
+          <span></span>
+        </div>
+        <div class="block">
+         <!--  <van-swipe
+            class="my-swipe"
+            :autoplay="3000"
+            indicator-color="white"
+            @change="onChange"
+          >
+            <van-swipe-item v-for="(item, index) in qualList" @click="goLink('/index_2')">
+              <img class="swiper-img" :src="item.image" />
+              <div class="title">{{ item.title }}</div>
+            </van-swipe-item>
+
+            <template #indicator>
+              <div class="custom-indicator">{{ current + 1 }}/{{ total }}</div>
+            </template>
+          </van-swipe> -->
+          <el-carousel class="my-swipe" :interval="3000" type="card" height="4rem" indicator-position="none">
+            <el-carousel-item class="swiperitem" v-for="(item, index) in qualList" @click="goLink('/index_2')">
+              <div>
+                <div class="img"><img class="swiper-img" :src="item.image" /></div>
+                <div class="title">{{ item.title }}</div>
+              </div>
+            </el-carousel-item>
+          </el-carousel>
+        </div>
+      </div>
+      <div class="more">
+        <span @click="goLink('/index_2')">查看更多 >></span>
+      </div>
+      <div class="index-temp6">
+        <div class="title-sub">
+          <span></span>
+          护航科技发展历程
+          <span></span>
+        </div>
+        <div class="content" id="scroll-sb">
+          <!-- <div class="step"></div> -->
+
+          <van-swipe class="swiper">
+            <van-swipe-item
+              v-for="item in homeData.course"
+              style="cursor: pointer"
+              :key="item"
+            >
+            <div class="swiper-content">
+              <div class="date-num">
+                {{ item.time }}
+              </div>
+              <img v-lazy="imgUrl.img11" />
+              <div class="ul-li" style="padding-right: 20px">
+                {{ item.content }}
+              </div>
+            </div>
+              
+            </van-swipe-item
+            >
+            <template #indicator>
+              <div class="custom-indicator">{{ current2 + 1 }}/{{ homeData.course.length }}</div>
+            </template>
+          </van-swipe>
+        </div>
+      </div>
+      <div class="index-temp7">
+        <div class="title-sub">
+          <span></span>
+          护航科技服务网络
+          <span></span>
+        </div>
+        <div class="content">
+          <!-- <van-row :gutter="200"> -->
+          <van-col
+            :span="24"
+            v-for="(item, index) in homeData.address"
+            :key="index"
+            style="margin-bottom:.3rem"
+             @click="goLink('/about_4')"
+          >
+            <div>{{ item.ctiy }}</div>
+            <img v-lazy="imgUrl.img11" />
+            <ul>
+              <li>地址：{{ item.text }}</li>
+              <li>电话：{{ item.phone }}</li>
+            </ul>
+          </van-col>
+          
+        </div>
+      </div>
+      <div class="more">
+        <span @click="goLink('/about_4')">查看更多 >></span>
+      </div>
+      <div class="index-temp8">
+        <div class="title-sub">
+          <span></span>
+          企业动态
+          <span></span>
+        </div>
+        
+        <div class="content">
+          <!-- <div class="step"></div> -->
+          <van-card
+       v-for="item in news"
+        :desc="item.subtitle"
+        :title="item.title"
+        :thumb="item.image"
+         @click="toNews(item)"
+      />
+          <!-- <div class="flex-content">
+            <van-row :gutter="66">
+              <van-col :span="8" v-for="(item, index) in news" :key="index">
+                <div class="scrollbar-demo-item" @click="link(item.id)">
+                  <div class="date-num">
+                    <img :src="item.image" alt="" />
+                    <span class="title">{{ item.title }}</span>
+                    <span class="text">{{ item.subtitle }}</span>
+                  </div>
+                </div>
+              </van-col>
+            </van-row>
+          </div> -->
+        </div>
+      </div>
+      <div class="more">
+        <span @click="goLink('/about_2')">查看更多 >></span>
+      </div>
+      <div class="index-temp9">
+        <van-row :gutter="10" class="content-list">
+          <van-col :span="8">
+            <div class="block" @click="goLink('/index_2')">
+              <img class="num-img" v-lazy="imgUrl.img4" />
+              <div class="title">企业荣誉</div>
+
+              <img class="step" v-lazy="imgUrl.img11" alt="" />
+            </div>
+          </van-col>
+          <van-col :span="8">
+            <div class="block" @click="goLink('/about_3')">
+              <img class="num-img" v-lazy="imgUrl.img5" />
+              <div class="title">社会招聘</div>
+
+              <img class="step" v-lazy="imgUrl.img11" alt="" />
+            </div>
+          </van-col>
+          <van-col :span="8">
+            <div class="block" @click="goLink('/about_3')">
+              <img class="num-img" v-lazy="imgUrl.img6" />
+              <div class="title">校园招聘</div>
+
+              <img class="step" v-lazy="imgUrl.img11" alt="" />
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import api from "@/http/api";
+// import bg from "./images/bg.png";
+import img1 from "./images/img1.png";
+import img2 from "./images/img2.png";
+import img3 from "./images/img3.png";
+import img4 from "./images/img4.png";
+import img5 from "./images/img5.png";
+import img6 from "./images/img6.png";
+import img11 from "./images/img11.png";
+
+// Import Swiper Vue.js components
+// import { Swiper, SwiperSlide } from 'swiper/vue';
+
+// Import Swiper styles
+// import 'swiper/css';
+
+//  import { Swiper, SwiperSlide } from 'vue-awesome-swiper'
+// import 'swiper/dist/idangerous.swiper.css'
+export default {
+  components: {
+    // Swiper,
+    // SwiperSlide
+  },
+  data() {
+    return {
+      current: 0,
+current2: 0,
+      history: [
+        
+      ],
+      imgUrl: {
+        // bg: bg,
+        img1: img1,
+        img2: img2,
+        img3: img3,
+        img4: img4,
+        img5: img5,
+        img6: img6,
+        img11: img11,
+      },
+      news: [],
+      currentPage: 1,
+      qualList: [],
+      total: 0,
+      homeData: JSON.parse(JSON.parse(window.localStorage.homeData)), // {bannerList:[]}
+    };
+  },
+  methods: {
+    toNews(row){
+      console.log(row)
+      this.$router.push({
+        path:'/info_detial',
+        query:{
+          info_id: row.ID
+        }
+      })
+    },
+    onChange(val) {
+      this.current = val;
+    },
+    link(id) {
+      console.log(id);
+      this.$router.push({ path: "/info_detial", query: { info_id: id } });
+    },
+    getData() {
+      api
+        .getTable("pubinfo/getInfoList", {
+          page: 1,
+          pageSize: 3,
+        })
+        .then((res) => {
+          console.log(res);
+          this.news = res.data.list;
+          // this.total = res.total;
+        });
+    },
+    goLink(path) {
+      this.$router.push(path);
+    },
+    getQual() {
+      api
+        .getTable("pubcompany/getCompanyList", {
+          page: 1,
+          pageSize: 200,
+          is_use: 1,
+          is_type: "",
+        })
+        .then((res) => {
+          console.log(res);
+          this.qualList = res.data.list;
+          this.total = res.data.total;
+        });
+    },
+  },
+  created() {
+    this.getData();
+    this.getQual();
+    // this.getHomeData()
+  },
+  mounted() {
+    return;
+    setTimeout(() => {
+      let sb2 = document.getElementById("scroll-sb");
+      let sb = this.$refs.myscroll;
+      let list = document.getElementsByClassName("scrollbar-demo-item");
+
+      // let sbw = sb.style.width()
+      console.log(sb2.offsetWidth, list.length * list[0].offsetWidth);
+      let i = -50;
+      setInterval(() => {
+        i++;
+        sb.style.left = -i + "px";
+        if (
+          i ==
+          list.length * list[0].offsetWidth - (sb2.offsetWidth * 2 - 130)
+        ) {
+          i = -50;
+        }
+      }, 15);
+    }, 1000);
+  },
+};
+</script>
+<style lang="less" scoped>
+@import "./about.less";
+</style>
--- a/src/views/about/childs/index_2/childs/index.less
+++ b/src/views/about/childs/index_2/childs/index.less
@ -0,0 +1,41 @@
+.it-container{
+    .it-temp1{
+       
+        img{
+            width: 100%;
+        }
+        
+    }
+   
+    
+    .it-temp2{
+        padding: .4rem .2rem;
+
+        position: relative;
+        z-index: 1;
+        .title{
+            font-size: .32rem;
+            font-weight: bold;
+            text-align: center;
+            margin-bottom: .2rem;
+        }
+        .content{
+            // min-height: 6rem;
+            // width: 1000px;
+            width: 100%;
+            margin: auto;
+            margin-top: .6rem;
+             p {
+                 img{
+                max-width: 100%;
+            }}
+        }
+        .time{
+            text-align: center;
+            font-size: .30rem;
+            color: #606266;
+            margin-bottom: .3rem;
+        }
+    }
+    
+}
--- a/src/views/about/childs/index_2/childs/index.vue
+++ b/src/views/about/childs/index_2/childs/index.vue
@ -0,0 +1,65 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+    </div>
+
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="title">
+          {{ infos.title || "动态详情" }}
+        </div>
+        <!-- <div class="title-sub">
+        <span></span>
+        {{ infos.title || "动态详情" }}
+        <span></span>
+      </div> -->
+        <div class="time">{{ infos.CreatedAt | formatYYYYMMDD }}</div>
+        <div class="html-content">
+          <div v-html="infos.content"></div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "../../../images/bg.png";
+import api from "@/http/api";
+import formatYYYYMMDD from "@/filters/Filters"
+export default {
+  components: {},
+  data() {
+    return {
+      imgUrl: {
+        bg: bg,
+      },
+      infos: {},
+      currentPage: 1,
+      pageSize: 15,
+      total: 0,
+    };
+  },
+  methods: {
+    getData() {
+      // api.dataInfo("pubinfo/findInfo", this.$route.query.info_id).then((res) => {
+      //   this.infos = res.data;
+      //   this.infos.content = api.decode(res.data.content)
+      // });
+      api.news(this.$route.query.info_id).then((res) => {
+        this.infos = res.data.reinfo;
+        // this.infos.content = api.decode(res.data.content)
+      });
+    },
+  },
+  mounted() {
+    // this.getData();
+  },
+  activated(){
+    this.getData();
+  }
+};
+</script>
+
+<style lang="less" scoped>
+@import "./index.less";
+</style>
--- a/src/views/about/childs/index_2/index.less
+++ b/src/views/about/childs/index_2/index.less
@ -0,0 +1,115 @@
+.it-container{
+    .it-temp1{
+        
+        img{
+            width: 100%;
+           
+        }
+        
+    }
+    
+    
+    .it-temp2{
+        padding-top: .4rem;
+        position: relative;
+        z-index: 1;
+        
+        .item{
+            display: flex;
+            padding: .3rem 0;
+            position: relative;
+            border-bottom: 1px solid #DFDFDF;
+            // margin-bottom: .3rem;
+            cursor: pointer;
+            .img{
+                flex: none;
+                width: 2.4rem;
+                height: 1.6rem;
+                img{
+                    width: 100%;
+                    height: 100%;
+                    object-fit:cover
+                }
+            }
+            .decs{
+                flex: auto;
+                padding-left: .2rem;
+                padding-right: 2.4rem;
+                .title{
+                    font-size: .28rem;
+                    font-weight: 400;
+                    color: #001D2D;
+                    line-height: .4rem;
+                    padding: .06rem .36rem;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                    margin-top: .2rem;
+                    margin-bottom: .16rem;
+                }
+                .text{
+                    font-size: .18rem;
+                    font-weight: 400;
+                    color: #606266;
+                    line-height: .32rem;
+                    padding: 0 .36rem;
+                    overflow: hidden;
+                    white-space: nowrap;
+                    text-overflow: ellipsis;
+                }
+            }
+            .time{
+                position: absolute;
+                right: 0;
+                bottom: .3rem;
+                font-size: .18rem;
+                
+                font-weight: 400;
+                color: #606266;
+            }
+            // padding-bottom: .2rem;
+            // margin-bottom: .42rem;
+            // &:hover{
+            //     box-shadow: 0px 10px 40px 0px rgba(0, 49, 75, 0.1);
+            // }
+            
+            
+        }
+        .page{
+            text-align: center;
+            padding: .48rem 0;
+            padding-bottom: .8rem;
+        }
+    }
+    ::v-deep .van-card{
+        padding: .16rem;
+        background-color: #fff;
+        box-shadow: 0px 10px 40px 0px rgba(0, 49, 75, 0.1);
+        border-radius: .08rem;
+      }
+      ::v-deep .van-card__thumb img{
+        // border-radius: 0;
+      }
+      ::v-deep .van-card__thumb{
+        margin-right: .2rem;
+        width: 1.8rem;
+        height: 1.8rem;
+      }
+      ::v-deep .van-card__content{
+        // align-items: center;
+        // justify-content: center;
+        padding-top: .16rem;
+      }
+      ::v-deep .van-card__title{
+        margin-bottom: .16rem;
+        font-size: .28rem;
+        line-height: .4rem;
+        max-height: 1rem;
+      }
+      ::v-deep .van-card__desc{
+        font-size: .24rem;
+        line-height: 1;
+        max-height: none;
+      }
+    
+}
--- a/src/views/about/childs/index_2/index.vue
+++ b/src/views/about/childs/index_2/index.vue
@ -0,0 +1,128 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+    </div>
+    <!-- <div class="breadcrumb">
+            <van-breadcrumb separator-class="van-icon-arrow-right">
+                <van-breadcrumb-item :to="{ path: '/about' }">关于护航</van-breadcrumb-item>
+                <van-breadcrumb-item>企业动态</van-breadcrumb-item>
+            </van-breadcrumb>
+        </div> -->
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="title-sub">
+          <span></span>
+          企业动态
+          <span></span>
+        </div>
+
+        <div class="content">
+          <van-list
+            v-model="loading"
+            :finished="finished"
+            finished-text="没有更多了"
+            @load="onLoad"
+          >
+            <van-card
+              v-for="item in news"
+              :key="item.ID"
+              :desc="item.subtitle"
+              :title="item.title"
+              :thumb="item.image"
+              @click="toNews(item)"
+            />
+          </van-list>
+        </div>
+        <div class="page">
+          <!-- <van-pagination
+            background
+            :current-page="currentPage"
+            @current-change="handleCurrentChange"
+            layout="prev, pager, next"
+            :total="total"
+          >
+          </van-pagination> -->
+          <!-- <van-pagination v-model="currentPage" :total-items="total" :show-page-size="10" @click="handleCurrentChange">
+            <template #prev-text>
+                <van-icon name="arrow-left" />
+            </template>
+            <template #next-text>
+                <van-icon name="arrow" />
+            </template>
+            <template #page="{ text }">{{ text }}</template>
+            </van-pagination> -->
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "../../images/bg.png";
+import api from "@/http/api";
+export default {
+  components: {},
+  data() {
+    return {
+      imgUrl: {
+        bg: bg,
+      },
+      news: [],
+      currentPage: 1,
+      pageSize: 15,
+      total: 0,
+      loading: false,
+      finished: false,
+    };
+  },
+  methods: {
+    onLoad(){
+      if(!this.finished){
+        this.loading=true
+        this.currentPage++
+        this.getData()
+      }
+      
+    },
+    toNews(row) {
+      console.log(row);
+      this.$router.push({
+        path: "/info_detial",
+        query: {
+          info_id: row.ID,
+        },
+      });
+    },
+    getData() {
+      api
+        .getTable("pubinfo/getInfoList", {
+          page: this.currentPage,
+          pageSize: 10,
+        })
+        .then((res) => {
+          this.news.push(...res.data.list) ;
+          this.total = res.data.total;
+          if(this.news.length >= this.total){
+            this.finished = true;
+          }
+          // 加载状态结束
+          this.loading = false;
+        });
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.getData();
+    },
+    link(id) {
+      this.$router.push({ path: "/info_detial", query: { info_id: id } });
+    },
+  },
+  created() {
+    this.getData();
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import "./index.less";
+</style>
--- a/src/views/about/childs/index_3/childs/join_info.vue
+++ b/src/views/about/childs/index_3/childs/join_info.vue
@ -0,0 +1,60 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+    </div>
+    <!-- <div class="breadcrumb">
+      <van-breadcrumb separator-class="van-icon-arrow-right">
+        <van-breadcrumb-item :to="{ path: '/about' }"
+          >关于护航</van-breadcrumb-item
+        >
+        <van-breadcrumb-item :to="{ path: '/about_3' }">加入我们</van-breadcrumb-item>
+        <van-breadcrumb-item>职位详情</van-breadcrumb-item>
+      </van-breadcrumb>
+    </div> -->
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="content-join" style="padding-bottom: 50px">
+          <div class="title">职位名称：{{ info.postionTitle }}</div>
+          <div class="base">工作点：{{ info.address }}</div>
+          <div v-html="info.content"></div>
+
+          <div class="title" style="margin-top: 10px">投递简历</div>
+          <div>
+            {{ homeData.describe }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "../../../images/bg.png";
+import api from "@/http/api";
+export default {
+  components: {},
+  data() {
+    return {
+      imgUrl: {
+        bg: bg,
+      },
+      info: {},
+      homeData: JSON.parse(JSON.parse(window.localStorage.homeData)),
+    };
+  },
+  mounted() {
+    this.getData();
+  },
+  methods: {
+    getData(type) {
+      // api.dataInfo('boss', this.$route.query.join_id).then((res) => {
+      this.info = JSON.parse(window.localStorage.join); //res.data
+      //  })
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import "../index.less";
+</style>
--- a/src/views/about/childs/index_3/index.less
+++ b/src/views/about/childs/index_3/index.less
@ -0,0 +1,117 @@
+.it-container{
+    .it-temp1{
+       
+        img{
+            width: 100%;
+        }
+        
+    }
+    
+    
+    .it-temp2{
+        padding-top: .4rem;
+        position: relative;
+        z-index: 1;
+        .content{
+            // padding: 0 3.8rem;
+            .title{
+                display: inline-block;
+                font-size: .32rem;
+                
+                font-weight: 400;
+                color: #001D2D;
+                line-height: .32rem;
+                letter-spacing: .01rem;
+                text-align: center;
+                cursor: pointer;
+                img{
+                    width: .98rem;
+                }
+            }
+            
+        }
+        .from{
+            margin-top: .4rem;
+            margin-bottom: .4rem;
+            // display: flex;
+            // .input{
+            //     flex: auto;
+            //     padding-right: .16rem;
+            // }
+            // .button{
+            //     flex: none;
+            //     width: 1.98rem;
+            //     height: 40px;
+            //     background: #001D2D;
+            //     border-radius: 4px;
+            //     text-align: center;
+            //     line-height: 40px;
+            //     font-size: 14px;
+                
+            //     font-weight: 400;
+            //     color: #FFFFFF;
+            //     cursor: pointer;
+            // }
+        }
+        .select{
+            margin-bottom: .6rem;
+            
+        }
+        .table-container {
+            padding-bottom: .8rem;
+            .operation {
+                .edit {
+                    color: #409eff;
+                }
+                .delete {
+                    color: #f56c6c;
+                }
+            }
+            .pagination {
+                margin-top: .4rem;
+                
+            }
+        }
+        .content-join{
+            min-height: 6rem;
+            // width: 1000px;
+            // margin: auto;
+            .title{
+                font-size: .32rem;
+                font-weight: bold;
+                line-height: .6rem;
+            }
+            .base{
+                font-size: .28rem;
+                margin-bottom: .4rem;
+            }
+        }
+    }
+    
+}
+
+// .amap-marker-content img{
+//     width: 25px;
+//     height: 34px;
+// }
+.ready{
+    cursor: pointer;
+    color: #409EFF;
+}
+.tab-btn {
+    line-height: 0.28rem;
+    color: #0091ff;
+    display: inline-block;
+    // font-size: 0.18rem;
+    margin-left: 0.1rem;
+    cursor: pointer;
+    position: absolute;
+    font-size: 14px;
+    right: 0;
+    line-height: 24px;
+}
+.assress {
+    position: absolute;
+    font-size: 14px;
+    right: 1.4rem;
+}
--- a/src/views/about/childs/index_3/index.vue
+++ b/src/views/about/childs/index_3/index.vue
@ -0,0 +1,268 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+    </div>
+
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="content">
+          <van-row :gutter="88">
+            <van-col :span="12" style="text-align: right">
+              <div class="title" @click="change(0)">
+                社会招聘<br />
+                <img
+                  v-show="index == 0"
+                  src="../../../../assets/image/icon_r.png"
+                />
+              </div>
+            </van-col>
+            <van-col :span="12" style="text-align: left">
+              <div class="title" @click="change(1)">
+                校园招聘<br />
+                <img
+                  v-show="index == 1"
+                  src="../../../../assets/image/icon_r.png"
+                />
+              </div>
+            </van-col>
+          </van-row>
+        </div>
+        <div class="from">
+          <!-- <div class="input">
+            <van-input
+              v-model="base_title"
+              style="height: 0.6rem"
+              placeholder="输入职位关键词"
+            />
+          </div>
+          <div class="button" @click="sousuo">搜索职位</div> -->
+          <van-search
+            v-model="base_title"
+            show-action
+            placeholder="请输入搜索关键词"
+          >
+            <template #action>
+              <div @click="getData">搜索</div>
+            </template>
+          </van-search>
+        </div>
+        <!-- <div class="select">
+          <van-select
+            v-model="value"
+            placeholder="工作地点"
+            style="margin-right: 0.2rem"
+            @change="sousuo"
+          >
+            <van-option
+              v-for="item in options"
+              :key="item"
+              :label="item"
+              :value="item"
+              class="myOption"
+            >
+            </van-option>
+          </van-select>
+          <van-select v-model="value2" placeholder="职位类别" @change="sousuo">
+            <van-option
+              v-for="item in options2"
+              :key="item"
+              :label="item"
+              :value="item"
+              class="myOption"
+            >
+            </van-option>
+          </van-select>
+          <van-button style="margin-left: 15px" @click="resft">重置</van-button>
+        </div> -->
+        <div class="table-container">
+          <van-list
+            :finished="finished"
+            finished-text="没有更多了"
+            @load="onLoad"
+          >
+            <van-cell v-for="item in tableData" :key="item.it">
+              {{item.postionTitle}}
+              <span class="assress">{{item.address}}</span>
+              <!-- {{ item.UpdatedAt | formatYYYYMMDD }} -->
+              <span class="tab-btn" @click="readyInfo(item)">
+                    查看
+              </span>
+            </van-cell>
+          </van-list>
+
+
+          <!-- <van-table :data="tableData" style="width: 100%">
+            <van-table-column prop="postionTitle" label="职位名称" />
+            <van-table-column prop="postion" label="职位类别" align="center" />
+            <van-table-column prop="address" label="工作地点" align="center" />
+            <van-table-column align="right">
+              <template slot-scope="scope">
+                <span class="ready" @click="readyInfo(scope.row)"> 查看</span>
+              </template>
+            </van-table-column>
+          </van-table> -->
+          
+          <div class="pagination">
+            <van-pagination v-model="currentPage" :total-items="total" :show-page-size="10" @click="handleCurrentChange">
+            <template #prev-text>
+                <van-icon name="arrow-left" />
+            </template>
+            <template #next-text>
+                <van-icon name="arrow" />
+            </template>
+            <template #page="{ text }">{{ text }}</template>
+            </van-pagination>
+          </div>
+        </div>
+        <!-- <div class="table-container" v-show="index == 1">
+          <van-table :data="tableData2" style="width: 100%">
+            <van-table-column prop="postionTitle" label="职位名称" />
+            <van-table-column prop="postion" label="职位类别" align="center" />
+            <van-table-column prop="address" label="工作地点" align="center" />
+            <van-table-column align="right">
+              <template slot-scope="scope">
+                <span class="ready" @click="readyInfo(scope.row)"> 查看</span>
+              </template>
+            </van-table-column>
+          </van-table>
+          <div class="pagination">
+            <van-pagination
+              background
+              :current-page="currentPage2"
+              @current-change="handleCurrentChange2"
+              layout="prev, pager, next"
+              :total="total2"
+            >
+            </van-pagination>
+          </div>
+        </div> -->
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "../../images/bg.png";
+import api from "@/http/api";
+export default {
+  components: {},
+  data() {
+    return {
+      imgUrl: {
+        bg: bg,
+      },
+      infos: [],
+      currentPage: 1,
+      pageSize: 15,
+      total: 0,
+      currentPage2: 1,
+      pageSize2: 15,
+      total2: 0,
+      index: 0,
+      options: [
+        
+      ],
+      value: "",
+      options2: [
+        
+      ],
+      value2: "",
+      tableData: [],
+      tableData2: [],
+      input: "",
+      base_title: "",
+    };
+  },
+  watch:{
+    index(a, b){
+      this.getData(1);
+    }
+  },
+  mounted() {
+    this.getData(0);
+    // this.getBtags();
+  },
+  methods: {
+    resft() {
+      this.value = "";
+      this.value2 = "";
+      this.base_title = "";
+      this.getData(0);
+      this.getData2(1);
+    },
+    getBtags() {
+      api.getBtags().then((res) => {
+       
+      });
+    },
+    sousuo() {
+      if (this.index == 0) {
+        this.getData(0);
+      } else {
+        this.getData2(1);
+      }
+    },
+    getData(type) {
+      api
+        .getTable("pubjoin/getJoinList", {
+          page: this.currentPage,
+          pageSize: this.pageSize,
+          joinType: type,
+          // base: this.value,
+          // base_type: this.value2,
+          postion_title: this.base_title,
+        })
+        .then((res) => {
+          console.log(res);
+          this.tableData = res.data.list;
+          this.total = res.data.total;
+        });
+    },
+    getData2(type) {
+      api
+        .getTable("pubjoin/getJoinList", {
+          page: this.currentPage,
+          pageSize: this.pageSize,
+          // status: type,
+          // base: this.value,
+          postion_title: this.value2,
+        })
+        .then((res) => {
+          console.log(res);
+
+          this.tableData2 = res.data.list;
+          this.total2 = res.data.total;
+        });
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.getData();
+    },
+    handleCurrentChange2(val) {
+      this.currentPage2 = val;
+      this.getData2();
+    },
+    link(id) {
+      console.log(id);
+      this.$router.push({ path: "/info_detial", query: { info_id: id } });
+    },
+    change(index) {
+      this.index = index;
+      this.getData(index)
+    },
+    readyInfo(row) {
+      window.localStorage.join = JSON.stringify(row);
+      this.$router.push({
+        path: "./join_info",
+        query: {
+          join_id: row.id,
+        },
+      });
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import "./index.less";
+</style>
--- a/src/views/about/childs/index_4/index.less
+++ b/src/views/about/childs/index_4/index.less
@ -0,0 +1,66 @@
+.it-container{
+    .it-temp1{
+       
+        img{
+            width: 100%;
+           
+        }
+        
+    }
+   
+    
+    .it-temp2{
+        position: relative;
+        z-index: 1;
+        .content{
+            padding: 0 1.8rem;
+            text-align: center;
+            .title{
+                display: inline-block;
+                font-size: .28rem;
+                
+                font-weight: 400;
+                color: #001D2D;
+                height: .32rem;
+                line-height: .32rem;
+                letter-spacing: .01rem;
+                text-align: center;
+                cursor: pointer;
+                margin: 0 .3rem;
+                margin-bottom: .4rem;
+                position: relative;
+                img{
+                    position: absolute;
+                    bottom: -.2rem;
+                    width: .68rem;
+                    left: 50%;
+                    margin-left: -.34rem;
+                }
+            }
+            
+        }
+        .contact-us{
+            margin-top: .3rem;
+            .title{
+                font-size: .28rem;
+                
+                font-weight: 400;
+                color: #606266;
+                line-height: .52rem;
+                margin-top: .3rem;
+                
+            }
+            .map{
+                padding: .3rem 0 1rem 0; 
+            }
+        }
+    }
+    ::v-deep .van-tabs__line {
+        background-color: #008cd5;
+      }
+}
+
+// .amap-marker-content img{
+//     width: 25px;
+//     height: 34px;
+// }
--- a/src/views/about/childs/index_4/index.vue
+++ b/src/views/about/childs/index_4/index.vue
@ -0,0 +1,84 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+    </div>
+    <div class="container-centent">
+      <div class="it-temp2">
+        
+        <div class="contact-us">
+          <van-tabs>
+            <van-tab
+              v-for="(item, index) in address"
+              :title="item.ctiy"
+              @click="change(index)"
+            >
+              <div class="title">
+                地址： {{ item.text }}
+
+                <br />
+                电话： {{ item.phone }}
+              </div>
+
+              <div class="map" style="height: 300px;">
+                
+                  <el-amap
+                    :vid="'amap' + index"
+                    class="amap"
+                    :zoom="12"
+                    :center="item.coordinate"
+                    :plugin="plugin"
+                  >
+                    <el-amap-marker
+                      :vid="'component-marker' + index"
+                      :position="item.coordinate"
+                    />
+                  </el-amap>
+                
+              </div>
+            </van-tab>
+          </van-tabs>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "../../images/bg.png";
+import api from "@/http/api";
+export default {
+  components: {},
+  data() {
+    return {
+      imgUrl: {
+        bg: bg,
+      },
+      addIndex: 0,
+      address: JSON.parse(JSON.parse(window.localStorage.homeData)).address,
+      plugin: [
+        // 这里放扩展的插件
+        {
+          pName: "Scale", // 比例尺
+          events: {
+            init(instance) {
+              console.log(instance);
+            },
+          },
+        },
+      ],
+    };
+  },
+  methods: {
+    change(index) {
+      this.addIndex = index;
+    },
+  },
+  mounted() {
+    // getData()
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import "./index.less";
+</style>
--- a/src/views/about/images/bg.png
+++ b/src/views/about/images/bg.png
--- a/src/views/about/images/icon1.png
+++ b/src/views/about/images/icon1.png
--- a/src/views/about/images/icon2.png
+++ b/src/views/about/images/icon2.png
--- a/src/views/about/images/icon3.png
+++ b/src/views/about/images/icon3.png
--- a/src/views/about/images/img1.png
+++ b/src/views/about/images/img1.png
--- a/src/views/about/images/img11.png
+++ b/src/views/about/images/img11.png
--- a/src/views/about/images/img2.png
+++ b/src/views/about/images/img2.png
--- a/src/views/about/images/img3.png
+++ b/src/views/about/images/img3.png
--- a/src/views/about/images/img4.png
+++ b/src/views/about/images/img4.png
--- a/src/views/about/images/img5.png
+++ b/src/views/about/images/img5.png
--- a/src/views/about/images/img6.png
+++ b/src/views/about/images/img6.png
--- a/src/views/apply/apply.less
+++ b/src/views/apply/apply.less
@ -0,0 +1,152 @@
+.it-container{
+   
+    .it-temp1{
+        // height: 7.88rem;
+        // display: flex;
+        // align-items: center;
+        // justify-content: center;
+        // text-align: center;
+        position: relative;
+        // z-index: 1;
+        img{
+            // position: absolute;
+            width: 100%;
+            height: 100%;
+            // top:0;
+            // left: 0;
+            // z-index: 0;
+            position: relative;
+            z-index: 0;
+        }
+        .title{
+            font-size: .6rem;
+            font-weight: 500;
+            color: #EFEFEF;
+            line-height: .89rem;
+            position: absolute;
+            z-index: 1;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+        }
+        // .sub-title{
+        //     font-size: .18rem;
+        //     font-weight: 500;
+        //     color: #EFEFEF;
+        //     line-height: .62rem;
+        // }
+    }
+    .it-temp2{
+        padding-top: .4rem;
+        position: relative;
+        z-index: 1;
+        .text-sub{
+            font-size: .18rem;
+            
+            font-weight: 400;
+            color: #606266;
+            line-height: .24rem;
+            text-align: center;
+            margin-bottom: 1.5rem;
+        }
+        .bg-img{
+            position: absolute;
+            width: 8.48rem;
+            height: auto;
+            top: 0;
+            right: 0;
+        }
+        .bg-img2{
+            position: absolute;
+            width: 7.14rem;
+            left: 0;
+            top: 11rem;
+        }
+        
+        
+        .content-list{
+            .title{
+                font-weight: bold;
+                font-size: .28rem;
+                padding: .3rem .3rem 0;
+            }
+            .sub-title{
+                font-size: .26rem;
+                padding: .3rem;
+                line-height: .4rem;
+                text-align: justify;
+            }
+        }
+        
+        
+        .content-item2{
+            // padding-left: 1.8rem;
+            .box{
+                .logo{
+                    right: .7rem;
+                }
+            }
+            .setp{
+                position: absolute;
+                left: .2rem;
+                right: auto;
+                span{
+                    display: block;
+                    width: .24rem;
+                    height: .24rem;
+                    margin-bottom: .12rem;
+                    &:first-child{
+                        background-color: #6EB92C;
+                    }
+                    &:last-child{
+                        background-color: #E1EAFD;
+                    }
+                }
+            }
+            .num{
+                left: -.6rem;
+            }
+        }
+        .apply-list{
+            display: flex;
+            border: 1px solid #DFDFDF;
+            position: relative;
+            margin-bottom: .8rem;
+            .icon{
+                position: absolute;
+                right: 0;
+                top: 0;
+                width: 1.66rem;
+            }
+            .logo{
+                flex:none;
+                width: 3.8rem;
+                height: 1.5rem;
+                img{
+                    width: 100%;
+                    height: 100%;
+                    display: block;
+                    object-fit: cover;
+                }
+            }
+            .apply-resc{
+                flex: auto;
+                padding: .26rem .3rem 0 .3rem;
+                .title{
+                    font-size: .24rem;
+                    
+                    font-weight: bold;
+                    color: #001D2D;
+                    margin-bottom: .06rem;
+                }
+                .text{
+                    font-size: .18rem;
+                    
+                    font-weight: 400;
+                    color: #606266;
+                    line-height: .24rem;
+                }
+            }
+        }
+    }
+}
--- a/src/views/apply/apply.vue
+++ b/src/views/apply/apply.vue
@ -0,0 +1,158 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="homeData.bannerList[3].image" />
+      <!-- <div class="title">应用案例</div> -->
+      <!-- <div class="sub-title">以“专业的 IT 服务管理体系”为核心，并利用高效的人工智能技术和自动化运维工具不断的追求 IT 场景的稳定性、安全性、可靠性。帮助行业及企业用户把信息技术应用转化为业务的驱动力，充分挖掘信息技术的能量，获得竞争的优势。</div> -->
+    </div>
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="title-sub">
+          <span></span>
+          优质客户
+          <span></span>
+        </div>
+
+        <van-row
+          class="content-list"
+          v-for="(item, index) in homeData.customer"
+          @click="toLink2(index)"
+        >
+          <van-col :span="24">
+            <img v-lazy="item.image" style="width: 100%" />
+          </van-col>
+          <van-col :span="24">
+            <div class="content-item">
+              <div class="box">
+                <!-- <span class="num">01</span> -->
+                <div class="title">
+                  {{ item.title }}
+                </div>
+                <div class="sub-title">
+                  {{ item.content }}
+                </div>
+              </div>
+            </div>
+          </van-col>
+        </van-row>
+        <van-row
+          class="content-list"
+          v-for="item in tableData"
+        >
+          <van-col :span="24">
+            <img v-lazy="item.image" style="width: 100%" />
+          </van-col>
+          <van-col :span="24">
+            <div class="content-item">
+              <div class="box">
+                <!-- <span class="num">01</span> -->
+                <div class="title">
+                  {{ item.title }}
+                </div>
+                <div class="sub-title">
+                  {{ item.content }}
+                </div>
+              </div>
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+    </div>
+    <Form />
+  </div>
+</template>
+<script>
+import Form from "@/components/Form.vue";
+// import bg from "./images/bg.png";
+// import img1 from "./images/img1.png";
+// import img2 from "./images/img2.png";
+// import img3 from "./images/img3.png";
+// import img4 from "./images/img4.png";
+// import img5 from "./images/img5.png";
+// import img6 from "./images/img6.png";
+// import img7 from "./images/img7.png";
+// import img8 from "./images/img8.png";
+// import img9 from "./images/img9.png";
+// import icon1 from "./images/icon1.png";
+// import icon2 from "./images/icon2.png";
+// import icon3 from "./images/icon3.png";
+// import icon4 from "./images/icon4.png";
+// import icon5 from "./images/icon5.png";
+import api from "@/http/api";
+export default {
+  components: { Form },
+  data() {
+    return {
+      imgUrl: {
+        // bg: bg,
+        // img1: img1,
+        // img2: img2,
+        // img3: img3,
+        // img4: img4,
+        // img5: img5,
+        // img6: img6,
+        // img7: img7,
+        // img8: img8,
+        // img9: img9,
+        // icon1: icon1,
+        // icon2: icon2,
+        // icon3: icon3,
+        // icon4: icon4,
+        // icon5: icon5,
+      },
+      tableData: [],
+      homeData: JSON.parse(JSON.parse(window.localStorage.homeData)),
+      // homeData:{bannerList:[]}
+    };
+  },
+  methods: {
+    toLink2(index){
+      switch (index) {
+        case 0:
+          this.$router.push('/app1')
+          break;
+        case 1:
+          this.$router.push('/app2')
+          break;
+        case 2:
+          this.$router.push('/app3')
+          break;
+        case 3:
+          this.$router.push('/app4')
+          break;
+        default:
+          break;
+      }
+    },
+    // goLink(path) {
+    //   this.$router.push(path);
+    // },
+    getData() {
+      api
+        .getTable("pubcases/getCasesList", {
+          page: 1,
+          pageSize: 20,
+        })
+        .then((res) => {
+          console.log(res);
+          this.tableData = res.data.list;
+        });
+    },
+    //   getHomeData() {
+    //   api.getHome().then((res) => {
+    //     if (res.data.customer) {
+    //       this.homeData = res.data;
+
+    //     }
+    //   });
+    // },
+  },
+  mounted() {
+    this.getData();
+    // this.getHomeData()
+  },
+};
+</script>
+<style lang="less" scoped>
+@import "./apply.less";
+</style>
--- a/src/views/apply/childs/index_1/images/bg.png
+++ b/src/views/apply/childs/index_1/images/bg.png
--- a/src/views/apply/childs/index_1/images/img1.png
+++ b/src/views/apply/childs/index_1/images/img1.png
--- a/src/views/apply/childs/index_1/images/img2.png
+++ b/src/views/apply/childs/index_1/images/img2.png
--- a/src/views/apply/childs/index_1/images/img3.png
+++ b/src/views/apply/childs/index_1/images/img3.png
--- a/src/views/apply/childs/index_1/images/img4.png
+++ b/src/views/apply/childs/index_1/images/img4.png
--- a/src/views/apply/childs/index_1/index.less
+++ b/src/views/apply/childs/index_1/index.less
@ -0,0 +1,378 @@
+.it-container {
+    .it-temp1 {
+        img{
+            
+            width: 100%;
+            
+            z-index: 0;
+        }
+        .title{
+            position: absolute;
+            font-size: .36rem;
+            top: 50%;
+            left: 50%;
+            transform: translateY(-50%) translateX(-50%);
+            font-weight: 500;
+            color: #FFFFFF;
+            background-color: rgba(0, 39, 59, 0.2);
+            height: .88rem;
+            line-height: .88rem;
+            border-radius: .26rem;
+            padding: 0 .24rem;
+            z-index: 1;
+            width: 100%;
+            text-align: center;
+        }
+    }
+    // .breadcrumb {
+    //     padding: 0.6rem 1.2rem 0.4rem 1.2rem;
+    // }
+
+    .it-temp2 {
+        // padding-top: .3rem;
+        position: relative;
+        z-index: 1;
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: .4rem .2rem;
+        }
+        // img {
+        //     display: block;
+        //     width: 9.65rem;
+        //     margin: auto;
+        // }
+    }
+    .it-temp3 {
+        position: relative;
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: 0rem .2rem;
+        }
+        
+        .pro-flex {
+            margin-top: .3rem;
+            .item {
+                margin-bottom: 0.4rem;
+                .content {
+                    // line-height: 0.32rem;
+                    margin-top:0rem;
+                    // text-align: center;
+                    position: relative;
+                    // padding-top: .5rem;
+                    div {
+                        // position: absolute;
+                        width: 100%;
+                        left: 0;
+                        top: 0;
+                        // text-align: center;
+                        font-size: 1.4rem;
+                        
+                        font-weight: bold;
+                        color: #eef2fb;
+                        z-index: 0;
+                        span {
+                            position: relative;
+                            top: -0.2rem;
+                            width: 1rem;
+                            height: 1rem;
+                            border-radius: 0.5rem;
+                            display: inline-flex;
+                            // line-height: 1rem;
+                            text-align: center;
+                            justify-content: center;
+                            align-items: center;
+                            img {
+                                width: 0.6rem;
+                                height: 0.6rem;
+                                display: block;
+                            }
+                        }
+                    }
+                    & > span {
+                        position: relative;
+                        z-index: 1;
+                        font-size: 0.18rem;
+                        
+                        font-weight: 500;
+                        color: #001d2d;
+                        text-align: left;
+                        // padding-left: 1.3rem;
+                        // padding-right: .6rem;
+                        display: block;
+                        top: -0.3rem;
+                        line-height: 0.32rem;
+                    }
+                    .icon {
+                        margin-left: .4rem;
+                        color: #e1eafd;
+                        span {
+                            background-color: #e1eafd;
+                        }
+                    }
+                    .icon2 {
+                        color: #ecf4e3;
+                        span {
+                            background-color: #ecf4e3;
+                        }
+                    }
+                    .icon3 {
+                        color: #e1eafd;
+                        span {
+                            background-color: #e1eafd;
+                        }
+                    }
+                    .title {
+                        margin-top: -.2rem;
+                        font-size: 0.30rem;
+                        
+                        font-weight: 500;
+                        color: #001d2d;
+                        margin-bottom: .2rem;
+                        margin-left: .3rem;
+                    }
+                    .text {
+                        font-size: .26rem;
+                        
+                        font-weight: 400;
+                        color: #606266;
+                        line-height: .32rem;
+                        padding: 0 .3rem;
+                    }
+                }
+            }
+            .pro-top {
+                ul {
+                    display: flex;
+                    position: relative;
+                    left: -0.66rem;
+                    padding-left: 0.2rem;
+                    li {
+                        flex: 1;
+                        color: #447ec0;
+                        font-size: 0.2rem;
+                        text-align: center;
+                    }
+                }
+            }
+            .pro-center {
+                img {
+                    width: 100%;
+                }
+            }
+            .pro-bottom {
+                ul {
+                    display: flex;
+                    position: relative;
+                    left: 0.5rem;
+                    padding-left: 0.2rem;
+                    li {
+                        flex: 1;
+                        color: #447ec0;
+                        font-size: 0.2rem;
+                        text-align: center;
+                    }
+                }
+            }
+        }
+        .img{
+            img{
+                display: block;
+                width: 100%;
+                margin: auto;
+                margin-top: .2rem;
+            }
+        }
+    }
+
+    
+    .it-temp3 {
+        position: relative;
+        z-index: 1;
+        
+        .text-sub {
+            font-size: 0.18rem;
+            
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.24rem;
+            text-align: center;
+            margin-bottom: 0.8rem;
+        }
+        .bg-img {
+            position: absolute;
+            width: 8.48rem;
+            height: auto;
+            top: 0;
+            right: 0;
+        }
+        .bg-img2 {
+            position: absolute;
+            width: 7.14rem;
+            left: 0;
+            top: 11rem;
+        }
+        
+
+        .content-list {
+            margin-bottom: 1rem;
+            img {
+                width: 100%;
+                // height: 2.4rem;
+            }
+        }
+        .content-item {
+            position: relative;
+            padding-left: 0.66rem;
+            display: flex;
+            align-items: center;
+            height: 100%;
+            .box {
+                position: relative;
+            }
+            .setp {
+                position: absolute;
+                right: 0.2rem;
+                width: 0.24rem;
+                height: 100%;
+                span {
+                    display: block;
+                    width: 0.24rem;
+                    height: 0.24rem;
+                    margin-bottom: 0.12rem;
+                    &:first-child {
+                        background-color: #008cd5;
+                    }
+                    &:last-child {
+                        background-color: #ecf4e3;
+                    }
+                }
+            }
+            .num {
+                position: absolute;
+                top: -0.66rem;
+                left: -0.64rem;
+                font-size: 0.72rem;
+                
+                font-weight: 500;
+                color: #001d2d;
+                opacity: 0.06;
+            }
+            .title {
+                font-size: 0.36rem;
+                
+                font-weight: 400;
+                color: #001d2d;
+                line-height: 0.24rem;
+                letter-spacing: 0.01rem;
+                margin-bottom: 0.2rem;
+            }
+            .sub-title {
+                font-size: 0.2rem;
+                
+                font-weight: 400;
+                color: #606266;
+                line-height: 0.32rem;
+                width: 80%;
+            }
+        }
+        .content-item2 {
+            padding-left: 1.8rem;
+            .setp {
+                position: absolute;
+                left: 0.2rem;
+                right: auto;
+                span {
+                    display: block;
+                    width: 0.24rem;
+                    height: 0.24rem;
+                    margin-bottom: 0.12rem;
+                    &:first-child {
+                        background-color: #6eb92c;
+                    }
+                    &:last-child {
+                        background-color: #e1eafd;
+                    }
+                }
+            }
+            .num {
+                left: -0.6rem;
+            }
+        }
+    }
+    .it-temp5{
+        // padding-bottom: 0;
+        position: relative;
+        margin-top: .4rem;
+        
+        .item{
+            margin-bottom: .5rem;
+            .title{
+                line-height: .32rem;
+                // text-align: center;
+                position: relative;
+                padding-top: .8rem;
+                div{
+                    position: absolute;
+                    width: 100%;
+                    left: .38rem;
+                    top: 0;
+                    // text-align: center;
+                    font-size: 1.40rem;
+                    
+                    font-weight: bold;
+                    color: #EEF2FB;
+                    z-index: 0;
+                    span{
+                        width: 1rem;
+                        height: 1rem;
+                        border-radius: .5rem;
+                        display: inline-block;
+                    }
+                }
+                & > span{
+                    position: relative;
+                    z-index: 1;
+                    font-size: .24rem;
+                    
+                    font-weight: 500;
+                    color: #606266;
+                    
+                    left: .56rem;
+                    display: inline-block;
+                }
+                .title1{
+                    color:#E1EAFD;
+                    span{
+                        background-color: #E1EAFD;
+                    }
+                }
+                .title2{
+                    color:#ECF4E3;
+                    span{
+                        background-color: #ECF4E3;
+                    }
+                }
+                
+            }
+        }
+        .text{
+            font-size: .18rem;
+            
+            font-weight: 400;
+            color: #606266;
+            line-height: .32rem;
+            margin-top: .6rem;
+            padding: .4rem;
+        }
+        
+    }
+    // ------------------
+}
--- a/src/views/apply/childs/index_1/index.vue
+++ b/src/views/apply/childs/index_1/index.vue
@ -0,0 +1,231 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+      <div class="title">某知名运动品牌</div>
+    </div>
+    <!-- <div class="breadcrumb">
+      <van-breadcrumb separator-class="van-icon-arrow-right">
+        <van-breadcrumb-item :to="{ path: '/apply' }"
+          >应用案例</van-breadcrumb-item
+        >
+        <van-breadcrumb-item>某知名运动品牌</van-breadcrumb-item>
+      </van-breadcrumb>
+    </div> -->
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="temp2-text">
+          随着该公司在中国的经营不断扩大，品牌店铺在中国境内最多总数达到8255间，在中国，几乎每个县级以上的城市都有该品牌的销售网点。由于业务的迅速发展IT支持和管理模式已经无法满足当前用户需求，依靠该企业自身的IT团队已不足以支持全国。IT治理成为该公司战略治理中关键的一个方面。
+        </div>
+        <!-- <img v-lazy="imgUrl.img1" alt=""> -->
+      </div>
+      <div class="it-temp3">
+        <div class="title-sub">
+          <span></span>
+          服务方案
+          <span></span>
+        </div>
+        <div class="temp2-text">
+            根据该企业的IT现状及业务模式，护航科技将在IT基础架构的运营维护中建立起标准化终端的IT服务管理、项目实施、流程制定、服务管理外包实施。
+          </div>
+        <div class="pro-flex">
+          <van-row :gutter="0">
+            <van-col :span="24">
+              <div class="item">
+                <div class="content">
+                  <div class="icon">
+                    <span> <img v-lazy="imgUrl.img1" alt="" /> </span>1
+                  </div>
+                  <div class="title">新店开店支持服务</div>
+                  <div class="text">
+                    针对全国门店网络的不断扩大， 
+                    护航在集团总部建立了呼叫中心，
+                    实现了需求和故障的统一受理和 
+                    统一支持
+                  </div>
+                </div>
+              </div>
+            </van-col>
+            <van-col :span="24">
+              <div class="item">
+                <div class="content">
+                  <div class="icon icon2">
+                    <span> <img v-lazy="imgUrl.img2" alt="" /> </span>2
+                  </div>
+                  <div class="title">EPOS 系统全国推广服务</div>
+                  <div class="text">
+                    该企业门店系统共升级了三次， 
+                    从起初的POS系统到EPOS1、
+                    EPOS2和EPOS3代系统。 
+                    护航负责了全国门店从POS到
+                    EPOS3代系统的升级切换工作
+                  </div>
+                </div>
+              </div>
+            </van-col>
+            <van-col :span="24">
+              <div class="item">
+                <div class="content">
+                  <div class="icon">
+                    <span> <img v-lazy="imgUrl.img3" alt="" /> </span>3
+                  </div>
+                  <div class="title">EPOS全国门店运营支持服务</div>
+                  <div class="text">
+                    为了确保全国门店IT系统的稳定运行，
+                    避免由于销售系统故障影响店面销售，
+                    并在销售高峰期能够保障全国门店得
+                    到高质量的支持，护航利用MSP平台
+                    增加了服务模式的弹性，有效确保了 
+                    销售高峰期时段服务支持效率
+                  </div>
+                </div>
+              </div>
+            </van-col>
+          </van-row>
+        </div>
+        <div class="img">
+          <img v-lazy="imgUrl.img4" alt="" />
+        </div>
+      </div>
+      <div class="it-temp5">
+        <div class="title-sub">
+          <span></span>
+          护航科技服务价值
+          <span></span>
+        </div>
+
+        <van-row :gutter="0">
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title1"><span></span>1</div>
+                <span
+                  >保证了IT基础设施、桌面及<br />后台应用系统的稳定运行</span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title2"><span></span>2</div>
+                <span
+                  >建立并完善了服务流程，极<br />大的改善了IT服务的高安全<br />性和高可用性</span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title2"><span></span>3</div>
+                <span
+                  >建立了规范的IT监控管理平<br />台与服务管理平台，根据业<br />务部门提出的服务级别、质<br />量、灵活性和成本目标来优<br />化IT资源</span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title1"><span></span>4</div>
+                <span
+                  >为IT投资决策提供精确的成<br />本信息, 有利于提高IT资源的<br />利用效率,
+                  并提高投入产出、<br />成本可预见</span
+                >
+              </div>
+            </div>
+          </van-col>
+        </van-row>
+
+        <van-row :gutter="0">
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title1"><span></span>5</div>
+                <span style="min-height: 1.6rem;"
+                  >保证了新门店IT基础设施<br />（桌面和EPOS）能够在<br />规定时间内完成部署、上<br />线和培训，从而保障了门<br />店的如期开业</span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title2"><span></span>6</div>
+                <span style="min-height: 1.6rem;"
+                  >将现有的各地业务部门的<br />IT支持人员进行整合，优<br />化人员编制，降低IT运营<br />成本
+                  20%</span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title2"><span></span>7</div>
+                <span
+                   style="min-height: 1.6rem;">使繁杂的IT管理变得标准<br />而有序，并从以往的被动<br />式服务转向主动式服务，<br />有效提升IT服务运作效率</span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title1"><span></span>8</div>
+                <span
+                   style="min-height: 1.6rem;">帮助企业IT管理者掌握IT<br />服务管理，为企业提供卓<br />越、完善、超值的IT全方<br />位规模服务</span
+                >
+              </div>
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "./images/bg.png";
+import img1 from "./images/img1.png";
+import img2 from "./images/img2.png";
+import img3 from "./images/img3.png";
+import img4 from "./images/img4.png";
+
+export default {
+  data() {
+    return {
+      cateList: [
+        "虚拟化",
+        "双机热备",
+        "邮件系统",
+        "监控系统",
+        "数据库建设",
+        "ERP系统",
+      ],
+      cateList2: [
+        "方案咨询",
+        "设计和建档维护",
+        "现场应急救援",
+        "按需例行巡检",
+        "主机系统安装",
+        "备份与升级",
+        "性能及操作系统优化",
+        "数据库配置",
+        "系统日常运维管理规范",
+      ],
+      imgUrl: {
+        bg: bg,
+        img1: img1,
+        img2: img2,
+        img3: img3,
+        img4: img4,
+      },
+    };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import "./index.less";
+</style>
--- a/src/views/apply/childs/index_2/images/bg.png
+++ b/src/views/apply/childs/index_2/images/bg.png
--- a/src/views/apply/childs/index_2/images/img1.png
+++ b/src/views/apply/childs/index_2/images/img1.png
--- a/src/views/apply/childs/index_2/images/img2.png
+++ b/src/views/apply/childs/index_2/images/img2.png
--- a/src/views/apply/childs/index_2/index.less
+++ b/src/views/apply/childs/index_2/index.less
@ -0,0 +1,149 @@
+.it-container {
+    .it-temp1 {
+        img{
+            
+            width: 100%;
+            
+            z-index: 0;
+        }
+        .title{
+            position: absolute;
+            width: 100%;
+            height: 100%;
+            top: 0;
+            left: 0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            div{
+                font-size: .36rem;
+            font-weight: 500;
+            color: #FFFFFF;
+            background-color: rgba(0, 39, 59, 0.2);
+            height: .88rem;
+            line-height: .88rem;
+            border-radius: .26rem;
+            padding: 0 .24rem;
+            z-index: 1;
+            text-align: center;
+            }
+        }
+    }
+    
+
+    .it-temp2 {
+        // padding-top: .3rem;
+        position: relative;
+        z-index: 1;
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: .4rem .2rem;
+        }
+       
+    }
+    .it-temp3 {
+        position: relative;
+
+        .img{
+            img{
+                display: block;
+                width: 100%;
+                margin: auto;
+                margin-top: .2rem;
+            }
+        }
+    }
+    .it-temp4{
+        position: relative;
+        margin-top: .3rem;
+        
+        .text{
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: .4rem .2rem;
+        }
+        .img{
+            img{
+                display: block;
+                width: 100%;
+                margin: auto;
+                margin-top: .2rem;
+            }
+        }
+    }
+    
+    
+    .it-temp5{
+        // padding-bottom: 0;
+        position: relative;
+        margin-top: .4rem;
+        
+        .item{
+            margin-bottom: .5rem;
+            .title{
+                line-height: .32rem;
+                // text-align: center;
+                position: relative;
+                padding-top: .5rem;
+                div{
+                    position: absolute;
+                    width: 100%;
+                    left: .38rem;
+                    top: 0;
+                    // text-align: center;
+                    font-size: 1.40rem;
+                    
+                    font-weight: bold;
+                    color: #EEF2FB;
+                    z-index: 0;
+                    span{
+                        width: 1rem;
+                        height: 1rem;
+                        border-radius: .5rem;
+                        display: inline-block;
+                    }
+                }
+                & > span{
+                    position: relative;
+                    z-index: 1;
+                    font-size: .24rem;
+                    
+                    font-weight: 500;
+                    color: #606266;
+                    left: .56rem;
+                }
+                .title1{
+                    color:#E1EAFD;
+                    span{
+                        background-color: #E1EAFD;
+                    }
+                }
+                .title2{
+                    color:#ECF4E3;
+                    span{
+                        background-color: #ECF4E3;
+                    }
+                }
+               
+            }
+        }
+        .text{
+            font-size: .18rem;
+            
+            font-weight: 400;
+            color: #606266;
+            line-height: .32rem;
+            margin-top: .6rem;
+            padding: .4rem;
+        }
+        
+    }
+    // ------------------
+}
--- a/src/views/apply/childs/index_2/index.vue
+++ b/src/views/apply/childs/index_2/index.vue
@ -0,0 +1,113 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+      <div class="title"><div>某大型互联网教育集团</div></div>
+    </div>
+    <!-- <div class="breadcrumb">
+      <van-breadcrumb separator-class="van-icon-arrow-right">
+        <van-breadcrumb-item :to="{ path: '/apply' }"
+          >应用案例</van-breadcrumb-item
+        >
+        <van-breadcrumb-item>某大型互联网教育集团</van-breadcrumb-item>
+      </van-breadcrumb>
+    </div> -->
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="temp2-text">
+          该集团以语言培训为核心，拥有短期培训系统、基础教育系统、文化传播系统、科技产业系统、咨询服务系统等多个发展平台，是一家集教育培训、教育产品研发、教育服务等于一体的大型综合性教育科技集团。该集团于2006年9月7日在美国纽约证券交易所成功上市，成为中国大陆首家海外上市的教育培训机构。
+          <br />护航科技为该集团及全国分支提供应用系统及桌面支持服务、集中式服务台支持服务、桌面运维支持及数据录入服务。
+        </div>
+        <!-- <img v-lazy="imgUrl.img1" alt=""> -->
+      </div>
+      <div class="it-temp3">
+        <div class="title-sub">
+          <span></span>
+          管理机制
+          <span></span>
+        </div>
+        <div class="img">
+          <img v-lazy="imgUrl.img1" alt="" />
+        </div>
+      </div>
+      <div class="it-temp4">
+        <div class="title-sub">
+          <span></span>
+          整体服务方案设计
+          <span></span>
+          <div class="text">
+            为了确保服务质量，首先对服务交付模式进行调整，建立400热线为基础的统一服务支持模式，在服务交付稳定的基础上，将服务台由北京迁移至武汉。
+            优化现有的服务流程并将服务策略落地到ITSM系统中，将ITSM系统与呼叫系统对接，形成统一的服务支持平台，提升服务解决效率。
+            配备符合标准的服务团队提供驻场支持，配备一名专属的服务经理进行管控。
+          </div>
+        </div>
+        <div class="img">
+          <img v-lazy="imgUrl.img2" alt="" />
+        </div>
+      </div>
+      <div class="it-temp5">
+        <div class="title-sub">
+          <span></span>
+          服务价值
+          <span></span>
+        </div>
+
+        <van-row :gutter="0">
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title1"><span></span>1</div>
+                <span>专属备份人员确保不空岗</span>
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title2"><span></span>2</div>
+                <span>专业技术平台保证系统的<br />实用性</span>
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title2"><span></span>3</div>
+                <span>为项目定期进行流程优化</span>
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="12">
+            <div class="item">
+              <div class="title">
+                <div class="title1"><span></span>4</div>
+                <span>公司级质量管理中心定期<br />进行质量检查</span>
+              </div>
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "./images/bg.png";
+import img1 from "./images/img1.png";
+import img2 from "./images/img2.png";
+
+export default {
+  data() {
+    return {
+      imgUrl: {
+        bg: bg,
+        img1: img1,
+        img2: img2,
+      },
+    };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import "./index.less";
+</style>
--- a/src/views/apply/childs/index_3/images/bg.png
+++ b/src/views/apply/childs/index_3/images/bg.png
--- a/src/views/apply/childs/index_3/images/img1.png
+++ b/src/views/apply/childs/index_3/images/img1.png
--- a/src/views/apply/childs/index_3/images/img2.png
+++ b/src/views/apply/childs/index_3/images/img2.png
--- a/src/views/apply/childs/index_3/images/img3.png
+++ b/src/views/apply/childs/index_3/images/img3.png
--- a/src/views/apply/childs/index_3/images/img4.png
+++ b/src/views/apply/childs/index_3/images/img4.png
--- a/src/views/apply/childs/index_3/images/img5.png
+++ b/src/views/apply/childs/index_3/images/img5.png
--- a/src/views/apply/childs/index_3/index.less
+++ b/src/views/apply/childs/index_3/index.less
@ -0,0 +1,384 @@
+.it-container {
+    .it-temp1 {
+        img {
+
+            width: 100%;
+
+            z-index: 0;
+        }
+
+        .title {
+            position: absolute;
+            width: 100%;
+            height: 100%;
+            top: 0;
+            left: 0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            div {
+                font-size: .36rem;
+                font-weight: 500;
+                color: #FFFFFF;
+                background-color: rgba(0, 39, 59, 0.2);
+                height: .88rem;
+                line-height: .88rem;
+                border-radius: .26rem;
+                padding: 0 .24rem;
+                z-index: 1;
+                text-align: center;
+            }
+        }
+    }
+
+
+    .it-temp2 {
+        // padding-top: .3rem;
+        position: relative;
+        z-index: 1;
+
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: .4rem .2rem;
+            padding-bottom: .2rem;
+        }
+
+    }
+
+    .it-temp3 {
+        position: relative;
+
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: 0rem .2rem;
+            margin-bottom: .2rem;
+        }
+
+        .img {
+            img {
+                display: block;
+                width: 88%;
+                margin: auto;
+                margin-top: .2rem;
+            }
+        }
+    }
+
+
+    .it-temp3 {
+        position: relative;
+        z-index: 1;
+        margin-top: .4rem;
+
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: 0rem .2rem;
+            margin-bottom: .2rem;
+        }
+
+        .text-sub {
+            font-size: 0.18rem;
+
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.24rem;
+            text-align: center;
+            margin-bottom: 0.8rem;
+        }
+
+        .bg-img {
+            position: absolute;
+            width: 8.48rem;
+            height: auto;
+            top: 0;
+            right: 0;
+        }
+
+        .bg-img2 {
+            position: absolute;
+            width: 7.14rem;
+            left: 0;
+            top: 11rem;
+        }
+
+
+        .content-list {
+            margin-bottom: 1rem;
+
+            img {
+                width: 100%;
+                // height: 2.4rem;
+            }
+        }
+
+        .content-item {
+            position: relative;
+            padding-left: 0.66rem;
+            display: flex;
+            align-items: center;
+            height: 100%;
+
+            .box {
+                position: relative;
+            }
+
+            .setp {
+                position: absolute;
+                right: 0.2rem;
+                width: 0.24rem;
+                height: 100%;
+
+                span {
+                    display: block;
+                    width: 0.24rem;
+                    height: 0.24rem;
+                    margin-bottom: 0.12rem;
+
+                    &:first-child {
+                        background-color: #008cd5;
+                    }
+
+                    &:last-child {
+                        background-color: #ecf4e3;
+                    }
+                }
+            }
+
+            .num {
+                position: absolute;
+                top: -0.66rem;
+                left: -0.64rem;
+                font-size: 0.72rem;
+
+                font-weight: 500;
+                color: #001d2d;
+                opacity: 0.06;
+            }
+
+            .title {
+                font-size: 0.36rem;
+
+                font-weight: 400;
+                color: #001d2d;
+                line-height: 0.24rem;
+                letter-spacing: 0.01rem;
+                margin-bottom: 0.2rem;
+            }
+
+            .sub-title {
+                font-size: 0.2rem;
+
+                font-weight: 400;
+                color: #606266;
+                line-height: 0.32rem;
+                width: 80%;
+            }
+        }
+
+        .content-item2 {
+            padding-left: 1.8rem;
+
+            .setp {
+                position: absolute;
+                left: 0.2rem;
+                right: auto;
+
+                span {
+                    display: block;
+                    width: 0.24rem;
+                    height: 0.24rem;
+                    margin-bottom: 0.12rem;
+
+                    &:first-child {
+                        background-color: #6eb92c;
+                    }
+
+                    &:last-child {
+                        background-color: #e1eafd;
+                    }
+                }
+            }
+
+            .num {
+                left: -0.6rem;
+            }
+        }
+    }
+
+    .it-temp5 {
+        // padding-bottom: 0;
+        position: relative;
+
+        margin-top: .4rem;
+
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: 0rem .2rem;
+            margin-bottom: .2rem;
+        }
+
+        .pro-flex {
+            padding-left: .3rem;
+
+            .item {
+                // margin-bottom: 0.2rem;
+
+                .content {
+                    // line-height: 0.32rem;
+                    // text-align: center;
+                    position: relative;
+                    // padding-top: .5rem;
+                    overflow: hidden;
+
+                    .icon {
+                        // position: absolute;
+                        float: left;
+                        font-size: 1.4rem;
+
+                        font-weight: bold;
+                        color: #eef2fb;
+                        z-index: 0;
+
+                        span {
+                            position: relative;
+                            top: -0.2rem;
+                            width: 1rem;
+                            height: 1rem;
+                            border-radius: 0.5rem;
+                            display: inline-flex;
+                            // line-height: 1rem;
+                            // text-align: center;
+                            justify-content: center;
+                            align-items: center;
+
+                            img {
+                                width: 0.6rem;
+                                height: 0.6rem;
+                                display: block;
+                            }
+                        }
+                    }
+
+                    // & > span {
+                    //     position: relative;
+                    //     z-index: 1;
+                    //     font-size: 0.18rem;
+                    //     
+                    //     font-weight: 500;
+                    //     color: #001d2d;
+                    //     text-align: left;
+                    //     // padding-left: 1.3rem;
+                    //     // padding-right: .6rem;
+                    //     display: block;
+                    //     top: -0.3rem;
+                    //     line-height: 0.32rem;
+                    // }
+                    .icon {
+                        position: relative;
+                        z-index: 0;
+                        color: #e1eafd;
+
+                        span {
+                            background-color: #e1eafd;
+                        }
+                    }
+
+                    .icon2 {
+                        color: #ecf4e3;
+
+                        span {
+                            background-color: #ecf4e3;
+                        }
+                    }
+
+                    .icon3 {
+                        color: #e1eafd;
+
+                        span {
+                            background-color: #e1eafd;
+                        }
+                    }
+
+                    // .title {
+                    //     margin-top: -.2rem;
+                    //     font-size: 0.24rem;
+                    //     
+                    //     font-weight: 500;
+                    //     color: #001d2d;
+                    //     margin-bottom: .2rem;
+                    //     margin-left: .3rem;
+                    // }
+                    .text {
+                        position: relative;
+                        z-index: 1;
+                        // top: -.3rem;
+                        display: block;
+                        padding-top: .4rem;
+                        font-size: .28rem;
+                        float: left;
+                        font-weight: 400;
+                        color: #606266;
+                        line-height: .44rem;
+                        margin-left: .3rem;
+
+                        span {
+                            font-size: .24rem;
+                            font-weight: 500;
+                            color: #001D2D;
+                            line-height: .44rem;
+                        }
+                    }
+                }
+            }
+
+        }
+
+        .img {
+            img {
+                width:100%;
+                display: block;
+                margin: auto;
+            }
+        }
+
+        .content-div {
+            .title {
+                text-align: center;
+                font-size: .36rem;
+
+                font-weight: 500;
+                color: #001D2D;
+                margin: .6rem 0 .3rem 0;
+            }
+
+            .text {
+                font-size: 0.26rem;
+                font-weight: 400;
+                color: #606266;
+                line-height: 0.4rem;
+                text-align: justify;
+                padding: 0rem .2rem;
+                margin-bottom: .2rem;
+            }
+        }
+    }
+
+    // ------------------
+}
--- a/src/views/apply/childs/index_3/index.vue
+++ b/src/views/apply/childs/index_3/index.vue
@ -0,0 +1,126 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+      <div class="title"><div>全球500强大型制造型企业</div></div>
+    </div>
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="temp2-text">
+          经过多年的快速发展，该企业迄今在中国已拥有27家本地企业、在60个主要城市设有销售与服务分公司和1.5万名员工，并且业务涵盖研发、生产、销售、服务等多个维度。2008年该企业在中国的订单额超过45亿美元，销售额约41亿美元。
+        </div>
+        <!-- <img v-lazy="imgUrl.img1" alt=""> -->
+      </div>
+      <div class="it-temp3">
+        <div class="title-sub">
+          <span></span>
+          服务方案
+          <span></span>
+        </div>
+        <div class="temp2-text">
+          护航科技股份有限公司（简称护航科技）帮助该企业在厦门建立了集中式呼叫中心，实现IT服务从过去的分布式管理完全转变到先进高效的集中式管理模式，该企业员工可以便捷的通过IT服务管理系统、邮件、电话、即时通讯工具等便捷方式获取IT技术支持。
+        </div>
+        <div class="img">
+          <img v-lazy="imgUrl.img1" alt="" />
+        </div>
+      </div>
+      <div class="it-temp5">
+        <div class="title-sub">
+          <span></span>
+          服务成果
+          <span></span>
+        </div>
+        <div class="temp2-text">
+          护航科技帮助该企业(中国)实现IT服务从过去的分布式管理完全转变到更为先进高效的集中式管理模式。
+        </div>
+        <div class="pro-flex">
+          <van-row :gutter="0">
+            <van-col :span="24">
+              <div class="item">
+                <div class="content">
+                  <div class="icon">
+                    <span> <img v-lazy="imgUrl.img2" alt="" /> </span>1
+                  </div>
+                  <div class="text">
+                    服务终端用户数已超过<br />
+                    <span>11000 人</span>
+                  </div>
+                </div>
+              </div>
+            </van-col>
+            <van-col :span="24">
+              <div class="item">
+                <div class="content">
+                  <div class="icon icon2">
+                    <span> <img v-lazy="imgUrl.img3" alt="" /> </span>2
+                  </div>
+                  <div class="text">
+                    日均case处理量超过<br />
+                    <span>700 个</span>
+                  </div>
+                </div>
+              </div>
+            </van-col>
+            <van-col :span="24">
+              <div class="item">
+                <div class="content">
+                  <div class="icon">
+                    <span> <img v-lazy="imgUrl.img4" alt="" /> </span>3
+                  </div>
+                  <div class="text">
+                    一线解决率<br />
+                    <span>>85%</span>
+                  </div>
+                </div>
+              </div>
+            </van-col>
+          </van-row>
+        </div>
+        <div class="img">
+          <img v-lazy="imgUrl.img5" alt="" />
+        </div>
+        <div class="content-div">
+          <div class="title">极虎病毒事件</div>
+          <div class="text">
+            2010年3月底，该企业公司暴发了一次大规模的网络病毒，短期内上海，天津，西安，武汉，青岛，重庆，南京等多个分公司和生产基地的计算机
+            网络服务受到影响。面对这突如其来的异常，护航科技的技术团队调用全国十几个城市的资源，对各个可能有问题的办事处进行电脑检查，查杀感
+            染病毒的机器，22日，护航协调了十六名工程师到上海办事处帮忙查杀病毒，
+            22日到24日，增加了全国巡检，最大程度降低了病毒对用户的影响。
+            另一方面项目经理带领热线支持团队大力配合各地区病毒的查杀，各Team
+            Leader都加班加点，协调各项工作。22日，电话量剧增，高峰期一小时
+            打进400多个电话，全天电话量近1300个。面对如此多的电话，热线团队表现出了良好的专业素质，将掉线率控制在较低水平，保证了服务水平。
+            短短时间内，护航完成了几乎不可能完成的任务，把病毒带来的影响降到了最低程度。此重大故障的及时响应及时解决，得到了该企业（中国）
+            公司客户的高度认可。
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "./images/bg.png";
+import img1 from "./images/img1.png";
+import img2 from "./images/img2.png";
+import img3 from "./images/img3.png";
+import img4 from "./images/img4.png";
+import img5 from "./images/img5.png";
+export default {
+  // components: { ArrowRight },
+  data() {
+    return {
+      imgUrl: {
+        bg: bg,
+        img1: img1,
+        img2: img2,
+        img3: img3,
+        img4: img4,
+        img5: img5,
+      },
+    };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import "./index.less";
+</style>
--- a/src/views/apply/childs/index_4/images/bg.png
+++ b/src/views/apply/childs/index_4/images/bg.png
--- a/src/views/apply/childs/index_4/images/icon1.png
+++ b/src/views/apply/childs/index_4/images/icon1.png
--- a/src/views/apply/childs/index_4/images/icon2.png
+++ b/src/views/apply/childs/index_4/images/icon2.png
--- a/src/views/apply/childs/index_4/images/icon3.png
+++ b/src/views/apply/childs/index_4/images/icon3.png
--- a/src/views/apply/childs/index_4/images/icon4.png
+++ b/src/views/apply/childs/index_4/images/icon4.png
--- a/src/views/apply/childs/index_4/images/icon5.png
+++ b/src/views/apply/childs/index_4/images/icon5.png
--- a/src/views/apply/childs/index_4/images/icon6.png
+++ b/src/views/apply/childs/index_4/images/icon6.png
--- a/src/views/apply/childs/index_4/images/img1.png
+++ b/src/views/apply/childs/index_4/images/img1.png
--- a/src/views/apply/childs/index_4/index.less
+++ b/src/views/apply/childs/index_4/index.less
@ -0,0 +1,288 @@
+.it-container {
+    .it-temp1 {
+       
+        position: relative;
+        img {
+            
+            width: 100%;
+            
+        }
+        .title {
+            position: absolute;
+            width: 100%;
+            height: 100%;
+            top: 0;
+            left: 0;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            div {
+                font-size: .36rem;
+                font-weight: 500;
+                color: #FFFFFF;
+                background-color: rgba(0, 39, 59, 0.2);
+                height: .88rem;
+                line-height: .88rem;
+                border-radius: .26rem;
+                padding: 0 .24rem;
+                z-index: 1;
+                text-align: center;
+            }
+        }
+    }
+    
+
+    .it-temp2 {
+        position: relative;
+        z-index: 1;
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: .4rem .2rem;
+        }
+        img {
+            display: block;
+            width: 9.65rem;
+            margin: auto;
+        }
+    }
+    .it-temp3 {
+        position: relative;
+        padding: 0 .2rem;
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: 0rem .2rem;
+            margin-bottom: .4rem;
+        }
+        
+        .item{
+            margin-bottom: .5rem;
+            .title{
+                line-height: .32rem;
+                // text-align: center;
+                position: relative;
+                // padding-top: .88rem;
+                overflow: hidden;
+                div{
+                    // position: absolute;
+                    // width: 100%;
+                    // left: .38rem;
+                    // top: 0;
+                   
+                    // text-align: center;
+                    font-size: 1.20rem;
+                    
+                    font-weight: bold;
+                    color: #EEF2FB;
+                    z-index: 0;
+                    overflow: hidden;
+                    line-height: 1rem;
+                    span{
+                        width: 1.3rem;
+                        height: 1.3rem;
+                        border-radius: .7rem;
+                        display: flex;
+                        justify-content: center;
+                        align-items: center;
+                        text-align: center;
+                        // line-height: 1rem;
+                        float: left;
+                        img{
+                            width: 0.6rem;
+                            
+                        }
+                    }
+                }
+                & > span{
+                    position: relative;
+                    z-index: 1;
+                    font-size: .30rem;
+                    float: left;
+                    width: calc(100% - 1.3rem);
+                    display: block;
+                    font-weight: 500;
+                    color: #606266;
+                    // left: .56rem;
+                    padding:0 .2rem;
+                    line-height: .44rem;
+                    .text{
+                        font-size: .24rem;
+                        
+                        font-weight: 400;
+                        color: #606266;
+                        line-height: .2rem;
+
+                    }
+                }
+                .title1{
+                    color:#E1EAFD;
+                    float: left;
+                    span{
+                        background-color: #E1EAFD;
+                    }
+                }
+                .title2{
+                    color:#ECF4E3;
+                    span{
+                        background-color: #ECF4E3;
+                    }
+                }
+                .title3{
+                    color:#E1EAFD;
+                    span{
+                        background-color: #E1EAFD;
+                    }
+                }
+                .title4{
+                    color:#ECF4E3;
+                    span{
+                        background-color: #ECF4E3;
+                    }
+                }
+            }
+        }
+    }
+    .it-temp4{
+        position: relative;
+
+        .temp2-text {
+            font-size: 0.26rem;
+            font-weight: 400;
+            color: #606266;
+            line-height: 0.4rem;
+            text-align: justify;
+            padding: 0rem .2rem;
+            margin-bottom: .4rem;
+        }
+        
+        .img{
+            img{
+                display: block;
+                width: 100%;
+                margin: auto;
+                margin-top: .2rem;
+                margin-bottom: .4rem;
+            }
+        }
+        // .text{
+        //     margin-top: .3rem;
+        //     font-size: .18rem;
+            
+        //     font-weight: 400;
+        //     color: #606266;
+        //     line-height: .32rem;
+        // }
+    }
+    
+    
+    .it-temp5{
+        position: relative;
+        
+        .item{
+            margin-bottom: .5rem;
+            padding: 0 .24rem;
+            .title{
+                line-height: .32rem;
+                // text-align: center;
+                position: relative;
+                // padding-top: .88rem;
+                overflow: hidden;
+                div{
+                    // position: absolute;
+                    // width: 100%;
+                    // left: .38rem;
+                    // top: 0;
+                   
+                    // text-align: center;
+                    font-size: 1.20rem;
+                    
+                    font-weight: bold;
+                    color: #EEF2FB;
+                    z-index: 0;
+                    overflow: hidden;
+                    line-height: 1rem;
+                    span{
+                        width: 1rem;
+                        height: 1rem;
+                        border-radius: .7rem;
+                        display: flex;
+                        justify-content: center;
+                        align-items: center;
+                        text-align: center;
+                        // line-height: 1rem;
+                        float: left;
+                        img{
+                            width: 0.6rem;
+        
+                        }
+                    }
+                }
+                & > span{
+                    position: relative;
+                    z-index: 1;
+                    font-size: .26rem;
+                    float: left;
+                    width: calc(100% - 1.8rem);
+                    display: block;
+                    font-weight: 500;
+                    color: #606266;
+                    // left: .56rem;
+                    padding:0 .3rem;
+                    line-height: .44rem;
+                    // .text{
+                    //     font-size: .24rem;
+                        
+                    //     font-weight: 400;
+                    //     color: #606266;
+                    //     line-height: .2rem;
+
+                    // }
+                }
+                .title1{
+                    color:#E1EAFD;
+                    float: left;
+                    span{
+                        background-color: #E1EAFD;
+                    }
+                }
+                .title2{
+                    color:#ECF4E3;
+                    span{
+                        background-color: #ECF4E3;
+                    }
+                }
+                .title3{
+                    color:#E1EAFD;
+                    span{
+                        background-color: #E1EAFD;
+                    }
+                }
+                .title4{
+                    color:#ECF4E3;
+                    span{
+                        background-color: #ECF4E3;
+                    }
+                }
+            }
+        }
+        // .text{
+        //     font-size: .24rem;
+            
+        //     font-weight: 400;
+        //     color: #606266;
+        //     line-height: .32rem;
+        //     margin-top: .6rem;
+        //     padding: .4rem;
+        // }
+        
+    }
+    // ------------------
+}
--- a/src/views/apply/childs/index_4/index.vue
+++ b/src/views/apply/childs/index_4/index.vue
@ -0,0 +1,216 @@
+<template>
+  <div class="it-container">
+    <div class="it-temp1">
+      <img v-lazy="imgUrl.bg" />
+      <div class="title"><div>某大型综合类央企</div></div>
+    </div>
+
+    <div class="container-centent">
+      <div class="it-temp2">
+        <div class="temp2-text">
+          该企业成立于1949年，经过多年的努力，从最初的粮油食品贸易公司发展成为中国领先的农产品、食品领域多元化产品和服务供应商，致力打造从田间到餐桌的全产业链粮油食品企业，建设全服务链的城市综合体，利用不断再生的自然资源为人类提供营养健康的食品、高品质的生活空间及生活服务，贡献于民众生活的富足和社会的繁荣稳定。
+        </div>
+        <!-- <img v-lazy="imgUrl.img1" alt=""> -->
+      </div>
+      <div class="it-temp3">
+        <div class="title-sub">
+          <span></span>
+          项目背景
+          <span></span>
+          
+        </div>
+        <div class="temp2-text">
+            根据该企业桌面运维服务外包的特殊性及本次项目需求特点，护航结合以往典型客户服务经验，在运维过程中着重关注以下几个方面：
+          </div>
+        <van-row :gutter="10">
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1">
+                  <span><img src="./images/icon1.png" /></span>
+                </div>
+                <span>
+                  运维交接平滑过渡<br />
+                  <span class="text"
+                    >保证项目的平滑交接，通过保障手段来降低由于交接可能导致的服务质量不稳定的情况</span
+                  >
+                </span>
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1 title2" style="float: right">
+                  <span><img src="./images/icon2.png" /></span>
+                </div>
+                <span style="float: right; text-align: right;"
+                  >量化 IT 服务<br />
+                  <span class="text"
+                    >针对IT请求和故障设立不同级别的响应和解决处理时间，制定人员、流程KPI考核体系，依据SLA（服务级别协议）进行交付服务管理</span
+                  ></span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1">
+                  <span><img src="./images/icon3.png" /></span>
+                </div>
+                <span
+                  >服务团队人员稳定<br />
+                  <span class="text"
+                    >通过运维数据分析故障变化趋势，对高发故障进行针对性管理与培训，减少故障发生</span
+                  ></span
+                >
+              </div>
+            </div>
+          </van-col>
+        </van-row>
+
+        <van-row :gutter="10">
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1 title2" style="float: right; text-align: right;">
+                  <span><img src="./images/icon4.png" /></span>
+                </div>
+                <span style="float: right; text-align: right;"
+                  >服务团队人员稳定<br />
+                  <span class="text"
+                    >形成关键岗位组内AB角色备份的策略，同时公司对项目团队人员进行备份，双重保障确保服务连续性</span
+                  ></span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1">
+                  <span><img src="./images/icon5.png" /></span>
+                </div>
+                <span
+                  >运维服务可视化<br />
+                  <span class="text"
+                    >充分利用IT服务管理工具，进行日常管理，使得管理人员能够实时掌握当前的服务状态，做到及时干预及时调整，并提高管理效率，运维服务可视化</span
+                  ></span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1 title2" style="float: right; text-align: right;">
+                  <span><img src="./images/icon6.png" /></span>
+                </div>
+                <span style="float: right; text-align: right;"
+                  >提高一线解决率<br />
+                  <span class="text"
+                    >不断总结和分享知识，利用知识提高解决效率</span
+                  ></span
+                >
+              </div>
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+      <div class="it-temp4">
+        <div class="title-sub">
+          <span></span>
+          服务方案
+          <span></span>
+          
+        </div>
+        <div class="temp2-text">
+            为保障服务及时响应并得到解决，同时能够确保重大故障和VIP服务需求得到及时解决，设计了如下的服务模式：
+          </div>
+        <div class="img">
+          <img v-lazy="imgUrl.img1" alt="" />
+        </div>
+        <div class="temp2-text">
+          在充分理解该企业运维服务项目需求的基础上，结合护航科技的服务经验，为了能够做到及时响应及时处理，设计统一热线服务台，充分响应用户需求。
+          遵循以ITIL为核心思想的IT服务管理，并以ISO20000、ISO27001和ISO9001为参考标准进行服务。
+        </div>
+      </div>
+      <div class="it-temp5">
+        <div class="title-sub">
+          <span></span>
+          服务价值
+          <span></span>
+        </div>
+
+        <van-row :gutter="0">
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1"><span></span>1</div>
+                <span>有效保障了该集团桌面<br />环境的稳定</span>
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1" style="float: right"><span></span>2</div>
+                <span  style="float: right; text-align: right"
+                  >有效融入了护航科技的IT<br />服务管理理念和管理方法，<br />
+                  促进了双方的IT服务管理效率</span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1 title2"><span></span>3</div>
+                <span>有效克服了信息部门一<br />线人员的瓶颈问题</span>
+              </div>
+            </div>
+          </van-col>
+           <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1 title2" style="float: right"><span></span>4</div>
+                <span  style="float: right; text-align: right"
+                  >及时解决信息系统的运行故障，保障了信息系统安全、可靠、高效的运行，降低了财政信息化建设、运营的成本和风险</span
+                >
+              </div>
+            </div>
+          </van-col>
+          <van-col :span="24">
+            <div class="item">
+              <div class="title">
+                <div class="title1"><span></span>5</div>
+                <span>整合了的信息资源，优化了IT系统架构</span>
+              </div>
+            </div>
+          </van-col>
+        </van-row>
+       
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import bg from "./images/bg.png";
+import img1 from "./images/img1.png";
+export default {
+  // components: { ArrowRight },
+  data() {
+    return {
+      imgUrl: {
+        bg: bg,
+        img1: img1,
+      },
+    };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+@import "./index.less";
+</style>
--- a/src/views/contactUs/contactUs.vue
+++ b/src/views/contactUs/contactUs.vue
@ -0,0 +1,29 @@
+
+<template>
+    <div class="contact-us">
+        <Form />
+    </div>
+</template>
+<script>
+import Form from '@/components/Form.vue';
+export default {
+    data() {
+        return {
+        };
+    },
+    computed: {},
+    watch: {},
+    methods: {},
+    mounted() {
+    },
+    components: { Form }
+};
+</script>
+
+<style lang="less" scoped>
+.contact-us{
+    height: 100%;
+    background: #fff;
+}
+
+</style>
--- a/src/views/guard/images/bg.jpg
+++ b/src/views/guard/images/bg.jpg
--- a/src/views/guard/images/guard_01.png
+++ b/src/views/guard/images/guard_01.png
--- a/src/views/guard/images/icon_01.jpg
+++ b/src/views/guard/images/icon_01.jpg
--- a/src/views/guard/images/icon_02.jpg
+++ b/src/views/guard/images/icon_02.jpg
--- a/src/views/guard/images/icon_03.jpg
+++ b/src/views/guard/images/icon_03.jpg
--- a/src/views/guard/images/icon_04.png
+++ b/src/views/guard/images/icon_04.png
--- a/src/views/guard/images/logo_list.png
+++ b/src/views/guard/images/logo_list.png
--- a/src/views/guard/images/page_01.png
+++ b/src/views/guard/images/page_01.png
--- a/Show More
+++ b/Show More