Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
Y
yq-ui
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
zhaopanyu
yq-ui
Commits
a128aaf9
Commit
a128aaf9
authored
Oct 25, 2024
by
zhaopanyu
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
zpy
parent
84acaebc
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
267 additions
and
133 deletions
+267
-133
src/assets/images/new.png
+0
-0
src/views/system/cb/index.vue
+9
-3
src/views/zyyq/index.vue
+257
-130
vue.config.js
+1
-0
No files found.
src/assets/images/new.png
0 → 100644
View file @
a128aaf9
1.4 KB
src/views/system/cb/index.vue
View file @
a128aaf9
...
@@ -57,22 +57,28 @@
...
@@ -57,22 +57,28 @@
<
el
-
dialog
:
title
=
"title"
:
visible
.
sync
=
"open"
width
=
"1200px"
append
-
to
-
body
>
<
el
-
dialog
:
title
=
"title"
:
visible
.
sync
=
"open"
width
=
"1200px"
append
-
to
-
body
>
<
el
-
form
ref
=
"form"
:
model
=
"form"
:
rules
=
"rules"
label
-
width
=
"80px"
>
<
el
-
form
ref
=
"form"
:
model
=
"form"
:
rules
=
"rules"
label
-
width
=
"80px"
>
<
el
-
row
>
<
el
-
row
>
<
el
-
col
:
span
=
"
8
"
>
<
el
-
col
:
span
=
"
6
"
>
<
el
-
form
-
item
label
=
"类型"
prop
=
"fid"
>
<
el
-
form
-
item
label
=
"类型"
prop
=
"fid"
>
<
treeselect
v
-
model
=
"fid"
:
options
=
"zbOptions2"
:
normalizer
=
"normalizer"
placeholder
=
"请选择上级名称"
/>
<
treeselect
v
-
model
=
"fid"
:
options
=
"zbOptions2"
:
normalizer
=
"normalizer"
placeholder
=
"请选择上级名称"
/>
<
/el-form-item
>
<
/el-form-item
>
<
/el-col
>
<
/el-col
>
<
el
-
col
:
span
=
"8"
>
<
el
-
col
:
span
=
"6"
>
<
el
-
form
-
item
label
=
"单位"
prop
=
"remark"
>
<
el
-
input
v
-
model
=
"form.remark"
placeholder
=
"请输入单位"
/>
<
/el-form-item
>
<
/el-col
>
<
el
-
col
:
span
=
"6"
>
<
el
-
form
-
item
label
=
"名称"
prop
=
"mc"
>
<
el
-
form
-
item
label
=
"名称"
prop
=
"mc"
>
<
el
-
input
v
-
model
=
"form.mc"
placeholder
=
"请输入名称"
/>
<
el
-
input
v
-
model
=
"form.mc"
placeholder
=
"请输入名称"
/>
<
/el-form-item
>
<
/el-form-item
>
<
/el-col
>
<
/el-col
>
<
el
-
col
:
span
=
"
8
"
>
<
el
-
col
:
span
=
"
6
"
>
<
el
-
form
-
item
label
=
"排序"
prop
=
"px"
>
<
el
-
form
-
item
label
=
"排序"
prop
=
"px"
>
<
el
-
input
v
-
model
=
"form.px"
placeholder
=
"请输入排序"
/>
<
el
-
input
v
-
model
=
"form.px"
placeholder
=
"请输入排序"
/>
<
/el-form-item
>
<
/el-form-item
>
<
/el-col
>
<
/el-col
>
<
/el-row
>
<
/el-row
>
<
div
v
-
if
=
"cplx === '产品'"
>
<
div
v
-
if
=
"cplx === '产品'"
>
...
...
src/views/zyyq/index.vue
View file @
a128aaf9
...
@@ -15,9 +15,11 @@
...
@@ -15,9 +15,11 @@
</el-row>
</el-row>
<el-row
class=
"content"
style=
"background-color: #f5f8fe;"
>
<el-row
class=
"content"
style=
"background-color: #f5f8fe;"
>
<el-col
:span=
"6"
style=
"padding: 20px; border-radius: 10px; min-height: 700px; background-color: #f5f8fe;"
>
<el-col
:span=
"6"
<el-menu
:default-active=
"activeNameInner"
class=
"product-menu"
:background-color=
"'transparent'"
style=
"padding: 20px; border-radius: 10px; min-height: 712px;overflow-x: auto; background-color: #f5f8fe;"
>
:text-color=
"'#333'"
:active-text-color=
"'#409EFF'"
>
<el-menu
v-if=
"activeNameOuter === '产品'"
:default-active=
"activeNameInner"
class=
"product-menu"
:background-color=
"'transparent'"
:text-color=
"'#333'"
:active-text-color=
"'#409EFF'"
:default-openeds=
"defaultOpeneds"
>
<!-- 外层菜单 -->
<!-- 外层菜单 -->
<el-submenu
v-for=
"outerItem in collapseDataOuter"
:key=
"outerItem.px"
:index=
"outerItem.px"
<el-submenu
v-for=
"outerItem in collapseDataOuter"
:key=
"outerItem.px"
:index=
"outerItem.px"
@
click
.
native=
"setActiveOuter(outerItem.cplx)"
>
@
click
.
native=
"setActiveOuter(outerItem.cplx)"
>
...
@@ -30,8 +32,8 @@
...
@@ -30,8 +32,8 @@
</
template
>
</
template
>
<!-- 第二级菜单 -->
<!-- 第二级菜单 -->
<el-submenu
v-
if=
"outerItem.cplx === '产品'"
v-for=
"innerItem in outerItem.cpChildren"
:key=
"innerItem.id
"
<el-submenu
v-
for=
"innerItem in outerItem.cpChildren"
:key=
"innerItem.id"
:index=
"innerItem.px
"
:
index=
"innerItem.px"
:
class=
"{ 'inner-submenu-active': isInnerActive(innerItem.name) }"
:class=
"{ 'inner-submenu-active': isInnerActive(innerItem.name) }"
@
click
.
native=
"setActiveInner(innerItem.mc)"
>
@
click
.
native=
"setActiveInner(innerItem.mc)"
>
<
template
#
title
>
<
template
#
title
>
<span
<span
...
@@ -42,12 +44,11 @@
...
@@ -42,12 +44,11 @@
<!-- 第三级菜单 -->
<!-- 第三级菜单 -->
<el-menu-item
v-for=
"content in innerItem.children2"
:key=
"content.id"
<el-menu-item
v-for=
"content in innerItem.children2"
:key=
"content.id"
:index=
"innerItem.name + '-' + content.mc"
@
click
.
native=
"setActiveInner(innerItem.name, content.mc)"
:index=
"innerItem.name + '-' + content.mc"
@
click
.
native=
"handleInnerClick(innerItem.name, content.mc, content.id, content.remark)"
:class=
"{ 'menu-item-active': activeNameInner === innerItem.name + '-' + content.mc }"
>
:class=
"{ 'menu-item-active': activeNameInner === innerItem.name + '-' + content.mc }"
>
<!-- 蓝色圆点 -->
<span
<span
:style=
"{ width: '6px', height: '6px', background: '#165BFF', borderRadius: '50%', display: 'inline-block', marginRight: '10px' }"
></span>
:style=
"{ width: '6px', height: '6px', background: '#165BFF', borderRadius: '50%', display: 'inline-block', marginRight: '10px' }"
></span>
<!-- 第三级菜单文本 -->
<span
:style=
"{
<span
:style=
"{
fontFamily: 'PingFang SC',
fontFamily: 'PingFang SC',
fontWeight: '500',
fontWeight: '500',
...
@@ -59,12 +60,35 @@
...
@@ -59,12 +60,35 @@
}"
>
}"
>
{{ content.mc }}
{{ content.mc }}
</span>
</span>
<img
v-if=
"content.zx === '1'"
src=
"../../assets/images/new.png"
alt=
"new"
style=
"width: 40px; height: 40px; margin-left: 5px; vertical-align: middle;"
/>
</el-menu-item>
</el-menu-item>
</el-submenu>
</el-submenu>
</el-submenu>
</el-menu>
<el-menu
v-if=
"activeNameOuter === '服务类'"
:default-active=
"activeNameInner"
class=
"product-menu"
:background-color=
"'transparent'"
:text-color=
"'#333'"
:active-text-color=
"'#409EFF'"
:default-openeds=
"defaultOpeneds"
>
<!-- 外层菜单 -->
<el-submenu
v-for=
"outerItem in collapseDataOuter"
:key=
"outerItem.px"
:index=
"outerItem.px"
@
click
.
native=
"setActiveOuter(outerItem.cplx)"
>
<
template
#
title
>
<img
src=
"../../assets/images/tag.png"
alt=
""
>
<span
style=
"font-family: 'PingFang SC'; font-weight: 800; font-size: 23px; color: #222222; line-height: 40px;"
>
{{
outerItem
.
mc
}}
</span>
</
template
>
<!-- 服务类的第二级菜单 -->
<!-- 服务类的第二级菜单 -->
<el-menu-item
v-if=
"outerItem.cplx === '服务类'"
v-for=
"service in outerItem.fwlChildren"
:key=
"service.id"
<el-menu-item
v-for=
"service in outerItem.fwlChildren"
:key=
"service.id"
:index=
"service.mc"
:index=
"service.mc"
@
click
.
native=
"setActiveInner(outerItem.mc, service.mc)"
>
@
click
.
native=
"handleServiceClick(outerItem.mc, service.mc, service.id, service.remark)"
:class=
"{ 'menu-item-active': activeNameInner === outerItem.mc + '-' + service.mc, 'service-menu-item-active': activeNameInner === outerItem.mc + '-' + service.mc }"
>
<span
:style=
"{ width: '6px', height: '6px', background: '#165BFF', borderRadius: '50%', display: 'inline-block', marginRight: '10px' }"
></span>
<span
:style=
"{
<span
:style=
"{
fontFamily: 'PingFang SC',
fontFamily: 'PingFang SC',
fontWeight: '500',
fontWeight: '500',
...
@@ -75,79 +99,95 @@
...
@@ -75,79 +99,95 @@
textUnderlineOffset: activeNameInner === outerItem.mc + '-' + service.mc ? '8px' : '0'
textUnderlineOffset: activeNameInner === outerItem.mc + '-' + service.mc ? '8px' : '0'
}"
>
}"
>
{{ service.mc }}
{{ service.mc }}
<!-- 判断 zx 是否为 1,如果是则显示图片 -->
<img
v-if=
"service.zx === '1'"
src=
"../../assets/images/new.png"
alt=
"new"
style=
"width: 40px; height: 40px; margin-left: 5px; vertical-align: middle;"
/>
</span>
</span>
</el-menu-item>
</el-menu-item>
</el-submenu>
</el-submenu>
</el-menu>
</el-menu>
</el-col>
</el-col>
<!-- 显示选项卡的内容 -->
<!-- 显示选项卡的内容 -->
<el-col
v-if=
"activeNameOuter === '产品'"
:span=
"18"
<el-col
v-if=
"activeNameOuter === '产品'"
:span=
"18"
style=
"border-radius: 10px; min-height: 700px; background-color: #f5f8fe;"
>
style=
"border-radius: 10px; min-height: 730px; background-color: #f5f8fe;"
>
<el-tabs
v-model=
"activeName"
@
tab-click=
"handleClick"
type=
"card"
class=
"custom-tabs"
>
<div
class=
"tabs"
>
<el-tab-pane
label=
"产品简介"
name=
"first"
:class=
"{ 'custom-active1': activeName === 'first' }"
>
<el-tabs
v-model=
"activeName"
@
tab-click=
"handleClick"
type=
"card"
class=
"custom-tabs"
>
<el-card
style=
"width: 100%; min-height: 712px;"
>
<el-tab-pane
label=
"产品简介"
name=
"first"
:class=
"{ 'custom-active1': activeName === 'first' }"
>
<div
v-html=
"`<style>
<el-card
style=
"width: 100%; height: 712px; overflow-y: auto;"
>
.table-container table { border: 1px solid #888; border-collapse: collapse; }
<div
v-html=
"`<style>
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
.table-container table { border: 1px solid #888; border-collapse: collapse; }
</style>${cpjj}`"
></div>
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
</el-card>
</style>${cpjj}`"
></div>
</el-tab-pane>
</el-card>
<el-tab-pane
label=
"功能特点"
name=
"second"
:class=
"{ 'custom-active2': activeName === 'second' }"
>
</el-tab-pane>
<el-card
style=
"width: 100%; min-height: 712px;"
>
<el-tab-pane
label=
"功能特点"
name=
"second"
:class=
"{ 'custom-active2': activeName === 'second' }"
>
<div
v-html=
"`<style>
<el-card
style=
"width: 100%; height: 712px; overflow-y: auto;"
>
.table-container table { border: 1px solid #888; border-collapse: collapse; }
<div
v-html=
"`<style>
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
.table-container table { border: 1px solid #888; border-collapse: collapse; }
</style>${gntd}`"
></div>
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
</el-card>
</style>${gntd}`"
></div>
</el-tab-pane>
</el-card>
<el-tab-pane
label=
"应用成效"
name=
"third"
:class=
"{ 'custom-active3': activeName === 'third' }"
>
</el-tab-pane>
<el-card
style=
"width: 100%; min-height: 712px;"
>
<el-tab-pane
label=
"应用成效"
name=
"third"
:class=
"{ 'custom-active3': activeName === 'third' }"
>
<div
v-html=
"`<style>
<el-card
style=
"width: 100%; height: 712px; overflow-y: auto;"
>
.table-container table { border: 1px solid #888; border-collapse: collapse; }
<div
v-html=
"`<style>
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
.table-container table { border: 1px solid #888; border-collapse: collapse; }
</style>${yycx}`"
></div>
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
</el-card>
</style>${yycx}`"
></div>
</el-tab-pane>
</el-card>
<el-tab-pane
label=
"用法介绍"
name=
"fourth"
:class=
"{ 'custom-active4': activeName === 'fourth' }"
>
</el-tab-pane>
<el-card
style=
"width: 100%; height: 712px;"
>
<el-tab-pane
label=
"用法介绍"
name=
"fourth"
:class=
"{ 'custom-active4': activeName === 'fourth' }"
>
<div
v-html=
"`<style>
<el-card
style=
"width: 100%; height: 712px; overflow-y: auto;"
>
.table-container table { border: 1px solid #888; border-collapse: collapse; }
<div
v-html=
"`<style>
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
.table-container table { border: 1px solid #888; border-collapse: collapse; }
</style>${yfjs}`"
></div>
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
</el-card>
</style>${yfjs}`"
></div>
</el-tab-pane>
</el-card>
</el-tabs>
</el-tab-pane>
</el-tabs>
<div
class=
"remark"
>
<h2>
{{ this.remark }}
</h2>
</div>
</div>
</el-col>
</el-col>
<!-- 外层折叠项 2 选中的内容 -->
<!-- 外层折叠项 2 选中的内容 -->
<el-col
v-else-if=
"activeNameOuter === '服务类'"
:span=
"18"
<el-col
v-else-if=
"activeNameOuter === '服务类'"
:span=
"18"
style=
"border-radius: 10px; min-height: 700px; background-color: #f5f8fe;"
>
style=
"border-radius: 10px; min-height: 700px; background-color: #f5f8fe;"
>
<el-tabs
v-model=
"activeName"
@
tab-click=
"handleClick"
type=
"card"
class=
"custom-tabs"
>
<div
class=
"tabs"
>
<el-tab-pane
label=
"团队介绍"
name=
"first"
>
<el-tabs
v-model=
"activeName"
@
tab-click=
"handleClick"
type=
"card"
class=
"custom-tabs"
>
<el-card
style=
"width: 100%; min-height: 712px;"
>
<el-tab-pane
label=
"团队介绍"
name=
"first"
>
<div
v-html=
"`<style>
<el-card
style=
"width: 100%; height: 712px; overflow-y: auto;"
>
<div
v-html=
"`<style>
.table-container table { border: 1px solid #888; border-collapse: collapse; }
.table-container table { border: 1px solid #888; border-collapse: collapse; }
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
</style>${tdjs}`"
></div>
</style>${tdjs}`"
></div>
</el-card>
</el-card>
</el-tab-pane>
</el-tab-pane>
<el-tab-pane
label=
"服务特色"
name=
"second"
>
<el-tab-pane
label=
"服务特色"
name=
"second"
>
<el-card
style=
"width: 100%; min-height: 712px
;"
>
<el-card
style=
"width: 100%; height: 712px; overflow-y: auto
;"
>
<div
v-html=
"`<style>
<div
v-html=
"`<style>
.table-container table { border: 1px solid #888; border-collapse: collapse; }
.table-container table { border: 1px solid #888; border-collapse: collapse; }
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
</style>${fwts}`"
></div>
</style>${fwts}`"
></div>
</el-card>
</el-card>
</el-tab-pane>
</el-tab-pane>
<el-tab-pane
label=
"服务案例"
name=
"third"
>
<el-tab-pane
label=
"服务案例"
name=
"third"
>
<el-card
style=
"width: 100%; min-height: 712px
;"
>
<el-card
style=
"width: 100%; height: 712px; overflow-y: auto
;"
>
<div
v-html=
"`<style>
<div
v-html=
"`<style>
.table-container table { border: 1px solid #888; border-collapse: collapse; }
.table-container table { border: 1px solid #888; border-collapse: collapse; }
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
.table-container table tbody tr td { border: 1px solid #999; padding: 8px; text-align: left; }
</style>${fwal}`"
></div>
</style>${fwal}`"
></div>
</el-card>
</el-card>
</el-tab-pane>
</el-tab-pane>
</el-tabs>
</el-tabs>
<div
class=
"remark"
>
<h2>
{{ this.remark }}
</h2>
</div>
</div>
</el-col>
</el-col>
</el-row>
</el-row>
...
@@ -161,6 +201,9 @@ export default {
...
@@ -161,6 +201,9 @@ export default {
// components: { footerNav },
// components: { footerNav },
data
()
{
data
()
{
return
{
return
{
remark
:
''
,
// 新增的remark属性
defaultOpeneds
:
[],
// 根据需要初始化 defaultOpeneds
selectedId
:
null
,
// 用于存储选中项的ID
cpjj
:
''
,
cpjj
:
''
,
gntd
:
''
,
gntd
:
''
,
yycx
:
''
,
yycx
:
''
,
...
@@ -168,44 +211,9 @@ export default {
...
@@ -168,44 +211,9 @@ export default {
tdjs
:
''
,
tdjs
:
''
,
fwts
:
''
,
fwts
:
''
,
fwal
:
''
,
fwal
:
''
,
activeNameOuter
:
""
,
// 默认选中的第一级选项
activeNameOuter
:
"
产品
"
,
// 默认选中的第一级选项
activeNameInner
:
""
,
// 默认选中的第二级选项
activeNameInner
:
""
,
// 默认选中的第二级选项
collapseDataOuter
:
[],
collapseDataOuter
:
[],
// collapseDataOuter: [
// {
// name: "outer1",
// title: "外层折叠项 1",
// collapseData: [
// {
// name: "1",
// title: "智能化办公",
// contents: ["大模型", "会议系统", "数字员工"],
// },
// {
// name: "2",
// title: "生产化信息",
// contents: ["大模型", "哈哈哈哈", "嘻嘻嘻嘻"],
// },
// ],
// },
// {
// name: "outer2",
// title: "外层折叠项 2",
// collapseData: [
// {
// name: "3",
// title: "基础设施",
// contents: ["999", "777", "666"],
// },
// {
// name: "4",
// title: "其他",
// contents: ["内容1", "内容2", "内容3"],
// },
// ],
// },
// ],
// -------------
activeName
:
"first"
,
activeName
:
"first"
,
name
:
null
,
name
:
null
,
ipdz
:
null
,
ipdz
:
null
,
...
@@ -220,38 +228,120 @@ export default {
...
@@ -220,38 +228,120 @@ export default {
computed
:
{},
computed
:
{},
mounted
()
{
mounted
()
{
this
.
getList
();
this
.
getList
();
this
.
setDefaultActiveMenu
();
//
this.setDefaultActiveMenu();
},
},
methods
:
{
methods
:
{
setDefaultActiveMenu
()
{
if
(
this
.
collapseDataOuter
.
length
>
0
)
{
setActiveOuter
(
cplx
)
{
const
firstOuterItem
=
this
.
collapseDataOuter
.
find
(
item
=>
item
.
mc
===
"软硬件产品"
);
// 找到目标外层菜单项
this
.
activeNameOuter
=
cplx
;
// 设置选中的外层菜单类型
if
(
firstOuterItem
)
{
this
.
activeNameInner
=
''
;
// 清空内层选中的状态
const
firstInnerItem
=
firstOuterItem
.
cpChildren
.
find
(
inner
=>
inner
.
name
===
"智能化办公"
);
// 找到目标内层菜单项
if
(
firstInnerItem
&&
firstInnerItem
.
children2
.
length
>
0
)
{
// 查找对应的外层菜单项
this
.
activeNameInner
=
`
${
firstInnerItem
.
name
}
-
${
firstInnerItem
.
children2
[
0
].
mc
}
`
;
// 默认选中第一个内容
const
selectedOuterItem
=
this
.
collapseDataOuter
.
find
(
item
=>
item
.
cplx
===
cplx
);
if
(
selectedOuterItem
)
{
// 处理产品类型的情况
if
(
cplx
===
'产品'
)
{
if
(
selectedOuterItem
.
cpChildren
&&
selectedOuterItem
.
cpChildren
.
length
>
0
)
{
const
firstInnerItem
=
selectedOuterItem
.
cpChildren
[
0
];
const
firstContent
=
firstInnerItem
.
children2
&&
firstInnerItem
.
children2
[
0
];
// 确保存在内容
if
(
firstContent
)
{
this
.
setActiveInner
(
firstInnerItem
.
name
,
firstContent
.
mc
,
firstContent
.
id
,
firstContent
.
zx
);
// 传递 zx
this
.
displaySelectedInfo
(
firstInnerItem
.
name
,
firstContent
);
// 展示选中的信息
}
}
}
else
if
(
cplx
===
'服务类'
)
{
if
(
selectedOuterItem
.
fwlChildren
&&
selectedOuterItem
.
fwlChildren
.
length
>
0
)
{
const
firstService
=
selectedOuterItem
.
fwlChildren
[
0
];
// 默认选中第一个服务
this
.
setActiveInner
(
selectedOuterItem
.
mc
,
firstService
.
mc
,
null
,
firstService
.
id
,
firstService
.
zx
);
// 传递 zx
this
.
displaySelectedInfo
(
selectedOuterItem
.
mc
,
firstService
);
// 展示选中的信息
}
}
}
}
console
.
log
(
'默认选中项:'
,
this
.
activeNameInner
);
// 检查默认选中项
// 设置展开的菜单项
this
.
defaultOpeneds
=
[
selectedOuterItem
.
px
];
// 展开外层菜单
}
}
},
},
isInnerActive
(
name
)
{
// 判断内层菜单项激活状态的逻辑
displaySelectedInfo
(
menuName
,
content
)
{
return
this
.
activeNameInner
.
startsWith
(
name
);
// 在这里更新展示选中的内容的信息
// 你可以根据需要展示的内容更新相应的数据属性
this
.
selectedMenuName
=
menuName
;
// 例如设置当前选中的菜单名称
this
.
selectedContent
=
content
;
// 设置当前选中的内容
// 其他逻辑,例如更新界面中的某些元素的显示
},
},
getList
()
{
getListcx
().
then
(
res
=>
{
console
.
log
(
'res'
,
res
);
this
.
collapseDataOuter
=
res
.
data
;
// 获取数据后,设置默认选中的第一个外层和内层菜单项
if
(
this
.
collapseDataOuter
.
length
>
0
)
{
const
firstOuterItem
=
this
.
collapseDataOuter
[
0
];
this
.
activeNameOuter
=
firstOuterItem
.
cplx
;
if
(
firstOuterItem
.
cpChildren
&&
firstOuterItem
.
cpChildren
.
length
>
0
)
{
const
firstInnerItem
=
firstOuterItem
.
cpChildren
[
0
];
const
firstContent
=
firstInnerItem
.
children2
[
0
];
// 假设有第三级菜单内容
// 默认选中第一项
this
.
setActiveInner
(
firstInnerItem
.
mc
,
firstContent
.
mc
,
firstContent
.
id
);
// 设置展开的菜单项
this
.
defaultOpeneds
=
[
firstOuterItem
.
px
,
firstInnerItem
.
px
];
// 外层和内层菜单都展开
}
}
});
},
setActiveOuter
(
cplx
)
{
setActiveOuter
(
cplx
)
{
this
.
activeNameOuter
=
cplx
;
this
.
activeNameOuter
=
cplx
;
console
.
log
(
this
.
activeNameOuter
,
' this.activeNameOuter'
);
console
.
log
(
'Outer menu set to:'
,
this
.
activeNameOuter
);
},
handleInnerClick
(
innerName
,
contentName
,
contentId
)
{
this
.
activeNameInner
=
`
${
innerName
}
-
${
contentName
}
`
;
// 处理内容相关的逻辑,比如获取内容等
this
.
getListdt
(
contentId
);
},
handleServiceClick
(
outerName
,
serviceName
,
serviceId
)
{
this
.
activeNameInner
=
`
${
outerName
}
-
${
serviceName
}
`
;
// 处理服务相关的逻辑,比如获取内容等
this
.
getListdt
(
serviceId
);
},
},
setActiveInner
(
innerName
,
content
=
''
)
{
setActiveInner
(
innerName
,
content
=
''
,
id
=
null
)
{
if
(
content
)
{
if
(
content
)
{
this
.
activeNameInner
=
innerName
+
'-'
+
content
;
this
.
activeNameInner
=
`
${
innerName
}
-
${
content
}
`
;
console
.
log
(
'activeNameInner updated to:'
,
this
.
activeNameInner
);
// 调试打印
console
.
log
(
this
.
activeNameInner
,
'this.activeNameInner'
);
this
.
selectedId
=
id
;
// 更新选中项的ID
console
.
log
(
'activeNameInner updated to:'
,
this
.
activeNameInner
);
this
.
getListdt
(
this
.
selectedId
);
// 获取内容数据
}
}
},
},
getListdt
(
id
)
{
// 假设你的getListdt接口是一个异步函数
getListdt
(
id
).
then
(
res
=>
{
console
.
log
(
'12222:'
,
res
.
data
.
remark
);
this
.
cpjj
=
res
.
data
.
cpjj
this
.
gntd
=
res
.
data
.
gntd
this
.
yycx
=
res
.
data
.
yycx
this
.
yfjs
=
res
.
data
.
yfjs
this
.
tdjs
=
res
.
data
.
tdjs
this
.
fwts
=
res
.
data
.
fwts
this
.
fwal
=
res
.
data
.
fwal
this
.
remark
=
res
.
data
.
remark
// 在这里处理返回的数据
}).
catch
(
error
=>
{
console
.
error
(
'Error fetching data:'
,
error
);
});
},
isInnerActive
(
innerName
)
{
isInnerActive
(
innerName
)
{
return
this
.
activeNameInner
.
startsWith
(
innerName
);
// 判断是否为活动状态
return
this
.
activeNameInner
.
startsWith
(
innerName
);
// 判断是否为活动状态
...
@@ -263,16 +353,6 @@ export default {
...
@@ -263,16 +353,6 @@ export default {
this
.
activeName
=
tab
.
name
;
// 确保更新activeName
this
.
activeName
=
tab
.
name
;
// 确保更新activeName
console
.
log
(
this
.
activeName
,
' this.activeName'
);
console
.
log
(
this
.
activeName
,
' this.activeName'
);
},
},
getList
()
{
getListcx
().
then
(
res
=>
{
console
.
log
(
'res'
,
res
)
this
.
collapseDataOuter
=
res
.
data
;
// this.cpjj = res.data.bmjjwh
// this.gntd = res.data.zzld
// this.yycx = res.data.sjglry
// this.yfjs = res.data.sjglry
})
},
...
@@ -283,6 +363,53 @@ export default {
...
@@ -283,6 +363,53 @@ export default {
</
script
>
</
script
>
<
style
scoped
lang=
"scss"
>
<
style
scoped
lang=
"scss"
>
::v-deep
.tabs
{
display
:
flex
;
align-items
:
flex-start
;
}
::v-deep
.custom-tabs
{
flex-grow
:
1
;
//
padding-right
:
10px
}
::v-deep
.remark
{
position
:
absolute
;
top
:
5px
;
/* 向上移动 */
right
:
30px
;
/* 向左移动 */
white-space
:
nowrap
;
font-size
:
18px
;
font-weight
:
bold
;
}
::v-deep
.menu-item-active
{
background-color
:
#ffffff
;
/* 选中项背景白色 */
}
::v-deep
.related-menu-item-active
{
background-color
:
#ffffff
;
/* 兄弟项背景白色 */
}
::v-deep
.service-menu-item-active
{
background-color
:
#ffffff
!important
;
//
服务类选中项背景色为白色
}
::v-deep
img
{
max-width
:
90%
!important
;
height
:
auto
!important
;
}
::v-deep
video
{
max-width
:
90%
!important
;
height
:
auto
!important
;
}
::v-deep
.rounded-corner-start
{
::v-deep
.rounded-corner-start
{
border-radius
:
10px
0
0
0
!important
;
border-radius
:
10px
0
0
0
!important
;
}
}
...
@@ -321,10 +448,10 @@ export default {
...
@@ -321,10 +448,10 @@ export default {
text-align
:
center
;
text-align
:
center
;
}
}
::v-deep
.el-tabs
.el-tabs__header.el-tabs__nav
.el-tabs__item
{
//
::v-deep
.el-tabs
.el-tabs__header.el-tabs__nav
.el-tabs__item
{
color
:
#ff0000
;
//
color
:
#ff0000
;
/* 设置字体颜色 */
//
/* 设置字体颜色 */
}
//
}
::v-deep
.el-tabs--card
>
.el-tabs__header
.el-tabs__nav
{
::v-deep
.el-tabs--card
>
.el-tabs__header
.el-tabs__nav
{
border
:
1px
none
;
border
:
1px
none
;
...
...
vue.config.js
View file @
a128aaf9
...
@@ -37,6 +37,7 @@ module.exports = {
...
@@ -37,6 +37,7 @@ module.exports = {
[
process
.
env
.
VUE_APP_BASE_API
]:
{
[
process
.
env
.
VUE_APP_BASE_API
]:
{
// target: `http://localhost:8080`,
// target: `http://localhost:8080`,
// target: `http://192.168.31.190:8899`,
// target: `http://192.168.31.190:8899`,
// target: `http://192.168.31.95:8081`,
target
:
`http://192.168.31.95:8081`
,
target
:
`http://192.168.31.95:8081`
,
changeOrigin
:
true
,
changeOrigin
:
true
,
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment