|
|
@ -3,8 +3,8 @@ |
|
|
<div class="left-title d-flex align-center justify-center"> |
|
|
<div class="left-title d-flex align-center justify-center"> |
|
|
{{ list.title }} |
|
|
{{ list.title }} |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<template v-for="item in list.children"> |
|
|
<div |
|
|
<div |
|
|
v-for="item in list.children" |
|
|
|
|
|
:key="item.code" |
|
|
:key="item.code" |
|
|
class="left-nav left-child d-flex align-center justify-center" |
|
|
class="left-nav left-child d-flex align-center justify-center" |
|
|
:class="code === item.code ? 'active' : ''" |
|
|
:class="code === item.code ? 'active' : ''" |
|
|
@ -12,6 +12,18 @@ |
|
|
> |
|
|
> |
|
|
{{ item.title }} |
|
|
{{ item.title }} |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<template v-if="item.children && item.children.length && getShow(item.code)"> |
|
|
|
|
|
<div |
|
|
|
|
|
class="left-nav-child d-flex align-center justify-center" |
|
|
|
|
|
v-for="child in item.children" |
|
|
|
|
|
:class="childCode === child.code ? 'active' : ''" |
|
|
|
|
|
:key="child.code" |
|
|
|
|
|
@click="changeQuery(child.code, item.url)" |
|
|
|
|
|
> |
|
|
|
|
|
{{ child.title }} |
|
|
|
|
|
</div> |
|
|
|
|
|
</template> |
|
|
|
|
|
</template> |
|
|
</div> |
|
|
</div> |
|
|
</template> |
|
|
</template> |
|
|
<script> |
|
|
<script> |
|
|
@ -28,21 +40,44 @@ export default { |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
data() { |
|
|
data() { |
|
|
return {}; |
|
|
return { |
|
|
|
|
|
childCode: '', |
|
|
|
|
|
str: '', |
|
|
|
|
|
}; |
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
methods: { |
|
|
methods: { |
|
|
changeQuery(code, url) { |
|
|
changeQuery(code, status, url) { |
|
|
|
|
|
if (!url) { |
|
|
if (this.code && code !== this.code) { |
|
|
if (this.code && code !== this.code) { |
|
|
this.$router.push({ |
|
|
this.$router.push({ |
|
|
query: { code }, |
|
|
query: { code }, |
|
|
}); |
|
|
}); |
|
|
this.$emit('chanegCode', code); |
|
|
this.$emit('chanegCode', code); |
|
|
|
|
|
this.childCode = code; |
|
|
|
|
|
} |
|
|
} else { |
|
|
} else { |
|
|
if (url === '/') { |
|
|
if (url === '/') { |
|
|
window.open(`http://${window.location.host}`); |
|
|
window.open(`${window.location.href}`); |
|
|
|
|
|
} else { |
|
|
|
|
|
window.open(`${process.env.VUE_APP_BASE_URL + process.env.VUE_APP_PUBLIC_PATH}${url}?code=${code}`); |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
getShow(code) { |
|
|
|
|
|
if (code === this.code) { |
|
|
|
|
|
return true; |
|
|
} else { |
|
|
} else { |
|
|
window.open(`http://${window.location.host}${url}?code=${code}`); |
|
|
console.log('code: ', code); |
|
|
|
|
|
for (let i = 0; i < this.list.children.length; i++) { |
|
|
|
|
|
const item = this.list.children[i]; |
|
|
|
|
|
if (item.children && item.children.length) { |
|
|
|
|
|
for (let k = 0; k < item.children.length; k++) { |
|
|
|
|
|
if (this.code === item.children[k].code && code === item.code) { |
|
|
|
|
|
return true; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
@ -67,6 +102,16 @@ export default { |
|
|
border-bottom: 1px solid rgba(112, 112, 112, 0.1); |
|
|
border-bottom: 1px solid rgba(112, 112, 112, 0.1); |
|
|
margin-bottom: 1px; |
|
|
margin-bottom: 1px; |
|
|
} |
|
|
} |
|
|
|
|
|
.left-nav-child { |
|
|
|
|
|
width: 240px; |
|
|
|
|
|
height: 28px; |
|
|
|
|
|
border-bottom: 1px solid rgba(112, 112, 112, 0.1); |
|
|
|
|
|
margin-bottom: 1px; |
|
|
|
|
|
background-color: #f5f5f5; |
|
|
|
|
|
font-size: 16px; |
|
|
|
|
|
cursor: pointer; |
|
|
|
|
|
transition: all 0.2s; |
|
|
|
|
|
} |
|
|
.left-child { |
|
|
.left-child { |
|
|
background-color: #fff; |
|
|
background-color: #fff; |
|
|
font-size: 20px; |
|
|
font-size: 20px; |
|
|
|
