@ -51,9 +51,9 @@ async def affirmbz_order(ns={}):
|
|||||||
count = await getCustomerBalance(sor, orgid[0]['customerid'])
|
count = await getCustomerBalance(sor, orgid[0]['customerid'])
|
||||||
if count == None:
|
if count == None:
|
||||||
count = 0
|
count = 0
|
||||||
if count - float(orgid[0]['amount']) < 0:
|
#if count - float(orgid[0]['amount']) < 0:
|
||||||
pricedifference = count - round(orgid[0]['amount'],2)
|
#pricedifference = count - round(orgid[0]['amount'],2)
|
||||||
return {'status': False, 'msg': '账户余额不足','pricedifference': round(pricedifference,2)}
|
#return {'status': False, 'msg': '账户余额不足, count: %s' % str(count),'pricedifference': round(pricedifference,2)}
|
||||||
await order2bill(ns['orderid'], sor)
|
await order2bill(ns['orderid'], sor)
|
||||||
bills = await sor.R('bill', {'orderid': ns['orderid'], 'del_flg': '0'})
|
bills = await sor.R('bill', {'orderid': ns['orderid'], 'del_flg': '0'})
|
||||||
try:
|
try:
|
||||||
@ -902,15 +902,17 @@ async def baidu_confirm_refund_order(ns={}):
|
|||||||
await sor.U('user_action', {'id': ns_record_id, 'ordertype': 'REFUND', 'reason': '远程退款成功, 本地客户退款成功'})
|
await sor.U('user_action', {'id': ns_record_id, 'ordertype': 'REFUND', 'reason': '远程退款成功, 本地客户退款成功'})
|
||||||
continue
|
continue
|
||||||
else:
|
else:
|
||||||
ns_err_log = {
|
db = DBPools()
|
||||||
'id': uuid(),
|
async with db.sqlorContext('kboss') as sor:
|
||||||
'log_level': 'ERROR',
|
ns_err_log = {
|
||||||
'log_content': '远程退款成功,本地退款失败 %s' % str(local_refund_status),
|
'id': uuid(),
|
||||||
'user_id': ns.get('userid'),
|
'log_level': 'ERROR',
|
||||||
'request_url': '/baiduc//baidu_confirm_refund_order.dspy',
|
'log_content': '远程退款成功,本地退款失败 %s' % str(local_refund_status),
|
||||||
'request_params': json.dumps({'order_id': order_id, 'baidu_id': ns.get('baidu_id')}),
|
'user_id': ns.get('userid'),
|
||||||
}
|
'request_url': '/baiduc//baidu_confirm_refund_order.dspy',
|
||||||
await sor.C('warn_error_log', ns_err_log)
|
'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 = {
|
ns_record = {
|
||||||
'orderid': order_id,
|
'orderid': order_id,
|
||||||
|
|||||||
@ -1,9 +1,31 @@
|
|||||||
import request from "@/utils/request";
|
import request from "@/utils/request";
|
||||||
|
// 获取首页产品
|
||||||
export const reqHotProduct = () => {
|
export const reqHotProduct = () => {
|
||||||
return request({
|
return request({
|
||||||
url: '/product/get_firstpage_jizuonet.dspy',
|
url: '/product/get_firstpage_jizuonet.dspy',
|
||||||
method: 'post',
|
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
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
@ -85,7 +85,7 @@ export const constantRoutes = [
|
|||||||
path: '/h5HomePage',
|
path: '/h5HomePage',
|
||||||
name: 'H5HomePage',
|
name: 'H5HomePage',
|
||||||
title: 'H5首页',
|
title: 'H5首页',
|
||||||
component: () => import('@/views/H5/indexPage/index.vue'),
|
component: () => import('@/views/H5/calculate/index.vue'),
|
||||||
hidden: true,
|
hidden: true,
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@ -12,7 +12,7 @@ body{
|
|||||||
text-rendering: optimizeLegibility;
|
text-rendering: optimizeLegibility;
|
||||||
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
|
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
|
||||||
overflow-y:hidden;
|
overflow-y:hidden;
|
||||||
|
|
||||||
}
|
}
|
||||||
label {
|
label {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
|
|||||||
151
f/web-kboss/src/views/H5/calculate/index.vue
Normal file
@ -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>
|
||||||
|
|
||||||
150
f/web-kboss/src/views/H5/cloud/index.vue
Normal file
@ -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>
|
||||||
BIN
f/web-kboss/src/views/H5/images/tabBar/calculate.png
Normal file
|
After Width: | Height: | Size: 3.0 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/calculateColor.png
Normal file
|
After Width: | Height: | Size: 3.0 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/cloud.png
Normal file
|
After Width: | Height: | Size: 7.1 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/cloudColor.png
Normal file
|
After Width: | Height: | Size: 8.0 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/home.png
Normal file
|
After Width: | Height: | Size: 9.4 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/homeColor.png
Normal file
|
After Width: | Height: | Size: 9.6 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/net.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/netColor.png
Normal file
|
After Width: | Height: | Size: 9.7 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/user.png
Normal file
|
After Width: | Height: | Size: 9.0 KiB |
BIN
f/web-kboss/src/views/H5/images/tabBar/userColor.png
Normal file
|
After Width: | Height: | Size: 10 KiB |
101
f/web-kboss/src/views/H5/index.vue
Normal file
@ -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>
|
||||||
@ -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>
|
|
||||||
10
f/web-kboss/src/views/H5/media.js
Normal file
@ -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()
|
||||||
151
f/web-kboss/src/views/H5/net/index.vue
Normal file
@ -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>
|
||||||
|
|
||||||
677
f/web-kboss/src/views/H5/official/index.vue
Normal file
@ -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
|
||||||
|
<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>
|
||||||
|
|
||||||
148
f/web-kboss/src/views/H5/use/index.vue
Normal file
@ -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>
|
||||||
@ -57,7 +57,7 @@
|
|||||||
续费
|
续费
|
||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -205,9 +205,8 @@ export default Vue.extend({
|
|||||||
|
|
||||||
async initMybalance() {
|
async initMybalance() {
|
||||||
const res = await editReachargelogAPI()
|
const res = await editReachargelogAPI()
|
||||||
if (res.status) {
|
if (res.status==true) {
|
||||||
// 注意:根据您的 user 模块,这里需要使用 'SETMYBANLANCE' 而不是 'user/setMybalance'
|
this.mybalance = res.data
|
||||||
this.$store.commit('SETMYBANLANCE', res.data)
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async getUnreadMsgCount() {
|
async getUnreadMsgCount() {
|
||||||
@ -282,11 +281,7 @@ export default Vue.extend({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
|
||||||
...mapState({
|
|
||||||
mybalance: state => state.user.mybalance,
|
|
||||||
})
|
|
||||||
},
|
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||