1029 lines
33 KiB
Vue
1029 lines
33 KiB
Vue
<template>
|
||
<div class="top">
|
||
<div class="left">
|
||
<a-checkbox v-model:checked="checkAll" @change="onCheckAllChange">
|
||
全选
|
||
</a-checkbox>
|
||
<!-- <div @click="reverseSelection" class="reverseSelection">反选</div> -->
|
||
<p>
|
||
已选：
|
||
<span class="num">{{ checkedListAbility.length || 0 }}</span>
|
||
</p>
|
||
</div>
|
||
<div class="right">
|
||
<div class="sousuokuang">
|
||
<a-input-search v-model:value="name" placeholder="请输入关键词" enter-button="搜索" size="large"
|
||
@search="getList('init')" />
|
||
</div>
|
||
<a-popconfirm v-if="checkedListAbility.length != 0" title="是否进行批量删除?" ok-text="是" cancel-text="否"
|
||
@confirm="handleDelete" @cancel="cancel">
|
||
<a-button type="primary" class="collect-btn" @click="ceshiFunction()">
|
||
批量删除
|
||
</a-button>
|
||
</a-popconfirm>
|
||
<a-button v-else type="primary" class="collect-btn" @click="ceshiFunction()">
|
||
批量删除
|
||
</a-button>
|
||
<a-button type="primary" v-if="!itShowXiHaiAn" class="collect-btn" @click="collection">
|
||
批量收藏
|
||
</a-button>
|
||
<a-button type="primary" class="apply-btn" @click="apply">
|
||
一键申请
|
||
</a-button>
|
||
</div>
|
||
</div>
|
||
<div class="items" :key="showKey">
|
||
<div class="item" v-for="(val, valIndex) in list" :key="val.id">
|
||
<div class="item-top" @click="showBottom(val)">
|
||
<div>
|
||
<a-checkbox :checked="val.checked" @click.stop="checkedDept(val)"></a-checkbox>
|
||
<span style="margin-left: 0.2rem" v-if="itShowXiHaiAn">
|
||
{{ val.deptName}}
|
||
</span>
|
||
<span style="margin-left: 0.2rem" v-else>
|
||
{{ val.deptName + '(' + val.count + ')' }}
|
||
</span>
|
||
</div>
|
||
<DownOutlined v-show="!val.show" />
|
||
<UpOutlined v-show="val.show" />
|
||
</div>
|
||
<div class="item-bottom" v-show="val.show">
|
||
<a-list class="demo-loadmore-list" :loading="val.initLoading" item-layout="horizontal"
|
||
:data-source="val.children">
|
||
<template #renderItem="{ item }">
|
||
<a-list-item>
|
||
<a-skeleton avatar :title="false" :loading="item.loading" active>
|
||
<a-list-item-meta :description="
|
||
item.description ||
|
||
(item.note1 && JSON.parse(item.note1) &&
|
||
JSON.parse(item.note1)[0] &&
|
||
JSON.parse(item.note1)[0].channelName +
|
||
'等' +
|
||
JSON.parse(item.note1).length +
|
||
'个摄像头') ||
|
||
''
|
||
" style="position: relative">
|
||
<template #title>
|
||
<div>
|
||
<a-tooltip>
|
||
<template #title>{{ item.resourceName }}</template>
|
||
<span @click="
|
||
showItem(
|
||
item.resourceId,
|
||
item.type,
|
||
item.delFlag,
|
||
item.note1
|
||
)
|
||
" style="cursor: pointer" class="name">
|
||
{{ item.resourceName }}
|
||
</span>
|
||
</a-tooltip>
|
||
<span class="type">{{ item.type }}</span>
|
||
</div>
|
||
<!-- // todo -->
|
||
<span class="time">
|
||
<span v-if="!itShowXiHaiAn">加购时间:{{ item.time }}</span>
|
||
<a-popconfirm title="是否删除该记录?" ok-text="是" cancel-text="否" @confirm="handleDelete(item, valIndex)"
|
||
@cancel="cancel">
|
||
<a-button type="primary" style="
|
||
width: 0.7rem;
|
||
height: 0.3rem;
|
||
margin-left: 0.12rem;
|
||
border-radius: 2px;
|
||
background: #fff;
|
||
color: #0558e1;
|
||
" @click="del">
|
||
删除
|
||
</a-button>
|
||
</a-popconfirm>
|
||
</span>
|
||
<svg t="1652233950228" class="icon" viewBox="0 0 1024 1024" version="1.1"
|
||
xmlns="http://www.w3.org/2000/svg" p-id="5970" data-spm-anchor-id="a313x.7781069.0.i8" width="50"
|
||
height="50" v-if="item.delFlag == 4 || item.delFlag == 5"
|
||
style="position: absolute; top: 0; left: 1rem">
|
||
<path
|
||
d="M955.22053 256C813.82053 11.2 500.72053-72.6 255.92053 68.8S-72.67947 523.2 68.72053 768 523.22053 1096.6 768.02053 955.2c244.7-141.2 328.6-454.1 187.4-698.8 0-0.1-0.1-0.3-0.2-0.4zM762.02053 944.7c-239 138.1-544.8 56.2-682.9-182.8S22.92053 217.1 261.92053 79.1s544.8-56.2 682.9 182.8c137.9 239 56.1 544.6-182.8 682.8z"
|
||
fill="#515151" opacity=".5" p-id="5971"></path>
|
||
<path
|
||
d="M898.12053 289.2C775.02053 76 502.42053 2.9 289.22053 126 76.02053 249.1 3.02053 521.6 126.02053 734.8 249.12053 948 521.62053 1021.1 734.82053 898 947.92053 774.9 1021.02053 502.4 898.12053 289.2zM731.62053 892.8C521.32053 1014.3 252.42053 942.2 131.02053 731.9 9.52053 521.6 81.62053 252.7 291.92053 131.3 502.12053 9.9 771.02053 81.8 892.42053 292c121.5 210.3 49.5 479.3-160.8 600.8z"
|
||
fill="#515151" opacity=".5" p-id="5972"></path>
|
||
<path
|
||
d="M323.62053 176.8c3.6-2 6 0.8 8.8 2.8 6 4.4 12.4 8.8 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 13.6-5.6 20.8 4.8 6 10 11.6 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.4 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.4-1.9-3.9-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.7-0.8-0.3-1.6 0.6-2zM200.72053 289.2c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 13.6-5.6 20.8 4.8 6 10 11.6 14.8 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.4-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5c-8.4-2-16.8-4.4-25.2-6.4-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 3.6-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.4-1.2 0-1.6 0.8-2.4l0.2 0.4z m276.6-159.6c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 14-5.6 20.8 4.8 6 10 12 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.8-1.2-0.4-1.6 0.4-2.4l0.2 0.4z m141.9 29.6c3.6-2 6 0.8 8.8 2.8l18.8 12.8c7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-3.6 14-5.6 20.8 4.8 6 10 12 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4-7.7 0.4-15.2 0.8-22.4 0.8-4.4 6.8-8.4 13.2-12.8 20-1.6 2.4-4 5.1-7.2 4-2.4-1.9-3.9-4.7-4.4-7.7l-7.2-20.5c-8.4-2-16.8-4.4-25.2-6.4-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 4-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.5-1.2 0.2-1.6 0.6-2zM150.02053 430c3.6-2 6 0.8 8.8 2.8 6.4 4.4 12.4 8.4 18.8 12.8 7.2-2.4 14.4-5.1 21.6-7.7 3.6-1.2 6-2.8 8.8 0.4 2.4 2.8 0.4 6.4-0.4 8.8-2 6.8-4 14-5.6 20.8 4.8 6 10 11.6 15.2 17.6 2.4 2.8 4.4 5.6 2.8 8.4-1.2 2.8-5.6 2.4-7.7 2.4l-22.4 0.8c-4.4 6.8-8.8 13.6-12.8 20-1.6 2.4-4 5.1-7.2 4-2.2-2-3.8-4.7-4.4-7.7l-7.2-20.5-25.2-6.4c-2.3-1.2-3.6-3.8-3.2-6.4 1.3-1.8 2.9-3.3 4.8-4.4 3.6-3.2 7.7-6.8 11.6-10 1.9-1.3 3.6-2.7 5.1-4.4-0.4-6.8-1.2-13.6-1.6-20.5-0.7-2.9-0.9-5.9-0.4-8.8-0.7-0.8-0.3-1.5 0.6-2z m558.9 414.4c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.1 4.4-0.7 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.5-1.1 0.8-1.1 1.6-1.1h0.1z m-158.8 50c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.1-3.7-5.6-3.6-7.7-4-6.8-1.6-14-3.6-20.8-5.6l-7.7-22c-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2-1 4.2-1.7 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.4-0.8 0.8-0.8 1.7-0.7z m276.5-159.6c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8s-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.2 4.4-0.7 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0-0.8 0.8-1.2 1.6-1.2l0.1 0.1z m45.6-137.6c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-1.6-14-3.6-20.8-5.6l-7.7-22c-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.2-0.7 0.6-0.7 1.4-0.7h0.3zM402.72053 868c3.6-2.4 2.4-5.6 2-8.8l-1.6-22.4 17.2-14.8c2.8-2.4 5.1-4 4-7.7-1.2-3.2-5.6-3.6-7.7-4-6.8-2-14-3.6-20.8-5.6-2.8-7.2-5.1-14.4-7.7-21.6-1.2-3.6-2.8-6.4-5.6-6.8-2.8-0.4-4.8 3.6-5.6 5.1l-12 19.2-24 1.2c-2.8 0-6.8 0.8-6.8 4.4 0.5 3 2 5.7 4.4 7.7 4.8 5.6 9.2 11.2 14 16.4l-7.2 25.2c-0.3 2.7 1.4 5.2 4 6 2.2-0.3 4.3-0.9 6.4-1.6l14.4-4.8c2.1-0.8 4.2-1.5 6.4-2 5.6 4 11.2 7.7 16.8 11.6 2.2 2.1 4.8 3.6 7.7 4.4 0.5-0.8 1-1.1 1.7-1.1z"
|
||
fill="#515151" opacity=".5" p-id="5973"></path>
|
||
<path
|
||
d="M386.42053 590.4l-43.8-75.9L207.02053 592.7l10.2 17.7L334.02053 543l23.4 40.4-90.5 52.2-13.5-23.4-18.7 10.8 53.1 92c9.1 15.8 21.2 19.5 36.4 10.7l98.8-57c6.2-3.6 11-9.3 13.4-16.1-1.4-15.9-6.2-31.2-14.2-45l-21.4 4.8c6.7 10.3 11 21.9 12.8 34-1 3.3-3.2 6-6.1 7.8l-88.3 51c-6.2 3.6-11.1 2.1-14.8-4.3l-27.3-47.4 109.3-63.1z m2.9-103.2l10.4 18.1 65.6-37.9 79.9 138.4 18.6-10.8-55.9-96.9c18.8-0.9 43.2-0.6 73 0.7l1.5-23.1c-29.8-0.3-58.4 0.4-86 2.6l-12.5-21.6 74.9-43.2-10.4-18.1-159.1 91.8zM669.52053 329l38.2 66.2 61.4-35.4-38.1-66.1-61.5 35.3z m72.4 24.2l-26.3 15.2-19-33 26.3-15.2 19 33zM599.02053 356.7l7.9 13.7-23.3 13.5 9.8 17 21.8-12.6c7.5 18.7 6.6 39.6-2.5 57.6l20.7 4.4c10.3-23.1 10.3-49.4 0-72.5l18.8-10.9c6 9.2 10.7 19.2 14.2 29.7 0.3 5-2.6 9.7-7.2 11.7-2.9 1.2-6.4 2.8-10.9 4.9l14.1 14.1c3.7-1.3 7.3-2.9 10.7-4.8 8.6-3.9 14.4-12.2 15.2-21.6-5.4-22.1-14.6-43-27.4-61.8l-36.1 20.8-7.9-13.7-17.9 10.5z m29.9 108.1l10 17.4 53.2-30.7c-7.8 23.7-20.6 45.4-37.5 63.6l20.6 11.1c18.6-24.2 30-53.1 33-83.4l29.8 51.5 18.4-10.7-29.8-51.5c27.4 11.5 57.2 16.3 86.9 14.1l3.5-23.5c-24.7 5.1-50.1 5-74.8-0.1l53.5-30.9-10-17.3-69.3 40-7.3-12.6-18.4 10.7L698.02053 425l-69.1 39.8z"
|
||
fill="#515151" opacity=".5" p-id="5974"></path>
|
||
</svg>
|
||
</template>
|
||
<template #avatar>
|
||
<a-checkbox :checked="item.checked" @click.stop="checkedItem(val, item)"></a-checkbox>
|
||
<div class="tx" v-if="!itShowXiHaiAn" :class="
|
||
item.type == '基础设施'
|
||
? 'sxt'
|
||
: item.type == '应用资源'
|
||
? 'yyzy'
|
||
: item.componentType == '智能算法'
|
||
? 'znsf'
|
||
: item.componentType == '图层服务'
|
||
? 'tcfw'
|
||
: item.componentType == '开发组件'
|
||
? 'kfzj'
|
||
: item.componentType == '业务组件'
|
||
? 'ywzj'
|
||
: ''
|
||
"></div>
|
||
</template>
|
||
</a-list-item-meta>
|
||
</a-skeleton>
|
||
</a-list-item>
|
||
</template>
|
||
</a-list>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<a-modal v-model:visible="videoVisible" title="已申请摄像头列表" @ok="videoVisible = false">
|
||
<a-table :columns="columns" :data-source="xVideoList" bordered :pagination="{ defaultPageSize: 6 }">
|
||
<template #bodyCell="{ column, text }">
|
||
<!-- <template>
|
||
<a>{{ text }}</a>
|
||
</template> -->
|
||
</template>
|
||
</a-table>
|
||
</a-modal>
|
||
|
||
</template>
|
||
<script setup>
|
||
import { onMounted, ref } from 'vue'
|
||
import { UpOutlined, DownOutlined } from '@ant-design/icons-vue'
|
||
import { useRouter } from 'vue-router'
|
||
import { message } from 'ant-design-vue'
|
||
import mybus from '@/myplugins/mybus'
|
||
import {
|
||
sgcDel,
|
||
scInsert,
|
||
selectResourceCarGroupByDept,
|
||
selectResourceListByDept,
|
||
selectResourceListByDeptName,
|
||
} from '@/api/personalCenter'
|
||
const router = useRouter()
|
||
// 分页
|
||
const pageNum = ref('1')
|
||
const pageSize = ref('99999')
|
||
const videoVisible = ref(false)
|
||
const xVideoList = ref([])
|
||
const total = ref(0)
|
||
const load = ref(0)
|
||
// 多选框
|
||
const checkedList = ref([])
|
||
const checkedListAll = ref([])
|
||
const checkedListAbility = ref([])
|
||
const checkAll = ref(false)
|
||
const checkNum = ref(0)
|
||
const showKey = ref(0)
|
||
const columns = ref([
|
||
{
|
||
title: '摄像头名称',
|
||
dataIndex: 'name',
|
||
},
|
||
])
|
||
// 筛选条件
|
||
const name = ref('')
|
||
const type = ref('')
|
||
const list = ref([])
|
||
const itShowXiHaiAn = ref(whoShow.itShowXiHaiAn);
|
||
// 初始化
|
||
onMounted(() => {
|
||
getList('init')
|
||
})
|
||
// 收藏
|
||
const collection = () => {
|
||
let scArr = []
|
||
if (checkedListAbility.value.length === 0) {
|
||
message.warning('请选择需要收藏的数据')
|
||
} else {
|
||
list.value.forEach((val) => {
|
||
if (val.children) {
|
||
val.children.map((item) => {
|
||
if (
|
||
checkedListAbility.value.indexOf(item.id) > -1 &&
|
||
item.delFlag == 0
|
||
) {
|
||
if (item.resourceId == '8888888880000000001') {
|
||
message.warning('摄像头无法添加收藏！')
|
||
} else {
|
||
scArr.push({ resourceId: item.resourceId })
|
||
}
|
||
}
|
||
})
|
||
}
|
||
})
|
||
if (scArr.length > 0) {
|
||
scInsert(scArr).then((res) => {
|
||
if (res.data.code === 0) {
|
||
message.success('收藏成功')
|
||
clean()
|
||
}
|
||
})
|
||
} else {
|
||
message.warning('下架的数据无法收藏')
|
||
}
|
||
}
|
||
}
|
||
// 全选按钮
|
||
const onCheckAllChange = () => {
|
||
if (checkAll.value) {
|
||
list.value.forEach((val) => {
|
||
if (checkedList.value.indexOf(val.deptId) == -1) {
|
||
checkedList.value.push(val.deptId)
|
||
checkedListAll.value.push(val.deptId)
|
||
}
|
||
if (val.children.length > 0) {
|
||
val.children.map((item) => {
|
||
if (checkedListAbility.value.indexOf(item.id) == -1) {
|
||
checkedListAbility.value.push(item.id)
|
||
val.checkedList.push(item.id)
|
||
checkNum.value++
|
||
}
|
||
item.checked = true
|
||
})
|
||
} else {
|
||
getListByDeptId(val)
|
||
}
|
||
val.checked = true
|
||
})
|
||
console.log(checkAll.value, checkedList.value)
|
||
} else {
|
||
list.value.forEach((val) => {
|
||
val.checked = false
|
||
checkNum.value -= Number(val.count)
|
||
if (checkedList.value.indexOf(val.deptId) != -1) {
|
||
checkedList.value.splice(checkedList.value.indexOf(val.deptId), 1)
|
||
checkedListAll.value.splice(
|
||
checkedListAll.value.indexOf(val.deptId),
|
||
1
|
||
)
|
||
handleChild(val)
|
||
}
|
||
})
|
||
// console.log(checkAll.value, checkedList.value)
|
||
}
|
||
}
|
||
// 处理child
|
||
const handleChild = (val) => {
|
||
if (val.children.length > 0) {
|
||
val.children.map((item) => {
|
||
// console.log('child=============>', checkedListAbility.value, item)
|
||
if (checkedListAbility.value.indexOf(item.id) > -1) {
|
||
item.checked = false
|
||
checkedListAbility.value.splice(
|
||
checkedListAbility.value.indexOf(item.id),
|
||
1
|
||
)
|
||
val.checkedList.splice(val.checkedList.indexOf(item.id), 1)
|
||
}
|
||
})
|
||
}
|
||
}
|
||
// 反选
|
||
const reverseSelectionFalg = ref(false)
|
||
const reverseSelection = () => {
|
||
// console.log(
|
||
// '点击反选==============>',
|
||
// checkedList.value,
|
||
// checkAll.value,
|
||
// list.value
|
||
// )
|
||
reverseSelectionFalg.value = !reverseSelectionFalg.value
|
||
if (checkAll.value) {
|
||
checkAll.value = false
|
||
list.value.map((val) => {
|
||
checkNum.value -= Number(val.count)
|
||
if (checkedList.value.indexOf(val.deptId) > -1) {
|
||
val.checked = false
|
||
checkedList.value.splice(checkedList.value.indexOf(val.deptId), 1)
|
||
checkedListAll.value.splice(
|
||
checkedListAll.value.indexOf(val.deptId),
|
||
1
|
||
)
|
||
handleChild(val)
|
||
}
|
||
})
|
||
} else {
|
||
const arr = []
|
||
list.value.map((val) => {
|
||
val.checked = !val.checked
|
||
if (val.checked) {
|
||
checkNum.value += Number(val.count)
|
||
checkedList.value.push(val.deptId)
|
||
checkedListAll.value.push(val.deptId)
|
||
if (val.children.length > 0) {
|
||
val.children.map((item) => {
|
||
item.checked = true
|
||
checkedListAbility.value.push(item.id)
|
||
val.checkedList.push(item.id)
|
||
})
|
||
}
|
||
arr.push(val.deptId)
|
||
} else {
|
||
checkNum.value -= Number(val.count)
|
||
checkedList.value.splice(checkedList.value.indexOf(val.deptId), 1)
|
||
checkedListAll.value.splice(
|
||
checkedListAll.value.indexOf(val.deptId),
|
||
1
|
||
)
|
||
handleChild(val)
|
||
}
|
||
if (arr.length == list.value.length) {
|
||
checkAll.value = true
|
||
}
|
||
})
|
||
}
|
||
reverseSelectionFalg.value = !reverseSelectionFalg.value
|
||
}
|
||
// 重置
|
||
const clean = (index) => {
|
||
name.value = ''
|
||
type.value = ''
|
||
pageNum.value = '1'
|
||
pageSize.value = '99999'
|
||
checkedList.value = []
|
||
checkedListAbility.value = []
|
||
checkedListAll.value = []
|
||
checkAll.value = false
|
||
showKey.value++
|
||
getList('', index)
|
||
}
|
||
// 获取信息
|
||
const getList = (type, index) => {
|
||
console.log(type, index)
|
||
if (type == 'init') {
|
||
pageNum.value = 1
|
||
pageSize.value = 99999
|
||
}
|
||
selectResourceCarGroupByDept({
|
||
pageNum: pageNum.value,
|
||
pageSize: pageSize.value,
|
||
name: name.value,
|
||
}).then((res) => {
|
||
console.log('res---获取信息--------->', res);
|
||
if (res.data.code !== 0) {
|
||
return message.error(res.data.msg)
|
||
}
|
||
let statistics = 0
|
||
res.data.data.list.map((val) => {
|
||
val.initLoading = true
|
||
val.show = false
|
||
if (checkedList.value.indexOf(val.deptId) > -1) {
|
||
val.checked = true
|
||
statistics++
|
||
} else {
|
||
val.checked = false
|
||
}
|
||
val.checkedList = []
|
||
val.children = []
|
||
val.pageNum = '1'
|
||
val.pageSize = '99999'
|
||
})
|
||
if (statistics != 0 && statistics == res.data.data.list.length) {
|
||
checkAll.value = true
|
||
}
|
||
if (list.value.length == 0) {
|
||
load.value = 1
|
||
}
|
||
if (load.value < Number(pageNum.value)) {
|
||
load.value = Number(pageNum.value)
|
||
}
|
||
// console.log('整体页面加载次数===============>', load.value)
|
||
// 判断是否有已打开项，如果有重新载入之后自动打开
|
||
list.value = res.data.data.list || []
|
||
console.log('list.value------------>', list.value);
|
||
|
||
if (index || index === 0) {
|
||
list.value[index].show = true
|
||
showNew(list.value[index])
|
||
}
|
||
total.value = res.data.data.deptCount
|
||
showKey.value++
|
||
if (type == 'init' || type == 'changePage') {
|
||
getListByDeptId(list.value[0])
|
||
}
|
||
})
|
||
}
|
||
// 通过deptid查询列表
|
||
const getListByDeptId = async (item) => {
|
||
console.log('通过deptid或者deptName查询列表------------>', item);
|
||
if (item.children.length == 0) {
|
||
let _obj = {
|
||
pageNum: item.pageNum,
|
||
pageSize: item.pageSize,
|
||
name: name.value,
|
||
}
|
||
let res;
|
||
// 西海岸 todo
|
||
if (whoShow.itShowXiHaiAn) {
|
||
_obj.deptName = item.deptName;
|
||
res = await selectResourceListByDeptName(_obj)
|
||
} else {
|
||
_obj.deptId = item.deptId || '';
|
||
res = await selectResourceListByDept(_obj)
|
||
}
|
||
console.log('res----根据部门查询-------->', res);
|
||
item.initLoading = false
|
||
if (res.data.code !== 0) {
|
||
return message.error(res.data.msg)
|
||
}
|
||
(res.data.data || []).map((val) => {
|
||
if (
|
||
(!item.load || item.load < Number(item.pageNum)) &&
|
||
load.value <= Number(pageNum.value)
|
||
) {
|
||
if (
|
||
item.checkAll == true ||
|
||
checkedList.value.indexOf(item.deptId) > -1
|
||
) {
|
||
if (checkedListAbility.value.indexOf(val.id) == -1) {
|
||
checkedListAbility.value.push(val.id)
|
||
item.checkedList.push(val.id)
|
||
}
|
||
val.checked = true
|
||
checkNum.value++
|
||
} else if (checkedListAbility.value.indexOf(val.id) == -1) {
|
||
val.checked = false
|
||
}
|
||
} else {
|
||
if (
|
||
checkedListAbility.value.indexOf(val.id) > -1 ||
|
||
(item.load < Number(item.pageNum) &&
|
||
checkedListAll.value.indexOf(item.deptId) > -1)
|
||
) {
|
||
val.checked = true
|
||
} else {
|
||
val.checked = false
|
||
}
|
||
}
|
||
val.loading = false
|
||
})
|
||
if (item.children.length == 0) {
|
||
item.load = 1
|
||
}
|
||
if (item.load < Number(item.pageNum)) {
|
||
item.load = Number(item.pageNum)
|
||
}
|
||
item.children = res.data.data
|
||
item.show = true
|
||
}
|
||
}
|
||
// 显示资源信息
|
||
const showBottom = (item) => {
|
||
debugger
|
||
item.show = !item.show
|
||
if (item.show) {
|
||
getListByDeptId(item)
|
||
}
|
||
}
|
||
const showNew = (item) => {
|
||
getListByDeptId(item)
|
||
}
|
||
// 切换页数
|
||
const pageChange = (val) => {
|
||
checkAll.value = false
|
||
pageNum.value = val
|
||
getList('changePage')
|
||
}
|
||
// 能力内分页
|
||
const pageChange2 = (item) => {
|
||
getListByDeptId(item)
|
||
}
|
||
// 点击部门多选框
|
||
const checkedDept = (item) => {
|
||
console.log(
|
||
'点击部门多选框==================>',
|
||
item,
|
||
checkedList.value,
|
||
checkAll.value
|
||
)
|
||
item.checked = !item.checked
|
||
if (item.checked) {
|
||
if (item.children.length > 0) {
|
||
item.children.map((val) => {
|
||
console.log('val.id------------>', val.id);
|
||
if (checkedListAbility.value.indexOf(val.id) == -1) {
|
||
checkedListAbility.value.push(val.id)
|
||
item.checkedList.push(val.id)
|
||
}
|
||
val.checked = true
|
||
})
|
||
} else {
|
||
getListByDeptId(item)
|
||
}
|
||
item.checkAll = true
|
||
checkedList.value.push(item.deptId)
|
||
checkedListAll.value.push(item.deptId)
|
||
judgeAll(item)
|
||
checkNum.value += Number(item.count)
|
||
if (checkedList.value.length == list.value.length) {
|
||
checkAll.value = true
|
||
}
|
||
} else {
|
||
if (item.children.length > 0) {
|
||
item.children.map((val) => {
|
||
if (checkedListAbility.value.indexOf(val.id) > -1) {
|
||
checkedListAbility.value.splice(
|
||
checkedListAbility.value.indexOf(val.id),
|
||
1
|
||
)
|
||
item.checkedList.splice(item.checkedList.indexOf(val.id), 1)
|
||
val.checked = false
|
||
}
|
||
})
|
||
}
|
||
item.checkAll = false
|
||
checkedList.value.splice(checkedList.value.indexOf(item.deptId), 1)
|
||
checkedListAll.value.splice(checkedListAll.value.indexOf(item.deptId), 1)
|
||
judgeAll(item)
|
||
if (checkedList.value.length !== list.value.length) {
|
||
checkAll.value = false
|
||
}
|
||
checkNum.value -= Number(item.count)
|
||
}
|
||
}
|
||
// 判断是否全选
|
||
const judgeAll = (item, val) => {
|
||
console.log(
|
||
'判断是否全选============>',
|
||
item,
|
||
val,
|
||
list.value,
|
||
checkedList.value
|
||
)
|
||
if (!val) {
|
||
let all = true
|
||
list.value.map((val) => {
|
||
if (val.checkedList.length !== val.children.length) {
|
||
all = false
|
||
}
|
||
})
|
||
if (all) {
|
||
checkAll.value = true
|
||
} else {
|
||
checkAll.value = false
|
||
}
|
||
} else {
|
||
let all = true
|
||
item.children.map((child) => {
|
||
if (checkedListAbility.value.indexOf(child.id) == -1) {
|
||
all = false
|
||
}
|
||
})
|
||
if (all) {
|
||
item.checked = true
|
||
} else {
|
||
item.checked = false
|
||
}
|
||
}
|
||
}
|
||
// 点击能力
|
||
const checkedItem = (val, item) => {
|
||
// console.log('点击能力===========>', val, item, checkedListAbility.value)
|
||
item.checked = !item.checked
|
||
if (item.checked) {
|
||
checkNum.value++
|
||
if (checkedListAbility.value.indexOf(item.id) == -1) {
|
||
checkedListAbility.value.push(item.id)
|
||
val.checkedList.push(item.id)
|
||
}
|
||
} else {
|
||
checkNum.value--
|
||
checkedListAbility.value.splice(
|
||
checkedListAbility.value.indexOf(item.id),
|
||
1
|
||
)
|
||
val.checkedList.splice(val.checkedList.indexOf(item.id), 1)
|
||
}
|
||
// console.log('判断是否全选===============>', val, checkedListAll.value)
|
||
if (val.checkedList.length == val.count) {
|
||
val.checked = true
|
||
checkedList.value.push(val.deptId)
|
||
checkedListAll.value.push(val.deptId)
|
||
// console.log(
|
||
// '全选===========================>',
|
||
// checkedList.value,
|
||
// list.value
|
||
// )
|
||
if (checkedList.value.length == list.value.length) {
|
||
checkAll.value = true
|
||
}
|
||
} else {
|
||
val.checked = false
|
||
if (checkedList.value.indexOf(val.deptId) > -1) {
|
||
checkedList.value.splice(checkedList.value.indexOf(val.deptId), 1)
|
||
}
|
||
if (checkedList.value.length !== list.value.length) {
|
||
checkAll.value = false
|
||
}
|
||
}
|
||
}
|
||
// 删除按钮
|
||
const delList = () => {
|
||
if (checkedListAbility.value.length == 0) {
|
||
message.warning('请先选择需要操作的数据！')
|
||
} else {
|
||
sgcDel({
|
||
ids: checkedListAbility.value,
|
||
}).then((res) => {
|
||
if (res.data.msg === 'success') {
|
||
message.success('删除成功')
|
||
// console.log('删除申购车列表================>', res)
|
||
mybus.emit('getSgcNum')
|
||
clean()
|
||
}
|
||
})
|
||
}
|
||
}
|
||
//ceshiFunction
|
||
const ceshiFunction = () => {
|
||
// debugger
|
||
if (checkedListAbility.value.length == 0) {
|
||
message.warning('请先选择需要操作的数据！')
|
||
}
|
||
}
|
||
// delOne delList handleDelete
|
||
const handleDelete = (item, index) => {
|
||
console.log('item, index------------>', item, index);
|
||
|
||
console.log('item------------>', item);
|
||
let delArr = [];
|
||
// 单个删除
|
||
if (index) {
|
||
delArr = [item.id]
|
||
} else {
|
||
// 批量删除
|
||
if (checkedListAbility.value.length == 0) {
|
||
return message.warning('请先选择需要操作的数据！')
|
||
} else {
|
||
delArr = checkedListAbility.value
|
||
}
|
||
}
|
||
sgcDel({
|
||
ids: delArr
|
||
}).then((res) => {
|
||
if (res.data.msg === 'success') {
|
||
message.success('删除成功')
|
||
// console.log('删除申购车列表================>', res)
|
||
mybus.emit('getSgcNum')
|
||
clean(index)
|
||
// val.show = true
|
||
}
|
||
})
|
||
}
|
||
const cancel = (e) => {
|
||
// console.log(e)
|
||
}
|
||
// 详情
|
||
const showItem = (id, type, delFlag, note1) => {
|
||
if (type == '基础设施') {
|
||
// console.log()
|
||
let arr = JSON.parse(note1)
|
||
xVideoList.value = []
|
||
arr.map((val) => {
|
||
xVideoList.value.push({ name: val.channelName, key: val.channelId })
|
||
})
|
||
videoVisible.value = true
|
||
} else {
|
||
if (delFlag == 0) {
|
||
window.sessionStorage.setItem('type', JSON.stringify('PurchaseVehicle'))
|
||
mybus.emit('tabsChange', { flag: id })
|
||
router.push({
|
||
path: '/details',
|
||
query: {
|
||
id: id,
|
||
},
|
||
})
|
||
}
|
||
}
|
||
}
|
||
// 一键申请
|
||
const apply = () => {
|
||
if (checkedListAbility.value.length == 0) {
|
||
message.warning('请先选择需要申请的数据！')
|
||
} else {
|
||
let arr = []
|
||
let delArr = []
|
||
console.log('list.value------------>', list.value);
|
||
|
||
list.value.map((val) => {
|
||
val.arr = val.children.filter((item) => {
|
||
if (whoShow.itShowXiHaiAn) {
|
||
item.type = '基础设施';
|
||
item.resourceName = '摄像头列表';
|
||
item.resourceId = '1522550195055828996';
|
||
}
|
||
console.log('选择的数据=============>', item)
|
||
if (checkedListAbility.value.indexOf(item.id) > -1) {
|
||
if (item.delFlag == 0) {
|
||
return item
|
||
} else {
|
||
delArr.push(item)
|
||
}
|
||
}
|
||
})
|
||
})
|
||
arr = list.value.filter((val) => val.arr.length !== 0)
|
||
if (delArr.length > 0) {
|
||
message.warning('已经下架的能力无法申请！')
|
||
}
|
||
if (arr.length > 0) {
|
||
console.log('一键申请===================>', arr)
|
||
localStorage.setItem('applyList', JSON.stringify(arr))
|
||
router.push({
|
||
path: '/apply',
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="less" scoped>
|
||
.ant-list {
|
||
|
||
// max-height: 5.3rem;
|
||
.ant-list-item {
|
||
width: 100%;
|
||
padding: 0.24rem 0.2rem;
|
||
|
||
.ant-list-item-meta {
|
||
align-items: center;
|
||
|
||
:deep(.ant-list-item-meta-avatar) {
|
||
padding-left: 0.2rem;
|
||
margin-right: 0.3rem;
|
||
}
|
||
|
||
.time {
|
||
margin-left: 0.3rem;
|
||
font-size: 0.12rem;
|
||
color: #ccc;
|
||
}
|
||
|
||
.type {
|
||
margin-left: 0.1rem;
|
||
padding: 0.03rem 0.1rem;
|
||
background: #00a7e3;
|
||
color: #fff;
|
||
}
|
||
|
||
:deep(.ant-list-item-meta-description) {
|
||
margin-top: 0.1rem;
|
||
max-height: 0.22rem;
|
||
margin-right: 0.1rem;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 2;
|
||
word-break: break-all;
|
||
-webkit-box-orient: vertical;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.ant-list::-webkit-scrollbar {
|
||
width: 0 !important;
|
||
}
|
||
|
||
.top {
|
||
margin: 0.1rem;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
border-bottom: 1px solid #f0f0f0;
|
||
|
||
.left {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
p {
|
||
height: 0.18rem;
|
||
line-height: 0.14rem;
|
||
padding-left: 0.1rem;
|
||
margin-bottom: 0;
|
||
border-left: 1px solid #212121;
|
||
}
|
||
|
||
.reverseSelection {
|
||
margin-right: 0.1rem;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.reverseSelection:hover {
|
||
color: #0058e1;
|
||
}
|
||
|
||
span {
|
||
margin-left: 0.1rem;
|
||
}
|
||
|
||
.num {
|
||
margin-left: 0;
|
||
color: #0087ff;
|
||
font-size: 0.2rem;
|
||
}
|
||
}
|
||
|
||
.right {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-around;
|
||
|
||
button {
|
||
margin-bottom: 0.1rem;
|
||
}
|
||
|
||
.sousuokuang {
|
||
width: 3.25rem;
|
||
margin: 0.1rem 0rem 0.21rem 0.2rem;
|
||
|
||
.ant-input-search {
|
||
max-width: 3rem;
|
||
}
|
||
|
||
:deep(.ant-input) {
|
||
width: 2.4rem;
|
||
height: 0.36rem;
|
||
font-size: 0.14rem;
|
||
color: #000;
|
||
background: #fff;
|
||
}
|
||
|
||
:deep(.ant-input-group-addon) {
|
||
display: inline-block;
|
||
margin-left: 0.1rem;
|
||
|
||
.ant-input-search-button {
|
||
width: 0.65rem;
|
||
height: 0.36rem;
|
||
border-radius: 2px;
|
||
font-size: 0.14rem;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.title {
|
||
font-size: 0.2rem;
|
||
color: #000000;
|
||
font-family: 'Alibaba PuHuiTi';
|
||
font-weight: 500;
|
||
margin-top: 0.2rem;
|
||
margin-left: 0.2rem;
|
||
}
|
||
|
||
.tab {
|
||
margin-top: 0.1rem;
|
||
margin-left: 0.2rem;
|
||
margin-bottom: 0.1rem;
|
||
display: flex;
|
||
font-size: 0.14rem;
|
||
color: #999999;
|
||
|
||
div {
|
||
width: 0.7rem;
|
||
height: 0.24rem;
|
||
border: 0.01rem solid #cccccc;
|
||
border-radius: 0.12rem;
|
||
margin-left: 0.1rem;
|
||
text-align: center;
|
||
color: #666666;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.tabclass {
|
||
border: 0.01rem solid #0087ff;
|
||
color: #0087ff;
|
||
}
|
||
}
|
||
|
||
.name {
|
||
max-width: 4.15rem;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
-o-text-overflow: ellipsis;
|
||
word-break: break-all;
|
||
}
|
||
|
||
.name:hover {
|
||
color: #0087ff;
|
||
}
|
||
|
||
.items {
|
||
height: 7.25rem;
|
||
padding: 0 0.3rem;
|
||
overflow-y: scroll;
|
||
|
||
.item {
|
||
.item-top {
|
||
width: 100%;
|
||
height: 0.6rem;
|
||
font-size: 20px;
|
||
font-weight: 600;
|
||
background: rgba(0, 135, 225, 0.1);
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 0 0.1rem;
|
||
margin-top: 0.08rem;
|
||
}
|
||
|
||
.item-top:hover {
|
||
cursor: pointer;
|
||
// 0058e1 透明度 0.5
|
||
background: rgba(0, 88, 225, 0.8);
|
||
color: white;
|
||
|
||
:deep(.anticon) {
|
||
color: white;
|
||
}
|
||
}
|
||
|
||
.item-bottom {
|
||
padding: 0 0.2rem;
|
||
border: 1px solid rgba(0, 135, 225, 0.1);
|
||
}
|
||
}
|
||
}
|
||
|
||
:deep(.ant-list-item-meta-avatar) {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.ant-pagination {
|
||
margin-bottom: 0.2rem;
|
||
}
|
||
|
||
.tx {
|
||
display: inline-block;
|
||
width: 0.8rem;
|
||
height: 0.8rem;
|
||
margin-left: 0.1rem;
|
||
}
|
||
|
||
.sxt {
|
||
background: url('~@/assets/home/sxt_square.png') no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
.yyzy {
|
||
background: url('~@/assets/home/yyzy_square.png') no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
.znsf {
|
||
background: url('~@/assets/home/znsf_square.png') no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
.tcfw {
|
||
background: url('~@/assets/home/tcfw_square.png') no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
.kfzj {
|
||
background: url('~@/assets/home/kfzj_square.png') no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
.ywzj {
|
||
background: url('~@/assets/home/ywzj_square.png') no-repeat;
|
||
background-size: 100%;
|
||
}
|
||
|
||
:deep(.ant-list-item-meta-title) {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
div {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
}
|
||
|
||
.collect-btn {
|
||
width: 1rem;
|
||
height: 0.36rem;
|
||
border-radius: 2px;
|
||
background: #fff;
|
||
color: #0558e1;
|
||
}
|
||
|
||
.apply-btn {
|
||
width: 1rem;
|
||
height: 0.36rem;
|
||
margin-left: 0.12rem;
|
||
border-radius: 2px;
|
||
}
|
||
</style>
|