Merge branch 'master' of http://47.109.37.87:3000/by2025/admin-vben5
Some checks are pending
Gitea Actions Demo / Explore-Gitea-Actions (push) Waiting to run
Some checks are pending
Gitea Actions Demo / Explore-Gitea-Actions (push) Waiting to run
This commit is contained in:
@@ -51,6 +51,7 @@
|
|||||||
"echarts-gl": "^2.0.9",
|
"echarts-gl": "^2.0.9",
|
||||||
"jsencrypt": "^3.3.2",
|
"jsencrypt": "^3.3.2",
|
||||||
"lodash-es": "^4.17.21",
|
"lodash-es": "^4.17.21",
|
||||||
|
"mpegts.js": "^1.8.0",
|
||||||
"pinia": "catalog:",
|
"pinia": "catalog:",
|
||||||
"tinymce": "^7.3.0",
|
"tinymce": "^7.3.0",
|
||||||
"unplugin-vue-components": "^0.27.3",
|
"unplugin-vue-components": "^0.27.3",
|
||||||
|
@@ -59,3 +59,12 @@ export function groupUpdate(data: GroupForm) {
|
|||||||
export function groupRemove(id: ID | IDS) {
|
export function groupRemove(id: ID | IDS) {
|
||||||
return requestClient.deleteWithMsg<void>(`/Property/group/${id}`);
|
return requestClient.deleteWithMsg<void>(`/Property/group/${id}`);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取节假日数据
|
||||||
|
* @param year
|
||||||
|
*/
|
||||||
|
export async function getHoliday(year: string) {
|
||||||
|
const response = await fetch(`https://timor.tech/api/holiday/year/${year}`);
|
||||||
|
return response.json();
|
||||||
|
}
|
||||||
|
@@ -1,4 +1,4 @@
|
|||||||
import type { PageQuery, BaseEntity } from '#/api/common';
|
import type {PageQuery, BaseEntity} from '#/api/common';
|
||||||
|
|
||||||
export interface GroupVO {
|
export interface GroupVO {
|
||||||
/**
|
/**
|
||||||
@@ -63,7 +63,16 @@ export interface GroupQuery extends PageQuery {
|
|||||||
attendanceType?: number;
|
attendanceType?: number;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 日期范围参数
|
* 日期范围参数
|
||||||
*/
|
*/
|
||||||
params?: any;
|
params?: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 假期
|
||||||
|
*/
|
||||||
|
export interface Holiday {
|
||||||
|
holiday: boolean;
|
||||||
|
name: string;
|
||||||
|
date: string;
|
||||||
|
}
|
||||||
|
@@ -58,6 +58,8 @@ export interface HouseChargeVO {
|
|||||||
costItemsVo: CostItemSettingVO;
|
costItemsVo: CostItemSettingVO;
|
||||||
|
|
||||||
chargeStatus: string;
|
chargeStatus: string;
|
||||||
|
|
||||||
|
personId: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface HouseChargeForm extends BaseEntity {
|
export interface HouseChargeForm extends BaseEntity {
|
||||||
|
@@ -12,7 +12,7 @@ import { requestClient } from '#/api/request';
|
|||||||
* @returns 厂商管理列表
|
* @returns 厂商管理列表
|
||||||
*/
|
*/
|
||||||
export function factoryList(params?: FactoryQuery) {
|
export function factoryList(params?: FactoryQuery) {
|
||||||
return requestClient.get<PageResult<FactoryVO>>('/property/factory/list', { params });
|
return requestClient.get<PageResult<FactoryVO>>('/sis/factory/list', { params });
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -21,7 +21,7 @@ export function factoryList(params?: FactoryQuery) {
|
|||||||
* @returns 厂商管理列表
|
* @returns 厂商管理列表
|
||||||
*/
|
*/
|
||||||
export function factoryExport(params?: FactoryQuery) {
|
export function factoryExport(params?: FactoryQuery) {
|
||||||
return commonExport('/property/factory/export', params ?? {});
|
return commonExport('/sis/factory/export', params ?? {});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -30,7 +30,7 @@ export function factoryExport(params?: FactoryQuery) {
|
|||||||
* @returns 厂商管理详情
|
* @returns 厂商管理详情
|
||||||
*/
|
*/
|
||||||
export function factoryInfo(id: ID) {
|
export function factoryInfo(id: ID) {
|
||||||
return requestClient.get<FactoryVO>(`/property/factory/${id}`);
|
return requestClient.get<FactoryVO>(`/sis/factory/${id}`);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -39,7 +39,7 @@ export function factoryInfo(id: ID) {
|
|||||||
* @returns void
|
* @returns void
|
||||||
*/
|
*/
|
||||||
export function factoryAdd(data: FactoryForm) {
|
export function factoryAdd(data: FactoryForm) {
|
||||||
return requestClient.postWithMsg<void>('/property/factory', data);
|
return requestClient.postWithMsg<void>('/sis/factory', data);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -48,7 +48,7 @@ export function factoryAdd(data: FactoryForm) {
|
|||||||
* @returns void
|
* @returns void
|
||||||
*/
|
*/
|
||||||
export function factoryUpdate(data: FactoryForm) {
|
export function factoryUpdate(data: FactoryForm) {
|
||||||
return requestClient.putWithMsg<void>('/property/factory', data);
|
return requestClient.putWithMsg<void>('/sis/factory', data);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -57,5 +57,5 @@ export function factoryUpdate(data: FactoryForm) {
|
|||||||
* @returns void
|
* @returns void
|
||||||
*/
|
*/
|
||||||
export function factoryRemove(id: ID | IDS) {
|
export function factoryRemove(id: ID | IDS) {
|
||||||
return requestClient.deleteWithMsg<void>(`/property/factory/${id}`);
|
return requestClient.deleteWithMsg<void>(`/sis/factory/${id}`);
|
||||||
}
|
}
|
13
apps/web-antd/src/api/sis/stream/index.ts
Normal file
13
apps/web-antd/src/api/sis/stream/index.ts
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
import type { AddStreamProxyResult } from './model';
|
||||||
|
import { requestClient } from '#/api/request';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 添加拉流代理,如果成功会返回可播放的视频流地址
|
||||||
|
* @param params
|
||||||
|
* @returns 人像信息列表
|
||||||
|
*/
|
||||||
|
export function addStreamProxy(params?: any) {
|
||||||
|
return requestClient.post<AddStreamProxyResult>('sis/stream//realtime/add', {
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
22
apps/web-antd/src/api/sis/stream/model.d.ts
vendored
Normal file
22
apps/web-antd/src/api/sis/stream/model.d.ts
vendored
Normal file
@@ -0,0 +1,22 @@
|
|||||||
|
export interface AddStreamProxyResult {
|
||||||
|
key:string;
|
||||||
|
rtsp:string;
|
||||||
|
rtmp:string;
|
||||||
|
flv:string;
|
||||||
|
wsFlv:string;
|
||||||
|
mp4:string;
|
||||||
|
hls:string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface AddStreamProxyQuery {
|
||||||
|
videoIp:string;
|
||||||
|
videoPort:number;
|
||||||
|
factoryNo:string;
|
||||||
|
account:string;
|
||||||
|
pwd:string;
|
||||||
|
channelId:string;
|
||||||
|
startTime:string;
|
||||||
|
endTime:string;
|
||||||
|
stream:string;
|
||||||
|
|
||||||
|
}
|
@@ -2,7 +2,7 @@ import type { FormSchemaGetter } from '#/adapter/form';
|
|||||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||||
import {getDictOptions} from "#/utils/dict";
|
import {getDictOptions} from "#/utils/dict";
|
||||||
import {renderDict} from "#/utils/render";
|
import {renderDict} from "#/utils/render";
|
||||||
|
import type { TableColumnsType } from 'ant-design-vue';
|
||||||
|
|
||||||
export const querySchema: FormSchemaGetter = () => [
|
export const querySchema: FormSchemaGetter = () => [
|
||||||
{
|
{
|
||||||
@@ -124,6 +124,18 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
rules:'required',
|
rules:'required',
|
||||||
defaultValue:'1',
|
defaultValue:'1',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
fieldName: 'shiftData',
|
||||||
|
component: 'Input',
|
||||||
|
dependencies: {
|
||||||
|
show: (formValue) => formValue.attendanceType=='1',
|
||||||
|
triggerFields: ['attendanceType'],
|
||||||
|
},
|
||||||
|
slots:{
|
||||||
|
default:'shiftData'
|
||||||
|
},
|
||||||
|
},
|
||||||
{
|
{
|
||||||
label: '排班周期',
|
label: '排班周期',
|
||||||
fieldName: 'schedulingCycle',
|
fieldName: 'schedulingCycle',
|
||||||
@@ -138,32 +150,99 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
defaultValue:'1',
|
defaultValue:'1',
|
||||||
rules:'required'
|
rules:'required'
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
label: '',
|
||||||
|
fieldName: 'cycleData',
|
||||||
|
component: 'Input',
|
||||||
|
dependencies: {
|
||||||
|
show: (formValue) => formValue.attendanceType=='1',
|
||||||
|
triggerFields: ['attendanceType'],
|
||||||
|
},
|
||||||
|
slots:{
|
||||||
|
default:'cycleData'
|
||||||
|
},
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
export const weekdayColumns: VxeGridProps['columns'] = [
|
export const weekdayColumns: TableColumnsType = [
|
||||||
{
|
{
|
||||||
title: '工作日',
|
title: '工作日',
|
||||||
name: 'label',
|
key: 'label',
|
||||||
width:180,
|
width:180,
|
||||||
align:'center',
|
align:'center',
|
||||||
dataIndex:'label'
|
dataIndex:'label'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '班次',
|
title: '班次',
|
||||||
name: 'shift',
|
key: 'shift',
|
||||||
minWidth:180,
|
minWidth:180,
|
||||||
align:'center',
|
align:'center',
|
||||||
dataIndex:'shift'
|
dataIndex:'shift'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '操作',
|
title: '操作',
|
||||||
name: 'action',
|
key: 'action',
|
||||||
dataIndex:'action',
|
dataIndex:'action',
|
||||||
width:180,
|
width:180,
|
||||||
align:'center',
|
align:'center',
|
||||||
slots:{
|
|
||||||
default:'action'
|
|
||||||
},
|
|
||||||
|
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
|
export const noClockingColumns: TableColumnsType = [
|
||||||
|
{
|
||||||
|
title: '无需打卡日期',
|
||||||
|
key: 'label',
|
||||||
|
width:180,
|
||||||
|
align:'center',
|
||||||
|
dataIndex:'label'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
key: 'action',
|
||||||
|
dataIndex:'action',
|
||||||
|
width:180,
|
||||||
|
align:'center',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
export const clockingColumns: TableColumnsType = [
|
||||||
|
{
|
||||||
|
title: '必须打卡日期',
|
||||||
|
key: 'label',
|
||||||
|
width:180,
|
||||||
|
align:'center',
|
||||||
|
dataIndex:'label'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
key: 'action',
|
||||||
|
dataIndex:'action',
|
||||||
|
width:180,
|
||||||
|
align:'center',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
export const cycleColumns: TableColumnsType = [
|
||||||
|
{
|
||||||
|
title: '天数',
|
||||||
|
key: 'label',
|
||||||
|
width:180,
|
||||||
|
align:'center',
|
||||||
|
dataIndex:'label'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '班次',
|
||||||
|
key: 'label',
|
||||||
|
width:180,
|
||||||
|
align:'center',
|
||||||
|
dataIndex:'label'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
key: 'action',
|
||||||
|
dataIndex:'action',
|
||||||
|
width:180,
|
||||||
|
align:'center',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
@@ -13,9 +13,16 @@ import {
|
|||||||
} from '#/api/property/attendanceManagement/attendanceGroupSettings';
|
} from '#/api/property/attendanceManagement/attendanceGroupSettings';
|
||||||
import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
|
import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
|
||||||
|
|
||||||
import {modalSchema, weekdayColumns} from './data';
|
import {
|
||||||
import {Tag, Button, Table} from 'ant-design-vue'
|
clockingColumns,
|
||||||
|
cycleColumns,
|
||||||
|
modalSchema,
|
||||||
|
noClockingColumns,
|
||||||
|
weekdayColumns
|
||||||
|
} from './data';
|
||||||
|
import {Tag, Button, Table, Checkbox} from 'ant-design-vue'
|
||||||
import {getDictOptions} from "#/utils/dict";
|
import {getDictOptions} from "#/utils/dict";
|
||||||
|
import holidayCalendar from './holiday-calendar.vue'
|
||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
|
|
||||||
@@ -24,7 +31,9 @@ const weekdayData = ref<any[]>([])
|
|||||||
const title = computed(() => {
|
const title = computed(() => {
|
||||||
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
|
return isUpdate.value ? $t('pages.common.edit') : $t('pages.common.add');
|
||||||
});
|
});
|
||||||
|
const settingData = ref<any>({
|
||||||
|
isAutomatic: true,
|
||||||
|
})
|
||||||
const [BasicForm, formApi] = useVbenForm({
|
const [BasicForm, formApi] = useVbenForm({
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
// 默认占满两列
|
// 默认占满两列
|
||||||
@@ -50,8 +59,9 @@ const {onBeforeClose, markInitialized, resetInitialized} = useBeforeCloseDiff(
|
|||||||
|
|
||||||
const [BasicModal, modalApi] = useVbenModal({
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
// 在这里更改宽度
|
// 在这里更改宽度
|
||||||
class: 'w-[70%]',
|
class: 'w-[80%]',
|
||||||
fullscreenButton: false,
|
fullscreenButton: false,
|
||||||
|
maskClosable:false,
|
||||||
onBeforeClose,
|
onBeforeClose,
|
||||||
onClosed: handleClosed,
|
onClosed: handleClosed,
|
||||||
onConfirm: handleConfirm,
|
onConfirm: handleConfirm,
|
||||||
@@ -66,18 +76,17 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
if (isUpdate.value && id) {
|
if (isUpdate.value && id) {
|
||||||
const record = await groupInfo(id);
|
const record = await groupInfo(id);
|
||||||
await formApi.setValues(record);
|
await formApi.setValues(record);
|
||||||
}else {
|
} else {
|
||||||
weekdayData.value=[]
|
weekdayData.value = []
|
||||||
getDictOptions('wy_kqgzr').forEach(item=>{
|
getDictOptions('wy_kqgzr').forEach(item => {
|
||||||
weekdayData.value.push({
|
weekdayData.value.push({
|
||||||
dayOfWeek:item.value,
|
dayOfWeek: item.value,
|
||||||
label:item.label,
|
label: item.label,
|
||||||
shift:item.value=='6'||item.value=='7'?'休息':'常规班次:08:00:00~12:00:00 14:00:00~17:00:00'
|
shift: item.value == '6' || item.value == '7' ? '休息' : '常规班次:08:00:00~12:00:00 14:00:00~17:00:00'
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
await markInitialized();
|
await markInitialized();
|
||||||
|
|
||||||
modalApi.modalLoading(false);
|
modalApi.modalLoading(false);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@@ -106,41 +115,95 @@ async function handleClosed() {
|
|||||||
await formApi.resetForm();
|
await formApi.resetForm();
|
||||||
resetInitialized();
|
resetInitialized();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const [HolidayCalendar, holidayApi] = useVbenModal({
|
||||||
|
connectedComponent: holidayCalendar,
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查看法定节假日日历
|
||||||
|
*/
|
||||||
|
async function showHoliday() {
|
||||||
|
holidayApi.open()
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<BasicModal :title="title">
|
<BasicModal :title="title">
|
||||||
<BasicForm>
|
<BasicForm>
|
||||||
<template #weekdaySetting>
|
<template #weekdaySetting>
|
||||||
<div style="font-size: 0.875rem;">
|
<div class="item-font">
|
||||||
<span>快捷设置班次:</span>
|
<span>快捷设置班次:</span>
|
||||||
<Tag color="processing">常规班次:08:00:00~12:00:00 14:00:00~17:00:00</Tag>
|
<Tag color="processing">常规班次:08:00:00~12:00:00 14:00:00~17:00:00</Tag>
|
||||||
<Button type="link">更改班次</Button>
|
<Button type="link">更改班次</Button>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #settingItem>
|
<template #settingItem>
|
||||||
<Table style="width: 100%" bordered :columns="weekdayColumns" :data-source="weekdayData"
|
<div class="item-font" style="width: 100%;">
|
||||||
size="small" :pagination="false">
|
<Table style="width: 100%" bordered :columns="weekdayColumns" :data-source="weekdayData"
|
||||||
<!-- <template #headerCell="{ column }">-->
|
size="small" :pagination="false">
|
||||||
<!-- </template>-->
|
<!-- <template #headerCell="{ column }">-->
|
||||||
<!-- <template #bodyCell="{ column, record }">-->
|
<!-- </template>-->
|
||||||
<!-- <template>-->
|
<!-- <template #bodyCell="{ column, record }">-->
|
||||||
<!-- {{ record[column.field] }}-->
|
<!-- <template>-->
|
||||||
<!-- </template>-->
|
<!-- {{ record[column.field] }}-->
|
||||||
<!-- </template>-->
|
<!-- </template>-->
|
||||||
<!-- <template #action="{row}">-->
|
<!-- </template>-->
|
||||||
<!-- <Button type="link">更改班次</Button>-->
|
<!-- <template #action="{row}">-->
|
||||||
<!-- <Button type="link">休息</Button>-->
|
<!-- <Button type="link">更改班次</Button>-->
|
||||||
<!-- </template>-->
|
<!-- <Button type="link">休息</Button>-->
|
||||||
</Table>
|
<!-- </template>-->
|
||||||
|
</Table>
|
||||||
|
<Checkbox class="item-padding-top" v-model:checked="settingData.isAutomatic">
|
||||||
|
法定节假日自动排休
|
||||||
|
</Checkbox>
|
||||||
|
<!-- https://timor.tech/api/holiday/year/2024 国务院节假日安排API-->
|
||||||
|
<Button type="link" @click="showHoliday">查看法定节假日日历</Button>
|
||||||
|
<p class="item-padding-top item-font-weight">特殊日期:</p>
|
||||||
|
<p class="item-padding">无需打卡日期:</p>
|
||||||
|
<Table style="width: 80%" bordered :columns="noClockingColumns" :data-source="[]"
|
||||||
|
size="small" :pagination="false">
|
||||||
|
</Table>
|
||||||
|
<p class="item-padding">必须打卡日期:</p>
|
||||||
|
<Table style="width: 80%" bordered :columns="clockingColumns" :data-source="[]"
|
||||||
|
size="small" :pagination="false">
|
||||||
|
</Table>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #attendanceShift>
|
<template #attendanceShift>
|
||||||
班次
|
<Button size="small">选择班次</Button>
|
||||||
|
</template>
|
||||||
|
<template #shiftData>
|
||||||
|
<Tag closable color="processing">早班</Tag>
|
||||||
</template>
|
</template>
|
||||||
<template #schedulingCycle>
|
<template #schedulingCycle>
|
||||||
周期
|
<span class="item-font">周期天数4天</span>
|
||||||
|
</template>
|
||||||
|
<template #cycleData>
|
||||||
|
<Table style="width: 100%" bordered :columns="cycleColumns" :data-source="[]"
|
||||||
|
size="small" :pagination="false">
|
||||||
|
</Table>
|
||||||
</template>
|
</template>
|
||||||
</BasicForm>
|
</BasicForm>
|
||||||
|
<HolidayCalendar></HolidayCalendar>
|
||||||
</BasicModal>
|
</BasicModal>
|
||||||
</template>
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.item-font {
|
||||||
|
font-size: 0.875rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-font-weight {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-padding-top {
|
||||||
|
padding-top: 1.1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-padding {
|
||||||
|
padding: 1.1rem 0 0.5rem 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
@@ -0,0 +1,78 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import {ref, shallowRef} from 'vue';
|
||||||
|
import {useVbenModal} from '@vben/common-ui';
|
||||||
|
|
||||||
|
import dayjs, {type Dayjs} from 'dayjs';
|
||||||
|
import duration from 'dayjs/plugin/duration';
|
||||||
|
import relativeTime from 'dayjs/plugin/relativeTime';
|
||||||
|
|
||||||
|
|
||||||
|
dayjs.extend(duration);
|
||||||
|
dayjs.extend(relativeTime);
|
||||||
|
import type {HouseChargeVO} from "#/api/property/costManagement/houseCharge/model";
|
||||||
|
import {getHoliday} from "#/api/property/attendanceManagement/attendanceGroupSettings";
|
||||||
|
import {Calendar, Tag} from 'ant-design-vue'
|
||||||
|
import type {Holiday} from "#/api/property/attendanceManagement/attendanceGroupSettings/model";
|
||||||
|
|
||||||
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
|
onOpenChange: handleOpenChange,
|
||||||
|
onClosed() {
|
||||||
|
houseChargeDetail.value = null;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const houseChargeDetail = shallowRef<null | HouseChargeVO>(null);
|
||||||
|
|
||||||
|
const holidayData = ref<any>({})
|
||||||
|
|
||||||
|
async function handleOpenChange(open: boolean) {
|
||||||
|
if (!open) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
modalApi.modalLoading(true);
|
||||||
|
const res = await getHoliday(new Date().getFullYear());
|
||||||
|
holidayData.value = res.holiday
|
||||||
|
modalApi.modalLoading(false);
|
||||||
|
}
|
||||||
|
|
||||||
|
const day = ref<Holiday>();
|
||||||
|
const getListData = (value: Dayjs) => {
|
||||||
|
const date = value.format('MM-DD');
|
||||||
|
day.value = holidayData.value?.[date] ?? null;
|
||||||
|
return !!day.value;
|
||||||
|
};
|
||||||
|
|
||||||
|
const getMonthData = (value: Dayjs) => {
|
||||||
|
if (value.month() === 8) {
|
||||||
|
return 1394;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BasicModal :footer="false" :fullscreen-button="false" title="法定节假日日历" class="w-[40%]">
|
||||||
|
<Calendar>
|
||||||
|
<template #dateCellRender="{ current }">
|
||||||
|
<div v-if="getListData(current)" style="height: 50px">
|
||||||
|
<Tag v-if="day.holiday" color="blue">
|
||||||
|
<span style="padding: 0 10px">休</span>
|
||||||
|
</Tag>
|
||||||
|
<Tag v-else color="red">
|
||||||
|
<span style="padding: 0 10px">班</span>
|
||||||
|
</Tag>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #monthCellRender="{ current }">
|
||||||
|
<div v-if="getMonthData(current)" class="notes-month">
|
||||||
|
<span>Backlog number</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</Calendar>
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
:deep(.ant-picker-calendar.ant-picker-calendar-full .ant-picker-calendar-date-content) {
|
||||||
|
height: 46px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
@@ -2,7 +2,6 @@
|
|||||||
import { Radio, Select, Button, Table,Calendar } from 'ant-design-vue';
|
import { Radio, Select, Button, Table,Calendar } from 'ant-design-vue';
|
||||||
import type { RadioChangeEvent } from 'ant-design-vue';
|
import type { RadioChangeEvent } from 'ant-design-vue';
|
||||||
import {ref} from 'vue';
|
import {ref} from 'vue';
|
||||||
import dayjs from 'dayjs';
|
|
||||||
import { Dayjs } from 'dayjs';
|
import { Dayjs } from 'dayjs';
|
||||||
import { columns, querySchema } from './data';
|
import { columns, querySchema } from './data';
|
||||||
import {
|
import {
|
||||||
@@ -11,7 +10,6 @@ import {
|
|||||||
type VxeGridProps
|
type VxeGridProps
|
||||||
} from '#/adapter/vxe-table';
|
} from '#/adapter/vxe-table';
|
||||||
import { getVxePopupContainer } from '@vben/utils';
|
import { getVxePopupContainer } from '@vben/utils';
|
||||||
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
|
|
||||||
import {
|
import {
|
||||||
arrangementExport,
|
arrangementExport,
|
||||||
arrangementList,
|
arrangementList,
|
||||||
@@ -22,11 +20,7 @@ import type { ArrangementForm } from '#/api/property/attendanceManagement/arrang
|
|||||||
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
|
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
|
||||||
import { Modal, Popconfirm, Space } from 'ant-design-vue';
|
import { Modal, Popconfirm, Space } from 'ant-design-vue';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const emit = defineEmits<{(e:'changeView',value:boolean):void}>();
|
const emit = defineEmits<{(e:'changeView',value:boolean):void}>();
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
viewMode:'calender' | 'schedule'
|
viewMode:'calender' | 'schedule'
|
||||||
}>();
|
}>();
|
||||||
@@ -40,25 +34,6 @@ function handleViewModeChange(e: RadioChangeEvent): void {
|
|||||||
emit('changeView',e.target.value)
|
emit('changeView',e.target.value)
|
||||||
}
|
}
|
||||||
|
|
||||||
const formOptions: VbenFormProps = {
|
|
||||||
commonConfig: {
|
|
||||||
labelWidth: 80,
|
|
||||||
componentProps: {
|
|
||||||
allowClear: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
schema: querySchema(),
|
|
||||||
wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
|
|
||||||
// 处理区间选择器RangePicker时间格式 将一个字段映射为两个字段 搜索/导出会用到
|
|
||||||
// 不需要直接删除
|
|
||||||
// fieldMappingTime: [
|
|
||||||
// [
|
|
||||||
// 'createTime',
|
|
||||||
// ['params[beginTime]', 'params[endTime]'],
|
|
||||||
// ['YYYY-MM-DD 00:00:00', 'YYYY-MM-DD 23:59:59'],
|
|
||||||
// ],
|
|
||||||
// ],
|
|
||||||
};
|
|
||||||
|
|
||||||
const gridOptions: VxeGridProps = {
|
const gridOptions: VxeGridProps = {
|
||||||
checkboxConfig: {
|
checkboxConfig: {
|
||||||
@@ -90,10 +65,23 @@ const gridOptions: VxeGridProps = {
|
|||||||
keyField: 'id',
|
keyField: 'id',
|
||||||
},
|
},
|
||||||
// 表格全局唯一表示 保存列配置需要用到
|
// 表格全局唯一表示 保存列配置需要用到
|
||||||
id: 'property-arrangement-index'
|
id: 'property-arrangement-index',
|
||||||
|
toolbarConfig: {
|
||||||
|
// 控制工具栏整体是否显示(默认显示)
|
||||||
|
show: true,
|
||||||
|
// 隐藏"刷新/重置"按钮(对应 redo)
|
||||||
|
refresh: false,
|
||||||
|
// 隐藏"全屏"按钮
|
||||||
|
fullscreen: false,
|
||||||
|
// 隐藏"列设置"按钮(对应 setting)
|
||||||
|
columns: false,
|
||||||
|
// 隐藏"表格尺寸"按钮(对应 size)
|
||||||
|
size: undefined,
|
||||||
|
// 其他可能的按钮(如导出等,按需配置)
|
||||||
|
// export: false, // 如果有导出按钮,也可以隐藏
|
||||||
|
},
|
||||||
};
|
};
|
||||||
const [BasicTable, tableApi] = useVbenVxeGrid({
|
const [BasicTable, tableApi] = useVbenVxeGrid({
|
||||||
formOptions,
|
|
||||||
gridOptions,
|
gridOptions,
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -129,7 +117,7 @@ async function handleDelete(row: Required<ArrangementForm>) {
|
|||||||
</div>
|
</div>
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<Page :auto-content-height="true">
|
<Page :auto-content-height="true">
|
||||||
<BasicTable table-title="排班列表">
|
<BasicTable >
|
||||||
<template #action="{ row }">
|
<template #action="{ row }">
|
||||||
<Space>
|
<Space>
|
||||||
<ghost-button
|
<ghost-button
|
||||||
@@ -162,4 +150,3 @@ async function handleDelete(row: Required<ArrangementForm>) {
|
|||||||
</template>
|
</template>
|
||||||
<style>
|
<style>
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
@@ -6,13 +6,11 @@ import {cloneDeep} from '@vben/utils';
|
|||||||
|
|
||||||
import {useVbenForm} from '#/adapter/form';
|
import {useVbenForm} from '#/adapter/form';
|
||||||
import {
|
import {
|
||||||
houseChargeAdd,
|
|
||||||
houseChargeInfo, houseChargeRefund,
|
houseChargeInfo, houseChargeRefund,
|
||||||
houseChargeUpdate
|
|
||||||
} from '#/api/property/costManagement/houseCharge';
|
} from '#/api/property/costManagement/houseCharge';
|
||||||
import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
|
import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
|
||||||
|
|
||||||
import {modalSchemaRefund, modalSchemaUpdate} from './data';
|
import {modalSchemaRefund} from './data';
|
||||||
import {renderDict} from "#/utils/render";
|
import {renderDict} from "#/utils/render";
|
||||||
import {Descriptions, DescriptionsItem, Divider} from "ant-design-vue";
|
import {Descriptions, DescriptionsItem, Divider} from "ant-design-vue";
|
||||||
import type {HouseChargeVO} from "#/api/property/costManagement/houseCharge/model";
|
import type {HouseChargeVO} from "#/api/property/costManagement/houseCharge/model";
|
||||||
@@ -62,14 +60,15 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
modalApi.modalLoading(true);
|
modalApi.modalLoading(true);
|
||||||
const {id} = modalApi.getData() as { id?: number | string };
|
const {id} = modalApi.getData() as { id?: number | string };
|
||||||
isUpdate.value = !!id;
|
isUpdate.value = !!id;
|
||||||
record.value = await houseChargeInfo(id);
|
if(id){
|
||||||
if (record.value) {
|
record.value = await houseChargeInfo(id);
|
||||||
room.value = record.value.roomVo
|
if (record.value) {
|
||||||
costItem.value = record.value.costItemsVo
|
room.value = record.value.roomVo
|
||||||
|
costItem.value = record.value.costItemsVo
|
||||||
|
}
|
||||||
|
await formApi.setValues(record.value);
|
||||||
}
|
}
|
||||||
await formApi.setValues(record.value);
|
|
||||||
await markInitialized();
|
await markInitialized();
|
||||||
|
|
||||||
modalApi.modalLoading(false);
|
modalApi.modalLoading(false);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@@ -83,8 +82,8 @@ async function handleConfirm() {
|
|||||||
}
|
}
|
||||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
||||||
const data = cloneDeep(await formApi.getValues());
|
const data = cloneDeep(await formApi.getValues());
|
||||||
data.costItemsId = record.value.costItemsId
|
data.costItemsId = record.value?.costItemsId
|
||||||
data.personId = record.value.personId
|
data.personId = record.value?.personId
|
||||||
await houseChargeRefund(data);
|
await houseChargeRefund(data);
|
||||||
resetInitialized();
|
resetInitialized();
|
||||||
emit('reload');
|
emit('reload');
|
||||||
@@ -123,7 +122,7 @@ async function handleClosed() {
|
|||||||
{{ record.startTime }}
|
{{ record.startTime }}
|
||||||
</DescriptionsItem>
|
</DescriptionsItem>
|
||||||
<DescriptionsItem label="房间">
|
<DescriptionsItem label="房间">
|
||||||
{{ room.roomNumber }}
|
{{ room?.roomNumber }}
|
||||||
</DescriptionsItem>
|
</DescriptionsItem>
|
||||||
<DescriptionsItem label="面积(㎡)">
|
<DescriptionsItem label="面积(㎡)">
|
||||||
{{ `${room?.area} (套内面积:${room?.insideInArea})` }}
|
{{ `${room?.area} (套内面积:${room?.insideInArea})` }}
|
||||||
|
@@ -3,6 +3,10 @@ import type { VxeGridProps } from '#/adapter/vxe-table';
|
|||||||
import { getPopupContainer } from '@vben/utils';
|
import { getPopupContainer } from '@vben/utils';
|
||||||
import { getDictOptions } from '#/utils/dict';
|
import { getDictOptions } from '#/utils/dict';
|
||||||
import { DictEnum } from '@vben/constants';
|
import { DictEnum } from '@vben/constants';
|
||||||
|
import type { FactoryQuery } from '#/api/sis/factory/model';
|
||||||
|
import { factoryList } from '#/api/sis/factory';
|
||||||
|
import { deviceGroupList } from '#/api/sis/deviceGroup';
|
||||||
|
import type { DeviceGroupQuery } from '#/api/sis/deviceGroup/model';
|
||||||
|
|
||||||
export const querySchema: FormSchemaGetter = () => [
|
export const querySchema: FormSchemaGetter = () => [
|
||||||
{
|
{
|
||||||
@@ -16,9 +20,13 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
label: '设备ip',
|
label: '设备ip',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
component: 'Input',
|
component: 'Select',
|
||||||
fieldName: 'deviceType',
|
fieldName: 'deviceType',
|
||||||
label: '设备类型',
|
label: '设备类型',
|
||||||
|
componentProps: {
|
||||||
|
getPopupContainer,
|
||||||
|
options: getDictOptions(DictEnum.sis_ipc_device_type, true),
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
fieldName: 'deviceStatus',
|
fieldName: 'deviceStatus',
|
||||||
@@ -40,12 +48,16 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
field: 'deviceName',
|
field: 'deviceName',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '厂商编号',
|
title: '设备厂商',
|
||||||
field: 'factoryNo',
|
field: 'factoryName',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '设备类型',
|
title: '设备类型',
|
||||||
field: 'device_type',
|
field: 'deviceTypeName',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '设备组',
|
||||||
|
field: 'groupName',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '设备ip',
|
title: '设备ip',
|
||||||
@@ -90,15 +102,53 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '设备厂商',
|
label: '设备厂商',
|
||||||
fieldName: 'facrotyNo',
|
fieldName: 'factoryNo',
|
||||||
component: 'Input',
|
component: 'ApiSelect',
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
resultField: 'list', // 根据API返回结构调整
|
||||||
|
labelField: 'factoryName',
|
||||||
|
valueField: 'factoryNo',
|
||||||
|
api: async () => {
|
||||||
|
const params: FactoryQuery = {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 500,
|
||||||
|
};
|
||||||
|
const res = await factoryList(params);
|
||||||
|
return res.rows;
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '设备类型',
|
label: '设备类型',
|
||||||
fieldName: 'deviceType',
|
fieldName: 'deviceType',
|
||||||
component: 'Input',
|
component: 'Select',
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
|
componentProps: {
|
||||||
|
getPopupContainer,
|
||||||
|
options: getDictOptions(DictEnum.sis_ipc_device_type, true),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '设备组',
|
||||||
|
fieldName: 'groupId',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
rules: 'required',
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
resultField: 'list', // 根据API返回结构调整
|
||||||
|
labelField: 'name',
|
||||||
|
valueField: 'id',
|
||||||
|
api: async () => {
|
||||||
|
const params: DeviceGroupQuery = {
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 500,
|
||||||
|
};
|
||||||
|
const res = await deviceGroupList(params);
|
||||||
|
return res.rows;
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '设备ip',
|
label: '设备ip',
|
||||||
|
@@ -6,10 +6,16 @@ import { $t } from '@vben/locales';
|
|||||||
import { cloneDeep } from '@vben/utils';
|
import { cloneDeep } from '@vben/utils';
|
||||||
|
|
||||||
import { useVbenForm } from '#/adapter/form';
|
import { useVbenForm } from '#/adapter/form';
|
||||||
import { deviceManageAdd, deviceManageInfo, deviceManageUpdate } from '#/api/sis/deviceManage';
|
import {
|
||||||
|
deviceManageAdd,
|
||||||
|
deviceManageInfo,
|
||||||
|
deviceManageUpdate,
|
||||||
|
} from '#/api/sis/deviceManage';
|
||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||||
|
|
||||||
import { modalSchema } from './data';
|
import { modalSchema } from './data';
|
||||||
|
import { getDictOptions } from '#/utils/dict';
|
||||||
|
import { DictEnum } from '@vben/constants';
|
||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
|
|
||||||
@@ -27,7 +33,7 @@ const [BasicForm, formApi] = useVbenForm({
|
|||||||
// 通用配置项 会影响到所有表单项
|
// 通用配置项 会影响到所有表单项
|
||||||
componentProps: {
|
componentProps: {
|
||||||
class: 'w-full',
|
class: 'w-full',
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
schema: modalSchema(),
|
schema: modalSchema(),
|
||||||
showDefaultActions: false,
|
showDefaultActions: false,
|
||||||
@@ -53,7 +59,6 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
modalApi.modalLoading(true);
|
modalApi.modalLoading(true);
|
||||||
|
|
||||||
const { id } = modalApi.getData() as { id?: number | string };
|
const { id } = modalApi.getData() as { id?: number | string };
|
||||||
isUpdate.value = !!id;
|
isUpdate.value = !!id;
|
||||||
|
|
||||||
@@ -98,4 +103,3 @@ async function handleClosed() {
|
|||||||
<BasicForm />
|
<BasicForm />
|
||||||
</BasicModal>
|
</BasicModal>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@@ -1,7 +1,5 @@
|
|||||||
import type { FormSchemaGetter } from '#/adapter/form';
|
import type { FormSchemaGetter } from '#/adapter/form';
|
||||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||||
import type { DeviceManageQuery } from '#/api/sis/deviceManage/model';
|
|
||||||
import { deviceManageList } from '#/api/sis/deviceManage';
|
|
||||||
|
|
||||||
export const querySchema: FormSchemaGetter = () => [
|
export const querySchema: FormSchemaGetter = () => [
|
||||||
{
|
{
|
||||||
@@ -205,6 +203,5 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
fieldName: 'elevatorControlDeviceId',
|
fieldName: 'elevatorControlDeviceId',
|
||||||
defaultValue: undefined,
|
defaultValue: undefined,
|
||||||
label: '梯控摄像头',
|
label: '梯控摄像头',
|
||||||
|
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
@@ -1,116 +0,0 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import { ref } from 'vue'
|
|
||||||
|
|
||||||
import { cloneDeep } from '@vben/utils'
|
|
||||||
import { useVbenModal } from '@vben/common-ui'
|
|
||||||
import { useVbenForm } from '#/adapter/form'
|
|
||||||
import { queryByUnitId } from '#/api/property/floor'
|
|
||||||
import { refAdd, refQuery } from '#/api/sis/elevatorInfo'
|
|
||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup'
|
|
||||||
|
|
||||||
const dataForm = ref<any>()
|
|
||||||
const title = ref('楼层授权')
|
|
||||||
|
|
||||||
const [BasicForm, formApi] = useVbenForm({
|
|
||||||
// 所有表单项共用,可单独在表单内覆盖
|
|
||||||
commonConfig: {
|
|
||||||
// 默认占满两列
|
|
||||||
formItemClass: 'col-span-1',
|
|
||||||
// 所有表单项
|
|
||||||
componentProps: {
|
|
||||||
class: 'w-full',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
layout: 'horizontal',
|
|
||||||
schema: [
|
|
||||||
{
|
|
||||||
component: 'CheckboxGroup',
|
|
||||||
componentProps: {
|
|
||||||
name: 'cname',
|
|
||||||
options: [],
|
|
||||||
},
|
|
||||||
defaultValue: [],
|
|
||||||
fieldName: 'floorNums',
|
|
||||||
label: '楼层'
|
|
||||||
}],
|
|
||||||
wrapperClass: 'grid-cols-1',
|
|
||||||
showDefaultActions: false
|
|
||||||
})
|
|
||||||
|
|
||||||
const [BasicModal, modalApi] = useVbenModal({
|
|
||||||
// 在这里更改宽度
|
|
||||||
class: 'w-[700px]',
|
|
||||||
fullscreenButton: false,
|
|
||||||
loading: true,
|
|
||||||
onClosed: handleClosed,
|
|
||||||
onConfirm: handleConfirm,
|
|
||||||
onOpened: handleInit,
|
|
||||||
})
|
|
||||||
|
|
||||||
function handleInit() {
|
|
||||||
dataForm.value = modalApi.getData()
|
|
||||||
const { unitId } = modalApi.getData()
|
|
||||||
queryByUnitId(unitId).then((res) => {
|
|
||||||
const arr: any[] = []
|
|
||||||
res.forEach((item) => {
|
|
||||||
arr.push({
|
|
||||||
label: item.floorName,
|
|
||||||
value: item.floorNumber,
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
formApi.updateSchema([
|
|
||||||
{
|
|
||||||
fieldName: 'floorNums',
|
|
||||||
componentProps: { options: arr },
|
|
||||||
}
|
|
||||||
])
|
|
||||||
handleChecked()
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function handleChecked() {
|
|
||||||
const { elevatorId } = modalApi.getData()
|
|
||||||
refQuery(elevatorId).then((res) => {
|
|
||||||
const arr: any[] = []
|
|
||||||
res.forEach((item) => {
|
|
||||||
arr.push(item.floorNum)
|
|
||||||
})
|
|
||||||
formApi.setFieldValue('floorNums', arr)
|
|
||||||
}).finally(() => {
|
|
||||||
modalApi.setState({ loading: false });
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const { resetInitialized } = useBeforeCloseDiff(
|
|
||||||
{
|
|
||||||
initializedGetter: defaultFormValueGetter(formApi),
|
|
||||||
currentGetter: defaultFormValueGetter(formApi),
|
|
||||||
},
|
|
||||||
)
|
|
||||||
|
|
||||||
async function handleConfirm() {
|
|
||||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
|
||||||
const data = cloneDeep(await formApi.getValues())
|
|
||||||
const params = {
|
|
||||||
elevatorId: dataForm.value.elevatorId,
|
|
||||||
floorNums: data.floorNums
|
|
||||||
}
|
|
||||||
refAdd(params).finally(() => {
|
|
||||||
modalApi.close()
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
async function handleClosed() {
|
|
||||||
await formApi.resetForm()
|
|
||||||
resetInitialized()
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<BasicModal :title="title">
|
|
||||||
<BasicForm />
|
|
||||||
</BasicModal>
|
|
||||||
</template>
|
|
@@ -25,7 +25,6 @@ import { commonDownloadExcel } from '#/utils/file/download';
|
|||||||
|
|
||||||
import elevatorInfoModal from './elevatorInfo-modal.vue';
|
import elevatorInfoModal from './elevatorInfo-modal.vue';
|
||||||
import { columns, querySchema } from './data';
|
import { columns, querySchema } from './data';
|
||||||
import floorAuthModal from './floorAuth-modal.vue';
|
|
||||||
|
|
||||||
const formOptions: VbenFormProps = {
|
const formOptions: VbenFormProps = {
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
@@ -89,10 +88,6 @@ const [ElevatorInfoModal, modalApi] = useVbenModal({
|
|||||||
connectedComponent: elevatorInfoModal,
|
connectedComponent: elevatorInfoModal,
|
||||||
});
|
});
|
||||||
|
|
||||||
const [FloorAuthModal, floorAuthModalApi] = useVbenModal({
|
|
||||||
connectedComponent: floorAuthModal,
|
|
||||||
});
|
|
||||||
|
|
||||||
function handleAdd() {
|
function handleAdd() {
|
||||||
modalApi.setData({});
|
modalApi.setData({});
|
||||||
modalApi.open();
|
modalApi.open();
|
||||||
@@ -128,11 +123,6 @@ function handleDownloadExcel() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleAuth(row: Required<ElevatorInfoForm>) {
|
|
||||||
floorAuthModalApi.setData({ unitId: row.unitId, elevatorId: row.elevatorId });
|
|
||||||
floorAuthModalApi.open();
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -165,8 +155,6 @@ function handleAuth(row: Required<ElevatorInfoForm>) {
|
|||||||
</template>
|
</template>
|
||||||
<template #action="{ row }">
|
<template #action="{ row }">
|
||||||
<Space>
|
<Space>
|
||||||
<ghost-button @click.stop="handleAuth(row)">楼层授权</ghost-button>
|
|
||||||
|
|
||||||
<ghost-button
|
<ghost-button
|
||||||
v-access:code="['sis:elevatorInfo:edit']"
|
v-access:code="['sis:elevatorInfo:edit']"
|
||||||
@click.stop="handleEdit(row)"
|
@click.stop="handleEdit(row)"
|
||||||
@@ -191,6 +179,5 @@ function handleAuth(row: Required<ElevatorInfoForm>) {
|
|||||||
</template>
|
</template>
|
||||||
</BasicTable>
|
</BasicTable>
|
||||||
<ElevatorInfoModal @reload="tableApi.query()" />
|
<ElevatorInfoModal @reload="tableApi.query()" />
|
||||||
<FloorAuthModal @reload="tableApi.query()" />
|
|
||||||
</Page>
|
</Page>
|
||||||
</template>
|
</template>
|
||||||
|
@@ -1,7 +1,6 @@
|
|||||||
import type { FormSchemaGetter } from '#/adapter/form';
|
import type { FormSchemaGetter } from '#/adapter/form';
|
||||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||||
|
|
||||||
|
|
||||||
export const querySchema: FormSchemaGetter = () => [
|
export const querySchema: FormSchemaGetter = () => [
|
||||||
{
|
{
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
@@ -11,17 +10,7 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
{
|
{
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
fieldName: 'factoryName',
|
fieldName: 'factoryName',
|
||||||
label: '设备厂商名称',
|
label: '厂商名称',
|
||||||
},
|
|
||||||
{
|
|
||||||
component: 'Input',
|
|
||||||
fieldName: 'dataState',
|
|
||||||
label: '数据状态:1有效,0无效',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
component: 'Input',
|
|
||||||
fieldName: 'searchValue',
|
|
||||||
label: '搜索值',
|
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
@@ -29,30 +18,18 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
// export const columns: () => VxeGridProps['columns'] = () => [
|
// export const columns: () => VxeGridProps['columns'] = () => [
|
||||||
export const columns: VxeGridProps['columns'] = [
|
export const columns: VxeGridProps['columns'] = [
|
||||||
{ type: 'checkbox', width: 60 },
|
{ type: 'checkbox', width: 60 },
|
||||||
{
|
|
||||||
title: '',
|
|
||||||
field: 'id',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: '厂商编码',
|
title: '厂商编码',
|
||||||
field: 'factoryNo',
|
field: 'factoryNo',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '设备厂商名称',
|
title: '厂商名称',
|
||||||
field: 'factoryName',
|
field: 'factoryName',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '备注',
|
title: '备注',
|
||||||
field: 'remark',
|
field: 'remark',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: '数据状态:1有效,0无效',
|
|
||||||
field: 'dataState',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '搜索值',
|
|
||||||
field: 'searchValue',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
field: 'action',
|
field: 'action',
|
||||||
fixed: 'right',
|
fixed: 'right',
|
||||||
@@ -79,7 +56,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
rules: 'required',
|
rules: 'required',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '设备厂商名称',
|
label: '厂商名称',
|
||||||
fieldName: 'factoryName',
|
fieldName: 'factoryName',
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
@@ -89,15 +66,4 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
fieldName: 'remark',
|
fieldName: 'remark',
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
label: '数据状态:1有效,0无效',
|
|
||||||
fieldName: 'dataState',
|
|
||||||
component: 'Input',
|
|
||||||
rules: 'required',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '搜索值',
|
|
||||||
fieldName: 'searchValue',
|
|
||||||
component: 'Input',
|
|
||||||
},
|
|
||||||
];
|
];
|
@@ -6,7 +6,7 @@ import { $t } from '@vben/locales';
|
|||||||
import { cloneDeep } from '@vben/utils';
|
import { cloneDeep } from '@vben/utils';
|
||||||
|
|
||||||
import { useVbenForm } from '#/adapter/form';
|
import { useVbenForm } from '#/adapter/form';
|
||||||
import { factoryAdd, factoryInfo, factoryUpdate } from '#/api/property/factory';
|
import { factoryAdd, factoryInfo, factoryUpdate } from '#/api/sis/factory';
|
||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||||
|
|
||||||
import { modalSchema } from './data';
|
import { modalSchema } from './data';
|
@@ -1,25 +1,16 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import type { Recordable } from '@vben/types';
|
|
||||||
|
|
||||||
import { ref } from 'vue';
|
|
||||||
|
|
||||||
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
|
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
|
||||||
import { getVxePopupContainer } from '@vben/utils';
|
import { getVxePopupContainer } from '@vben/utils';
|
||||||
|
|
||||||
import { Modal, Popconfirm, Space } from 'ant-design-vue';
|
import { Modal, Popconfirm, Space } from 'ant-design-vue';
|
||||||
import dayjs from 'dayjs';
|
|
||||||
|
|
||||||
import {
|
import {
|
||||||
useVbenVxeGrid,
|
useVbenVxeGrid,
|
||||||
vxeCheckboxChecked,
|
vxeCheckboxChecked,
|
||||||
type VxeGridProps
|
type VxeGridProps,
|
||||||
} from '#/adapter/vxe-table';
|
} from '#/adapter/vxe-table';
|
||||||
|
|
||||||
import {
|
import { factoryExport, factoryList, factoryRemove } from '#/api/sis/factory';
|
||||||
factoryExport,
|
|
||||||
factoryList,
|
|
||||||
factoryRemove,
|
|
||||||
} from '#/api/property/factory';
|
|
||||||
import type { FactoryForm } from '#/api/property/factory/model';
|
import type { FactoryForm } from '#/api/property/factory/model';
|
||||||
import { commonDownloadExcel } from '#/utils/file/download';
|
import { commonDownloadExcel } from '#/utils/file/download';
|
||||||
|
|
||||||
@@ -76,7 +67,7 @@ const gridOptions: VxeGridProps = {
|
|||||||
keyField: 'id',
|
keyField: 'id',
|
||||||
},
|
},
|
||||||
// 表格全局唯一表示 保存列配置需要用到
|
// 表格全局唯一表示 保存列配置需要用到
|
||||||
id: 'property-factory-index'
|
id: 'property-factory-index',
|
||||||
};
|
};
|
||||||
|
|
||||||
const [BasicTable, tableApi] = useVbenVxeGrid({
|
const [BasicTable, tableApi] = useVbenVxeGrid({
|
||||||
@@ -118,9 +109,14 @@ function handleMultiDelete() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function handleDownloadExcel() {
|
function handleDownloadExcel() {
|
||||||
commonDownloadExcel(factoryExport, '厂商管理数据', tableApi.formApi.form.values, {
|
commonDownloadExcel(
|
||||||
fieldMappingTime: formOptions.fieldMappingTime,
|
factoryExport,
|
||||||
});
|
'厂商管理数据',
|
||||||
|
tableApi.formApi.form.values,
|
||||||
|
{
|
||||||
|
fieldMappingTime: formOptions.fieldMappingTime,
|
||||||
|
},
|
||||||
|
);
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -140,7 +136,8 @@ function handleDownloadExcel() {
|
|||||||
danger
|
danger
|
||||||
type="primary"
|
type="primary"
|
||||||
v-access:code="['property:factory:remove']"
|
v-access:code="['property:factory:remove']"
|
||||||
@click="handleMultiDelete">
|
@click="handleMultiDelete"
|
||||||
|
>
|
||||||
{{ $t('pages.common.delete') }}
|
{{ $t('pages.common.delete') }}
|
||||||
</a-button>
|
</a-button>
|
||||||
<a-button
|
<a-button
|
@@ -1,4 +1,4 @@
|
|||||||
import { type FormSchemaGetter, type VbenFormSchema } from '#/adapter/form';
|
import { type FormSchemaGetter } from '#/adapter/form';
|
||||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||||
|
|
||||||
import { DictEnum } from '@vben/constants';
|
import { DictEnum } from '@vben/constants';
|
||||||
|
@@ -1,5 +1,4 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import type { PropType } from 'vue';
|
|
||||||
import { onMounted, ref } from 'vue';
|
import { onMounted, ref } from 'vue';
|
||||||
import { SyncOutlined } from '@ant-design/icons-vue';
|
import { SyncOutlined } from '@ant-design/icons-vue';
|
||||||
import { InputSearch, Skeleton, Tree } from 'ant-design-vue';
|
import { InputSearch, Skeleton, Tree } from 'ant-design-vue';
|
||||||
@@ -11,21 +10,15 @@ defineOptions({ inheritAttrs: false });
|
|||||||
withDefaults(defineProps<{ showSearch?: boolean }>(), { showSearch: true });
|
withDefaults(defineProps<{ showSearch?: boolean }>(), { showSearch: true });
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{
|
||||||
/**
|
|
||||||
* 点击刷新按钮的事件
|
checked: [];
|
||||||
*/
|
|
||||||
reload: [];
|
|
||||||
/**
|
/**
|
||||||
* 点击节点的事件
|
* 点击节点的事件
|
||||||
*/
|
*/
|
||||||
|
reload: [];
|
||||||
select: [];
|
select: [];
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const channelId = defineModel('channelId', {
|
|
||||||
required: true,
|
|
||||||
type: Array as PropType<string[]>,
|
|
||||||
});
|
|
||||||
|
|
||||||
const searchValue = defineModel('searchValue', {
|
const searchValue = defineModel('searchValue', {
|
||||||
type: String,
|
type: String,
|
||||||
default: '',
|
default: '',
|
||||||
@@ -39,7 +32,6 @@ const showTreeSkeleton = ref<boolean>(true);
|
|||||||
async function loadChannelTree() {
|
async function loadChannelTree() {
|
||||||
showTreeSkeleton.value = true;
|
showTreeSkeleton.value = true;
|
||||||
searchValue.value = '';
|
searchValue.value = '';
|
||||||
channelId.value = [];
|
|
||||||
const ret = await treeList();
|
const ret = await treeList();
|
||||||
channelTree.value = ret;
|
channelTree.value = ret;
|
||||||
showTreeSkeleton.value = false;
|
showTreeSkeleton.value = false;
|
||||||
@@ -85,14 +77,14 @@ onMounted(loadChannelTree);
|
|||||||
<Tree
|
<Tree
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
v-if="channelTree.length > 0"
|
v-if="channelTree.length > 0"
|
||||||
v-model:selected-keys="channelId"
|
|
||||||
:class="$attrs.class"
|
:class="$attrs.class"
|
||||||
:field-names="{ title: 'label', key: 'id' }"
|
|
||||||
:show-line="{ showLeafIcon: false }"
|
:show-line="{ showLeafIcon: false }"
|
||||||
:tree-data="channelTree"
|
:tree-data="channelTree"
|
||||||
:virtual="false"
|
:virtual="false"
|
||||||
default-expand-all
|
default-expand-all
|
||||||
|
checkable
|
||||||
@select="$emit('select')"
|
@select="$emit('select')"
|
||||||
|
@check="$emit('checked')"
|
||||||
>
|
>
|
||||||
<template #title="{ label }">
|
<template #title="{ label }">
|
||||||
<span v-if="label.indexOf(searchValue) > -1">
|
<span v-if="label.indexOf(searchValue) > -1">
|
||||||
|
@@ -0,0 +1,4 @@
|
|||||||
|
export interface CacheNode {
|
||||||
|
player: any; // 播放器控制对象
|
||||||
|
data: any; // 播放节点参数
|
||||||
|
}
|
||||||
|
@@ -2,36 +2,286 @@
|
|||||||
<Page class="h-full w-full">
|
<Page class="h-full w-full">
|
||||||
<!-- 设备分组区域 -->
|
<!-- 设备分组区域 -->
|
||||||
<div class="flex h-full gap-[8px]">
|
<div class="flex h-full gap-[8px]">
|
||||||
<ChannelTree v-model:channel-id="channelId" class="w-[260px]" />
|
<ChannelTree class="w-[260px]" @check="onNodeChecked" />
|
||||||
|
|
||||||
<!-- 设备分组区域 -->
|
<!-- 设备分组区域 -->
|
||||||
<div class="bg-background flex-1">
|
<div class="bg-background flex-1">
|
||||||
<div class="video-play-area h-[calc(100%-40px)]">
|
<div class="video-play-area flex h-[calc(100%-40px)] flex-wrap">
|
||||||
<div
|
<div
|
||||||
v-for="i in playerNum"
|
v-for="i in playerNum"
|
||||||
|
:style="playerStyle"
|
||||||
class="player"
|
class="player"
|
||||||
:class="'player-' + i"
|
:class="`layer-${i} ${currentSelectPlayerIndex == i ? selected : ''}`"
|
||||||
></div>
|
@click="playerSelect(i)"
|
||||||
|
>
|
||||||
|
<video
|
||||||
|
style="width: 100%; height: 100%"
|
||||||
|
:ref="setItemRef"
|
||||||
|
muted
|
||||||
|
autoplay
|
||||||
|
></video>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="player-area h-[40px]">
|
<div class="player-area flex h-[40px] gap-[5px]">
|
||||||
|
<div @click="onPlayerNumChanged(1)" class="h-[40px] w-[40px]">1</div>
|
||||||
|
<div @click="onPlayerNumChanged(2)" class="h-[40px] w-[40px]">2</div>
|
||||||
|
<div @click="onPlayerNumChanged(3)" class="h-[40px] w-[40px]">3</div>
|
||||||
|
<div @click="onPlayerNumChanged(4)" class="h-[40px] w-[40px]">4</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Page>
|
</Page>
|
||||||
>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref } from 'vue';
|
import { onMounted, onUnmounted, ref, toRaw } from 'vue';
|
||||||
import { Page } from '@vben/common-ui';
|
import { Page } from '@vben/common-ui';
|
||||||
import ChannelTree from './channel-tree.vue';
|
import ChannelTree from './channel-tree.vue';
|
||||||
|
import mpegts from 'mpegts.js';
|
||||||
|
import { message } from 'ant-design-vue';
|
||||||
|
import { addStreamProxy } from '#/api/sis/stream';
|
||||||
|
import type { AddStreamProxyQuery } from '#/api/sis/stream/model';
|
||||||
|
|
||||||
|
const selected = 'selected';
|
||||||
|
|
||||||
|
const itemRefs = ref<HTMLVideoElement[]>([]);
|
||||||
|
const setItemRef = (el: any) => {
|
||||||
|
if (el) {
|
||||||
|
itemRefs.value.push(el);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const channelId = ref("");
|
|
||||||
/**
|
/**
|
||||||
* 屏幕播放器数量
|
* 屏幕播放器数量
|
||||||
*/
|
*/
|
||||||
const playerNum = ref(1);
|
const playerNum = ref(1);
|
||||||
|
/**
|
||||||
|
* 屏幕播放器样式
|
||||||
|
*/
|
||||||
|
const playerStyle = ref({
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
});
|
||||||
|
const currentSelectPlayerIndex = ref(-1);
|
||||||
|
|
||||||
|
function playerSelect(index: number) {
|
||||||
|
if (index === currentSelectPlayerIndex.value) {
|
||||||
|
currentSelectPlayerIndex.value = -1;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
currentSelectPlayerIndex.value = index;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 播放器数量
|
||||||
|
* @param val
|
||||||
|
*/
|
||||||
|
function onPlayerNumChanged(val: number) {
|
||||||
|
// 1个屏幕
|
||||||
|
if (val === 1) {
|
||||||
|
playerStyle.value = {
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
};
|
||||||
|
playerNum.value = 1;
|
||||||
|
}
|
||||||
|
// 4个屏幕 2*2
|
||||||
|
else if (val === 2) {
|
||||||
|
playerStyle.value = {
|
||||||
|
width: '50%',
|
||||||
|
height: '50%',
|
||||||
|
};
|
||||||
|
playerNum.value = 4;
|
||||||
|
}
|
||||||
|
// 9个屏幕 3*3
|
||||||
|
else if (val === 3) {
|
||||||
|
playerStyle.value = {
|
||||||
|
width: '33.33%',
|
||||||
|
height: '33.33%',
|
||||||
|
};
|
||||||
|
playerNum.value = 9;
|
||||||
|
}
|
||||||
|
// 16个屏幕 4*4
|
||||||
|
else {
|
||||||
|
playerStyle.value = {
|
||||||
|
width: '25%',
|
||||||
|
height: '25%',
|
||||||
|
};
|
||||||
|
playerNum.value = 16;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 处理带有子节点的数据
|
||||||
|
* @param node
|
||||||
|
* @param newNode
|
||||||
|
*/
|
||||||
|
function handleParentNoe(node: any, newNode: any[] = []) {
|
||||||
|
if (node.children && node.children.length >= 1) {
|
||||||
|
node.children.forEach((item: any) => {
|
||||||
|
if (item.level === 2) {
|
||||||
|
newNode.push(toRaw(item.data));
|
||||||
|
}
|
||||||
|
if (item.children && item.children.length >= 1) {
|
||||||
|
handleParentNoe(item.children, newNode);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 播放器数据, 每一个位置代表页面上行的一个矩形
|
||||||
|
const playerList: any[] = [];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 节点选中时间处理
|
||||||
|
* @param _val 选中节点id
|
||||||
|
* @param checked 是否选中
|
||||||
|
* @param node 节点数据
|
||||||
|
*/
|
||||||
|
function onNodeChecked(
|
||||||
|
_val: any,
|
||||||
|
{ checked, node }: { checked: boolean; node: any },
|
||||||
|
) {
|
||||||
|
// 此次操作需要新增或者删除节点
|
||||||
|
let checkNode: any = [];
|
||||||
|
if (node.level === 1) {
|
||||||
|
handleParentNoe(node, checkNode);
|
||||||
|
} else {
|
||||||
|
checkNode.push(toRaw(node.data));
|
||||||
|
}
|
||||||
|
// 新增
|
||||||
|
if (checked) {
|
||||||
|
if (currentSelectPlayerIndex.value === -1 && checkNode.length == 0) {
|
||||||
|
doPlayer(checkNode[0], currentSelectPlayerIndex.value);
|
||||||
|
}
|
||||||
|
// 批量播放 currentSelectPlayerIndex 将不再生效
|
||||||
|
else {
|
||||||
|
checkNode.forEach((item: any) => {
|
||||||
|
// 判断当前摄像数据是否已经在播放,如果在播放则此次不进行播放处理.默认选中最后一个
|
||||||
|
let firstFreePlayerIndex = playerNum.value - 1;
|
||||||
|
// 记录第一个空播放器是否已找到
|
||||||
|
let isRecord = false;
|
||||||
|
// 此次选中的设备是否播放
|
||||||
|
let isPlayer = true;
|
||||||
|
for (let i = 0; i < playerNum.value; i++) {
|
||||||
|
// 记录第一个出现空播放器的索引
|
||||||
|
const playerData = playerList[i];
|
||||||
|
// 没找到空播放器,并且此次循环播放器为null
|
||||||
|
if (!isRecord && !playerData) {
|
||||||
|
firstFreePlayerIndex = i;
|
||||||
|
isRecord = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (playerData && playerData.data.id == item.id) {
|
||||||
|
isRecord = false;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (isPlayer) {
|
||||||
|
doPlayer(item, firstFreePlayerIndex);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 删除
|
||||||
|
else {
|
||||||
|
checkNode.forEach((item: any) => {
|
||||||
|
for (let i = 0; i < playerNum.value; i++) {
|
||||||
|
const player = playerList[i];
|
||||||
|
if (player && player.data.id === item.id) {
|
||||||
|
closePlayer(i);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 开始播放视频流
|
||||||
|
* @param nodeData 播放的节点数据
|
||||||
|
* @param index 播放器的索引信息
|
||||||
|
*/
|
||||||
|
function doPlayer(nodeData: any, index: number) {
|
||||||
|
if (mpegts.isSupported()) {
|
||||||
|
const params = {
|
||||||
|
videoIp: nodeData.deviceIp,
|
||||||
|
videoPort: nodeData.devicePort,
|
||||||
|
factoryNo: nodeData.factoryNo,
|
||||||
|
account: nodeData.deviceAccount,
|
||||||
|
pwd: nodeData.devicePwd,
|
||||||
|
channelId: nodeData.channelNo,
|
||||||
|
};
|
||||||
|
addStreamProxy(params).then((res) => {
|
||||||
|
const url = res.wsFlv;
|
||||||
|
closePlayer(index);
|
||||||
|
const videoConfig = {
|
||||||
|
type: 'flv',
|
||||||
|
url: url,
|
||||||
|
isLive: true,
|
||||||
|
hasAudio: true,
|
||||||
|
hasVideo: true,
|
||||||
|
enableWorker: true, // 启用分离的线程进行转码
|
||||||
|
enableStashBuffer: false, // 关闭IO隐藏缓冲区
|
||||||
|
stashInitialSize: 128, // 减少首帧显示等待时长
|
||||||
|
};
|
||||||
|
const playerConfig = {
|
||||||
|
enableErrorRecover: true, // 启用错误恢复
|
||||||
|
autoCleanupMaxBackwardDuration: 30,
|
||||||
|
autoCleanupMinBackwardDuration: 10,
|
||||||
|
};
|
||||||
|
const player = mpegts.createPlayer(videoConfig, playerConfig);
|
||||||
|
const videoElement = itemRefs.value[index];
|
||||||
|
if (videoElement) {
|
||||||
|
player.attachMediaElement(videoElement);
|
||||||
|
player.load();
|
||||||
|
player.play();
|
||||||
|
playerList[index] = {
|
||||||
|
player,
|
||||||
|
data: nodeData,
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
console.log('视频播放元素获取异常');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
message.error('浏览器不支持播放');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function closePlayer(index: number) {
|
||||||
|
// 如果播放器存在,尝试关闭
|
||||||
|
const pData = playerList[index];
|
||||||
|
if (pData) {
|
||||||
|
try {
|
||||||
|
const player = pData.player;
|
||||||
|
player.pause(); // 暂停
|
||||||
|
player.unload(); // 卸载
|
||||||
|
player.destroy(); // 销毁
|
||||||
|
playerList[index] = null;
|
||||||
|
} catch (e) {
|
||||||
|
console.log('播放器关闭失败,e=', e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
// 初始化不加载任何视频
|
||||||
|
});
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
for (let i = 0; i < playerList.length; i++) {
|
||||||
|
closePlayer(i);
|
||||||
|
}
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style></style>
|
<style scoped>
|
||||||
|
.player {
|
||||||
|
border: 1px solid #e4e4e7;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.player.selected {
|
||||||
|
border: 2px solid deepskyblue;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
@@ -28,8 +28,8 @@ export default defineConfig(async () => {
|
|||||||
rewrite: (path) => path.replace(/^\/api/, ''),
|
rewrite: (path) => path.replace(/^\/api/, ''),
|
||||||
// mock代理目标地址
|
// mock代理目标地址
|
||||||
// target: 'http://192.168.43.169:8080',
|
// target: 'http://192.168.43.169:8080',
|
||||||
target: 'https://by.missmoc.top/api/',
|
// target: 'https://by.missmoc.top/api/',
|
||||||
// target: 'http://192.168.0.108:8080',
|
target: 'http://192.168.0.108:8080',
|
||||||
// target: 'http://192.168.0.106:8080',
|
// target: 'http://192.168.0.106:8080',
|
||||||
// target: 'http://47.109.37.87:3010',
|
// target: 'http://47.109.37.87:3010',
|
||||||
ws: true,
|
ws: true,
|
||||||
|
@@ -21,6 +21,7 @@ export const DictEnum = {
|
|||||||
wy_fjzt: 'wy_fjzt', // 房间状态
|
wy_fjzt: 'wy_fjzt', // 房间状态
|
||||||
wy_direction_towards: 'direction_towards', // 房间朝向
|
wy_direction_towards: 'direction_towards', // 房间朝向
|
||||||
sis_device_status: 'sis_device_status', //设备在线状态
|
sis_device_status: 'sis_device_status', //设备在线状态
|
||||||
|
sis_ipc_device_type: 'sis_ipc_device_type', //设备在线状态
|
||||||
wy_sf:'wy_sf',//是否可售
|
wy_sf:'wy_sf',//是否可售
|
||||||
SIS_ACCESS_CONTROL_DEVICE_TYPE: 'sis_access_control_device_type',
|
SIS_ACCESS_CONTROL_DEVICE_TYPE: 'sis_access_control_device_type',
|
||||||
SIS_LIB_TYPE: 'sis_lib_type',
|
SIS_LIB_TYPE: 'sis_lib_type',
|
||||||
|
Reference in New Issue
Block a user