Compare commits
4 Commits
8cb2f83fb5
...
b3b35d21b3
Author | SHA1 | Date |
---|---|---|
guoyue | b3b35d21b3 | |
guoyue | 21adcb62c8 | |
guoyue | 5387d6a7a3 | |
guoyue | 8b9e11b0a0 |
|
@ -8,139 +8,58 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="form-container">
|
<div class="form-container">
|
||||||
<div v-if="applySuccess">
|
<div v-if="applySuccess">
|
||||||
<a-form
|
<a-form ref="formRef" :model="formName" name="basic" :label-col="{ style: { width: '106px' } }"
|
||||||
ref="formRef"
|
:wrapper-col="{ style: { width: '230px' } }" labelAlign="left" autocomplete="off">
|
||||||
:model="formName"
|
|
||||||
name="basic"
|
|
||||||
:label-col="{ style: { width: '106px' } }"
|
|
||||||
:wrapper-col="{ style: { width: '230px' } }"
|
|
||||||
labelAlign="left"
|
|
||||||
autocomplete="off"
|
|
||||||
>
|
|
||||||
<div class="base-info">
|
<div class="base-info">
|
||||||
<a-form-item
|
<a-form-item label="申请标题" name="title" :rules="[{ required: true, message: '请输入申请标题' }]">
|
||||||
label="申请标题"
|
<a-input placeholder="请输入能力申请标题" v-model:value="formName.title" />
|
||||||
name="title"
|
|
||||||
:rules="[{ required: true, message: '请输入申请标题' }]"
|
|
||||||
>
|
|
||||||
<a-input
|
|
||||||
placeholder="请输入能力申请标题"
|
|
||||||
v-model:value="formName.title"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</div>
|
</div>
|
||||||
<div class="base-info">
|
<div class="base-info">
|
||||||
<a-form-item
|
<a-form-item label="申请人信息" name="user" :rules="[{ required: true, message: '请输入申请人' }]">
|
||||||
label="申请人信息"
|
<a-input placeholder="请输入申请人" v-model:value="formName.user" disabled />
|
||||||
name="user"
|
|
||||||
:rules="[{ required: true, message: '请输入申请人' }]"
|
|
||||||
>
|
|
||||||
<a-input
|
|
||||||
placeholder="请输入申请人"
|
|
||||||
v-model:value="formName.user"
|
|
||||||
disabled
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item
|
<a-form-item style="margin: 0 22px" label="电话" name="phone" :rules="[
|
||||||
style="margin: 0 22px"
|
|
||||||
label="电话"
|
|
||||||
name="phone"
|
|
||||||
:rules="[
|
|
||||||
{
|
{
|
||||||
required: true,
|
required: true,
|
||||||
pattern: /^1[3456789]\d{9}$/,
|
pattern: /^1[3456789]\d{9}$/,
|
||||||
message: '请输入正确的电话号码',
|
message: '请输入正确的电话号码',
|
||||||
},
|
},
|
||||||
]"
|
]">
|
||||||
>
|
<a-input placeholder="请输入申请人电话" v-model:value="formName.phone" />
|
||||||
<a-input
|
|
||||||
placeholder="请输入申请人电话"
|
|
||||||
v-model:value="formName.phone"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item
|
<a-form-item label="单位" name="unit" :rules="[{ required: true, message: '请输入单位' }]">
|
||||||
label="单位"
|
<a-input placeholder="请输入单位" v-model:value="formName.unit" disabled v-if="deptFlage" />
|
||||||
name="unit"
|
<a-select v-else placeholder="请选择归属部门" v-model:value="formName.unit" @change="deptIdChangeFunction">
|
||||||
:rules="[{ required: true, message: '请输入单位' }]"
|
<a-select-option v-for="(item, index) in deptNameAll" :key="`${index}-${item}`" :value="item.name">
|
||||||
>
|
|
||||||
<a-input
|
|
||||||
placeholder="请输入单位"
|
|
||||||
v-model:value="formName.unit"
|
|
||||||
disabled
|
|
||||||
v-if="deptFlage"
|
|
||||||
/>
|
|
||||||
<a-select
|
|
||||||
v-else
|
|
||||||
placeholder="请选择归属部门"
|
|
||||||
v-model:value="formName.unit"
|
|
||||||
@change="deptIdChangeFunction"
|
|
||||||
>
|
|
||||||
<a-select-option
|
|
||||||
v-for="(item, index) in deptNameAll"
|
|
||||||
:key="`${index}-${item}`"
|
|
||||||
:value="item.name"
|
|
||||||
>
|
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
</a-select-option>
|
</a-select-option>
|
||||||
</a-select>
|
</a-select>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</div>
|
</div>
|
||||||
<div class="base-info" v-if="flag">
|
<div class="base-info" v-if="flag">
|
||||||
<a-form-item
|
<a-form-item label="应用系统" name="applicationSystem" :rules="[{ required: true, message: '请选择应用系统' }]">
|
||||||
label="应用系统"
|
<a-select v-model:value="formName.applicationSystem" show-search placeholder="请输入关键字"
|
||||||
name="applicationSystem"
|
style="width: 200px" :options="systemOptions" @focus="handleFocus" @blur="handleBlur"
|
||||||
:rules="[{ required: true, message: '请选择应用系统' }]"
|
@change="systemHandleChange" @search="systemHandleSearch"></a-select>
|
||||||
>
|
|
||||||
<a-select
|
|
||||||
v-model:value="formName.applicationSystem"
|
|
||||||
show-search
|
|
||||||
placeholder="请输入关键字"
|
|
||||||
style="width: 200px"
|
|
||||||
:options="systemOptions"
|
|
||||||
@focus="handleFocus"
|
|
||||||
@blur="handleBlur"
|
|
||||||
@change="systemHandleChange"
|
|
||||||
@search="systemHandleSearch"
|
|
||||||
></a-select>
|
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item
|
<a-form-item class="applicationScene" label="应用领域" name="applicationScene"
|
||||||
class="applicationScene"
|
:rules="[{ required: true, message: '请选择应用领域' }]" style="width: 6.93rem">
|
||||||
label="应用领域"
|
<a-select v-model:value="formName.applicationScene" :options="applicationSceneOpthion" mode="tags"
|
||||||
name="applicationScene"
|
:size="size" placeholder="请选择应用领域" :filterOption="false" :searchValue="false"
|
||||||
:rules="[{ required: true, message: '请选择应用领域' }]"
|
style="width: 5.87rem"></a-select>
|
||||||
style="width: 6.93rem"
|
|
||||||
>
|
|
||||||
<a-select
|
|
||||||
v-model:value="formName.applicationScene"
|
|
||||||
:options="applicationSceneOpthion"
|
|
||||||
mode="tags"
|
|
||||||
:size="size"
|
|
||||||
placeholder="请选择应用领域"
|
|
||||||
:filterOption="false"
|
|
||||||
:searchValue="false"
|
|
||||||
style="width: 5.87rem"
|
|
||||||
></a-select>
|
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<a-form-item
|
<a-form-item label="需求依据" name="applicationBackground" :rules="[
|
||||||
label="需求依据"
|
|
||||||
name="applicationBackground"
|
|
||||||
:rules="[
|
|
||||||
{ required: true, message: '请输入需求依据' },
|
{ required: true, message: '请输入需求依据' },
|
||||||
{ min: 50, message: '需求依据最少为50个字' },
|
{ min: 50, message: '需求依据最少为50个字' },
|
||||||
]"
|
]">
|
||||||
>
|
<a-textarea placeholder="请输入需求依据" v-model:value="formName.applicationBackground" :rows="4" />
|
||||||
<a-textarea
|
|
||||||
placeholder="请输入需求依据"
|
|
||||||
v-model:value="formName.applicationBackground"
|
|
||||||
:rows="4"
|
|
||||||
/>
|
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</div>
|
</div>
|
||||||
<div class="bottom-btn">
|
<div class="bottom-btn">
|
||||||
<a-button
|
<a-button style="
|
||||||
style="
|
|
||||||
width: 80px;
|
width: 80px;
|
||||||
height: 38px;
|
height: 38px;
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
|
@ -151,15 +70,10 @@
|
||||||
border: none;
|
border: none;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
"
|
" type="primary" html-type="cancle" @click="resetFields()">
|
||||||
type="primary"
|
|
||||||
html-type="cancle"
|
|
||||||
@click="resetFields()"
|
|
||||||
>
|
|
||||||
退出申请
|
退出申请
|
||||||
</a-button>
|
</a-button>
|
||||||
<a-button
|
<a-button style="
|
||||||
style="
|
|
||||||
width: 80px;
|
width: 80px;
|
||||||
height: 38px;
|
height: 38px;
|
||||||
background: #0087ff;
|
background: #0087ff;
|
||||||
|
@ -169,11 +83,7 @@
|
||||||
border: none;
|
border: none;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
"
|
" type="primary" html-type="submit" @click="processStartHandle()">
|
||||||
type="primary"
|
|
||||||
html-type="submit"
|
|
||||||
@click="processStartHandle()"
|
|
||||||
>
|
|
||||||
提交申请
|
提交申请
|
||||||
</a-button>
|
</a-button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -216,6 +126,7 @@
|
||||||
import { sgcDel, getApplyForm } from '@/api/personalCenter'
|
import { sgcDel, getApplyForm } from '@/api/personalCenter'
|
||||||
import { pageWithAttrs, updateIntegrationServices } from '@/api/home'
|
import { pageWithAttrs, updateIntegrationServices } from '@/api/home'
|
||||||
import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
|
import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
|
||||||
|
import { getIntegrationDetail } from '@/api/home'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: '',
|
name: '',
|
||||||
|
@ -224,26 +135,20 @@
|
||||||
HomeHeader,
|
HomeHeader,
|
||||||
AbilityToApplyFor,
|
AbilityToApplyFor,
|
||||||
},
|
},
|
||||||
beforeRouteLeave(from, to, next) {
|
|
||||||
console.log('from, to, next------------>', from, to, next);
|
|
||||||
localStorage.removeItem('integrationServicesItemInfo')
|
|
||||||
next()
|
|
||||||
},
|
|
||||||
setup() {
|
setup() {
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const disabled = ref(false)
|
const disabled = ref(false)
|
||||||
const flag = ref(false)
|
const flag = ref(false)
|
||||||
const list = ref(JSON.parse(localStorage.getItem('applyList')))
|
const list = ref(JSON.parse(localStorage.getItem('applyList')))
|
||||||
const integrationServicesItemInfo = ref(
|
|
||||||
JSON.parse(localStorage.getItem('integrationServicesItemInfo') || '{}')
|
|
||||||
)
|
|
||||||
const deptNameAll = ref([]) //所有部门名称
|
const deptNameAll = ref([]) //所有部门名称
|
||||||
const deptFlage = ref(true) //判断是否存在默认部门名称
|
const deptFlage = ref(true) //判断是否存在默认部门名称
|
||||||
console.log(
|
const applyAll = router.currentRoute.value.query.applyAll;
|
||||||
'integrationServicesItemInfo------------>',
|
// 融合服务id
|
||||||
integrationServicesItemInfo
|
const integrationServicesId = router.currentRoute.value.query.integrationServicesId;
|
||||||
)
|
// 融合服务详情
|
||||||
const applyAll = router.currentRoute.value.query.applyAll
|
const integrationServicesItemInfo = ref(null)
|
||||||
|
|
||||||
const num = ref(0)
|
const num = ref(0)
|
||||||
if (!applyAll) {
|
if (!applyAll) {
|
||||||
list.value.map((item) => {
|
list.value.map((item) => {
|
||||||
|
@ -376,7 +281,6 @@
|
||||||
//退出返回上一页
|
//退出返回上一页
|
||||||
const resetFields = () => {
|
const resetFields = () => {
|
||||||
window.history.go(-1)
|
window.history.go(-1)
|
||||||
localStorage.removeItem('integrationServicesItemInfo')
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 跳转到能力集市
|
// 跳转到能力集市
|
||||||
|
@ -500,11 +404,11 @@
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
// todo 融合服务
|
// 融合服务
|
||||||
if (
|
if (integrationServicesId) {
|
||||||
Object.keys(integrationServicesItemInfo).length > 0
|
getIntegrationServicesDeatil(integrationServicesId).then(res => {
|
||||||
) {
|
|
||||||
updateIntegrationServiceAction()
|
updateIntegrationServiceAction()
|
||||||
|
})
|
||||||
}
|
}
|
||||||
jumpToDetailsPageconetent()
|
jumpToDetailsPageconetent()
|
||||||
}
|
}
|
||||||
|
@ -623,11 +527,11 @@
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
// todo 融合服务
|
// 融合服务
|
||||||
if (
|
if (integrationServicesId) {
|
||||||
Object.keys(integrationServicesItemInfo).length > 0
|
getIntegrationServicesDeatil(integrationServicesId).then(res => {
|
||||||
) {
|
|
||||||
updateIntegrationServiceAction()
|
updateIntegrationServiceAction()
|
||||||
|
})
|
||||||
}
|
}
|
||||||
jumpToDetailsPageconetent()
|
jumpToDetailsPageconetent()
|
||||||
}
|
}
|
||||||
|
@ -800,7 +704,7 @@
|
||||||
mybus.off('reomveOldData')
|
mybus.off('reomveOldData')
|
||||||
})
|
})
|
||||||
|
|
||||||
// 融合服务-更新 todo
|
// 融合服务-更新
|
||||||
const updateIntegrationServiceAction = () => {
|
const updateIntegrationServiceAction = () => {
|
||||||
let _applyCount =
|
let _applyCount =
|
||||||
Number(integrationServicesItemInfo.value.applyCount || 0) + 1
|
Number(integrationServicesItemInfo.value.applyCount || 0) + 1
|
||||||
|
@ -810,13 +714,32 @@
|
||||||
updateIntegrationServices(_data)
|
updateIntegrationServices(_data)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
console.log('res---更新--------->', res)
|
console.log('res---更新--------->', res)
|
||||||
localStorage.removeItem('integrationServicesItemInfo')
|
|
||||||
})
|
})
|
||||||
.catch((err) => {
|
.catch((err) => {
|
||||||
console.log('err----更新-------->', err)
|
console.log('err----更新-------->', err)
|
||||||
localStorage.removeItem('integrationServicesItemInfo')
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 融合服务--详情
|
||||||
|
const getIntegrationServicesDeatil = (id) => {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
getIntegrationDetail(id).then(
|
||||||
|
(res) => {
|
||||||
|
resolve(res)
|
||||||
|
if (res.data.code !== 0) {
|
||||||
|
return message.error(res.data.msg)
|
||||||
|
}
|
||||||
|
integrationServicesItemInfo.value = res.data.data || {}
|
||||||
|
},
|
||||||
|
(err) => {
|
||||||
|
reject(err)
|
||||||
|
message.error(err)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
deptIdChangeFunction,
|
deptIdChangeFunction,
|
||||||
formRef,
|
formRef,
|
||||||
|
@ -848,6 +771,7 @@
|
||||||
applicationSceneOpthion,
|
applicationSceneOpthion,
|
||||||
flag,
|
flag,
|
||||||
applyAll,
|
applyAll,
|
||||||
|
getIntegrationServicesDeatil,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
@ -860,6 +784,7 @@
|
||||||
margin: 0.8rem auto 0;
|
margin: 0.8rem auto 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
||||||
aside {
|
aside {
|
||||||
width: 282px;
|
width: 282px;
|
||||||
height: 96%;
|
height: 96%;
|
||||||
|
@ -867,6 +792,7 @@
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
margin: 1% 0 3%;
|
margin: 1% 0 3%;
|
||||||
}
|
}
|
||||||
|
|
||||||
article {
|
article {
|
||||||
width: 1090px;
|
width: 1090px;
|
||||||
height: 99%;
|
height: 99%;
|
||||||
|
@ -874,8 +800,10 @@
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
margin: 1% auto;
|
margin: 1% auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-container {
|
.form-container {
|
||||||
padding: 20px 20px 30px 20px;
|
padding: 20px 20px 30px 20px;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
color: #000;
|
color: #000;
|
||||||
|
@ -883,52 +811,63 @@
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.base-info {
|
.base-info {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.ant-form-item-label) {
|
:deep(.ant-form-item-label) {
|
||||||
label {
|
label {
|
||||||
color: #666;
|
color: #666;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
|
|
||||||
&::after {
|
&::after {
|
||||||
content: '';
|
content: '';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.ant-form-item-required) {
|
:deep(.ant-form-item-required) {
|
||||||
&::before {
|
&::before {
|
||||||
font-size: 8px;
|
font-size: 8px;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.ant-input) {
|
:deep(.ant-input) {
|
||||||
border: 1px solid #e0e0e0;
|
border: 1px solid #e0e0e0;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.success {
|
.success {
|
||||||
div {
|
div {
|
||||||
width: 100px;
|
width: 100px;
|
||||||
margin: 80px auto 40px;
|
margin: 80px auto 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #000;
|
color: #000;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.applicationScene {
|
.applicationScene {
|
||||||
:deep(.ant-select-selector) {
|
:deep(.ant-select-selector) {
|
||||||
overflow-x: scroll;
|
overflow-x: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.ant-select-selection-overflow) {
|
:deep(.ant-select-selection-overflow) {
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
resize: none;
|
resize: none;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bottom-btn {
|
.bottom-btn {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
|
@ -571,10 +571,14 @@ export default {
|
||||||
_applyList = jcss.concat(_applyList)
|
_applyList = jcss.concat(_applyList)
|
||||||
localStorage.setItem('applyList', JSON.stringify(_applyList))
|
localStorage.setItem('applyList', JSON.stringify(_applyList))
|
||||||
// 融合服务
|
// 融合服务
|
||||||
localStorage.setItem('integrationServicesItemInfo', JSON.stringify(item))
|
|
||||||
router.push({
|
router.push({
|
||||||
path: '/apply',
|
path: '/apply',
|
||||||
|
query: {
|
||||||
|
integrationServicesId: item.id,
|
||||||
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
mybus.on('chongzhi', (typeObj) => {
|
mybus.on('chongzhi', (typeObj) => {
|
||||||
|
|
|
@ -494,7 +494,7 @@
|
||||||
<template #bodyCell="{ column, record }">
|
<template #bodyCell="{ column, record }">
|
||||||
<template v-if="column.dataIndex === 'operation'">
|
<template v-if="column.dataIndex === 'operation'">
|
||||||
<a
|
<a
|
||||||
v-if="isXiHaiAn || true"
|
v-if="isXiHaiAn"
|
||||||
@click="
|
@click="
|
||||||
openVideo(
|
openVideo(
|
||||||
record.channelCode ||
|
record.channelCode ||
|
||||||
|
@ -1730,13 +1730,14 @@
|
||||||
status: 1,
|
status: 1,
|
||||||
name: mapSearchParam.value.cameraName
|
name: mapSearchParam.value.cameraName
|
||||||
}
|
}
|
||||||
if (
|
// todo-临时放开
|
||||||
params.regionId === '70be8c5b664f4bcf869d82f2e8335051' &&
|
// if (
|
||||||
!params.name &&
|
// params.regionId === '70be8c5b664f4bcf869d82f2e8335051' &&
|
||||||
!params.longitude
|
// !params.name &&
|
||||||
) {
|
// !params.longitude
|
||||||
params.status = ''
|
// ) {
|
||||||
}
|
// params.status = ''
|
||||||
|
// }
|
||||||
let paramsFather = ''
|
let paramsFather = ''
|
||||||
let i = 1
|
let i = 1
|
||||||
for (var key in params) {
|
for (var key in params) {
|
||||||
|
|
|
@ -168,7 +168,6 @@
|
||||||
<a-button
|
<a-button
|
||||||
v-if="item.approveStatus === '通过'"
|
v-if="item.approveStatus === '通过'"
|
||||||
@click.stop="switchFunction(item)"
|
@click.stop="switchFunction(item)"
|
||||||
class="DownloadAttachment2"
|
|
||||||
>
|
>
|
||||||
查看详情
|
查看详情
|
||||||
</a-button>
|
</a-button>
|
||||||
|
@ -186,6 +185,14 @@
|
||||||
<span class="channelName">{{ val.channelName }}</span>
|
<span class="channelName">{{ val.channelName }}</span>
|
||||||
<span class="type">基础设施</span>
|
<span class="type">基础设施</span>
|
||||||
</div>
|
</div>
|
||||||
|
<a-button
|
||||||
|
type="primary"
|
||||||
|
v-if="item.approveStatus === '通过' && whoShow1.itShowXiHaiAn"
|
||||||
|
@click.stop="openVideo(val)"
|
||||||
|
>
|
||||||
|
视频预览
|
||||||
|
</a-button>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="ability-bottom">
|
<div class="ability-bottom">
|
||||||
<div class="dec2">位置:{{ val.nodeName }}</div>
|
<div class="dec2">位置:{{ val.nodeName }}</div>
|
||||||
|
@ -208,6 +215,23 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 单个预览弹窗 -->
|
||||||
|
<a-modal
|
||||||
|
wrapClassName="single-preview-modal"
|
||||||
|
v-model:visible="visible"
|
||||||
|
title="视频预览"
|
||||||
|
:width="960"
|
||||||
|
destroyOnClose
|
||||||
|
>
|
||||||
|
<template #footer></template>
|
||||||
|
<div style="width: 100%; display: flex; justify-content: center">
|
||||||
|
<div style="width: 100%; height: 100%">
|
||||||
|
<vue3VideoPlay v-bind="options"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a-modal>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
|
@ -216,11 +240,44 @@
|
||||||
import { message } from 'ant-design-vue'
|
import { message } from 'ant-design-vue'
|
||||||
import { endProcess, getApplyForm } from '@/api/personalCenter.js'
|
import { endProcess, getApplyForm } from '@/api/personalCenter.js'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
|
import {
|
||||||
|
getStreamByChannelCode,
|
||||||
|
} from '@/api/videoSurveillance'
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const backUrl = ref(window.SITE_CONFIG.apiURL + '/')
|
const backUrl = ref(window.SITE_CONFIG.apiURL + '/')
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
refObj: { type: Object, default: null },
|
refObj: { type: Object, default: null },
|
||||||
})
|
})
|
||||||
|
const whoShow1 = ref(whoShow)
|
||||||
|
let visible = ref(false)
|
||||||
|
const options = reactive({
|
||||||
|
width: '912px', //播放器宽度
|
||||||
|
height: '513px', //播放器高度
|
||||||
|
color: '#409eff', //主题色
|
||||||
|
title: '', //视频名称
|
||||||
|
src: '', //视频源
|
||||||
|
type: 'm3u8', // 视频源类型
|
||||||
|
muted: false, //静音
|
||||||
|
webFullScreen: false,
|
||||||
|
speedRate: ['0.75', '1.0', '1.25', '1.5', '2.0'], //播放倍速
|
||||||
|
autoPlay: true, //自动播放
|
||||||
|
loop: false, //循环播放
|
||||||
|
mirror: false, //镜像画面
|
||||||
|
ligthOff: false, //关灯模式
|
||||||
|
volume: 0.3, //默认音量大小
|
||||||
|
control: true, //是否显示控制
|
||||||
|
controlBtns: [
|
||||||
|
'audioTrack',
|
||||||
|
'quality',
|
||||||
|
'speedRate',
|
||||||
|
'volume',
|
||||||
|
'setting',
|
||||||
|
'pip',
|
||||||
|
'pageFullScreen',
|
||||||
|
'fullScreen',
|
||||||
|
], //显示所有按钮,
|
||||||
|
})
|
||||||
|
|
||||||
const dept = reactive({})
|
const dept = reactive({})
|
||||||
// eslint-disable-next-line no-undef
|
// eslint-disable-next-line no-undef
|
||||||
if (infrastructure) {
|
if (infrastructure) {
|
||||||
|
@ -379,6 +436,25 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 视频预览
|
||||||
|
const openVideo = (item) => {
|
||||||
|
console.log('打开视频', item)
|
||||||
|
const param = {
|
||||||
|
key: item.cameraId,
|
||||||
|
}
|
||||||
|
getStreamByChannelCode(param).then((res) => {
|
||||||
|
console.log('视频预览------------>', res);
|
||||||
|
console.log(res)
|
||||||
|
visible.value = true
|
||||||
|
options.src = res.data.data || ''
|
||||||
|
}).catch(err => {
|
||||||
|
message.error(err)
|
||||||
|
})
|
||||||
|
// 视频测试--勿删
|
||||||
|
// visible.value = true
|
||||||
|
// options.src = 'http://playertest.longtailvideo.com/adaptive/bipbop/gear4/prog_index.m3u8'
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.title {
|
.title {
|
||||||
|
@ -576,4 +652,19 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.single-preview-modal {
|
||||||
|
.ant-modal-header {
|
||||||
|
background: url(~@/assets/home/video-background.png) no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
.ant-modal-title {
|
||||||
|
font-size: 0.16rem;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.anticon {
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue