首页更新
This commit is contained in:
parent
76618a5e16
commit
dd8960f0f1
@ -54,6 +54,24 @@
|
||||
<div class="content unicode" style="display: block;">
|
||||
<ul class="icon_lists dib-box">
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">右箭头</div>
|
||||
<div class="code-name">&#xe624;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">上</div>
|
||||
<div class="code-name">&#xe63c;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">下</div>
|
||||
<div class="code-name">&#xe63d;</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont"></span>
|
||||
<div class="name">购物车空</div>
|
||||
@ -156,9 +174,9 @@
|
||||
<pre><code class="language-css"
|
||||
>@font-face {
|
||||
font-family: 'iconfont';
|
||||
src: url('iconfont.woff2?t=1781579680075') format('woff2'),
|
||||
url('iconfont.woff?t=1781579680075') format('woff'),
|
||||
url('iconfont.ttf?t=1781579680075') format('truetype');
|
||||
src: url('iconfont.woff2?t=1782877614448') format('woff2'),
|
||||
url('iconfont.woff?t=1782877614448') format('woff'),
|
||||
url('iconfont.ttf?t=1782877614448') format('truetype');
|
||||
}
|
||||
</code></pre>
|
||||
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
||||
@ -184,6 +202,33 @@
|
||||
<div class="content font-class">
|
||||
<ul class="icon_lists dib-box">
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-youjiantou"></span>
|
||||
<div class="name">
|
||||
右箭头
|
||||
</div>
|
||||
<div class="code-name">.icon-youjiantou
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-shang"></span>
|
||||
<div class="name">
|
||||
上
|
||||
</div>
|
||||
<div class="code-name">.icon-shang
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-xia"></span>
|
||||
<div class="name">
|
||||
下
|
||||
</div>
|
||||
<div class="code-name">.icon-xia
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<span class="icon iconfont icon-gouwuchekong"></span>
|
||||
<div class="name">
|
||||
@ -337,6 +382,30 @@
|
||||
<div class="content symbol">
|
||||
<ul class="icon_lists dib-box">
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-youjiantou"></use>
|
||||
</svg>
|
||||
<div class="name">右箭头</div>
|
||||
<div class="code-name">#icon-youjiantou</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-shang"></use>
|
||||
</svg>
|
||||
<div class="name">上</div>
|
||||
<div class="code-name">#icon-shang</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-xia"></use>
|
||||
</svg>
|
||||
<div class="name">下</div>
|
||||
<div class="code-name">#icon-xia</div>
|
||||
</li>
|
||||
|
||||
<li class="dib">
|
||||
<svg class="icon svg-icon" aria-hidden="true">
|
||||
<use xlink:href="#icon-gouwuchekong"></use>
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 5043107 */
|
||||
src: url('iconfont.woff2?t=1781579680075') format('woff2'),
|
||||
url('iconfont.woff?t=1781579680075') format('woff'),
|
||||
url('iconfont.ttf?t=1781579680075') format('truetype');
|
||||
src: url('iconfont.woff2?t=1782877614448') format('woff2'),
|
||||
url('iconfont.woff?t=1782877614448') format('woff'),
|
||||
url('iconfont.ttf?t=1782877614448') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
@ -13,6 +13,18 @@
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-youjiantou:before {
|
||||
content: "\e624";
|
||||
}
|
||||
|
||||
.icon-shang:before {
|
||||
content: "\e63c";
|
||||
}
|
||||
|
||||
.icon-xia:before {
|
||||
content: "\e63d";
|
||||
}
|
||||
|
||||
.icon-gouwuchekong:before {
|
||||
content: "\e600";
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -5,6 +5,27 @@
|
||||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "1304892",
|
||||
"name": "右箭头",
|
||||
"font_class": "youjiantou",
|
||||
"unicode": "e624",
|
||||
"unicode_decimal": 58916
|
||||
},
|
||||
{
|
||||
"icon_id": "1305406",
|
||||
"name": "上",
|
||||
"font_class": "shang",
|
||||
"unicode": "e63c",
|
||||
"unicode_decimal": 58940
|
||||
},
|
||||
{
|
||||
"icon_id": "1305407",
|
||||
"name": "下",
|
||||
"font_class": "xia",
|
||||
"unicode": "e63d",
|
||||
"unicode_decimal": 58941
|
||||
},
|
||||
{
|
||||
"icon_id": "1306",
|
||||
"name": "购物车空",
|
||||
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -6,153 +6,16 @@
|
||||
|
||||
<transition name="slide">
|
||||
<div v-show="windowsHidden" style="font-size: 14px">
|
||||
<div class="new-floating" style="z-index: 99;">
|
||||
<img src="./img/head.png" alt="">
|
||||
<div class="cloud-contact-us " @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave">
|
||||
<!-- <span class="cloud-contact-us-i"></span>-->
|
||||
<span> 售</span>
|
||||
<span> 前</span>
|
||||
<span> 咨</span>
|
||||
<span> 询</span>
|
||||
</div>
|
||||
<!-- <div class="cart-entry-wrapper" @click="tryUse">-->
|
||||
<!-- <el-tooltip class="item" effect="light" content="申请试用" placement="left">-->
|
||||
<!-- <div class="cart-entry">-->
|
||||
<!-- <span class="cart-icon"></span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </el-tooltip>-->
|
||||
|
||||
<!-- </div>-->
|
||||
<div @click="open2"
|
||||
|
||||
style="position:absolute;bottom:-40px;display: flex;justify-content: center;align-items: center;cursor: pointer">
|
||||
<!-- 摄像头 -->
|
||||
<!-- <el-tooltip v-if="getHomePath()!=='/ncmatchHome/index'" class="item" effect="light" content="联系销售" placement="left">
|
||||
<span class="el-icon-video-camera"
|
||||
style="font-weight: 550;font-size: 22px;"></span>
|
||||
</el-tooltip> -->
|
||||
|
||||
<!-- </div>-->
|
||||
<!-- <div class="cart-entry-wrapper" style="visibility: visible;">-->
|
||||
<!-- <div class="cart-entry" data-track-category="购物车浮层" data-track-name="入口点击"-->
|
||||
<!-- data-track-action="click"><span class="cart-icon"></span></div>-->
|
||||
<!-- <span class="cart-icon"></span>-->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- <div class="floating-box" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave"-->
|
||||
<!-- style="cursor: default;">-->
|
||||
<!-- <span>联系我们</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="floating-box1" @click="tryUse">-->
|
||||
|
||||
<!-- <span>申请试用</span>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
|
||||
<!-- <transition name="slide">-->
|
||||
<!-- <div v-show="windowsHidden">-->
|
||||
<!-- <div class="floating-box" @mouseenter="handleMouseEnter" @mouseleave="handleMouseLeave"-->
|
||||
<!-- style="cursor: default;">-->
|
||||
<!-- <i class="el-icon-s-comment"></i>-->
|
||||
<!-- <span>联系我们</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="floating-box1" @click="tryUse">-->
|
||||
<!-- <i class="el-icon-s-order"></i>-->
|
||||
<!-- <span>申请试用</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </transition>-->
|
||||
|
||||
<div v-if="false" @click="windowsHidden=!windowsHidden" class="floating-box1 hiddenBtn"
|
||||
style="width: 50px;height: 50px;border-radius:50%;bottom: 30px;background-color: #f1e9e9;color: blue">
|
||||
<i class="el-icon-arrow-right" style="color: blue" v-show="windowsHidden"></i>
|
||||
<i class="el-icon-arrow-left" style="color: blue" v-show="!windowsHidden"></i>
|
||||
</div>
|
||||
|
||||
|
||||
<transition name="el-zoom-in-top">
|
||||
<!--isShow&&windowsHidden -->
|
||||
<div v-show="isShow&&windowsHidden" class="cloud-contact-us-spread-container" style="z-index: 9">
|
||||
<ul class="cloud-contact-us-spread" style="padding-left: 15px;">
|
||||
<li class="cloud-contact-us-tel" style="height: 90px;">
|
||||
<div style="display: flex;justify-content: center;align-items: center;padding-top: 15px">
|
||||
<div data-track-action="click" data-track-category="右侧公共悬浮区" data-track-name="售前咨询"
|
||||
data-agl-cvt="5"
|
||||
style="height: 100%;display: flex;justify-content: center;align-items: center;flex-direction: column;">
|
||||
<div
|
||||
style="margin-left: -50px;width: 100px;height: 30px;display: flex;justify-content: center;align-items: center">
|
||||
<span style="margin-right: 5px;margin-top: 17px;height: 35px;"
|
||||
class="cloud-contact-us-icon"></span>
|
||||
<p class="cloud-contact-us-tit" style="font-size: 14px;">售前咨询</p>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: center;align-items: center;"
|
||||
>
|
||||
<div v-if="!phone"
|
||||
style="width: 80px;height: 25px;display: flex!important;justify-content: center;align-items: center">
|
||||
<el-skeleton
|
||||
style="width: 100%;padding: 0;margin: 0;height: 100%;margin-top: -25px"
|
||||
:rows="1"
|
||||
animated/>
|
||||
</div>
|
||||
<p v-else class="cloud-contact-us-con" style="font-size: 12px;height: 20px;margin-top: 5px">
|
||||
{{ phone }}</p></div>
|
||||
</div>
|
||||
<div v-if="false" style="width: 90px;height: 90px;">
|
||||
<div class="img"
|
||||
style="width: 90px;height: 90px; display: flex;justify-content: center;align-items: center"
|
||||
>
|
||||
<el-skeleton style="width: 80px;height: 80px;" :loading="loading" animated
|
||||
v-if="isShowPicLoading">
|
||||
<template slot="template">
|
||||
<el-skeleton-item
|
||||
variant="image"
|
||||
style="width: 80px; height:80px ;"
|
||||
/>
|
||||
</template>
|
||||
</el-skeleton>
|
||||
<img style="width: 80px;height: 80px;" v-else @load="onImageLoad" :src="src" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="floating-consult">
|
||||
<a href="#" class="floating-consult-btn primary" @click.prevent="openAiConsult">
|
||||
<div class="floating-consult-icon">
|
||||
<img src="./img/ocai.jpg" alt="在线咨询">
|
||||
<span class="consult-badge"></span>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
<span class="floating-consult-text">在线咨询</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div class="dialog" v-if="false"-->
|
||||
<!-- style="display: flex;justify-content: space-around;">-->
|
||||
<!-- <div class="phone">-->
|
||||
<!-- <span class="sonOne">业务咨询</span>-->
|
||||
<!-- <span class="sonTwo">生态合作总监</span>-->
|
||||
<!-- <span class="sonThree" style="display: flex;">-->
|
||||
<!-- 电话:-->
|
||||
<!-- <el-skeleton style="width: 120px" animated v-if="isShowPicLoading">-->
|
||||
<!-- <template slot="template">-->
|
||||
<!-- <el-skeleton-item variant="image" style="width: 70px; height: 20px;"/>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-skeleton>-->
|
||||
<!-- <span v-else>{{ phone }}</span>-->
|
||||
|
||||
<!-- </span>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="img" style="display: flex;justify-content: center;align-items: center"-->
|
||||
<!-- >-->
|
||||
<!-- <el-skeleton style="width: 100%" :loading="loading" animated v-if="isShowPicLoading">-->
|
||||
<!-- <template slot="template">-->
|
||||
<!-- <el-skeleton-item-->
|
||||
<!-- variant="image"-->
|
||||
<!-- style="width: 100px; height:100px ;"-->
|
||||
<!-- />-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-skeleton>-->
|
||||
<!-- <img v-else @load="onImageLoad" :src="src" alt="">-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
</transition>
|
||||
|
||||
|
||||
@ -381,6 +244,9 @@ export default {
|
||||
open2() {
|
||||
this.isShowChangeChat = true
|
||||
},
|
||||
openAiConsult() {
|
||||
window.dispatchEvent(new CustomEvent('kboss-open-ai-chat'))
|
||||
},
|
||||
//关闭弹窗
|
||||
closeWindow() {
|
||||
this.isShowChangeChat = false
|
||||
@ -967,10 +833,6 @@ export default {
|
||||
margin-top: 2px;
|
||||
width: 20px;
|
||||
background-position: -100px 0;
|
||||
|
||||
&:hover {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.el-icon-video-camera {
|
||||
@ -1014,6 +876,67 @@ export default {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.floating-consult {
|
||||
position: fixed;
|
||||
right: 18px;
|
||||
bottom: 128px;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.floating-consult-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
text-decoration: none;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.14);
|
||||
transition: all 0.25s ease;
|
||||
}
|
||||
|
||||
.floating-consult-btn:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.floating-consult-btn.primary {
|
||||
width: 56px;
|
||||
padding: 12px 8px;
|
||||
border-radius: 28px;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.floating-consult-icon {
|
||||
position: relative;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.floating-consult-icon img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.consult-badge {
|
||||
position: absolute;
|
||||
top: -2px;
|
||||
right: -2px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
border: 2px solid #fff;
|
||||
background: #ef4444;
|
||||
}
|
||||
|
||||
.floating-consult-text {
|
||||
writing-mode: vertical-rl;
|
||||
text-orientation: mixed;
|
||||
font-size: 12px;
|
||||
color: #1f2937;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
<style>
|
||||
|
||||
BIN
f/web-kboss/src/components/FloatingBox/img/ocai.jpg
Normal file
BIN
f/web-kboss/src/components/FloatingBox/img/ocai.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
@ -790,4 +790,228 @@ export default {
|
||||
::v-deep .el-drawer__body {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* 新版站内信视觉优化 */
|
||||
.drawer,
|
||||
.drawerMobile {
|
||||
::v-deep .el-drawer {
|
||||
background: #f5f8ff;
|
||||
box-shadow: -18px 0 48px rgba(15, 23, 42, 0.16);
|
||||
}
|
||||
}
|
||||
|
||||
.drawer {
|
||||
::v-deep .el-drawer {
|
||||
width: 64% !important;
|
||||
min-width: 860px;
|
||||
border-radius: 24px 0 0 24px;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.drawerMobile {
|
||||
::v-deep .el-drawer {
|
||||
border-radius: 18px 0 0 18px;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.drawer ::v-deep .el-container,
|
||||
.drawerMobile ::v-deep .el-container {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.aside {
|
||||
background: linear-gradient(180deg, #eef5ff 0%, #f8fbff 100%) !important;
|
||||
border-right: 1px solid #e4ecf7;
|
||||
|
||||
.header {
|
||||
height: 78px !important;
|
||||
padding-left: 26px !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: transparent !important;
|
||||
border-bottom: 0 !important;
|
||||
color: #111827;
|
||||
font-size: 20px !important;
|
||||
line-height: 1.3 !important;
|
||||
font-weight: 800 !important;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding: 8px 14px;
|
||||
|
||||
div {
|
||||
height: 44px !important;
|
||||
margin-bottom: 8px;
|
||||
padding-left: 16px !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 12px;
|
||||
color: #5f6b7a;
|
||||
font-size: 15px !important;
|
||||
line-height: 44px !important;
|
||||
font-weight: 600;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
&:hover {
|
||||
background: rgba(30, 111, 255, 0.08) !important;
|
||||
color: #1e6fff;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%) !important;
|
||||
color: #fff !important;
|
||||
box-shadow: 0 10px 24px rgba(39, 90, 255, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content_box {
|
||||
padding: 22px 26px !important;
|
||||
background: #f8fbff !important;
|
||||
|
||||
.header {
|
||||
height: auto !important;
|
||||
padding: 0 0 18px !important;
|
||||
border-bottom: 0 !important;
|
||||
color: #111827 !important;
|
||||
font-size: 24px !important;
|
||||
line-height: 1.35 !important;
|
||||
font-weight: 800 !important;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-bottom: 16px !important;
|
||||
padding: 14px 16px !important;
|
||||
display: flex !important;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
border: 1px solid #edf1f7 !important;
|
||||
border-radius: 16px;
|
||||
background: #fff;
|
||||
box-shadow: 0 10px 28px rgba(31, 45, 61, 0.05);
|
||||
}
|
||||
|
||||
.msgtext {
|
||||
margin: 4px 12px 12px;
|
||||
padding: 16px 18px !important;
|
||||
border: 1px solid #e8eef7;
|
||||
border-radius: 14px !important;
|
||||
background: #f7faff !important;
|
||||
color: #4b5563 !important;
|
||||
font-size: 14px;
|
||||
line-height: 1.8 !important;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-button {
|
||||
border-radius: 999px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
::v-deep .el-button--primary {
|
||||
border-color: transparent;
|
||||
background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
|
||||
}
|
||||
|
||||
::v-deep .el-button--danger {
|
||||
border-color: #fee2e2;
|
||||
background: #fff5f5;
|
||||
color: #ef4444;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-color: #fecaca;
|
||||
background: #fee2e2;
|
||||
color: #dc2626;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-table {
|
||||
border-radius: 18px;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
box-shadow: 0 12px 32px rgba(31, 45, 61, 0.06);
|
||||
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
th {
|
||||
background: #f4f8ff !important;
|
||||
color: #4b5563;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
td {
|
||||
border-bottom: 1px solid #edf1f7;
|
||||
color: #344054;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.el-table__row {
|
||||
transition: background 0.2s ease;
|
||||
|
||||
&:hover > td {
|
||||
background: #f7faff !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-table__expanded-cell {
|
||||
background: #fff !important;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .unReadColor td {
|
||||
background: #eef5ff !important;
|
||||
color: #111827;
|
||||
font-weight: 600;
|
||||
|
||||
&:first-child {
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
width: 4px;
|
||||
height: 28px;
|
||||
border-radius: 0 999px 999px 0;
|
||||
background: #1e6fff;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.content_box {
|
||||
padding: 16px !important;
|
||||
}
|
||||
|
||||
.aside {
|
||||
.header {
|
||||
height: 64px !important;
|
||||
padding-left: 14px !important;
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding: 6px 8px;
|
||||
|
||||
div {
|
||||
height: 40px !important;
|
||||
padding-left: 10px !important;
|
||||
font-size: 13px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -3,7 +3,7 @@ import Vue from 'vue'
|
||||
import Cookies from 'js-cookie'
|
||||
import 'normalize.css/normalize.css' // a modern alternative to CSS resets
|
||||
|
||||
import './assets/css/iconfont/iconfont.css'
|
||||
import '@/assets/css/iconfont/iconfont.css'
|
||||
|
||||
import Element from 'element-ui'
|
||||
import './styles/element-variables.scss'
|
||||
|
||||
@ -65,7 +65,13 @@ export const constantRoutes = [
|
||||
{
|
||||
path: "/tokenMarket",
|
||||
name: "PublicTokenMarket",
|
||||
component: () => import('@/views/product/allProduct/index.vue'),
|
||||
redirect: to => ({
|
||||
path: "/homePage/tokenMarket",
|
||||
query: {
|
||||
category: to.query.category || "TOKEN市集",
|
||||
single: to.query.single || "1",
|
||||
}
|
||||
}),
|
||||
hidden: true,
|
||||
meta: {
|
||||
title: "TOKEN市集",
|
||||
@ -337,6 +343,12 @@ export const constantRoutes = [
|
||||
name: "homePageIndex",
|
||||
hidden: true,
|
||||
meta: { title: "首页", onCache: true },
|
||||
}, {
|
||||
path: "opc",
|
||||
component: () => import("@/views/homePage/mainPage/OPC/index.vue"),
|
||||
name: "homePageOPC",
|
||||
hidden: true,
|
||||
meta: { title: "OPC公共服务平台", onCache: true },
|
||||
}, {
|
||||
path: "computeMarket",
|
||||
component: () => import("@/views/homePage/computeMarket/index.vue"),
|
||||
@ -355,6 +367,12 @@ export const constantRoutes = [
|
||||
name: "trainPlatform",
|
||||
hidden: true,
|
||||
meta: { title: "训推平台", onCache: true },
|
||||
}, {
|
||||
path: "tokenMarket",
|
||||
component: () => import("@/views/product/allProduct/index.vue"),
|
||||
name: "homePageTokenMarket",
|
||||
hidden: true,
|
||||
meta: { title: "TOKEN市集", onCache: true },
|
||||
}, {
|
||||
path: "agentStore",
|
||||
component: () => import("@/views/homePage/agentStore"),
|
||||
@ -775,6 +793,13 @@ export const asyncRoutes = [
|
||||
hidden: true,
|
||||
meta: { title: "首页", fullPath: "/homePage/index" },
|
||||
},
|
||||
{
|
||||
path: "opc",
|
||||
component: () => import("@/views/homePage/mainPage/OPC/index.vue"),
|
||||
name: "homePageOPC",
|
||||
hidden: true,
|
||||
meta: { title: "OPC公共服务平台", fullPath: "/homePage/opc" },
|
||||
},
|
||||
{
|
||||
path: "detail",
|
||||
component: () => import("@/views/homePage/detail/index.vue"),
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div style="width: 100%;">
|
||||
<div class="about-page" style="width: 100%;">
|
||||
<!-- Banner部分 -->
|
||||
<div class="banner">
|
||||
<div v-if="JSON.stringify(logoInfoNew) !== '{}'" style="font-size: 38px;">
|
||||
|
||||
@ -168,5 +168,9 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.agent-store-page {
|
||||
padding-top: 82px;
|
||||
}
|
||||
|
||||
@import './agent.css';
|
||||
</style>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="news-page">
|
||||
|
||||
new
|
||||
</div>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>sale</div>
|
||||
<div class="sale-page">sale</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import Vue from 'vue'
|
||||
|
||||
@ -424,7 +424,7 @@ export default {
|
||||
<style scoped lang="scss">
|
||||
.compute-market-page {
|
||||
min-height: 100vh;
|
||||
padding: 28px 0 8px;
|
||||
padding: 82px 0 8px;
|
||||
background:
|
||||
radial-gradient(circle at top left, rgba(64, 158, 255, 0.18), transparent 34%),
|
||||
radial-gradient(circle at top right, rgba(14, 165, 233, 0.12), transparent 28%),
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div style="width: 100%;">
|
||||
<div class="detail-page" style="width: 100%;">
|
||||
<!-- 顶部容器，设置最小宽度和flex布局 -->
|
||||
<div id="topContainer"
|
||||
style="min-width: 1400px; width: 100%;display: flex;flex-direction: column;justify-content: flex-start;align-items: center">
|
||||
|
||||
@ -1,48 +1,55 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
title="产品咨询"
|
||||
:visible.sync="showTalk"
|
||||
width="1000px"
|
||||
title="联系销售"
|
||||
:visible="dialogVisible"
|
||||
width="620px"
|
||||
center
|
||||
append-to-body
|
||||
:close-on-click-modal="false"
|
||||
@close="cancelBtn"
|
||||
top="15px"
|
||||
@update:visible="handleDialogVisibleUpdate"
|
||||
top="8vh"
|
||||
custom-class="talk-dialog"
|
||||
>
|
||||
<el-form ref="ruleForm" :rules="rules" label-position="top" label-width="80px" :model="addData">
|
||||
<el-form-item label="需求描述">
|
||||
<el-input :autosize="{ minRows: 3, maxRows: 3}" type="textarea" size="mini"
|
||||
v-model="addData.content"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="客户类型">
|
||||
<el-radio v-model="addData.custom_type" label="1">企业</el-radio>
|
||||
<el-radio v-model="addData.custom_type" label="0">个人</el-radio>
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-bottom: 10px" label="联系人姓名" prop="name">
|
||||
<el-input style="width: 350px;" size="mini" v-model="addData.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-bottom: 10px" prop="phone" label="联系人手机">
|
||||
<el-input style="width: 350px;" size="mini" v-model="addData.phone"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item v-show="addData.custom_type==='1'" style="margin-bottom: 10px" label="公司名称">
|
||||
<el-input style="width: 350px;" size="mini" v-model="addData.company"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item style="margin-bottom: 10px" label="联系人邮箱">
|
||||
<el-input style="width: 350px;" size="mini" v-model="addData.email"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-checkbox style="margin-top: 25px" v-model="checked">
|
||||
勾选表示：您同意<span v-if="JSON.stringify(logoInfoNew)!=='{}'">{{ logoInfoNew.home.bannerTitle }}</span>及其授权的合作伙伴通过您填写的联系方式联系您，且数据仅用于与您沟通。当您注销平台账号后，您的数据会被销毁。
|
||||
</el-checkbox>
|
||||
<div class="qcode">
|
||||
|
||||
<img v-if="JSON.stringify(logoInfoNew)!=='{}'" :src="logoInfoNew.home.qrCode" alt="">
|
||||
<span style="margin-top: 10px;display: inline-block">扫码添加官方客服</span>
|
||||
<div class="talk-body">
|
||||
<div class="talk-form">
|
||||
<el-form ref="ruleForm" :rules="rules" label-position="top" label-width="80px" :model="addData">
|
||||
<el-form-item label="需求描述">
|
||||
<el-input :autosize="{ minRows: 4, maxRows: 4 }" type="textarea" v-model="addData.content" placeholder="请输入您的具体需求"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="客户类型">
|
||||
<el-radio v-model="addData.custom_type" label="1">企业</el-radio>
|
||||
<el-radio v-model="addData.custom_type" label="0">个人</el-radio>
|
||||
</el-form-item>
|
||||
<div class="form-grid">
|
||||
<el-form-item label="联系人姓名" prop="name">
|
||||
<el-input v-model="addData.name" placeholder="请输入联系人姓名"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="phone" label="联系人手机">
|
||||
<el-input v-model="addData.phone" placeholder="请输入联系人手机"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item v-show="addData.custom_type==='1'" label="公司名称">
|
||||
<el-input v-model="addData.company" placeholder="请输入公司名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人邮箱">
|
||||
<el-input v-model="addData.email" placeholder="请输入联系人邮箱"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
<el-checkbox class="agreement-checkbox" v-model="checked">
|
||||
勾选表示：您同意<span v-if="JSON.stringify(logoInfoNew)!=='{}'">{{ logoInfoNew.home.bannerTitle }}</span>及其授权的合作伙伴通过您填写的联系方式联系您，且数据仅用于与您沟通。当您注销平台账号后，您的数据会被销毁。
|
||||
</el-checkbox>
|
||||
</div>
|
||||
<div class="qcode">
|
||||
<img v-if="JSON.stringify(logoInfoNew)!=='{}'" :src="logoInfoNew.home.qrCode" alt="">
|
||||
<span>扫码添加官方客服</span>
|
||||
</div>
|
||||
</div>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
|
||||
<!-- <el-button size="mini" @click="cancelBtn">取 消</el-button>-->
|
||||
<el-button size="mini" type="primary" @click="confirmBtn">提 交</el-button>
|
||||
</span>
|
||||
<el-button class="cancel-btn" @click="cancelBtn">取消</el-button>
|
||||
<el-button class="submit-btn" type="primary" :loading="addBtnLoading" @click="confirmBtn">提交咨询</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
@ -71,6 +78,7 @@ export default Vue.extend({
|
||||
},
|
||||
addBtnLoading: false,
|
||||
checked: false,
|
||||
dialogVisible: false,
|
||||
addData: {
|
||||
content: '',//需求内容
|
||||
custom_type: "1",//客户类型 0-个人 1-企业
|
||||
@ -87,8 +95,23 @@ export default Vue.extend({
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
showTalk: {
|
||||
immediate: true,
|
||||
handler(value) {
|
||||
this.dialogVisible = value
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleDialogVisibleUpdate(value) {
|
||||
this.dialogVisible = value;
|
||||
if (!value) {
|
||||
this.$store.commit('setShowTalk', false);
|
||||
}
|
||||
},
|
||||
cancelBtn() {
|
||||
this.dialogVisible = false;
|
||||
this.$store.commit('setShowTalk', false);
|
||||
console.log("取消按钮被点击了");
|
||||
},
|
||||
@ -144,41 +167,176 @@ export default Vue.extend({
|
||||
|
||||
|
||||
<style scoped lang="scss">
|
||||
::v-deep .talk-dialog {
|
||||
border-radius: 22px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 24px 70px rgba(15, 23, 42, 0.18);
|
||||
z-index: 99999999999999999!important;
|
||||
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__header {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 22px 28px 8px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__title {
|
||||
color: #111827;
|
||||
font-size: 22px;
|
||||
line-height: 1.4;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__headerbtn {
|
||||
top: 26px;
|
||||
right: 28px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 8px 28px 6px;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item__label {
|
||||
padding-bottom: 0;
|
||||
padding-bottom: 8px;
|
||||
color: #374151;
|
||||
font-size: 15px;
|
||||
line-height: 1.4;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item {
|
||||
margin-bottom: 0;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner,
|
||||
::v-deep .el-textarea__inner {
|
||||
border-radius: 12px;
|
||||
border-color: #e5eaf3;
|
||||
color: #111827;
|
||||
font-size: 15px;
|
||||
pointer-events: auto;
|
||||
user-select: text;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
}
|
||||
|
||||
::v-deep .el-textarea__inner {
|
||||
padding: 12px 14px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
::v-deep .el-radio__label {
|
||||
color: #374151;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.talk-body {
|
||||
position: relative;
|
||||
min-height: 470px;
|
||||
}
|
||||
|
||||
.talk-form {
|
||||
min-width: 0;
|
||||
padding-right: 178px;
|
||||
}
|
||||
|
||||
.form-grid {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.agreement-checkbox {
|
||||
margin-top: 4px;
|
||||
|
||||
::v-deep .el-checkbox__label {
|
||||
color: #6b7280;
|
||||
font-size: 13px;
|
||||
line-height: 1.7;
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.qcode {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
min-height: 174px;
|
||||
padding: 14px 12px;
|
||||
position: absolute;
|
||||
right: 150px;
|
||||
bottom: 150px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 18px;
|
||||
background: linear-gradient(180deg, #f4f8ff 0%, #ffffff 100%);
|
||||
border: 1px solid #edf1f7;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
width: 112px;
|
||||
height: 112px;
|
||||
object-fit: cover;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
span {
|
||||
margin-top: 12px;
|
||||
color: #4b5563;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__footer {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-top: 0;
|
||||
padding-bottom: 35px;
|
||||
gap: 14px;
|
||||
padding: 8px 28px 26px;
|
||||
}
|
||||
|
||||
.cancel-btn,
|
||||
.submit-btn {
|
||||
min-width: 160px;
|
||||
height: 44px;
|
||||
padding: 0 32px;
|
||||
border-radius: 999px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.cancel-btn {
|
||||
border: 1px solid #d8e0ef;
|
||||
color: #4b5563;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
border: 0;
|
||||
background: linear-gradient(90deg, #275AFF 0%, #2EBDFA 100%);
|
||||
box-shadow: 0 12px 28px rgba(39, 90, 255, 0.22);
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.talk-body {
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.talk-form {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.qcode {
|
||||
position: static;
|
||||
width: 100%;
|
||||
min-height: auto;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -2,13 +2,15 @@
|
||||
<div id="homeOut" class="homeOut">
|
||||
<TopBox id="topBox"></TopBox>
|
||||
|
||||
<router-view></router-view>
|
||||
<div class="home-router-view">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
<!-- footer-->
|
||||
<div class="footer">
|
||||
<div class="left-box" style="border-bottom: 1px solid #7A82A0">
|
||||
<div class="left-box">
|
||||
|
||||
<div style="display: flex;flex-direction: column">
|
||||
<img v-if="JSON.stringify(logoInfoNew)!=='{}'" style="width: 148px;height: 48px;"
|
||||
<div class="footer-brand">
|
||||
<img v-if="JSON.stringify(logoInfoNew)!=='{}'"
|
||||
:src="logoInfoNew.home.logoImg" alt=""
|
||||
class="img">
|
||||
<div class="content-main">
|
||||
@ -27,40 +29,19 @@
|
||||
</div>
|
||||
</div>
|
||||
<ul class="bigUl">
|
||||
|
||||
<!-- <li class="bigLi">-->
|
||||
<!-- <span class="title">关于我们</span>-->
|
||||
<!-- <ul class="smallUl">-->
|
||||
<!-- <li class="smallLi" @click="$router.push('/homePage/about')">公司介绍</li>-->
|
||||
<!-- </ul>-->
|
||||
<!-- <span class="title"> </span>-->
|
||||
<!-- </li>-->
|
||||
<!-- <li class="bigLi">-->
|
||||
<!-- <span class="title">产品</span>-->
|
||||
<!-- <ul class="smallUl">-->
|
||||
<!-- <li @click="goBaidu" class="smallLi">百度云</li>-->
|
||||
<!-- <li @click="goAliyun" class="smallLi">阿里云</li>-->
|
||||
<!-- <!– <li class="smallLi">开元云</li>–>-->
|
||||
<!-- </ul>-->
|
||||
<!-- <span class="title"> </span>-->
|
||||
<!-- </li>-->
|
||||
<!-- <li class="bigLi">-->
|
||||
<!-- <span class="title">解决方案</span>-->
|
||||
<!-- <ul class="smallUl">-->
|
||||
<!-- <li class="smallLi">生物医药</li>-->
|
||||
<!-- </ul>-->
|
||||
<!-- <span class="title"> </span>-->
|
||||
<!-- </li>-->
|
||||
<!-- <li class="bigLi">-->
|
||||
<!-- <span class="title">服务与支持</span>-->
|
||||
<!-- <ul class="smallUl">-->
|
||||
<!-- <li class="smallLi">模型微调</li>-->
|
||||
<!-- <li class="smallLi">模型应用</li>-->
|
||||
<!-- <li class="smallLi">业务咨询</li>-->
|
||||
<!-- <li class="smallLi">加入开元</li>-->
|
||||
<!-- </ul>-->
|
||||
<!-- <span class="title"> </span>-->
|
||||
<!-- </li>-->
|
||||
<li class="bigLi footer-service">
|
||||
<span class="title">产品服务</span>
|
||||
<ul class="smallUl footer-service-list">
|
||||
<li
|
||||
v-for="item in footerProductServices"
|
||||
:key="item.label"
|
||||
class="smallLi"
|
||||
@click="goFooterService(item.path)"
|
||||
>
|
||||
{{ item.label }}
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<div v-if="JSON.stringify(logoInfoNew)!=='{}'&&logoInfoNew.home.bannerTitle!=='开元数智'" class="right-box">
|
||||
<div class="qr-box">
|
||||
@ -70,7 +51,7 @@
|
||||
</div>
|
||||
<span class="qr-content">微信客服</span>
|
||||
</div>
|
||||
<div class="qr-box" style="margin-left: 0.667rem">
|
||||
<div class="qr-box">
|
||||
<div class="qr-code">
|
||||
<img src="./img/kefu.jpg" style="padding: 0.08rem" alt="">
|
||||
|
||||
@ -79,9 +60,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex;justify-content: center;align-items: center;width: 100%; ">
|
||||
<div class="footer-record">
|
||||
<span v-if="JSON.stringify(logoInfoNew)!=='{}'"
|
||||
style="margin:15px 0 ;width: 1400px;display:flex;justify-content:center;align-items:center;color: #7A82A0;"><span
|
||||
class="footer-record__text"><span
|
||||
class="goStyle"
|
||||
@click="goOut('https://beian.miit.gov.cn/#/Integrated/index')">
|
||||
京ICP备{{
|
||||
@ -150,6 +131,15 @@ export default Vue.extend({
|
||||
icon: require("./newImg/container.png"),
|
||||
activeIcon: require("./newImg/containerActive.png")
|
||||
}
|
||||
],
|
||||
footerProductServices: [
|
||||
{ label: 'Token市集', path: '/homePage/tokenMarket' },
|
||||
{ label: '算力市场', path: '/homePage/computeMarket' },
|
||||
{ label: 'OPC公共服务平台', path: '/homePage/opc' },
|
||||
{ label: '训推平台', path: '/homePage/trainPlatform' },
|
||||
{ label: '智能体商店', path: '/homePage/agentStore' },
|
||||
{ label: '供需广场', path: '/ncmatchHome/supplyAndDemandSquare' },
|
||||
{ label: '文档中心', path: '/homePage/new' },
|
||||
]
|
||||
}
|
||||
},
|
||||
@ -179,6 +169,10 @@ export default Vue.extend({
|
||||
goOut(url){
|
||||
window.open(url)
|
||||
},
|
||||
goFooterService(path) {
|
||||
if (!path || this.$route.path === path) return
|
||||
this.$router.push(path)
|
||||
},
|
||||
scrollToElement(id) {
|
||||
const element = document.getElementById(id);
|
||||
if (element) {
|
||||
@ -247,54 +241,94 @@ export default Vue.extend({
|
||||
height: 100%;
|
||||
overflow: auto !important;
|
||||
min-width: 1500px;
|
||||
// background: linear-gradient(180deg, #f0f7ff 0%, #ffffff 60%, #f5f8ff 100%);
|
||||
}
|
||||
#topBox{
|
||||
// height: 82px;
|
||||
background: transparent!important;
|
||||
background-color: transparent!important;
|
||||
box-shadow: none!important;
|
||||
border: 0!important;
|
||||
}
|
||||
|
||||
.home-router-view {
|
||||
width: 100%;
|
||||
padding-top: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding: 35px 0;
|
||||
padding: 42px 0 22px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.left-box {
|
||||
width: 1400px;
|
||||
height: 100%;
|
||||
min-height: 180px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-bottom: 15px;
|
||||
align-items: flex-start;
|
||||
padding: 0 0 30px;
|
||||
border-bottom: 1px solid rgba(122, 130, 160, 0.28);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer-brand {
|
||||
width: 420px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.img {
|
||||
width: 168px;
|
||||
height: 54px;
|
||||
object-fit: contain;
|
||||
object-position: left center;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.right-box {
|
||||
height: 100%;
|
||||
min-width: 260px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
align-items: flex-start;
|
||||
gap: 34px;
|
||||
}
|
||||
|
||||
.content-main {
|
||||
mix-blend-mode: normal;
|
||||
color: rgba(0, 0, 0, 1);
|
||||
font-size: 0.187rem;
|
||||
color: #7A82A0;
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.qr-code {
|
||||
width: 112px;
|
||||
height: 112px;
|
||||
padding: 6px;
|
||||
border: 1px solid #edf1f7;
|
||||
border-radius: 12px;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
width: 1.853rem;
|
||||
height: 1.853rem;
|
||||
}
|
||||
|
||||
.qr-content {
|
||||
mix-blend-mode: normal;
|
||||
color: rgba(24, 24, 24, 1);
|
||||
color: #4b5563;
|
||||
font-family: PingFang SC, serif;
|
||||
font-weight: 600;
|
||||
font-size: 0.187rem;
|
||||
font-size: 14px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.qr-box {
|
||||
@ -314,27 +348,30 @@ export default Vue.extend({
|
||||
}
|
||||
|
||||
.bigUl {
|
||||
margin: 0 15px;
|
||||
margin-left: -250px;
|
||||
//padding-top: 15px;
|
||||
width: fit-content;
|
||||
margin: 0 80px 0 40px;
|
||||
width: 260px;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
.bigLi {
|
||||
margin: 0 25px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
height: 100%;
|
||||
|
||||
.title {
|
||||
color: #222F60;
|
||||
color: #111827;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
line-height: 1.4;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.smallUl {
|
||||
font-size: 16px;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
font-size: 15px;
|
||||
color: #7A82A0;
|
||||
|
||||
li {
|
||||
@ -343,12 +380,29 @@ export default Vue.extend({
|
||||
}
|
||||
}
|
||||
|
||||
.footer-service {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.footer-service-list {
|
||||
margin-top: 16px;
|
||||
|
||||
.smallLi {
|
||||
line-height: 1.5;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.info {
|
||||
font-size: 14px;
|
||||
color: #7A82A0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
margin: 10px 0;
|
||||
margin: 6px 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -358,12 +412,32 @@ export default Vue.extend({
|
||||
}
|
||||
|
||||
.smallLi {
|
||||
transition: color .2s ease, transform .2s ease;
|
||||
|
||||
&:hover {
|
||||
color: #1b5bff;
|
||||
cursor: pointer;
|
||||
transform: translateX(4px);
|
||||
}
|
||||
}
|
||||
|
||||
.footer-record {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.footer-record__text {
|
||||
width: 1400px;
|
||||
margin: 18px 0 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #7A82A0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.goStyle {
|
||||
cursor: pointer;
|
||||
transition: all .3s ease-in-out;
|
||||
|
||||
1122
f/web-kboss/src/views/homePage/mainPage/OPC/index.vue
Normal file
1122
f/web-kboss/src/views/homePage/mainPage/OPC/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
Binary file not shown.
|
After Width: | Height: | Size: 52 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 91 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 57 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
BIN
f/web-kboss/src/views/homePage/mainPage/img/case/ocai-mascot.jpg
Normal file
BIN
f/web-kboss/src/views/homePage/mainPage/img/case/ocai-mascot.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
File diff suppressed because it is too large
Load Diff
@ -5,7 +5,7 @@
|
||||
<!-- <div class="search-box">
|
||||
<search></search>
|
||||
</div> -->
|
||||
<div style="width: 100%;">
|
||||
<div class="ncmatch-router-view">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
|
||||
@ -239,6 +239,12 @@ export default Vue.extend({
|
||||
background-color: #f6f8fd;
|
||||
}
|
||||
|
||||
.ncmatch-router-view {
|
||||
width: 100%;
|
||||
padding-top: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding: 35px 0;
|
||||
width: 100%;
|
||||
|
||||
@ -750,6 +750,7 @@ export default {
|
||||
.plaza-page {
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
padding-top: 82px;
|
||||
overflow-x: hidden;
|
||||
background: linear-gradient(180deg, #f0f7ff 0%, #ffffff 60%, #f5f8ff 100%);
|
||||
color: #1a1a1a;
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="hospital-page">
|
||||
<div class="banner">
|
||||
<img class="bg" src="./img/hospitalBanner.png" alt="">
|
||||
<div class="textBox">
|
||||
|
||||
@ -158,5 +158,9 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.train-page {
|
||||
padding-top: 82px;
|
||||
}
|
||||
|
||||
@import './train.css';
|
||||
</style>
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
<template>
|
||||
<div class="product-service-page" :class="{ 'single-product-page': isSinglePageMode }">
|
||||
<TopBox v-if="isSinglePageMode" class="single-page-topbox" />
|
||||
|
||||
<!-- 产品分类导航 -->
|
||||
<div v-if="!isSinglePageMode" class="category-nav">
|
||||
@ -228,7 +227,6 @@
|
||||
<script>
|
||||
import { reqNavList, reqNewHomeSync, reqNewHomeFestival } from "@/api/newHome";
|
||||
import { gotoYuanJingAPI } from '@/api/gotoYuanJing'
|
||||
import TopBox from '@/views/homePage/components/topBox/index.vue'
|
||||
|
||||
const getImageUrlPrefix = () => {
|
||||
const origin = window.location.origin
|
||||
@ -246,9 +244,6 @@ const getImageUrlPrefix = () => {
|
||||
|
||||
export default {
|
||||
name: "ProductServicePage",
|
||||
components: {
|
||||
TopBox
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
panelData: [],
|
||||
@ -270,7 +265,10 @@ export default {
|
||||
return this.isTokenMarketCategory(this.activeCategory);
|
||||
},
|
||||
isSinglePageMode() {
|
||||
return this.$route.path === '/tokenMarket' || this.$route.query.single === '1' || this.$route.query.single === 'true';
|
||||
return this.$route.path === '/tokenMarket' ||
|
||||
this.$route.path === '/homePage/tokenMarket' ||
|
||||
this.$route.query.single === '1' ||
|
||||
this.$route.query.single === 'true';
|
||||
},
|
||||
currentSubcategories() {
|
||||
if (!this.activeCategory || !this.panelData.length) return [];
|
||||
@ -531,7 +529,7 @@ export default {
|
||||
// 加载导航数据
|
||||
async loadNavData() {
|
||||
try {
|
||||
const response = await reqNavList({ url_link: window.location.href });
|
||||
const response = await reqNavList({ url_link: this.getNavRequestUrl() });
|
||||
if (response.status && response.data.product_service) {
|
||||
this.panelData = this.processNavData(response.data.product_service);
|
||||
}
|
||||
@ -541,6 +539,15 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
getNavRequestUrl() {
|
||||
if (!this.isSinglePageMode) {
|
||||
return window.location.href;
|
||||
}
|
||||
const baseUrl = window.location.href.split('#')[0];
|
||||
const homePath = window.location.hostname.includes('ncmatch.cn') ? '/ncmatchHome/index' : '/homePage/index';
|
||||
return `${baseUrl}#${homePath}`;
|
||||
},
|
||||
|
||||
// 处理导航数据 - 修复数据结构
|
||||
processNavData(data) {
|
||||
return data.map((category, categoryIndex) => {
|
||||
@ -897,31 +904,24 @@ export default {
|
||||
<style lang="less" scoped>
|
||||
.product-service-page {
|
||||
margin: 0 auto;
|
||||
padding: 24px;
|
||||
padding: 82px 24px 24px;
|
||||
background: #fff;
|
||||
min-height: calc(100vh - 100px);
|
||||
|
||||
&.single-product-page {
|
||||
height: 100vh;
|
||||
min-height: 100vh;
|
||||
padding: 28px;
|
||||
padding: 82px 0 0;
|
||||
background: linear-gradient(180deg, #f3f7ff 0%, #ffffff 100%);
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
|
||||
.single-page-topbox {
|
||||
width: 100vw;
|
||||
margin: -28px calc(50% - 50vw) 24px;
|
||||
}
|
||||
|
||||
.product-content {
|
||||
max-width: 1180px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.product-content {
|
||||
margin: 24px auto 0;
|
||||
padding-right: 28px;
|
||||
padding-bottom: 40px;
|
||||
padding-left: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user