Compare commits
No commits in common. "1ae34481d79f9fbc749f4b864fb98f3e7477a36c" and "bc73b269a6e6befaeaf6777e0ef26a7a2f120a96" have entirely different histories.
1ae34481d7
...
bc73b269a6
|
@ -230,7 +230,7 @@
|
||||||
>
|
>
|
||||||
<button class="buzhou">提交</button>
|
<button class="buzhou">提交</button>
|
||||||
</a-popconfirm>
|
</a-popconfirm>
|
||||||
<button class="buzhou" v-else-if="showView === '部署与使用'" @click="submit()">
|
<button class="buzhou" v-else-if="服务商联系电话 === '部署与使用'" @click="submit()">
|
||||||
提交
|
提交
|
||||||
</button>
|
</button>
|
||||||
<button class="quxiao" @click="close()">取消</button>
|
<button class="quxiao" @click="close()">取消</button>
|
||||||
|
|
|
@ -1,34 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="wrapper">
|
<div class="wrapper">
|
||||||
<div class="nav">
|
<div class="wrapper-title-left-tree" :key="showKey">
|
||||||
<div :class="{ active: itemIndex == 1 }" @click="btnClick(1)">
|
|
||||||
<span
|
|
||||||
class="photo"
|
|
||||||
:style="{
|
|
||||||
backgroundImage: `url(${bumenImg}) `,
|
|
||||||
backgroundSize: 'cover',
|
|
||||||
}"
|
|
||||||
></span>
|
|
||||||
<span>部门</span>
|
|
||||||
</div>
|
|
||||||
<div :class="{ active: itemIndex == 2 }" @click="btnClick(2)">
|
|
||||||
<span
|
|
||||||
class="photo"
|
|
||||||
:style="{
|
|
||||||
backgroundImage: `url(${biaoqianImg}) `,
|
|
||||||
backgroundSize: 'cover',
|
|
||||||
}"
|
|
||||||
></span>
|
|
||||||
<span>标签</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div v-if="itemIndex == 1" class="wrapper-title-left-tree" :key="showKey">
|
|
||||||
<div v-for="item in treeData" :key="item.id" class="primaryNode">
|
<div v-for="item in treeData" :key="item.id" class="primaryNode">
|
||||||
<div
|
<div class="top" @click="showBottom(item)" :class="item.show ? 'topSelect' : ''">
|
||||||
class="top"
|
|
||||||
@click="showBottom(item)"
|
|
||||||
:class="item.show ? 'topSelect' : ''"
|
|
||||||
>
|
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
({{ item.channelCount }})
|
({{ item.channelCount }})
|
||||||
<DownOutlined v-show="!item.show" />
|
<DownOutlined v-show="!item.show" />
|
||||||
|
@ -36,28 +10,13 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="bottom" v-show="item.show">
|
<div class="bottom" v-show="item.show">
|
||||||
<div v-for="val in item.children" :key="val.id" class="item">
|
<div v-for="val in item.children" :key="val.id" class="item">
|
||||||
<div
|
<div class="up" :class="selectId == val.id ? 'select' : ''"
|
||||||
class="up"
|
@click="showDown(item, val), onSelect(item, val)">
|
||||||
:class="selectId == val.id ? 'select' : ''"
|
|
||||||
@click="showDown(item, val), onSelect(item, val)"
|
|
||||||
>
|
|
||||||
<div>
|
<div>
|
||||||
<svg
|
<svg t="1654068878091" class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||||||
t="1654068878091"
|
xmlns="http://www.w3.org/2000/svg" p-id="2156" width="0.25rem" height="0.25rem"
|
||||||
class="icon"
|
v-show="selectId == val.id">
|
||||||
viewBox="0 0 1024 1024"
|
<path d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z" p-id="2157" fill="#0058e1"></path>
|
||||||
version="1.1"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
p-id="2156"
|
|
||||||
width="0.25rem"
|
|
||||||
height="0.25rem"
|
|
||||||
v-show="selectId == val.id"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z"
|
|
||||||
p-id="2157"
|
|
||||||
fill="#0058e1"
|
|
||||||
></path>
|
|
||||||
</svg>
|
</svg>
|
||||||
<span class="name">{{ val.name }}({{ val.channelCount }})</span>
|
<span class="name">{{ val.name }}({{ val.channelCount }})</span>
|
||||||
</div>
|
</div>
|
||||||
|
@ -68,30 +27,13 @@
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="down" v-show="val.show">
|
<div class="down" v-show="val.show">
|
||||||
<div
|
<div v-for="child in val.children" :key="child.id" class="child"
|
||||||
v-for="child in val.children"
|
:class="selectId == child.id ? 'select2' : ''" @click="onSelect(item, child, child)">
|
||||||
:key="child.id"
|
|
||||||
class="child"
|
|
||||||
:class="selectId == child.id ? 'select2' : ''"
|
|
||||||
@click="onSelect(item, child, child)"
|
|
||||||
>
|
|
||||||
<div>
|
<div>
|
||||||
<svg
|
<svg t="1654068878091" class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||||||
t="1654068878091"
|
xmlns="http://www.w3.org/2000/svg" p-id="2156" width="0.25rem" height="0.25rem"
|
||||||
class="icon"
|
v-show="selectId == child.id">
|
||||||
viewBox="0 0 1024 1024"
|
<path d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z" p-id="2157" fill="#0058e1"></path>
|
||||||
version="1.1"
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
p-id="2156"
|
|
||||||
width="0.25rem"
|
|
||||||
height="0.25rem"
|
|
||||||
v-show="selectId == child.id"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z"
|
|
||||||
p-id="2157"
|
|
||||||
fill="#0058e1"
|
|
||||||
></path>
|
|
||||||
</svg>
|
</svg>
|
||||||
<span class="name">
|
<span class="name">
|
||||||
{{ child.name }}
|
{{ child.name }}
|
||||||
|
@ -104,20 +46,6 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="itemIndex == 2" class="wrapper-title-left-tree">
|
|
||||||
<div v-for="(item, index) in biaoqianList">
|
|
||||||
<div class="titleName">{{ item.placeTypeName }}</div>
|
|
||||||
<div class="glgkmk" v-for="(child, index) in item.children">
|
|
||||||
<div
|
|
||||||
class="glgknum"
|
|
||||||
:class="{ active: child.placeTypeCode == chooseId }"
|
|
||||||
@click="tabClick(child.placeTypeCode)"
|
|
||||||
>
|
|
||||||
{{ child.placeTypeName }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
@ -131,35 +59,29 @@ import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
setup() {
|
setup() {
|
||||||
const biaoqianList = ref([])
|
|
||||||
const bumenImg = require('@/assets/newHome/bumen.png')
|
|
||||||
const biaoqianImg = require('@/assets/newHome/biaoqian.png')
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const whoShow1 = ref(whoShow)
|
const whoShow1 = ref(whoShow)
|
||||||
const showKey = ref(0)
|
const showKey = ref(0)
|
||||||
const treeData = ref([])
|
const treeData = ref([])
|
||||||
const selectId = ref('')
|
const selectId = ref('')
|
||||||
let itemIndex = ref(1)
|
|
||||||
let chooseId = ref('')
|
|
||||||
//切换tab
|
|
||||||
const btnClick = (index) => {
|
|
||||||
itemIndex.value = index
|
|
||||||
}
|
|
||||||
//选择标签内容
|
|
||||||
const tabClick = (id) => {
|
|
||||||
chooseId.value = id
|
|
||||||
}
|
|
||||||
// 初始化
|
// 初始化
|
||||||
const init = async () => {
|
const init = async () => {
|
||||||
treeData.value = []
|
treeData.value = []
|
||||||
let select =
|
console.log(
|
||||||
router.currentRoute.value.query.select ||
|
'router.currentRoute.value.query.select',
|
||||||
DETAIL_PAGE_CONTENT_DEFAULT_TAB
|
router.currentRoute.value.query.select
|
||||||
|
)
|
||||||
|
let select = router.currentRoute.value.query.select || DETAIL_PAGE_CONTENT_DEFAULT_TAB
|
||||||
if (select === '123') {
|
if (select === '123') {
|
||||||
select = ''
|
select = ''
|
||||||
}
|
}
|
||||||
|
console.log(
|
||||||
|
'获取url中的select=====================>',
|
||||||
|
router.currentRoute.value.query.select
|
||||||
|
)
|
||||||
if (select == '基础设施') {
|
if (select == '基础设施') {
|
||||||
let res = {}
|
let res = {};
|
||||||
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
||||||
res = await getCameraAllOrgan({ parentId: 'S4NbecfYB1DBH8HNULGS34' })
|
res = await getCameraAllOrgan({ parentId: 'S4NbecfYB1DBH8HNULGS34' })
|
||||||
} else {
|
} else {
|
||||||
|
@ -168,25 +90,7 @@ export default defineComponent({
|
||||||
areaId: '70be8c5b664f4bcf869d82f2e8335051',
|
areaId: '70be8c5b664f4bcf869d82f2e8335051',
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
treeData.value = (res.data && res.data.data) || []
|
treeData.value = res.data && res.data.data || []
|
||||||
//获取标签列表=========
|
|
||||||
biaoqianList.value = [
|
|
||||||
{
|
|
||||||
placeTypeName: '政府机构',
|
|
||||||
children: [
|
|
||||||
{ placeTypeName: '行政中心', placeTypeCode: '1' },
|
|
||||||
{ placeTypeName: '行政中心', placeTypeCode: '12' },
|
|
||||||
{ placeTypeName: '行政中心', placeTypeCode: '14' },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
placeTypeName: '政府机构1',
|
|
||||||
children: [
|
|
||||||
{ placeTypeName: '行政中心', placeTypeCode: '2' },
|
|
||||||
{ placeTypeName: '行政中心', placeTypeCode: '3' },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]
|
|
||||||
// 只有一个,默认展开到二级菜单
|
// 只有一个,默认展开到二级菜单
|
||||||
if(res.data && res.data.data.length == 1) {
|
if(res.data && res.data.data.length == 1) {
|
||||||
showBottom(treeData.value[0])
|
showBottom(treeData.value[0])
|
||||||
|
@ -198,6 +102,11 @@ export default defineComponent({
|
||||||
})
|
})
|
||||||
|
|
||||||
const onSelect = async (item, val, child) => {
|
const onSelect = async (item, val, child) => {
|
||||||
|
console.log('item--------onSelect---->', item);
|
||||||
|
console.log('val------onSelect------>', val);
|
||||||
|
console.log('child-----onSelect------->', child);
|
||||||
|
mybus.emit('getCameraByParentId', val.id)
|
||||||
|
mybus.emit('getListByParentId', val.id)
|
||||||
let res = {}
|
let res = {}
|
||||||
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
||||||
res = await getCameraAllOrgan({ parentId: val.id })
|
res = await getCameraAllOrgan({ parentId: val.id })
|
||||||
|
@ -228,8 +137,8 @@ export default defineComponent({
|
||||||
})
|
})
|
||||||
|
|
||||||
const showBottom = async (item) => {
|
const showBottom = async (item) => {
|
||||||
item.show = !item.show
|
item.show = !item.show;
|
||||||
let res = {}
|
let res = {};
|
||||||
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
|
||||||
res = await getCameraAllOrgan({ parentId: item.id })
|
res = await getCameraAllOrgan({ parentId: item.id })
|
||||||
} else {
|
} else {
|
||||||
|
@ -239,17 +148,17 @@ export default defineComponent({
|
||||||
|
|
||||||
treeData.value.map((treeDataItem, index) => {
|
treeData.value.map((treeDataItem, index) => {
|
||||||
if (item.id == treeDataItem.id) {
|
if (item.id == treeDataItem.id) {
|
||||||
treeData.value[index].children = (res.data && res.data.data) || []
|
treeData.value[index].children = res.data && res.data.data || []
|
||||||
console.log('treeData.value.[index]', treeData.value[index])
|
console.log('treeData.value.[index]', treeData.value[index])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
const showDown = (item, val) => {
|
const showDown = (item, val) => {
|
||||||
selectId.value = val.id
|
selectId.value = val.id
|
||||||
console.log('item---showDown--------->', item)
|
console.log('item---showDown--------->', item);
|
||||||
console.log('val----showDown-------->', val)
|
console.log('val----showDown-------->', val);
|
||||||
if (item.children) {
|
if (item.children) {
|
||||||
val.show = !val.show
|
val.show = !val.show;
|
||||||
// 取消选中
|
// 取消选中
|
||||||
if (!val.show) {
|
if (!val.show) {
|
||||||
selectId.value = ''
|
selectId.value = ''
|
||||||
|
@ -257,19 +166,12 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
btnClick,
|
|
||||||
tabClick,
|
|
||||||
treeData,
|
treeData,
|
||||||
showKey,
|
showKey,
|
||||||
onSelect,
|
onSelect,
|
||||||
showBottom,
|
showBottom,
|
||||||
showDown,
|
showDown,
|
||||||
selectId,
|
selectId,
|
||||||
itemIndex,
|
|
||||||
bumenImg,
|
|
||||||
biaoqianImg,
|
|
||||||
biaoqianList,
|
|
||||||
chooseId,
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeUnmount() {
|
beforeUnmount() {
|
||||||
|
@ -283,67 +185,6 @@ export default defineComponent({
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.titleName {
|
|
||||||
font-size: 18px;
|
|
||||||
color: #1e1a1a;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
padding-left: 10px;
|
|
||||||
border-left: 6px solid #1296db;
|
|
||||||
}
|
|
||||||
.glgkmk {
|
|
||||||
cursor: pointer;
|
|
||||||
text-align: center;
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
width: 30%;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
.active {
|
|
||||||
color: #0058e1;
|
|
||||||
}
|
|
||||||
.glgknum {
|
|
||||||
// color: #000000;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.glgkmk :hover {
|
|
||||||
color: #0058e1;
|
|
||||||
}
|
|
||||||
.nav {
|
|
||||||
margin-bottom: 13px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
font-size: 18px;
|
|
||||||
font-family: 'Alibaba PuHuiTi';
|
|
||||||
color: #000000;
|
|
||||||
line-height: 0.32rem;
|
|
||||||
margin-bottom: 0.1rem;
|
|
||||||
|
|
||||||
.photo {
|
|
||||||
display: inline-block;
|
|
||||||
height: 0.3rem;
|
|
||||||
width: 0.3rem;
|
|
||||||
margin-right: 0.1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
div {
|
|
||||||
padding: 0 0.1rem;
|
|
||||||
cursor: pointer;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
div:hover {
|
|
||||||
color: #1296db;
|
|
||||||
}
|
|
||||||
|
|
||||||
.active {
|
|
||||||
font-weight: 600;
|
|
||||||
color: #1296db;
|
|
||||||
border-bottom: 0.02rem solid #1296db;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.primaryNode {
|
.primaryNode {
|
||||||
.top {
|
.top {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
Loading…
Reference in New Issue