diff --git a/b/baiduc/baidu_confirm_refund_order.dspy b/b/baiduc/baidu_confirm_refund_order.dspy
index 46245ca..fb13695 100644
--- a/b/baiduc/baidu_confirm_refund_order.dspy
+++ b/b/baiduc/baidu_confirm_refund_order.dspy
@@ -51,9 +51,9 @@ async def affirmbz_order(ns={}):
     count = await getCustomerBalance(sor, orgid[0]['customerid'])
     if count == None:
         count = 0
-    if count - float(orgid[0]['amount']) < 0:
-        pricedifference = count - round(orgid[0]['amount'],2)
-        return {'status': False, 'msg': '账户余额不足','pricedifference': round(pricedifference,2)}
+    #if count - float(orgid[0]['amount']) < 0:
+        #pricedifference = count - round(orgid[0]['amount'],2)
+        #return {'status': False, 'msg': '账户余额不足, count: %s' % str(count),'pricedifference': round(pricedifference,2)}
     await order2bill(ns['orderid'], sor)
     bills = await sor.R('bill', {'orderid': ns['orderid'], 'del_flg': '0'})
     try:
@@ -902,15 +902,17 @@ async def baidu_confirm_refund_order(ns={}):
                 await sor.U('user_action', {'id': ns_record_id, 'ordertype': 'REFUND', 'reason': '远程退款成功, 本地客户退款成功'})                   
             continue
         else:
-            ns_err_log = {
-                'id': uuid(),
-                'log_level': 'ERROR',
-                'log_content': '远程退款成功，本地退款失败 %s' % str(local_refund_status),
-                'user_id': ns.get('userid'),
-                'request_url': '/baiduc//baidu_confirm_refund_order.dspy',
-                'request_params': json.dumps({'order_id': order_id, 'baidu_id': ns.get('baidu_id')}),
-            }
-            await sor.C('warn_error_log', ns_err_log)
+            db = DBPools()
+            async with db.sqlorContext('kboss') as sor:
+                ns_err_log = {
+                    'id': uuid(),
+                    'log_level': 'ERROR',
+                    'log_content': '远程退款成功，本地退款失败 %s' % str(local_refund_status),
+                    'user_id': ns.get('userid'),
+                    'request_url': '/baiduc//baidu_confirm_refund_order.dspy',
+                    'request_params': json.dumps({'order_id': order_id, 'baidu_id': ns.get('baidu_id')}),
+                }
+                await sor.C('warn_error_log', ns_err_log)
                 
             ns_record = {
                 'orderid': order_id,
diff --git a/f/web-kboss/src/api/H5/index.js b/f/web-kboss/src/api/H5/index.js
index 6704d81..a9e3cb7 100644
--- a/f/web-kboss/src/api/H5/index.js
+++ b/f/web-kboss/src/api/H5/index.js
@@ -1,9 +1,31 @@
 import request from "@/utils/request";
-
+// 获取首页产品
 export const reqHotProduct = () => {
   return request({
     url: '/product/get_firstpage_jizuonet.dspy',
     method: 'post',
   })
 }
+// 获取云，算，网，用数据
+export const reqNavList = (data) => {
+  return request({
+    url: '/product/get_firstpage_product_tree.dspy',
+    method: 'post',
+    headers: {
+      'Content-Type': 'application/json'
+    },
+    data
+  })
+}
 
+//立即咨询
+export const reqNewHomeConsult = (data) => {
+  return request({
+    url: '/product/add_user_inquiry.dspy',
+    method: 'post',
+    headers: {
+      'Content-Type': 'application/json'
+    },
+    data
+  })
+}
diff --git a/f/web-kboss/src/router/index.js b/f/web-kboss/src/router/index.js
index d155c42..398473d 100644
--- a/f/web-kboss/src/router/index.js
+++ b/f/web-kboss/src/router/index.js
@@ -85,7 +85,7 @@ export const constantRoutes = [
     path: '/h5HomePage',
     name: 'H5HomePage',
     title: 'H5首页',
-    component: () => import('@/views/H5/indexPage/index.vue'),
+    component: () => import('@/views/H5/calculate/index.vue'),
     hidden: true,
   },
 
diff --git a/f/web-kboss/src/styles/index.scss b/f/web-kboss/src/styles/index.scss
index cb3b455..e3a72eb 100644
--- a/f/web-kboss/src/styles/index.scss
+++ b/f/web-kboss/src/styles/index.scss
@@ -12,7 +12,7 @@ body{
   text-rendering: optimizeLegibility;
   font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
   overflow-y:hidden;
- 	
+
 }
 label {
   font-weight: 700;
diff --git a/f/web-kboss/src/views/H5/calculate/index.vue b/f/web-kboss/src/views/H5/calculate/index.vue
new file mode 100644
index 0000000..d845802
--- /dev/null
+++ b/f/web-kboss/src/views/H5/calculate/index.vue
@@ -0,0 +1,151 @@
+<template>
+  <div>
+    <!-- 标题 -->
+    <div class="top-tit">
+      开元云
+    </div>
+
+    <!-- 供应商 -->
+    <div v-if="cloudData.secMenu && cloudData.secMenu.length > 0" class="supplier">
+      <div class="supplier-title">{{ cloudData.secMenu[0].secTitle }}</div>
+    </div>
+
+    <!-- 云产品 -->
+    <div class="box">
+      <!-- 循环所有分类下的产品 -->
+      <template v-if="cloudData.secMenu && cloudData.secMenu.length > 0">
+        <template v-for="secMenu in cloudData.secMenu">
+          <template v-for="thrMenu in secMenu.thrMenu">
+            <!-- 循环每个分类下的产品 -->
+            <div
+              v-for="product in thrMenu.value"
+              :key="product.id"
+              class="box-item"
+            >
+              <!-- 标题 -->
+              <div class="item-tit">
+                {{ product.name }}
+              </div>
+              <!-- 详情 -->
+              <div class="item-detail">
+                {{ product.description }}
+              </div>
+              <!-- 描述 -->
+              <div class="item-desc">
+                智算
+              </div>
+              <!-- 立即咨询 -->
+              <div class="item-btn">
+                <div class="btn">
+                  立即咨询
+                </div>
+              </div>
+            </div>
+          </template>
+        </template>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reqNavList } from '@/api/H5/index'
+export default {
+  data() {
+    return {
+      cloudData: {},
+    }
+  },
+  created() {
+    this.getCloudData()
+  },
+  methods: {
+    async getCloudData() {
+      const res = await reqNavList()
+      if (res.status == true) {
+        this.cloudData = res.data.product_service[1]
+        console.log(this.cloudData);
+      }
+    }
+  }
+}
+</script>
+<style>
+  html,
+  body {
+    height: 100%;
+    overflow-y: auto;
+  }
+</style>
+<style lang="less" scoped>
+.top-tit {
+  display: flex;
+  justify-content: center;
+  background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  font-size: .3rem;
+}
+
+.supplier {
+
+  display: flex;
+  padding: .22rem ;
+
+  .supplier-title {
+    font-size: .2rem;
+    color: #000;
+    padding: .1rem .16rem;
+    background-color: pink;
+    border-radius: 0.08rem;
+  }
+}
+
+.box {
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding: 0 .3rem;
+  .box-item {
+    display: flex;
+    width: 48%;
+    flex-direction: column;
+    align-items: self-start;
+    border: .02rem solid #f0f0f0;
+    border-radius: .2rem;
+    padding: .1rem 0.1rem;
+    margin: .34rem 0;
+    .item-tit{
+      font-size: .14rem;
+      color: #000;
+    }
+    .item-detail{
+      color: #737373;
+      font-size: .12rem;
+      margin: .26rem 0;
+    }
+    .item-desc{
+      color: #acafb3;
+      background-color: #e9edf2;
+      font-size: .12rem;
+      padding: .06rem .1rem;
+      border-radius: .08rem;
+    }
+    .item-btn{
+      width: 100%;
+      display: flex;
+      justify-content: flex-end;
+      .btn{
+        background-color: #1f70ff;
+        color: #fff;
+        padding: .05rem .1rem;
+        border-radius: .1rem;
+        font-size: 0.16rem;
+      }
+    }
+  }
+}
+</style>
+
diff --git a/f/web-kboss/src/views/H5/cloud/index.vue b/f/web-kboss/src/views/H5/cloud/index.vue
new file mode 100644
index 0000000..789d3c3
--- /dev/null
+++ b/f/web-kboss/src/views/H5/cloud/index.vue
@@ -0,0 +1,150 @@
+<template>
+  <div>
+    <!-- 标题 -->
+    <div class="top-tit">
+      开元云
+    </div>
+
+    <!-- 供应商 -->
+    <div v-if="cloudData.secMenu && cloudData.secMenu.length > 0" class="supplier">
+      <div class="supplier-title">{{ cloudData.secMenu[0].secTitle }}</div>
+    </div>
+
+    <!-- 云产品 -->
+    <div class="box">
+      <!-- 循环所有分类下的产品 -->
+      <template v-if="cloudData.secMenu && cloudData.secMenu.length > 0">
+        <template v-for="secMenu in cloudData.secMenu">
+          <template v-for="thrMenu in secMenu.thrMenu">
+            <!-- 循环每个分类下的产品 -->
+            <div
+              v-for="product in thrMenu.value"
+              :key="product.id"
+              class="box-item"
+            >
+              <!-- 标题 -->
+              <div class="item-tit">
+                {{ product.name }}
+              </div>
+              <!-- 详情 -->
+              <div class="item-detail">
+                {{ product.description }}
+              </div>
+              <!-- 描述 -->
+              <div class="item-desc">
+                {{ product.label }}
+              </div>
+              <!-- 立即咨询 -->
+              <div class="item-btn">
+                <div class="btn">
+                  立即咨询
+                </div>
+              </div>
+            </div>
+          </template>
+        </template>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reqNavList } from '@/api/H5/index'
+export default {
+  data() {
+    return {
+      cloudData: {},
+    }
+  },
+  created() {
+    this.getCloudData()
+  },
+  methods: {
+    async getCloudData() {
+      const res = await reqNavList()
+      if (res.status == true) {
+        this.cloudData = res.data.product_service[0]
+        console.log(this.cloudData);
+      }
+    }
+  }
+}
+</script>
+<style>
+  html,
+  body {
+    height: 100%;
+    overflow-y: auto;
+  }
+</style>
+<style lang="less" scoped>
+.top-tit {
+  display: flex;
+  justify-content: center;
+  background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  font-size: .3rem;
+}
+
+.supplier {
+
+  display: flex;
+  padding: .22rem ;
+
+  .supplier-title {
+    font-size: .2rem;
+    color: #000;
+    padding: .1rem .16rem;
+    background-color: pink;
+    border-radius: 0.08rem;
+  }
+}
+
+.box {
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding: 0 .3rem;
+  .box-item {
+    display: flex;
+    width: 48%;
+    flex-direction: column;
+    align-items: self-start;
+    border: .02rem solid #f0f0f0;
+    border-radius: .2rem;
+    padding: .1rem 0.1rem;
+    margin: .34rem 0;
+    .item-tit{
+      font-size: .14rem;
+      color: #000;
+    }
+    .item-detail{
+      color: #737373;
+      font-size: .12rem;
+      margin: .26rem 0;
+    }
+    .item-desc{
+      color: #acafb3;
+      background-color: #e9edf2;
+      font-size: .12rem;
+      padding: .06rem .1rem;
+      border-radius: .08rem;
+    }
+    .item-btn{
+      width: 100%;
+      display: flex;
+      justify-content: flex-end;
+      .btn{
+        background-color: #1f70ff;
+        color: #fff;
+        padding: .05rem .1rem;
+        border-radius: .1rem;
+        font-size: 0.16rem;
+      }
+    }
+  }
+}
+</style>
diff --git a/f/web-kboss/src/views/H5/images/tabBar/calculate.png b/f/web-kboss/src/views/H5/images/tabBar/calculate.png
new file mode 100644
index 0000000..2d85206
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/calculate.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/calculateColor.png b/f/web-kboss/src/views/H5/images/tabBar/calculateColor.png
new file mode 100644
index 0000000..09ca9fa
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/calculateColor.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/cloud.png b/f/web-kboss/src/views/H5/images/tabBar/cloud.png
new file mode 100644
index 0000000..d452a89
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/cloud.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/cloudColor.png b/f/web-kboss/src/views/H5/images/tabBar/cloudColor.png
new file mode 100644
index 0000000..d158c7a
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/cloudColor.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/home.png b/f/web-kboss/src/views/H5/images/tabBar/home.png
new file mode 100644
index 0000000..134d588
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/home.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/homeColor.png b/f/web-kboss/src/views/H5/images/tabBar/homeColor.png
new file mode 100644
index 0000000..34d2b36
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/homeColor.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/net.png b/f/web-kboss/src/views/H5/images/tabBar/net.png
new file mode 100644
index 0000000..8b41bf5
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/net.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/netColor.png b/f/web-kboss/src/views/H5/images/tabBar/netColor.png
new file mode 100644
index 0000000..dd348ad
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/netColor.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/user.png b/f/web-kboss/src/views/H5/images/tabBar/user.png
new file mode 100644
index 0000000..c4f9066
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/user.png differ
diff --git a/f/web-kboss/src/views/H5/images/tabBar/userColor.png b/f/web-kboss/src/views/H5/images/tabBar/userColor.png
new file mode 100644
index 0000000..51aa648
Binary files /dev/null and b/f/web-kboss/src/views/H5/images/tabBar/userColor.png differ
diff --git a/f/web-kboss/src/views/H5/index.vue b/f/web-kboss/src/views/H5/index.vue
new file mode 100644
index 0000000..f84269d
--- /dev/null
+++ b/f/web-kboss/src/views/H5/index.vue
@@ -0,0 +1,101 @@
+<template>
+  <div>
+    <div class="main">
+      
+    </div>
+    <div class="tabBar">
+      <!-- 首页 -->
+      <div class="tabBar-item">
+        <div class="item-img">
+          <img src="./images/tabBar/home.png" alt="" />
+        </div>
+        <div class="item-text">
+          首页
+        </div>
+      </div>
+      <!-- 云 -->
+      <div class="tabBar-item">
+        <div class="item-img">
+          <img src="./images/tabBar/cloud.png" alt="" />
+        </div>
+        <div class="item-text">
+          云
+        </div>
+      </div>
+      <!-- 算 -->
+      <div class="tabBar-item">
+        <div class="item-img">
+          <img src="./images/tabBar/calculate.png" alt="" />
+        </div>
+        <div class="item-text">
+          算
+        </div>
+      </div>
+      <!-- 网 -->
+      <div class="tabBar-item">
+        <div class="item-img">
+          <img src="./images/tabBar/net.png" alt="" />
+        </div>
+        <div class="item-text">
+          网
+        </div>
+      </div>
+      <!-- 用 -->
+      <div class="tabBar-item">
+        <div class="item-img">
+          <img src="./images/tabBar/user.png" alt="" />
+        </div>
+        <div class="item-text">
+          用
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import './media'
+export default {
+  data() {
+    return {
+
+    }
+  },
+  methods: {
+
+  },
+
+
+}
+</script>
+
+<style lang="less" scoped>
+.tabBar {
+  padding: .1rem 0;
+  background-color: #fff;
+  width: 100%;
+  display: flex;
+  justify-content: space-around;
+  position: fixed;
+  bottom: 0;
+  .tabBar-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .item-img {
+    margin-bottom: .1rem;
+    img {
+      width: .3rem;
+      height: .3rem;
+      display: block;
+    }
+  }
+
+  .item-text {
+    font-size: .14rem;
+  }
+}
+</style>
diff --git a/f/web-kboss/src/views/H5/indexPage/index.vue b/f/web-kboss/src/views/H5/indexPage/index.vue
deleted file mode 100644
index d5cbe75..0000000
--- a/f/web-kboss/src/views/H5/indexPage/index.vue
+++ /dev/null
@@ -1,392 +0,0 @@
-<template>
-  <div class="main-page">
-    <!-- banner图 -->
-    <div class="top-box">
-      <div class="title">
-        <p class="title-top">
-          <span class="name">开元云</span> 您身边的AI管家
-        </p>
-        <p class="title-btm">
-          全球领先的AI服务运营商
-        </p>
-      </div>
-    </div>
-    <!-- 云筑企业基座 -->
-    <div class="base-box">
-      <div class="text">
-        <p class="text-top">云筑企业基座</p>
-        <p class="text-btm">多云结合 让上云更简单</p>
-      </div>
-      <!-- 内容 -->
-      <div class="content">
-        <div class="item-box" v-for="(item, index) in baseData" :key="index">
-          <!-- 标题 -->
-          <div class="item-title">
-            {{ item.title }}
-          </div>
-          <!-- 介绍 -->
-          <div class="item-description">
-            {{ item.description }}
-          </div>
-          <!-- 内容 -->
-          <div class="item-content">
-            {{ item.content }}
-          </div>
-          <div class="icon-box">
-
-          </div>
-          <!-- 价格 -->
-          <div class="item-price">
-            <span class="price-icon">￥</span> <span class="price">{{ item.price }}</span> 台/月
-          </div>
-          <!-- 按钮 -->
-          <div class="item-button">
-            <div class="item-button-text">立即咨询</div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <!-- 智算未来征程 -->
-    <div class="journey-box">
-      <div class="text">
-        <p class="text-top">智算未来征程</p>
-        <p class="text-btm">多元异构 灵活短租</p>
-      </div>
-      <!-- 内容 -->
-      <div class="content">
-        <div class="item-box" v-for="(item, index) in baseData" :key="index">
-          <!-- 标题 -->
-          <div class="item-title">
-            {{ item.title }}
-          </div>
-          <!-- 介绍 -->
-          <div class="item-description">
-            {{ item.description }}
-          </div>
-          <!-- 内容 -->
-          <div class="item-content">
-            {{ item.content }}
-          </div>
-          <div class="icon-box">
-
-          </div>
-          <!-- 价格 -->
-          <div class="item-price">
-            <span class="price-icon">￥</span> <span class="price">{{ item.price }}</span> 台/月
-          </div>
-          <!-- 按钮 -->
-          <div class="item-button">
-            <div class="item-button-text">立即咨询</div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <!-- 网织智能经纬 -->
-    <div class="latitude-box">
-      <div class="text">
-        <p class="text-top">网织智能经纬</p>
-        <p class="text-btm">云算网结合 让连接更简单</p>
-      </div>
-      <!-- 内容 -->
-      <div class="content">
-        <div class="item-box" v-for="(item, index) in baseData" :key="index">
-          <!-- 标题 -->
-          <div class="item-title">
-            {{ item.title }}
-          </div>
-          <!-- 介绍 -->
-          <div class="item-description">
-            {{ item.description }}
-          </div>
-          <!-- 内容 -->
-          <div class="item-content">
-            {{ item.content }}
-          </div>
-          <div class="icon-box">
-
-          </div>
-          <!-- 价格 -->
-          <div class="item-price">
-            <span class="price-icon">￥</span> <span class="price">{{ item.price }}</span> 台/月
-          </div>
-          <!-- 按钮 -->
-          <div class="item-button">
-            <div class="item-button-text">立即咨询</div>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- 合作机构 -->
-    <div class="partner">
-      <div class="text">
-        <p class="text-top">合作伙伴</p>
-        <p class="text-btm">Partners</p>
-      </div>
-      <!-- 滚动合作伙伴内容 -->
-      <div class="partner-scroll">
-        <div class="logo-scroll-wrapper">
-          <div class="logo-scroll-container">
-            <div v-for="(image, index) in duplicatedImages" :key="index" class="logo-item">
-              <img :src="image" />
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { reqHotProduct } from '@/api/H5/index.js'
-
-export default {
-  data() {
-    return {
-      baseData: [],
-      journeyData: [],
-      latitude: [],
-      images: [
-        require('../images/top/img.png'),
-        require('../images/top/img_1.png'),
-        require('../images/top/img_2.png'),
-        require('../images/top/img_3.png'),
-        require('../images/top/img_4.png'),
-        require('../images/top/img_5.png'),
-        require('../images/top/img_6.png'),
-        require('../images/top/img_8.png'),
-        require('../images/top/img_9.png')
-      ]
-    }
-  },
-  computed: {
-    duplicatedImages() {
-      return [...this.images, ...this.images]
-    }
-  },
-  created() {
-    this.getHotProduct()
-  },
-  methods: {
-    async getHotProduct() {
-      const res = await reqHotProduct()
-      console.log('数据', res);
-      if (res.status == true) {
-        this.baseData = res.data.base
-        this.journeyData = res.data.suan
-        this.latitude = res.data.net
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-* {
-  margin: 0;
-  padding: 0;
-  font-size: 16px;
-  box-sizing: border-box;
-}
-.main-page {
-  width: 100%;
-  height: 100%;
-  background-color: #f8fafd;
-}
-
-.top-box {
-  width: 100%;
-  height: 50vh;
-  background: url("../images/banner.png") no-repeat;
-  background-size: 100% 100%;
-  display: flex;
-  align-items: center;
-}
-
-.title {
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  color: #222f60;
-
-  .name {
-    background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
-    background-clip: text;
-    font-size: .55rem;
-  }
-
-  .title-top {
-    font-size: .55rem;
-  }
-
-  .title-btm {
-    font-size: .26rem;
-    margin-top: .98rem;
-  }
-}
-
-// 子项标题
-.text {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  padding: .14rem 0;
-  width: 100%;
-
-  .text-top {
-    font-size: .26rem;
-    color: #000;
-  }
-
-  .text-btm {
-    margin-top: .14rem;
-    font-size: .18rem;
-    color: #707070;
-  }
-}
-
-// 云筑企业基座
-.base-box,
-.journey-box,
-.latitude-box {
-
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  padding: 0.3rem 0.4rem;
-
-  .content {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-    gap: 0.2rem;
-
-    .item-box {
-      width: 48%;
-      background-color: #fff;
-      border-radius: 0.1rem;
-      padding: 0.2rem;
-      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
-      margin-bottom: 0.2rem;
-      display: flex;
-      flex-direction: column;
-
-      .item-title {
-        font-size: 0.2rem;
-        font-weight: bold;
-        color: #333;
-        margin-bottom: 0.1rem;
-      }
-
-      .item-description {
-        font-size: 0.14rem;
-        color: #666;
-        margin-bottom: 0.15rem;
-      }
-
-      .item-content {
-        font-size: 0.14rem;
-        color: #333;
-        line-height: 1.4;
-        flex: 1;
-      }
-
-      .item-price {
-        font-size: 0.1rem;
-        font-weight: bold;
-        color: #d4d6e1;
-        margin: 0.15rem 0;
-
-        .price {
-          font-size: .22rem;
-          color: #f52220;
-        }
-
-        .price-icon {
-          color: #f52220;
-          font-size: .1rem;
-        }
-      }
-
-      .item-button {
-        background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
-        border-radius: 0.04rem;
-        padding: 0.08rem 0;
-        text-align: center;
-
-        .item-button-text {
-          color: #fff;
-          font-size: 0.14rem;
-        }
-      }
-    }
-  }
-}
-
-// 合作伙伴样式
-.partner {
-  background-color: #f8f9fd;
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  padding: 0.3rem 0.4rem;
-
-  .partner-scroll {
-    width: 100%;
-    max-width: 14rem;
-    margin: 0 auto;
-    padding: .15rem;
-    background: #fff;
-    border-radius: .16rem;
-    margin-bottom: .3rem;
-
-    .logo-scroll-wrapper {
-      width: 100%;
-      height: .85rem;
-      overflow: hidden;
-      position: relative;
-    }
-
-    .logo-scroll-container {
-      display: flex;
-      height: 100%;
-      animation: scroll 15s linear infinite;
-      white-space: nowrap;
-    }
-
-    .logo-item {
-      flex: 0 0 auto;
-      width: 1.68rem;
-      height: 100%;
-      margin-right: .2rem;
-      background: #fff;
-      border-radius: .04rem;
-      overflow: hidden;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-
-      img {
-        width: 100%;
-        height: 100%;
-        object-fit: contain;
-      }
-    }
-  }
-}
-
-@keyframes scroll {
-  0% {
-    transform: translateX(0);
-  }
-
-  100% {
-    transform: translateX(-50%);
-  }
-}
-</style>
diff --git a/f/web-kboss/src/views/H5/media.js b/f/web-kboss/src/views/H5/media.js
new file mode 100644
index 0000000..4f55b34
--- /dev/null
+++ b/f/web-kboss/src/views/H5/media.js
@@ -0,0 +1,10 @@
+function adapter() {
+  //获取布局视口宽度，因为开启了理想视口，布局视口=设备横向独立像素值
+  const dpWidth = document.documentElement.clientWidth
+  //计算根字体大小
+  const rootFonstSize = (dpWidth * 100) / 750
+  //设置根字体大小
+  document.documentElement.style.fontSize = rootFonstSize + 'px'
+}
+adapter()
+window.onresize = adapter()
diff --git a/f/web-kboss/src/views/H5/net/index.vue b/f/web-kboss/src/views/H5/net/index.vue
new file mode 100644
index 0000000..020eabc
--- /dev/null
+++ b/f/web-kboss/src/views/H5/net/index.vue
@@ -0,0 +1,151 @@
+<template>
+  <div>
+    <!-- 标题 -->
+    <div class="top-tit">
+      开元云
+    </div>
+
+    <!-- 供应商 -->
+    <div v-if="cloudData.secMenu && cloudData.secMenu.length > 0" class="supplier">
+      <div class="supplier-title">{{ cloudData.secMenu[0].secTitle }}</div>
+    </div>
+
+    <!-- 云产品 -->
+    <div class="box">
+      <!-- 循环所有分类下的产品 -->
+      <template v-if="cloudData.secMenu && cloudData.secMenu.length > 0">
+        <template v-for="secMenu in cloudData.secMenu">
+          <template v-for="thrMenu in secMenu.thrMenu">
+            <!-- 循环每个分类下的产品 -->
+            <div
+              v-for="product in thrMenu.value"
+              :key="product.id"
+              class="box-item"
+            >
+              <!-- 标题 -->
+              <div class="item-tit">
+                {{ product.name }}
+              </div>
+              <!-- 详情 -->
+              <div class="item-detail">
+                {{ product.description }}
+              </div>
+              <!-- 描述 -->
+              <div class="item-desc">
+                算力网络
+              </div>
+              <!-- 立即咨询 -->
+              <div class="item-btn">
+                <div class="btn">
+                  立即咨询
+                </div>
+              </div>
+            </div>
+          </template>
+        </template>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reqNavList } from '@/api/H5/index'
+export default {
+  data() {
+    return {
+      cloudData: {},
+    }
+  },
+  created() {
+    this.getCloudData()
+  },
+  methods: {
+    async getCloudData() {
+      const res = await reqNavList()
+      if (res.status == true) {
+        this.cloudData = res.data.product_service[2]
+        console.log(this.cloudData);
+      }
+    }
+  }
+}
+</script>
+<style>
+  html,
+  body {
+    height: 100%;
+    overflow-y: auto;
+  }
+</style>
+<style lang="less" scoped>
+.top-tit {
+  display: flex;
+  justify-content: center;
+  background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  font-size: .3rem;
+}
+
+.supplier {
+
+  display: flex;
+  padding: .22rem ;
+
+  .supplier-title {
+    font-size: .2rem;
+    color: #000;
+    padding: .1rem .16rem;
+    background-color: pink;
+    border-radius: 0.08rem;
+  }
+}
+
+.box {
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding: 0 .3rem;
+  .box-item {
+    display: flex;
+    width: 48%;
+    flex-direction: column;
+    align-items: self-start;
+    border: .02rem solid #f0f0f0;
+    border-radius: .2rem;
+    padding: .1rem 0.1rem;
+    margin: .34rem 0;
+    .item-tit{
+      font-size: .14rem;
+      color: #000;
+    }
+    .item-detail{
+      color: #737373;
+      font-size: .12rem;
+      margin: .26rem 0;
+    }
+    .item-desc{
+      color: #acafb3;
+      background-color: #e9edf2;
+      font-size: .12rem;
+      padding: .06rem .1rem;
+      border-radius: .08rem;
+    }
+    .item-btn{
+      width: 100%;
+      display: flex;
+      justify-content: flex-end;
+      .btn{
+        background-color: #1f70ff;
+        color: #fff;
+        padding: .05rem .1rem;
+        border-radius: .1rem;
+        font-size: 0.16rem;
+      }
+    }
+  }
+}
+</style>
+
diff --git a/f/web-kboss/src/views/H5/official/index.vue b/f/web-kboss/src/views/H5/official/index.vue
new file mode 100644
index 0000000..7b04fe7
--- /dev/null
+++ b/f/web-kboss/src/views/H5/official/index.vue
@@ -0,0 +1,677 @@
+让图标始终是对其的状态 让布局规整些
+<template>
+  <div class="main-page">
+    <!-- banner图 -->
+    <div class="top-box">
+      <div class="title">
+        <p class="title-top">
+          <span class="name">开元云</span> 您身边的AI管家
+        </p>
+        <p class="title-btm">
+          全球领先的AI服务运营商
+        </p>
+      </div>
+    </div>
+
+    <!-- 云筑企业基座 -->
+    <div class="base-box">
+      <div class="text">
+        <p class="text-top">云筑企业基座</p>
+        <p class="text-btm">多云结合 让上云更简单</p>
+      </div>
+      <!-- 内容 -->
+      <div class="content">
+        <div class="item-box" v-for="(item, key) in baseData" :key="key">
+          <div class="item-title">{{ item.title }}</div>
+          <div class="item-description">{{ item.description }}</div>
+
+          <!-- 优势列表 -->
+          <div class="advantage-list" v-if="item.list && item.list.length">
+            <div class="advantage-item" v-for="listItem in item.list" :key="listItem.id">
+              <img v-if="listItem.icon" :src="getIconPath(listItem.icon)" alt="" class="advantage-icon" />
+              <span v-if="listItem.name" class="advantage-name">{{ listItem.name }} : </span>
+              <span class="advantage-content">{{ listItem.content }}</span>
+            </div>
+          </div>
+
+          <div class="item-price">
+            <span class="price-icon">￥</span>
+            <span class="price">{{ item.price }}</span> {{ item.price_unit }}
+          </div>
+          <div class="item-button">
+            <div class="item-button-text">立即咨询</div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 智算未来征程 -->
+    <div class="journey-box">
+      <div class="text">
+        <p class="text-top">智算未来征程</p>
+        <p class="text-btm">多元异构 灵活短租</p>
+      </div>
+      <!-- 内容 -->
+      <div class="content">
+        <div class="item-box" v-for="(item, key) in journeyData" :key="key">
+          <div class="item-title">{{ item.title }}</div>
+          <div class="item-description">{{ item.description }}</div>
+
+          <!-- 优势列表 -->
+          <div class="advantage-list" v-if="item.list && item.list.length">
+            <div class="advantage-item" v-for="listItem in item.list" :key="listItem.id">
+              <img v-if="listItem.icon" :src="getIconPath(listItem.icon)" alt="" class="advantage-icon" />
+              <span v-if="listItem.name" class="advantage-name">{{ listItem.name }}：</span>
+              <span class="advantage-content">{{ listItem.content }}</span>
+            </div>
+          </div>
+
+          <div class="item-price">
+            <span class="price-icon">￥</span>
+            <span class="price">{{ item.price }}</span> {{ item.price_unit }}
+          </div>
+          <div class="item-button">
+            <div class="item-button-text">立即咨询</div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 网织智能经纬 -->
+    <div class="latitude-box">
+      <div class="text">
+        <p class="text-top">网织智能经纬</p>
+        <p class="text-btm">云算网结合 让连接更简单</p>
+      </div>
+      <!-- 内容 -->
+      <div class="content">
+        <div class="item-box" v-for="(item, key) in latitude" :key="key">
+          <div class="item-title">{{ item.title }}</div>
+          <div class="item-description">{{ item.description }}</div>
+
+          <!-- 优势列表 -->
+          <div class="advantage-list" v-if="item.advantageList && item.advantageList.length">
+            <div class="advantage-item" v-for="advantage in item.advantageList" :key="advantage.id">
+              <img v-if="advantage.icon" :src="getIconPath(advantage.icon)" alt="" class="advantage-icon" />
+              <span class="advantage-name">{{ advantage.name }}：</span>
+              <span class="advantage-content">{{ advantage.content }}</span>
+            </div>
+          </div>
+
+          <!-- 标签列表 - 添加边框 -->
+          <div class="tag-list" v-if="item.tagList && item.tagList.length">
+            <span
+              class="tag-item"
+              v-for="tag in item.tagList"
+              :key="tag.id"
+            >
+              {{ tag.name }}
+            </span>
+          </div>
+
+          <div class="item-button">
+            <div class="item-button-text">立即咨询</div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 合作伙伴 -->
+    <div class="partner">
+      <div class="text">
+        <p class="text-top">合作伙伴</p>
+        <p class="text-btm">Partners</p>
+      </div>
+      <!-- 滚动合作伙伴内容 -->
+      <div class="partner-scroll">
+        <div class="logo-scroll-wrapper">
+          <div class="logo-scroll-container">
+            <div v-for="(image, index) in duplicatedImages" :key="index" class="logo-item">
+              <img :src="image" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- footer -->
+    <div class="footer">
+      <div class="left-box">
+        <div class="logo-footer">
+          <img :src="logoImg" alt="公司logo" v-if="logoImg">
+          <img src="@/assets/kyy/LOGO.png" alt="公司logo" class="img" v-else>
+        </div>
+        <div class="content-main">
+          <ul>
+            <li>地址: {{ address }}</li>
+            <li>电话：400-6150805 &nbsp;&nbsp;&nbsp;&nbsp;
+              <span class="phone-number">010-65917875</span>
+            </li>
+            <li>邮箱：Open-computing@kaiyuancloud.cn</li>
+            <li>IPC备案号: {{ ICP }}
+              <span class="copyright">版权所有 @kaiyuanyun 2023</span>
+            </li>
+            <li>
+              <img src="@/image/login/policeInsignia/policeInsignia.png" alt="公安备案图标" class="police-icon">
+              <a href="https://beian.mps.gov.cn/#/query/webSearch?code=11010502054007" rel="noreferrer" target="_blank"
+                class="police-link">京公网安备11010502054007</a>
+              <span>
+                <router-link tag="a" target="_blank" class="license-link"
+                  :to="{ name: 'homePageImage' }">经营许可证:京B2-20232313</router-link>
+              </span>
+            </li>
+          </ul>
+        </div>
+      </div>
+      <div class="right-box">
+        <div class="qr-box">
+          <div class="qr-code">
+            <img src="@/assets/kyy/客服wechat.png" alt="微信客服二维码">
+          </div>
+          <span class="qr-content">微信客服</span>
+        </div>
+        <div class="qr-box qr-box-margin">
+          <div class="qr-code">
+            <img src="@/assets/kyy/kyy公众号.jpg" alt="公众号二维码">
+          </div>
+          <span class="qr-content">扫描关注二维码</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reqHotProduct } from '@/api/H5/index.js'
+import { getLogoAPI } from "@/api/login"
+
+export default {
+  name: 'MainPage',
+  data() {
+    return {
+      baseData: {},
+      journeyData: {},
+      latitude: {},
+      images: [
+        require('../images/top/img.png'),
+        require('../images/top/img_1.png'),
+        require('../images/top/img_2.png'),
+        require('../images/top/img_3.png'),
+        require('../images/top/img_4.png'),
+        require('../images/top/img_5.png'),
+        require('../images/top/img_6.png'),
+        require('../images/top/img_8.png'),
+        require('../images/top/img_9.png')
+      ],
+      logoImg: require("@/assets/logo/colorLogo.png"),
+      logoText: "开元云(北京)科技有限公司",
+      url: window.location.href,
+      photosUrl: [],
+      ICP: "京ICP备2022001945号-1",
+      address: "农业展览馆13号瑞辰国际中心518B(团结湖地铁站c东南口步行420米)"
+    }
+  },
+  computed: {
+    duplicatedImages() {
+      return [...this.images, ...this.images]
+    }
+  },
+  created() {
+    this.loadData()
+  },
+  methods: {
+    async loadData() {
+      try {
+        await this.getHotProduct()
+        await this.getCompanyInfo()
+      } catch (error) {
+        console.error('数据加载失败:', error)
+      }
+    },
+
+    async getHotProduct() {
+      const res = await reqHotProduct()
+      console.log('热门产品数据', res)
+
+      if (res.status) {
+        // 直接使用对象结构
+        this.baseData = res.data.base || {}
+        this.journeyData = res.data.suan || {}
+        this.latitude = res.data.net || {}
+      }
+    },
+
+    async getCompanyInfo() {
+      const params = {
+        url_link: this.parseURL(this.url)
+      }
+
+      const res = await getLogoAPI(params)
+
+      if (res.status && res.data && res.data.length) {
+        this.photosUrl = res.data[0]
+
+        if (this.photosUrl.orgname !== '业主机构') {
+          this.logoImg = this.photosUrl.logo || this.logoImg
+          this.logoText = this.photosUrl.orgname || this.logoText
+          this.ICP = this.photosUrl.license_number || this.ICP
+          this.address = this.photosUrl.address || this.address
+        }
+      } else {
+        this.showErrorMessage(res.msg || '获取公司信息失败')
+      }
+    },
+
+    parseURL(url) {
+      if (url.includes("#")) {
+        return url.split("#")[0]
+      }
+      return url
+    },
+
+    showErrorMessage(message) {
+      this.$message({
+        message,
+        type: "error"
+      })
+    },
+
+    // 获取图标路径
+    getIconPath(iconPath) {
+      // 如果图标路径是绝对路径或网络路径，直接返回
+      if (iconPath.startsWith('http') || iconPath.startsWith('//') || iconPath.startsWith('data:')) {
+        return iconPath
+      }
+      // 如果是相对路径，尝试使用 require 加载
+      try {
+        // 注意：这里可能需要根据实际路径调整
+        // 假设图标在 @/views/homePage/mainPage/ 目录下
+        return require(`@/views/homePage/mainPage/${iconPath}`)
+      } catch (e) {
+        console.warn('图标加载失败:', iconPath)
+        return ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less">
+html, body {
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  overflow-x: hidden;
+}
+
+body {
+  overflow-y: auto !important;
+  background-color: #f8fafd;
+}
+</style>
+
+<style lang="less" scoped>
+.main-page {
+  width: 100%;
+  min-height: 100vh;
+  background-color: #f8fafd;
+  overflow-y: auto;
+  -webkit-overflow-scrolling: touch;
+}
+
+.top-box {
+  width: 100%;
+  height: 50vh;
+  background: url("../images/banner.png") no-repeat;
+  background-size: 100% 100%;
+  display: flex;
+  align-items: center;
+}
+
+.title {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #222f60;
+
+  .name {
+    background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    font-size: .55rem;
+  }
+
+  .title-top {
+    font-size: .55rem;
+  }
+
+  .title-btm {
+    font-size: .26rem;
+    margin-top: .98rem;
+  }
+}
+
+.text {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  padding: .14rem 0;
+  width: 100%;
+
+  .text-top {
+    font-size: .26rem;
+    color: #000;
+  }
+
+  .text-btm {
+    font-size: .18rem;
+    color: #707070;
+  }
+}
+
+.base-box,
+.journey-box,
+.latitude-box {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 0.3rem 0.4rem;
+
+  .content {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    gap: 0.2rem;
+
+    .item-box {
+      width: 48%;
+      background-color: #fff;
+      border-radius: 0.1rem;
+      padding: 0.2rem;
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+      margin-bottom: 0.2rem;
+      display: flex;
+      flex-direction: column;
+
+      .item-title {
+        font-size: 0.2rem;
+        font-weight: bold;
+        color: #333;
+        margin-bottom: 0.1rem;
+      }
+
+      .item-description {
+        font-size: 0.14rem;
+        color: #666;
+        margin-bottom: 0.15rem;
+        line-height: 1.4;
+      }
+
+      .advantage-list {
+        margin: 0.1rem 0;
+        .advantage-item {
+          display: flex;
+          align-items: flex-start;
+          font-size: 0.12rem;
+          color: #666;
+          margin-bottom: 0.08rem;
+          line-height: 1.4;
+
+          .advantage-icon {
+            width: 0.16rem;
+            height: 0.16rem;
+            margin-right: 0.05rem;
+            flex-shrink: 0;
+          }
+
+          .advantage-name {
+            color: #000;
+            font-weight: 500;
+            white-space: nowrap;
+            margin-right: 0.05rem;
+          }
+
+          .advantage-content {
+            flex: 1;
+          }
+        }
+      }
+
+      .item-price {
+        font-size: 0.1rem;
+        font-weight: bold;
+        color: #d4d6e1;
+        margin: 0.15rem 0;
+
+        .price {
+          font-size: .22rem;
+          color: #f52220;
+        }
+
+        .price-icon {
+          color: #f52220;
+          font-size: .1rem;
+        }
+      }
+
+      .tag-list {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 0.1rem;
+        margin: 0.15rem 0;
+
+        .tag-item {
+          padding: 0.04rem 0.12rem;
+          font-size: 0.12rem;
+          color: #aeb6bf;
+          background-color: #fff;
+          border: .02rem solid #c8d6e7;
+          border-radius: 0.12rem;
+          display: inline-block;
+        }
+      }
+
+      .item-button {
+        background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+        border-radius: 0.04rem;
+        padding: 0.08rem 0;
+        text-align: center;
+        cursor: pointer;
+        margin-top: auto;
+
+        .item-button-text {
+          color: #fff;
+          font-size: 0.14rem;
+        }
+      }
+    }
+  }
+}
+
+.partner {
+  background-color: #f8f9fd;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 0.3rem 0.4rem;
+
+  .partner-scroll {
+    width: 100%;
+    max-width: 14rem;
+    margin: 0 auto;
+    padding: .15rem;
+    background: #fff;
+    border-radius: .16rem;
+    margin-bottom: .3rem;
+
+    .logo-scroll-wrapper {
+      width: 100%;
+      height: .85rem;
+      overflow: hidden;
+      position: relative;
+    }
+
+    .logo-scroll-container {
+      display: flex;
+      height: 100%;
+      animation: scroll 15s linear infinite;
+      white-space: nowrap;
+    }
+
+    .logo-item {
+      flex: 0 0 auto;
+      width: 1.68rem;
+      height: 100%;
+      margin-right: .2rem;
+      background: #fff;
+      border-radius: .04rem;
+      overflow: hidden;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      img {
+        width: 100%;
+        height: 100%;
+        object-fit: contain;
+      }
+    }
+  }
+}
+
+@keyframes scroll {
+  0% {
+    transform: translateX(0);
+  }
+
+  100% {
+    transform: translateX(-50%);
+  }
+}
+
+.footer {
+  width: 100%;
+  background: #f5f7fa;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0.4rem;
+  border-top: 0.013rem solid #e4e7ed;
+  margin-top: 0.4rem;
+}
+
+.left-box {
+  display: flex;
+  align-items: flex-start;
+}
+
+.logo-footer {
+  width: 1.333rem;
+  height: 0.4rem;
+  margin-right: 0.667rem;
+
+  img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
+}
+
+.content-main {
+  ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+  }
+
+  li {
+    font-size: 0.16rem;
+    color: #606266;
+    line-height: 1.8;
+    margin-bottom: 0.08rem;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+  }
+
+  a {
+    color: #409eff;
+    text-decoration: none;
+    font-size: 0.16rem;
+
+    &:hover {
+      text-decoration: underline;
+    }
+  }
+}
+
+.phone-number {
+  margin-left: 0.267rem;
+  font-size: .16rem;
+}
+
+.copyright {
+  margin-left: 0.267rem;
+  font-size: .16rem;
+}
+
+.police-icon {
+  width: 0.227rem;
+  height: 0.227rem;
+  margin-right: 0.027rem;
+  vertical-align: middle;
+}
+
+.police-link {
+  margin-right: 0.4rem;
+}
+
+.license-link {
+  font-size: 0.16rem;
+}
+
+.right-box {
+  display: flex;
+  align-items: center;
+}
+
+.qr-box {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  .qr-code {
+    width: 1.333rem;
+    height: 1.333rem;
+    background: #fff;
+    border-radius: 0.053rem;
+    margin-bottom: 0.133rem;
+    padding: 0.08rem;
+    border: 0.013rem solid #e4e7ed;
+    box-sizing: content-box;
+
+    img {
+      width: 100%;
+      height: 100%;
+      object-fit: contain;
+    }
+  }
+
+  .qr-content {
+    font-size: 0.16rem;
+    color: #606266;
+  }
+}
+
+.qr-box-margin {
+  margin-left: 0.667rem;
+}
+</style>
+
diff --git a/f/web-kboss/src/views/H5/use/index.vue b/f/web-kboss/src/views/H5/use/index.vue
new file mode 100644
index 0000000..adbd236
--- /dev/null
+++ b/f/web-kboss/src/views/H5/use/index.vue
@@ -0,0 +1,148 @@
+<template>
+  <div>
+    <!-- 标题 -->
+    <div class="top-tit">
+      开元云
+    </div>
+
+    <!-- 供应商 -->
+    <div v-if="cloudData.secMenu && cloudData.secMenu.length > 0" class="supplier">
+      <div class="supplier-title">{{ cloudData.secMenu[0].secTitle }}</div>
+    </div>
+
+    <!-- 云产品 -->
+    <div class="box">
+      <!-- 循环所有分类下的产品 -->
+      <template v-if="cloudData.secMenu && cloudData.secMenu.length > 0">
+        <template v-for="secMenu in cloudData.secMenu">
+          <template v-for="thrMenu in secMenu.thrMenu">
+            <!-- 循环每个分类下的产品 -->
+            <div
+              v-for="product in thrMenu.value"
+              :key="product.id"
+              class="box-item"
+            >
+              <!-- 标题 -->
+              <div class="item-tit">
+                {{ product.name }}
+              </div>
+              <!-- 详情 -->
+              <div class="item-detail">
+                {{ thrMenu.thrTitle }}
+              </div>
+              <!-- 描述 -->
+              <div class="item-desc">
+                AI应用
+              </div>
+              <!-- 立即咨询 -->
+              <div class="item-btn">
+                <div class="btn">
+                  立即咨询
+                </div>
+              </div>
+            </div>
+          </template>
+        </template>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script>
+import { reqNavList } from '@/api/H5/index'
+export default {
+  data() {
+    return {
+      cloudData: {},
+    }
+  },
+  created() {
+    this.getCloudData()
+  },
+  methods: {
+    async getCloudData() {
+      const res = await reqNavList()
+      if (res.status == true) {
+        this.cloudData = res.data.product_service[3]
+        console.log(this.cloudData);
+      }
+    }
+  }
+}
+</script>
+<style>
+  html,
+  body {
+    height: 100%;
+    overflow-y: auto;
+  }
+</style>
+<style lang="less" scoped>
+.top-tit {
+  display: flex;
+  justify-content: center;
+  background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  font-size: .3rem;
+}
+
+.supplier {
+  display: flex;
+  padding: .22rem ;
+  .supplier-title {
+    font-size: .2rem;
+    color: #000;
+    padding: .1rem .16rem;
+    background-color: pink;
+    border-radius: 0.08rem;
+  }
+}
+
+.box {
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding: 0 .3rem;
+  .box-item {
+    display: flex;
+    width: 48%;
+    flex-direction: column;
+    align-items: self-start;
+    border: .02rem solid #f0f0f0;
+    border-radius: .2rem;
+    padding: .1rem 0.1rem;
+    margin: .34rem 0;
+    .item-tit{
+      font-size: .14rem;
+      color: #000;
+    }
+    .item-detail{
+      color: #737373;
+      font-size: .12rem;
+      margin: .26rem 0;
+    }
+    .item-desc{
+      color: #acafb3;
+      background-color: #e9edf2;
+      font-size: .12rem;
+      padding: .06rem .1rem;
+      border-radius: .08rem;
+    }
+    .item-btn{
+      width: 100%;
+      display: flex;
+      justify-content: flex-end;
+      .btn{
+        background-color: #1f70ff;
+        color: #fff;
+        padding: .05rem .1rem;
+        border-radius: .1rem;
+        font-size: 0.16rem;
+      }
+    }
+  }
+}
+</style>
diff --git a/f/web-kboss/src/views/homePage/mainPage/qqq.vue b/f/web-kboss/src/views/homePage/mainPage/qqq.vue
deleted file mode 100644
index e69de29..0000000
diff --git a/f/web-kboss/src/views/product/mainPage/index.vue b/f/web-kboss/src/views/product/mainPage/index.vue
index 8386db7..1477331 100644
--- a/f/web-kboss/src/views/product/mainPage/index.vue
+++ b/f/web-kboss/src/views/product/mainPage/index.vue
@@ -57,7 +57,7 @@
                   续费
                 </el-button>
               </template>
-            </el-table-column>  
+            </el-table-column>
           </el-table>
         </div>
       </div>
@@ -205,9 +205,8 @@ export default Vue.extend({
 
     async initMybalance() {
       const res = await editReachargelogAPI()
-      if (res.status) {
-        // 注意：根据您的 user 模块，这里需要使用 'SETMYBANLANCE' 而不是 'user/setMybalance'
-        this.$store.commit('SETMYBANLANCE', res.data)
+      if (res.status==true) {
+        this.mybalance = res.data
       }
     },
     async getUnreadMsgCount() {
@@ -282,11 +281,7 @@ export default Vue.extend({
       }
     }
   },
-  computed: {
-    ...mapState({
-      mybalance: state => state.user.mybalance,
-    })
-  },
+
 })
 </script>