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:
@@ -42,6 +42,14 @@ export function applicationAdd(data: ApplicationForm) {
|
|||||||
return requestClient.postWithMsg<void>('/property/application', data);
|
return requestClient.postWithMsg<void>('/property/application', data);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 领用审核
|
||||||
|
* @param data
|
||||||
|
*/
|
||||||
|
export function applicationVerified(data: ApplicationForm) {
|
||||||
|
return requestClient.postWithMsg<void>('/property/application/verified', data);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 更新资产领用
|
* 更新资产领用
|
||||||
* @param data
|
* @param data
|
||||||
|
@@ -12,6 +12,22 @@ import { requestClient } from '#/api/request';
|
|||||||
export function workOrdersTypeList(params?: WorkOrdersTypeQuery) {
|
export function workOrdersTypeList(params?: WorkOrdersTypeQuery) {
|
||||||
return requestClient.get<PageResult<WorkOrdersTypeVO>>('/property/workOrdersType/list', { params });
|
return requestClient.get<PageResult<WorkOrdersTypeVO>>('/property/workOrdersType/list', { params });
|
||||||
}
|
}
|
||||||
|
/**
|
||||||
|
* 查询工单类型不分页
|
||||||
|
* @param params
|
||||||
|
* @returns 工单类型管理列表
|
||||||
|
*/
|
||||||
|
export function workOrdersTypeListAll(params?: WorkOrdersTypeQuery) {
|
||||||
|
return requestClient.get<WorkOrdersTypeVO[]>('/property/workOrdersType/queryList', { params });
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 查询工单类型树结构
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export function workOrdersTypeTree(params?: WorkOrdersTypeQuery) {
|
||||||
|
return requestClient.get<WorkOrdersTypeVO[]>('/property/workOrdersType/typeTree', { params });
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 导出工单类型管理列表
|
* 导出工单类型管理列表
|
||||||
|
@@ -1,4 +1,4 @@
|
|||||||
import type { PageQuery, BaseEntity } from '#/api/common';
|
import type {PageQuery, BaseEntity} from '#/api/common';
|
||||||
|
|
||||||
export interface WorkOrdersTypeVO {
|
export interface WorkOrdersTypeVO {
|
||||||
/**
|
/**
|
||||||
@@ -34,7 +34,9 @@ export interface WorkOrdersTypeVO {
|
|||||||
/**
|
/**
|
||||||
* 是否支持转单(0支持,1不支持)
|
* 是否支持转单(0支持,1不支持)
|
||||||
*/
|
*/
|
||||||
isTransfers: number;
|
isTransfers: string;
|
||||||
|
|
||||||
|
excludeId: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface WorkOrdersTypeForm extends BaseEntity {
|
export interface WorkOrdersTypeForm extends BaseEntity {
|
||||||
@@ -72,6 +74,11 @@ export interface WorkOrdersTypeForm extends BaseEntity {
|
|||||||
* 是否支持转单(0支持,1不支持)
|
* 是否支持转单(0支持,1不支持)
|
||||||
*/
|
*/
|
||||||
isTransfers?: number;
|
isTransfers?: number;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 上级类型id
|
||||||
|
*/
|
||||||
|
parentId?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface WorkOrdersTypeQuery extends PageQuery {
|
export interface WorkOrdersTypeQuery extends PageQuery {
|
||||||
@@ -109,4 +116,9 @@ export interface WorkOrdersTypeQuery extends PageQuery {
|
|||||||
* 日期范围参数
|
* 日期范围参数
|
||||||
*/
|
*/
|
||||||
params?: any;
|
params?: any;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否过滤子级
|
||||||
|
*/
|
||||||
|
filterSubNodes?: boolean;
|
||||||
}
|
}
|
||||||
|
@@ -109,6 +109,7 @@ async function setupPackageSelect() {
|
|||||||
const assets = await assetList({
|
const assets = await assetList({
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
pageSize: 1000,
|
pageSize: 1000,
|
||||||
|
params: {stock: 1} //库存不为0
|
||||||
});
|
});
|
||||||
assetsData.value = assets.rows
|
assetsData.value = assets.rows
|
||||||
const options = users.rows.map((item) => ({
|
const options = users.rows.map((item) => ({
|
||||||
@@ -145,7 +146,8 @@ async function setupPackageSelect() {
|
|||||||
if (assetInfo) {
|
if (assetInfo) {
|
||||||
formApi.updateSchema([{
|
formApi.updateSchema([{
|
||||||
componentProps: {
|
componentProps: {
|
||||||
max:assetInfo.stock
|
max: assetInfo.stock,
|
||||||
|
min: 1
|
||||||
},
|
},
|
||||||
fieldName: 'number',
|
fieldName: 'number',
|
||||||
}])
|
}])
|
||||||
|
@@ -28,7 +28,7 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
options:getDictOptions(DictEnum.WY_ZCSHZT)
|
options:getDictOptions(DictEnum.WY_ZCSHZT)
|
||||||
},
|
},
|
||||||
fieldName: 'state',
|
fieldName: 'state',
|
||||||
label: '领用状态',
|
label: '审核状态',
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
// component: 'Input',
|
// component: 'Input',
|
||||||
@@ -78,7 +78,7 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
field: 'applicationTime',
|
field: 'applicationTime',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '领用状态',
|
title: '审核状态',
|
||||||
field: 'state',
|
field: 'state',
|
||||||
slots: {
|
slots: {
|
||||||
default: ({ row }) => {
|
default: ({ row }) => {
|
||||||
|
@@ -14,7 +14,7 @@ import {
|
|||||||
import {
|
import {
|
||||||
applicationExport,
|
applicationExport,
|
||||||
applicationList,
|
applicationList,
|
||||||
applicationRemove, applicationUpdate,
|
applicationRemove, applicationVerified,
|
||||||
} from '#/api/property/assetManage/application';
|
} from '#/api/property/assetManage/application';
|
||||||
import type {ApplicationForm} from '#/api/property/assetManage/application/model';
|
import type {ApplicationForm} from '#/api/property/assetManage/application/model';
|
||||||
import {commonDownloadExcel} from '#/utils/file/download';
|
import {commonDownloadExcel} from '#/utils/file/download';
|
||||||
@@ -98,7 +98,7 @@ async function handleAudit(row: Required<ApplicationForm>, status: number) {
|
|||||||
info.state = status
|
info.state = status
|
||||||
info.acceptanceTime = new Date()
|
info.acceptanceTime = new Date()
|
||||||
info.acceptanceUserId = userStore.userInfo?.userId
|
info.acceptanceUserId = userStore.userInfo?.userId
|
||||||
await applicationUpdate(info)
|
await applicationVerified(info)
|
||||||
await tableApi.query();
|
await tableApi.query();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@@ -1,6 +1,7 @@
|
|||||||
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 {getDictOptions} from "#/utils/dict";
|
import {getDictOptions} from "#/utils/dict";
|
||||||
|
import {renderDict} from "#/utils/render";
|
||||||
|
|
||||||
|
|
||||||
export const querySchema: FormSchemaGetter = () => [
|
export const querySchema: FormSchemaGetter = () => [
|
||||||
@@ -69,19 +70,24 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
export const columns: VxeGridProps['columns'] = [
|
export const columns: VxeGridProps['columns'] = [
|
||||||
{ type: 'checkbox', width: 60 },
|
{ type: 'checkbox', width: 60 },
|
||||||
{
|
{
|
||||||
title: '仓库id',
|
title: '仓库',
|
||||||
field: 'depotId',
|
field: 'depotName',
|
||||||
minWidth:150,
|
minWidth:150,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '资产id',
|
title: '资产',
|
||||||
field: 'assetId',
|
field: 'assetName',
|
||||||
width:180,
|
width:180,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '流转类型',
|
title: '流转类型',
|
||||||
field: 'type',
|
field: 'type',
|
||||||
width:120,
|
width:120,
|
||||||
|
slots:{
|
||||||
|
default:({row})=>{
|
||||||
|
return renderDict(row.type,'wy_cklzlx')
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
@@ -95,8 +101,8 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
width:150,
|
width:150,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '操作人id',
|
title: '操作人',
|
||||||
field: 'userId',
|
field: 'userName',
|
||||||
width:150,
|
width:150,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@@ -152,8 +152,7 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
{
|
{
|
||||||
label: '工单类型',
|
label: '工单类型',
|
||||||
fieldName: 'type',
|
fieldName: 'type',
|
||||||
component: 'ApiSelect',
|
component: 'TreeSelect',
|
||||||
componentProps: {},
|
|
||||||
rules: 'selectRequired',
|
rules: 'selectRequired',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@@ -17,7 +17,10 @@ import workOrdersDetail from './work-orders-detail.vue';
|
|||||||
import ordersModal from './orders-modal.vue';
|
import ordersModal from './orders-modal.vue';
|
||||||
import {columns, querySchema} from './data';
|
import {columns, querySchema} from './data';
|
||||||
import {onMounted, ref} from "vue";
|
import {onMounted, ref} from "vue";
|
||||||
import {workOrdersTypeList} from "#/api/property/businessManagement/workOrdersType";
|
import {
|
||||||
|
workOrdersTypeList,
|
||||||
|
workOrdersTypeListAll
|
||||||
|
} from "#/api/property/businessManagement/workOrdersType";
|
||||||
|
|
||||||
const ordersTypeList = ref<any[]>([]);
|
const ordersTypeList = ref<any[]>([]);
|
||||||
const ordersType = ref<string>('0');
|
const ordersType = ref<string>('0');
|
||||||
@@ -130,11 +133,10 @@ function handleMultiDelete() {
|
|||||||
|
|
||||||
async function queryOrderType() {
|
async function queryOrderType() {
|
||||||
let params = {
|
let params = {
|
||||||
pageSize: 1000,
|
filterSubNodes:true
|
||||||
pageNum: 1
|
|
||||||
}
|
}
|
||||||
const res = await workOrdersTypeList(params)
|
const res = await workOrdersTypeListAll(params)
|
||||||
ordersTypeList.value = res.rows.map((item) => ({
|
ordersTypeList.value = res.map((item) => ({
|
||||||
label: item.orderTypeName,
|
label: item.orderTypeName,
|
||||||
value: item.id,
|
value: item.id,
|
||||||
}));
|
}));
|
||||||
|
@@ -14,9 +14,7 @@ import {
|
|||||||
import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
|
import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
|
||||||
|
|
||||||
import {modalSchema} from './data';
|
import {modalSchema} from './data';
|
||||||
import {personList} from "#/api/property/resident/person";
|
import {workOrdersTypeTree} from "#/api/property/businessManagement/workOrdersType";
|
||||||
import {renderDictValue} from "#/utils/render";
|
|
||||||
import {workOrdersTypeList} from "#/api/property/businessManagement/workOrdersType";
|
|
||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
|
|
||||||
@@ -61,7 +59,7 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
modalApi.modalLoading(true);
|
modalApi.modalLoading(true);
|
||||||
await queryPersonData()
|
await queryWorkOrdersType()
|
||||||
|
|
||||||
const {id} = modalApi.getData() as { id?: number | string };
|
const {id} = modalApi.getData() as { id?: number | string };
|
||||||
isUpdate.value = !!id;
|
isUpdate.value = !!id;
|
||||||
@@ -106,34 +104,35 @@ async function handleClosed() {
|
|||||||
resetInitialized();
|
resetInitialized();
|
||||||
}
|
}
|
||||||
|
|
||||||
async function queryPersonData() {
|
async function queryWorkOrdersType() {
|
||||||
let params = {
|
const options = await workOrdersTypeTree()
|
||||||
pageSize: 1000,
|
formApi.updateSchema([
|
||||||
pageNum: 1,
|
|
||||||
}
|
|
||||||
const res = await personList(params);
|
|
||||||
const options = res.rows.map((user) => ({
|
|
||||||
label: user.userName + '-' + renderDictValue(user.gender, 'sys_user_sex') + '-' + user.phone,
|
|
||||||
value: user.id,
|
|
||||||
}));
|
|
||||||
formApi.updateSchema([{
|
|
||||||
componentProps: () => ({
|
|
||||||
options: options,
|
|
||||||
showSearch:true,
|
|
||||||
filterOption: filterOption
|
|
||||||
}),
|
|
||||||
fieldName: 'initiatorName',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
componentProps: () => ({
|
componentProps: () => ({
|
||||||
options: options,
|
class: 'w-full',
|
||||||
showSearch:true,
|
fieldNames: {
|
||||||
filterOption: filterOption
|
key: 'id',
|
||||||
|
label: 'orderTypeName',
|
||||||
|
value: 'id',
|
||||||
|
children: 'children',
|
||||||
|
},
|
||||||
|
placeholder: '请选择工单类型',
|
||||||
|
showSearch: true,
|
||||||
|
treeData: options,
|
||||||
|
treeDefaultExpandAll: true,
|
||||||
|
treeLine: { showLeafIcon: false },
|
||||||
|
treeNodeFilterProp: 'orderTypeName',
|
||||||
|
treeNodeLabelProp: 'orderTypeName',
|
||||||
}),
|
}),
|
||||||
fieldName: 'handler',
|
fieldName: 'type',
|
||||||
}])
|
},
|
||||||
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const filterOption = (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||||
|
};
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
@@ -4,11 +4,11 @@ import {renderDict} from "#/utils/render";
|
|||||||
import {getDictOptions} from "#/utils/dict";
|
import {getDictOptions} from "#/utils/dict";
|
||||||
|
|
||||||
export const querySchema: FormSchemaGetter = () => [
|
export const querySchema: FormSchemaGetter = () => [
|
||||||
{
|
// {
|
||||||
component: 'Input',
|
// component: 'Input',
|
||||||
fieldName: 'orderTypeNo',
|
// fieldName: 'orderTypeNo',
|
||||||
label: '工单类型编号',
|
// label: '工单类型编号',
|
||||||
},
|
// },
|
||||||
{
|
{
|
||||||
component: 'Input',
|
component: 'Input',
|
||||||
fieldName: 'orderTypeName',
|
fieldName: 'orderTypeName',
|
||||||
@@ -25,7 +25,7 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
];
|
];
|
||||||
|
|
||||||
export const columns: VxeGridProps['columns'] = [
|
export const columns: VxeGridProps['columns'] = [
|
||||||
{ type: 'checkbox', width: 60 },
|
// { type: 'checkbox', width: 60 },
|
||||||
// {
|
// {
|
||||||
// title: '工单类型编号',
|
// title: '工单类型编号',
|
||||||
// field: 'orderTypeNo',
|
// field: 'orderTypeNo',
|
||||||
@@ -33,6 +33,8 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
{
|
{
|
||||||
title: '类型名称',
|
title: '类型名称',
|
||||||
field: 'orderTypeName',
|
field: 'orderTypeName',
|
||||||
|
treeNode: true,
|
||||||
|
minWidth:180,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '运作模式',
|
title: '运作模式',
|
||||||
@@ -42,15 +44,17 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
return renderDict(row.operationMode, 'pro_operation_pattern');
|
return renderDict(row.operationMode, 'pro_operation_pattern');
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
minWidth:'120'
|
width:180,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '排序值',
|
title: '排序值',
|
||||||
field: 'sort',
|
field: 'sort',
|
||||||
|
width:180,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '累计工单数量',
|
title: '累计工单数量',
|
||||||
field: 'number',
|
field: 'number',
|
||||||
|
width:180,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '是否支持转单',
|
title: '是否支持转单',
|
||||||
@@ -60,7 +64,7 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
return renderDict(row.isTransfers, 'support_transferring_orders');
|
return renderDict(row.isTransfers, 'support_transferring_orders');
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
minWidth:'120'
|
width:180,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: 'action',
|
field: 'action',
|
||||||
@@ -87,6 +91,11 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
component: 'Input',
|
component: 'Input',
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
label: '父级类型',
|
||||||
|
fieldName: 'parentId',
|
||||||
|
component: 'Select',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
label: '运作模式',
|
label: '运作模式',
|
||||||
fieldName: 'operationMode',
|
fieldName: 'operationMode',
|
||||||
|
@@ -8,13 +8,14 @@ import {
|
|||||||
type VxeGridProps
|
type VxeGridProps
|
||||||
} from '#/adapter/vxe-table';
|
} from '#/adapter/vxe-table';
|
||||||
import {
|
import {
|
||||||
workOrdersTypeList,
|
workOrdersTypeListAll,
|
||||||
workOrdersTypeRemove,
|
workOrdersTypeRemove,
|
||||||
} from '#/api/property/businessManagement/workOrdersType';
|
} from '#/api/property/businessManagement/workOrdersType';
|
||||||
import type { WorkOrdersTypeForm } from '#/api/property/businessManagement/workOrdersType/model';
|
import type { WorkOrdersTypeForm } from '#/api/property/businessManagement/workOrdersType/model';
|
||||||
import workOrdersTypeModal from './workOrdersType-modal.vue';
|
import workOrdersTypeModal from './workOrdersType-modal.vue';
|
||||||
import workOrdersTypeDetail from './workOrdersType-detail.vue';
|
import workOrdersTypeDetail from './workOrdersType-detail.vue';
|
||||||
import { columns, querySchema } from './data';
|
import { columns, querySchema } from './data';
|
||||||
|
import {ref} from "vue";
|
||||||
|
|
||||||
const formOptions: VbenFormProps = {
|
const formOptions: VbenFormProps = {
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
@@ -39,21 +40,27 @@ const gridOptions: VxeGridProps = {
|
|||||||
columns,
|
columns,
|
||||||
height: 'auto',
|
height: 'auto',
|
||||||
keepSource: true,
|
keepSource: true,
|
||||||
pagerConfig: {},
|
pagerConfig: {
|
||||||
|
enabled:false,
|
||||||
|
},
|
||||||
proxyConfig: {
|
proxyConfig: {
|
||||||
ajax: {
|
ajax: {
|
||||||
query: async ({ page }, formValues = {}) => {
|
query: async (_, formValues = {}) => {
|
||||||
return await workOrdersTypeList({
|
const resp = await workOrdersTypeListAll({
|
||||||
pageNum: page.currentPage,
|
|
||||||
pageSize: page.pageSize,
|
|
||||||
...formValues,
|
...formValues,
|
||||||
});
|
});
|
||||||
|
return { rows: resp };
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
rowConfig: {
|
rowConfig: {
|
||||||
keyField: 'id',
|
keyField: 'id',
|
||||||
},
|
},
|
||||||
|
treeConfig: {
|
||||||
|
parentField: 'parentId',
|
||||||
|
rowField: 'id',
|
||||||
|
transform: true,
|
||||||
|
},
|
||||||
// 表格全局唯一表示 保存列配置需要用到
|
// 表格全局唯一表示 保存列配置需要用到
|
||||||
id: 'property-workOrdersType-index'
|
id: 'property-workOrdersType-index'
|
||||||
};
|
};
|
||||||
@@ -87,6 +94,7 @@ async function handleEdit(row: Required<WorkOrdersTypeForm>) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function handleDelete(row: Required<WorkOrdersTypeForm>) {
|
async function handleDelete(row: Required<WorkOrdersTypeForm>) {
|
||||||
|
console.log(row,'======row')
|
||||||
await workOrdersTypeRemove(row.id);
|
await workOrdersTypeRemove(row.id);
|
||||||
await tableApi.query();
|
await tableApi.query();
|
||||||
}
|
}
|
||||||
@@ -111,14 +119,14 @@ function handleMultiDelete() {
|
|||||||
<BasicTable table-title="工单类型列表">
|
<BasicTable table-title="工单类型列表">
|
||||||
<template #toolbar-tools>
|
<template #toolbar-tools>
|
||||||
<Space>
|
<Space>
|
||||||
<a-button
|
<!-- <a-button-->
|
||||||
:disabled="!vxeCheckboxChecked(tableApi)"
|
<!-- :disabled="!vxeCheckboxChecked(tableApi)"-->
|
||||||
danger
|
<!-- danger-->
|
||||||
type="primary"
|
<!-- type="primary"-->
|
||||||
v-access:code="['property:workOrdersType:remove']"
|
<!-- v-access:code="['property:workOrdersType:remove']"-->
|
||||||
@click="handleMultiDelete">
|
<!-- @click="handleMultiDelete">-->
|
||||||
{{ $t('pages.common.delete') }}
|
<!-- {{ $t('pages.common.delete') }}-->
|
||||||
</a-button>
|
<!-- </a-button>-->
|
||||||
<a-button
|
<a-button
|
||||||
type="primary"
|
type="primary"
|
||||||
v-access:code="['property:workOrdersType:add']"
|
v-access:code="['property:workOrdersType:add']"
|
||||||
@@ -151,6 +159,7 @@ function handleMultiDelete() {
|
|||||||
danger
|
danger
|
||||||
v-access:code="['property:workOrdersType:remove']"
|
v-access:code="['property:workOrdersType:remove']"
|
||||||
@click.stop=""
|
@click.stop=""
|
||||||
|
:disabled="row.children?.length>0"
|
||||||
>
|
>
|
||||||
{{ $t('pages.common.delete') }}
|
{{ $t('pages.common.delete') }}
|
||||||
</ghost-button>
|
</ghost-button>
|
||||||
|
@@ -30,9 +30,9 @@ async function handleOpenChange(open: boolean) {
|
|||||||
<template>
|
<template>
|
||||||
<BasicModal :footer="false" :fullscreen-button="false" title="工单类型信息" class="w-[70%]">
|
<BasicModal :footer="false" :fullscreen-button="false" title="工单类型信息" class="w-[70%]">
|
||||||
<Descriptions v-if="workOrdersTypeInfoDetail" size="small" :column="2" bordered :labelStyle="{width:'120px'}">
|
<Descriptions v-if="workOrdersTypeInfoDetail" size="small" :column="2" bordered :labelStyle="{width:'120px'}">
|
||||||
<DescriptionsItem label="工单类型编号">
|
<!-- <DescriptionsItem label="工单类型编号">-->
|
||||||
{{ workOrdersTypeInfoDetail.orderTypeNo }}
|
<!-- {{ workOrdersTypeInfoDetail.orderTypeNo }}-->
|
||||||
</DescriptionsItem>
|
<!-- </DescriptionsItem>-->
|
||||||
<DescriptionsItem label="类型名称">
|
<DescriptionsItem label="类型名称">
|
||||||
{{ workOrdersTypeInfoDetail.orderTypeName }}
|
{{ workOrdersTypeInfoDetail.orderTypeName }}
|
||||||
</DescriptionsItem>
|
</DescriptionsItem>
|
||||||
|
@@ -1,12 +1,16 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, ref } from 'vue';
|
import {computed, ref} from 'vue';
|
||||||
import { useVbenModal } from '@vben/common-ui';
|
import {useVbenModal} from '@vben/common-ui';
|
||||||
import { $t } from '@vben/locales';
|
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 { workOrdersTypeAdd, workOrdersTypeInfo, workOrdersTypeUpdate } from '#/api/property/businessManagement/workOrdersType';
|
import {
|
||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
workOrdersTypeAdd,
|
||||||
import { modalSchema } from './data';
|
workOrdersTypeInfo, workOrdersTypeListAll,
|
||||||
|
workOrdersTypeUpdate
|
||||||
|
} from '#/api/property/businessManagement/workOrdersType';
|
||||||
|
import {defaultFormValueGetter, useBeforeCloseDiff} from '#/utils/popup';
|
||||||
|
import {modalSchema} from './data';
|
||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
const isUpdate = ref(false);
|
const isUpdate = ref(false);
|
||||||
@@ -31,7 +35,7 @@ const [BasicForm, formApi] = useVbenForm({
|
|||||||
wrapperClass: 'grid-cols-2',
|
wrapperClass: 'grid-cols-2',
|
||||||
});
|
});
|
||||||
|
|
||||||
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
const {onBeforeClose, markInitialized, resetInitialized} = useBeforeCloseDiff(
|
||||||
{
|
{
|
||||||
initializedGetter: defaultFormValueGetter(formApi),
|
initializedGetter: defaultFormValueGetter(formApi),
|
||||||
currentGetter: defaultFormValueGetter(formApi),
|
currentGetter: defaultFormValueGetter(formApi),
|
||||||
@@ -40,7 +44,7 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
|||||||
|
|
||||||
const [BasicModal, modalApi] = useVbenModal({
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
// 在这里更改宽度
|
// 在这里更改宽度
|
||||||
class: 'w-[60%]',
|
class: 'w-[70%]',
|
||||||
fullscreenButton: false,
|
fullscreenButton: false,
|
||||||
onBeforeClose,
|
onBeforeClose,
|
||||||
onClosed: handleClosed,
|
onClosed: handleClosed,
|
||||||
@@ -50,10 +54,9 @@ 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;
|
||||||
|
await initTypeOptions(id)
|
||||||
if (isUpdate.value && id) {
|
if (isUpdate.value && id) {
|
||||||
const record = await workOrdersTypeInfo(id);
|
const record = await workOrdersTypeInfo(id);
|
||||||
record.operationMode = record.operationMode?.toString();
|
record.operationMode = record.operationMode?.toString();
|
||||||
@@ -69,7 +72,7 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
async function handleConfirm() {
|
async function handleConfirm() {
|
||||||
try {
|
try {
|
||||||
modalApi.lock(true);
|
modalApi.lock(true);
|
||||||
const { valid } = await formApi.validate();
|
const {valid} = await formApi.validate();
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
@@ -90,11 +93,30 @@ async function handleClosed() {
|
|||||||
await formApi.resetForm();
|
await formApi.resetForm();
|
||||||
resetInitialized();
|
resetInitialized();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function initTypeOptions(id:string) {
|
||||||
|
let params = {
|
||||||
|
excludeId:id,
|
||||||
|
filterSubNodes: true //过滤子级
|
||||||
|
}
|
||||||
|
const typeList = await workOrdersTypeListAll(params)
|
||||||
|
formApi.updateSchema([{
|
||||||
|
componentProps: () => ({
|
||||||
|
options: typeList,
|
||||||
|
showSearch: true,
|
||||||
|
optionFilterProp: 'orderTypeName',
|
||||||
|
fieldNames: {label: 'orderTypeName', value: 'id'},
|
||||||
|
allowClear: true,
|
||||||
|
}),
|
||||||
|
fieldName: 'parentId',
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<BasicModal :title="title">
|
<BasicModal :title="title">
|
||||||
<BasicForm />
|
<BasicForm/>
|
||||||
</BasicModal>
|
</BasicModal>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@@ -32,49 +32,26 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
|
|
||||||
export const columns: VxeGridProps['columns'] = [
|
export const columns: VxeGridProps['columns'] = [
|
||||||
{ type: 'checkbox', width: 60 },
|
{ type: 'checkbox', width: 60 },
|
||||||
// {
|
{
|
||||||
// title: '任务编号',
|
title: '巡检计划',
|
||||||
// field: 'id',
|
field: 'planId',
|
||||||
// width:'auto'
|
minWidth:200
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// title: '巡检计划',
|
title: '巡检任务',
|
||||||
// field: 'planName',
|
field: 'taskId',
|
||||||
// minWidth:200
|
width:150
|
||||||
// },
|
},
|
||||||
// {
|
{
|
||||||
// title: '巡检时间范围',
|
title: '巡检路线',
|
||||||
// field: 'planInsTime',
|
field: 'routeId',
|
||||||
// width:'auto'
|
width:150
|
||||||
//
|
},
|
||||||
// },
|
{
|
||||||
// // {
|
title: '巡检点',
|
||||||
// // title: '实际巡检时间',
|
field: 'pointId',
|
||||||
// // field: 'endDate',
|
width:150
|
||||||
// // width:180
|
},
|
||||||
// //
|
|
||||||
// // },
|
|
||||||
// {
|
|
||||||
// title: '签到状态',
|
|
||||||
// field: 'actInsTime',
|
|
||||||
// width:150,
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// title: '巡检人',
|
|
||||||
// field: 'planUserName',
|
|
||||||
// width:'auto'
|
|
||||||
//
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// title: '巡检方式',
|
|
||||||
// field: 'taskType',
|
|
||||||
// width:'auto',
|
|
||||||
// slots: {
|
|
||||||
// default: ({ row }) => {
|
|
||||||
// return renderDict(row.taskType, 'wy_xjqdfs');
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
{
|
{
|
||||||
title: '签到类型',
|
title: '签到类型',
|
||||||
field: 'signType',
|
field: 'signType',
|
||||||
@@ -118,7 +95,7 @@ export const columns: VxeGridProps['columns'] = [
|
|||||||
{
|
{
|
||||||
title: '备注',
|
title: '备注',
|
||||||
field: 'remark',
|
field: 'remark',
|
||||||
minWidth:120
|
width:180
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
// field: 'action',
|
// field: 'action',
|
||||||
|
@@ -1,7 +1,6 @@
|
|||||||
import {type FormSchemaGetter, z} 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',
|
||||||
@@ -10,8 +9,6 @@ export const querySchema: FormSchemaGetter = () => [
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
// 需要使用i18n注意这里要改成getter形式 否则切换语言不会刷新
|
|
||||||
// export const columns: () => VxeGridProps['columns'] = () => [
|
|
||||||
export const columns: VxeGridProps['columns'] = [
|
export const columns: VxeGridProps['columns'] = [
|
||||||
{ type: 'checkbox', width: 60 },
|
{ type: 'checkbox', width: 60 },
|
||||||
{
|
{
|
||||||
@@ -61,19 +58,85 @@ export const modalSchema: FormSchemaGetter = () => [
|
|||||||
component: 'Input',
|
component: 'Input',
|
||||||
rules: 'required',
|
rules: 'required',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
label: '巡检点',
|
|
||||||
fieldName: 'pointId',
|
|
||||||
component: 'ApiSelect',
|
|
||||||
componentProps:{
|
|
||||||
mode: 'multiple',
|
|
||||||
},
|
|
||||||
rules: z.array(z.string()).min(1, { message: '请选择' }),
|
|
||||||
formItemClass: 'col-span-2',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: '备注',
|
label: '备注',
|
||||||
fieldName: 'remark',
|
fieldName: 'remark',
|
||||||
component: 'Textarea',
|
component: 'Textarea',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
|
//!!!!!!
|
||||||
|
export const querySchemaPoint: FormSchemaGetter = () => [
|
||||||
|
{
|
||||||
|
component: 'ApiSelect',
|
||||||
|
fieldName: 'pointId',
|
||||||
|
label: '巡检点名称',
|
||||||
|
componentProps: {},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const columnsPoint: VxeGridProps['columns'] = [
|
||||||
|
{
|
||||||
|
title: '巡检点ID',
|
||||||
|
field: 'pointId',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '巡检点名称',
|
||||||
|
field: 'pointName',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'action',
|
||||||
|
fixed: 'right',
|
||||||
|
slots: { default: 'action' },
|
||||||
|
title: '操作',
|
||||||
|
width: 180,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const modalSchemaPoint: FormSchemaGetter = () => [
|
||||||
|
{
|
||||||
|
label: '主键id',
|
||||||
|
fieldName: 'id',
|
||||||
|
component: 'Input',
|
||||||
|
dependencies: {
|
||||||
|
show: () => false,
|
||||||
|
triggerFields: [''],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '巡检点名称',
|
||||||
|
fieldName: 'pointId',
|
||||||
|
rules: 'required',
|
||||||
|
component: 'ApiSelect',
|
||||||
|
componentProps: {},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '开始时间',
|
||||||
|
fieldName: 'startTime',
|
||||||
|
component: 'DatePicker',
|
||||||
|
componentProps: {
|
||||||
|
showTime: true,
|
||||||
|
format: 'YYYY-MM-DD HH:mm:ss',
|
||||||
|
placeholder: '请选择开始时间',
|
||||||
|
},
|
||||||
|
rules: 'required',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '结束时间',
|
||||||
|
fieldName: 'endTime',
|
||||||
|
component: 'DatePicker',
|
||||||
|
componentProps: {
|
||||||
|
showTime: true,
|
||||||
|
format: 'YYYY-MM-DD HH:mm:ss',
|
||||||
|
placeholder: '请选择开始时间',
|
||||||
|
},
|
||||||
|
rules: 'required',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '排序',
|
||||||
|
fieldName: 'sort',
|
||||||
|
component: 'Input',
|
||||||
|
rules: 'required',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
@@ -1,14 +1,8 @@
|
|||||||
<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 { ref } from 'vue';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
useVbenVxeGrid,
|
useVbenVxeGrid,
|
||||||
vxeCheckboxChecked,
|
vxeCheckboxChecked,
|
||||||
@@ -33,15 +27,6 @@ const formOptions: VbenFormProps = {
|
|||||||
},
|
},
|
||||||
schema: querySchema(),
|
schema: querySchema(),
|
||||||
wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
|
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 = {
|
||||||
@@ -114,6 +99,12 @@ function handleMultiDelete() {
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const parentData = ref({})
|
||||||
|
const handleUpdate = (dataSet) => {
|
||||||
|
parentData.value = dataSet; // 更新父组件的数据源
|
||||||
|
console.log(parentData.value,111123);
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -163,6 +154,6 @@ function handleMultiDelete() {
|
|||||||
</Space>
|
</Space>
|
||||||
</template>
|
</template>
|
||||||
</BasicTable>
|
</BasicTable>
|
||||||
<InspectionRouteModal @reload="tableApi.query()" />
|
<InspectionRouteModal @reload="tableApi.query()" @update-data="handleUpdate"/>
|
||||||
</Page>
|
</Page>
|
||||||
</template>
|
</template>
|
||||||
|
@@ -4,12 +4,17 @@ import { useVbenModal } from '@vben/common-ui';
|
|||||||
import { $t } from '@vben/locales';
|
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 { inspectionRouteAdd, inspectionRouteInfo, inspectionRouteUpdate } from '#/api/property/inspectionManagement/inspectionRoute';
|
import {
|
||||||
|
inspectionRouteAdd,
|
||||||
|
inspectionRouteInfo,
|
||||||
|
inspectionRouteList,
|
||||||
|
inspectionRouteUpdate
|
||||||
|
} from '#/api/property/inspectionManagement/inspectionRoute';
|
||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||||
import {
|
import {
|
||||||
inspectionPointList,
|
inspectionPointList,
|
||||||
} from '#/api/property/inspectionManagement/inspectionPoint';
|
} from '#/api/property/inspectionManagement/inspectionPoint';
|
||||||
import { modalSchema } from './data';
|
import {modalSchema} from './data';
|
||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>();
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
|
|
||||||
@@ -20,11 +25,8 @@ const title = computed(() => {
|
|||||||
|
|
||||||
const [BasicForm, formApi] = useVbenForm({
|
const [BasicForm, formApi] = useVbenForm({
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
// 默认占满两列
|
|
||||||
formItemClass: 'col-span-1',
|
formItemClass: 'col-span-1',
|
||||||
// 默认label宽度 px
|
|
||||||
labelWidth: 100,
|
labelWidth: 100,
|
||||||
// 通用配置项 会影响到所有表单项
|
|
||||||
componentProps: {
|
componentProps: {
|
||||||
class: 'w-full',
|
class: 'w-full',
|
||||||
}
|
}
|
||||||
@@ -41,8 +43,8 @@ const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
|||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const pointList = ref<any[]>([]);
|
||||||
const [BasicModal, modalApi] = useVbenModal({
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
// 在这里更改宽度
|
|
||||||
class: 'w-[60%]',
|
class: 'w-[60%]',
|
||||||
fullscreenButton: false,
|
fullscreenButton: false,
|
||||||
onBeforeClose,
|
onBeforeClose,
|
||||||
@@ -59,11 +61,15 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
|
|
||||||
if (isUpdate.value && id) {
|
if (isUpdate.value && id) {
|
||||||
const record = await inspectionRouteInfo(id);
|
const record = await inspectionRouteInfo(id);
|
||||||
record.pointId = record.pointId?.split(',')
|
pointList.value = (record.inspectionRoutePointVoList || []).map(item => ({
|
||||||
|
pointId: item.pointId ?? '',
|
||||||
|
pointName: item.pointName ?? '',
|
||||||
|
}));
|
||||||
|
await tableApi.reload();
|
||||||
|
console.log(pointList.value,111)
|
||||||
await formApi.setValues(record);
|
await formApi.setValues(record);
|
||||||
}
|
}
|
||||||
await markInitialized();
|
await markInitialized();
|
||||||
|
|
||||||
modalApi.modalLoading(false);
|
modalApi.modalLoading(false);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@@ -75,9 +81,11 @@ async function handleConfirm() {
|
|||||||
if (!valid) {
|
if (!valid) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
let data = {
|
||||||
const data = cloneDeep(await formApi.getValues());
|
...cloneDeep(await formApi.getValues()),
|
||||||
data.pointId = data.pointId?.join(',')
|
inspectionRoutePointBoList:[pointData.value]
|
||||||
|
}
|
||||||
|
console.log(data,333)
|
||||||
await (isUpdate.value ? inspectionRouteUpdate(data) : inspectionRouteAdd(data));
|
await (isUpdate.value ? inspectionRouteUpdate(data) : inspectionRouteAdd(data));
|
||||||
resetInitialized();
|
resetInitialized();
|
||||||
emit('reload');
|
emit('reload');
|
||||||
@@ -104,12 +112,11 @@ async function queryWorkOrdersType() {
|
|||||||
label: item.pointName,
|
label: item.pointName,
|
||||||
value: item.id,
|
value: item.id,
|
||||||
}));
|
}));
|
||||||
formApi.updateSchema([{
|
tableApi.formApi.updateSchema([{
|
||||||
componentProps: () => ({
|
componentProps: () => ({
|
||||||
options: options,
|
options: options,
|
||||||
showSearch: true,
|
showSearch: true,
|
||||||
filterOption: filterOption,
|
filterOption: filterOption,
|
||||||
mode: 'multiple',
|
|
||||||
}),
|
}),
|
||||||
fieldName: 'pointId',
|
fieldName: 'pointId',
|
||||||
}])
|
}])
|
||||||
@@ -118,11 +125,100 @@ async function queryWorkOrdersType() {
|
|||||||
const filterOption = (input: string, option: any) => {
|
const filterOption = (input: string, option: any) => {
|
||||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
//!!!!!!
|
||||||
|
import { Page, type VbenFormProps } from '@vben/common-ui';
|
||||||
|
import { Space } from 'ant-design-vue';
|
||||||
|
import {
|
||||||
|
useVbenVxeGrid,
|
||||||
|
type VxeGridProps
|
||||||
|
} from '#/adapter/vxe-table';
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
import type { InspectionRouteForm } from '#/api/property/inspectionManagement/inspectionRoute/model';
|
||||||
|
import pointModal from './point-modal.vue';
|
||||||
|
import { columnsPoint, querySchemaPoint } from './data';
|
||||||
|
|
||||||
|
const formOptions: VbenFormProps = {
|
||||||
|
commonConfig: {
|
||||||
|
labelWidth: 90,
|
||||||
|
componentProps: {
|
||||||
|
allowClear: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
schema: querySchemaPoint(),
|
||||||
|
wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
|
||||||
|
};
|
||||||
|
|
||||||
|
const gridOptions: VxeGridProps = {
|
||||||
|
checkboxConfig: {
|
||||||
|
highlight: true,
|
||||||
|
reserve: true,
|
||||||
|
},
|
||||||
|
columns: columnsPoint,
|
||||||
|
height: 'auto',
|
||||||
|
keepSource: true,
|
||||||
|
pagerConfig: {},
|
||||||
|
rowConfig: {
|
||||||
|
keyField: 'id',
|
||||||
|
},
|
||||||
|
id: 'property-inspectionRoutePoint-index'
|
||||||
|
};
|
||||||
|
|
||||||
|
const [BasicTable, tableApi] = useVbenVxeGrid({
|
||||||
|
formOptions,
|
||||||
|
gridOptions,
|
||||||
|
});
|
||||||
|
|
||||||
|
const [PointModal, pointModalApi] = useVbenModal({
|
||||||
|
connectedComponent: pointModal,
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleAdd() {
|
||||||
|
pointModalApi.setData({});
|
||||||
|
pointModalApi.open();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleEdit(row: Required<InspectionRouteForm>) {
|
||||||
|
pointModalApi.setData({ id: row.id });
|
||||||
|
pointModalApi.open();
|
||||||
|
}
|
||||||
|
|
||||||
|
const pointData = ref({})
|
||||||
|
const handlePoint = (data) => {
|
||||||
|
data.startTime = dayjs(data.startTime).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
data.endTime = dayjs(data.endTime).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
pointData.value = data;
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<BasicModal :title="title">
|
<BasicModal :title="title">
|
||||||
<BasicForm />
|
<BasicForm />
|
||||||
|
<Page :auto-content-height="true" style="background-color: #F1F3F6">
|
||||||
|
<BasicTable table-title="巡检点" :grid-options="gridOptions">
|
||||||
|
<template #toolbar-tools>
|
||||||
|
<Space>
|
||||||
|
<a-button
|
||||||
|
type="primary"
|
||||||
|
@click="handleAdd"
|
||||||
|
>
|
||||||
|
{{ $t('pages.common.add') }}
|
||||||
|
</a-button>
|
||||||
|
</Space>
|
||||||
|
</template>
|
||||||
|
<template #action="{ row }">
|
||||||
|
<Space>
|
||||||
|
<ghost-button
|
||||||
|
@click.stop="handleEdit(row)"
|
||||||
|
>
|
||||||
|
{{ '巡检点' }}
|
||||||
|
</ghost-button>
|
||||||
|
</Space>
|
||||||
|
</template>
|
||||||
|
</BasicTable>
|
||||||
|
<PointModal @reload="tableApi.query()" @update-data="handlePoint"/>
|
||||||
|
</Page>
|
||||||
</BasicModal>
|
</BasicModal>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@@ -0,0 +1,116 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { useVbenModal } from '@vben/common-ui';
|
||||||
|
import { cloneDeep } from '@vben/utils';
|
||||||
|
import { useVbenForm } from '#/adapter/form';
|
||||||
|
import { inspectionRouteInfo } from '#/api/property/inspectionManagement/inspectionRoute';
|
||||||
|
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||||
|
import {
|
||||||
|
inspectionPointList,
|
||||||
|
} from '#/api/property/inspectionManagement/inspectionPoint';
|
||||||
|
import { modalSchemaPoint } from './data';
|
||||||
|
import {ref} from "vue";
|
||||||
|
|
||||||
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
|
|
||||||
|
const isUpdate = ref(false);
|
||||||
|
|
||||||
|
const [BasicForm, formApi] = useVbenForm({
|
||||||
|
commonConfig: {
|
||||||
|
formItemClass: 'col-span-2',
|
||||||
|
labelWidth: 100,
|
||||||
|
componentProps: {
|
||||||
|
class: 'w-full',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
schema: modalSchemaPoint(),
|
||||||
|
showDefaultActions: false,
|
||||||
|
wrapperClass: 'grid-cols-2',
|
||||||
|
});
|
||||||
|
|
||||||
|
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
||||||
|
{
|
||||||
|
initializedGetter: defaultFormValueGetter(formApi),
|
||||||
|
currentGetter: defaultFormValueGetter(formApi),
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
|
class: 'w-[550px]',
|
||||||
|
fullscreenButton: false,
|
||||||
|
onBeforeClose,
|
||||||
|
onClosed: handleClosed,
|
||||||
|
onConfirm: handleConfirm,
|
||||||
|
onOpenChange: async (isOpen) => {
|
||||||
|
if (!isOpen) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
modalApi.modalLoading(true);
|
||||||
|
await queryWorkOrdersType()
|
||||||
|
const { id } = modalApi.getData() as { id?: number | string };
|
||||||
|
isUpdate.value = !!id;
|
||||||
|
|
||||||
|
if (isUpdate.value && id) {
|
||||||
|
const record = await inspectionRouteInfo(id);
|
||||||
|
await formApi.setValues(record);
|
||||||
|
}
|
||||||
|
await markInitialized();
|
||||||
|
|
||||||
|
modalApi.modalLoading(false);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
async function handleConfirm() {
|
||||||
|
try {
|
||||||
|
modalApi.lock(true);
|
||||||
|
const { valid } = await formApi.validate();
|
||||||
|
if (!valid) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const data = cloneDeep(await formApi.getValues());
|
||||||
|
emit('update-data', data);
|
||||||
|
resetInitialized();
|
||||||
|
emit('reload');
|
||||||
|
modalApi.close();
|
||||||
|
} catch (error) {
|
||||||
|
console.error(error);
|
||||||
|
} finally {
|
||||||
|
modalApi.lock(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleClosed() {
|
||||||
|
await formApi.resetForm();
|
||||||
|
resetInitialized();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function queryWorkOrdersType() {
|
||||||
|
let params = {
|
||||||
|
pageSize: 1000,
|
||||||
|
pageNum: 1
|
||||||
|
}
|
||||||
|
const res = await inspectionPointList(params)
|
||||||
|
const options = res.rows.map((item) => ({
|
||||||
|
label: item.pointName,
|
||||||
|
value: item.id,
|
||||||
|
}));
|
||||||
|
formApi.updateSchema([{
|
||||||
|
componentProps: () => ({
|
||||||
|
options: options,
|
||||||
|
showSearch: true,
|
||||||
|
filterOption: filterOption,
|
||||||
|
}),
|
||||||
|
fieldName: 'pointId',
|
||||||
|
}])
|
||||||
|
}
|
||||||
|
|
||||||
|
const filterOption = (input: string, option: any) => {
|
||||||
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<BasicModal title="选择巡检点">
|
||||||
|
<BasicForm />
|
||||||
|
</BasicModal>
|
||||||
|
</template>
|
||||||
|
|
0
apps/web-antd/src/views/sis/acAdmin/data.ts
Normal file
0
apps/web-antd/src/views/sis/acAdmin/data.ts
Normal file
200
apps/web-antd/src/views/sis/acAdmin/dp-tree.vue
Normal file
200
apps/web-antd/src/views/sis/acAdmin/dp-tree.vue
Normal file
@@ -0,0 +1,200 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { onMounted, ref, toRaw } from 'vue';
|
||||||
|
import { SyncOutlined } from '@ant-design/icons-vue';
|
||||||
|
import { InputSearch, message, Skeleton, Tree } from 'ant-design-vue';
|
||||||
|
import { queryTree } from '#/api/sis/accessControl';
|
||||||
|
import type { TreeNode } from '#/api/common';
|
||||||
|
|
||||||
|
defineOptions({ inheritAttrs: false });
|
||||||
|
|
||||||
|
withDefaults(defineProps<{ showSearch?: boolean }>(), { showSearch: true });
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
checked: [];
|
||||||
|
/**
|
||||||
|
* 点击节点的事件
|
||||||
|
*/
|
||||||
|
reload: [];
|
||||||
|
select: [];
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const searchValue = defineModel('searchValue', {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
});
|
||||||
|
|
||||||
|
/** 通道数据源 */
|
||||||
|
const channelTree = ref<TreeNode[]>([]);
|
||||||
|
/** 骨架屏加载 */
|
||||||
|
const showTreeSkeleton = ref<boolean>(true);
|
||||||
|
|
||||||
|
async function loadChannelTree() {
|
||||||
|
showTreeSkeleton.value = true;
|
||||||
|
searchValue.value = '';
|
||||||
|
const ret = await queryTree();
|
||||||
|
handleNode(ret, 3);
|
||||||
|
channelTree.value = ret;
|
||||||
|
showTreeSkeleton.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleNode(nodes: any[], level: number) {
|
||||||
|
nodes.forEach((node) => {
|
||||||
|
if (node.level < level) {
|
||||||
|
node.disabled = true;
|
||||||
|
}
|
||||||
|
if (node.children) {
|
||||||
|
handleNode(node.children, level);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleReload() {
|
||||||
|
await loadChannelTree();
|
||||||
|
emit('reload');
|
||||||
|
}
|
||||||
|
|
||||||
|
function open() {
|
||||||
|
const acArr = checkNodeData();
|
||||||
|
if (acArr) {
|
||||||
|
console.log(acArr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function close() {
|
||||||
|
const acArr = checkNodeData();
|
||||||
|
if (acArr) {
|
||||||
|
console.log(acArr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function alwaysOpen() {
|
||||||
|
const acArr = checkNodeData();
|
||||||
|
if (acArr) {
|
||||||
|
console.log(acArr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function reSet() {
|
||||||
|
const acArr = checkNodeData();
|
||||||
|
if (acArr) {
|
||||||
|
console.log(acArr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function checkNodeData() {
|
||||||
|
const arr = Object.keys(checkData);
|
||||||
|
if (!arr || arr.length === 0) {
|
||||||
|
message.error('请先选择门禁');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
const acArr: any = [];
|
||||||
|
arr.forEach((item) => {
|
||||||
|
const node: any = checkData[item];
|
||||||
|
if (node.level == 5) {
|
||||||
|
acArr.push(node);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
if (!acArr || acArr.length === 0) {
|
||||||
|
message.error('请先选择门禁');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
return acArr;
|
||||||
|
}
|
||||||
|
|
||||||
|
const checkData: any = {};
|
||||||
|
|
||||||
|
function onTreeCheck(_keys: any, nodes: any) {
|
||||||
|
const { checked, checkedNodes } = nodes;
|
||||||
|
// 找到需要播放的视频节点
|
||||||
|
checkedNodes.forEach((node: any) => {
|
||||||
|
const nodeData = toRaw(node);
|
||||||
|
const id = nodeData.id;
|
||||||
|
if (checked) {
|
||||||
|
checkData[id] = nodeData;
|
||||||
|
} else {
|
||||||
|
delete checkData[id];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const nodes = toRaw(checkedNodes);
|
||||||
|
emit('checked', nodes);
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(loadChannelTree);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div :class="$attrs.class">
|
||||||
|
<Skeleton
|
||||||
|
:loading="showTreeSkeleton"
|
||||||
|
:paragraph="{ rows: 8 }"
|
||||||
|
active
|
||||||
|
class="p-[8px]"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="bg-background flex h-full flex-col overflow-y-auto rounded-lg pt-[5px]"
|
||||||
|
>
|
||||||
|
<div class="btn-gp">
|
||||||
|
<a-button size="small" @click="open" type="primary">开门</a-button>
|
||||||
|
<a-button size="small" @click="close" type="primary">关门</a-button>
|
||||||
|
<a-button size="small" @click="alwaysOpen" type="primary"
|
||||||
|
>常开
|
||||||
|
</a-button>
|
||||||
|
<a-button size="small" @click="reSet" type="primary"
|
||||||
|
>恢复正常
|
||||||
|
</a-button>
|
||||||
|
</div>
|
||||||
|
<!-- 固定在顶部 必须加上bg-background背景色 否则会产生'穿透'效果 -->
|
||||||
|
<div
|
||||||
|
v-if="showSearch"
|
||||||
|
class="bg-background z-100 sticky left-0 top-0 p-[8px]"
|
||||||
|
>
|
||||||
|
<InputSearch
|
||||||
|
v-model:value="searchValue"
|
||||||
|
:placeholder="$t('pages.common.search')"
|
||||||
|
size="small"
|
||||||
|
>
|
||||||
|
<template #enterButton>
|
||||||
|
<a-button @click="handleReload">
|
||||||
|
<SyncOutlined class="text-primary" />
|
||||||
|
</a-button>
|
||||||
|
</template>
|
||||||
|
</InputSearch>
|
||||||
|
</div>
|
||||||
|
<div class="h-full overflow-x-hidden px-[8px]">
|
||||||
|
<Tree
|
||||||
|
v-bind="$attrs"
|
||||||
|
v-if="channelTree.length > 0"
|
||||||
|
:class="$attrs.class"
|
||||||
|
:show-line="{ showLeafIcon: false }"
|
||||||
|
:tree-data="channelTree"
|
||||||
|
:virtual="false"
|
||||||
|
checkable
|
||||||
|
multiple
|
||||||
|
@select="$emit('select')"
|
||||||
|
@check="onTreeCheck"
|
||||||
|
>
|
||||||
|
<template #title="{ label }">
|
||||||
|
<span v-if="label.indexOf(searchValue) > -1">
|
||||||
|
{{ label.substring(0, label.indexOf(searchValue)) }}
|
||||||
|
<span style="color: #f50">{{ searchValue }}</span>
|
||||||
|
{{
|
||||||
|
label.substring(
|
||||||
|
label.indexOf(searchValue) + searchValue.length,
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
<span v-else>{{ label }}</span>
|
||||||
|
</template>
|
||||||
|
</Tree>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Skeleton>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style scoped>
|
||||||
|
.btn-gp {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
</style>
|
223
apps/web-antd/src/views/sis/acAdmin/index.vue
Normal file
223
apps/web-antd/src/views/sis/acAdmin/index.vue
Normal file
@@ -0,0 +1,223 @@
|
|||||||
|
<template>
|
||||||
|
<Page :auto-content-height="true">
|
||||||
|
<div class="flex h-full gap-[8px]">
|
||||||
|
<DpTree class="h-[87vh] w-[300px]" @check="onNodeChecked" />
|
||||||
|
<div class="bg-background flex-1">
|
||||||
|
<div class="video-play-area flex h-full flex-wrap">
|
||||||
|
<div
|
||||||
|
v-for="i in playerNum"
|
||||||
|
:style="playerStyle"
|
||||||
|
class="player"
|
||||||
|
:class="`layer-${i} ${currentSelectPlayerIndex == i ? selected : ''}`"
|
||||||
|
@click="playerSelect(i)"
|
||||||
|
>
|
||||||
|
<video
|
||||||
|
style="width: 100%; height: 100%"
|
||||||
|
:ref="setItemRef"
|
||||||
|
muted
|
||||||
|
autoplay
|
||||||
|
></video>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Page>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import DpTree from './dp-tree.vue';
|
||||||
|
import { Page } from '@vben/common-ui';
|
||||||
|
import { ref } from 'vue';
|
||||||
|
import mpegts from "mpegts.js";
|
||||||
|
import {addStreamProxy} from "#/api/sis/stream";
|
||||||
|
import {message} from "ant-design-vue";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 屏幕播放器数量
|
||||||
|
*/
|
||||||
|
const selected = 'selected';
|
||||||
|
const playerNum = ref(4);
|
||||||
|
/**
|
||||||
|
* 屏幕播放器样式
|
||||||
|
*/
|
||||||
|
const playerStyle = ref({
|
||||||
|
width: '50%',
|
||||||
|
height: '50%',
|
||||||
|
});
|
||||||
|
const currentSelectPlayerIndex = ref(-1);
|
||||||
|
|
||||||
|
function playerSelect(index: number) {
|
||||||
|
if (index === currentSelectPlayerIndex.value) {
|
||||||
|
currentSelectPlayerIndex.value = -1;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
currentSelectPlayerIndex.value = index;
|
||||||
|
}
|
||||||
|
|
||||||
|
const itemRefs = ref<HTMLVideoElement[]>([]);
|
||||||
|
const setItemRef = (el: any) => {
|
||||||
|
if (el) {
|
||||||
|
itemRefs.value.push(el);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function onNodeChecked(nodes: any[]) {
|
||||||
|
console.log(nodes);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 播放器数据, 每一个位置代表页面上行的一个矩形
|
||||||
|
const playerList: any[] = [];
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 开始播放视频流
|
||||||
|
* @param nodeData 播放的节点数据
|
||||||
|
* @param index 播放器的索引信息
|
||||||
|
*/
|
||||||
|
function doPlayer(nodeData: any, index: number = 0) {
|
||||||
|
console.log('index=', index);
|
||||||
|
if (mpegts.isSupported()) {
|
||||||
|
let params = {};
|
||||||
|
// if (nodeData.nvrIp) {
|
||||||
|
// params = {
|
||||||
|
// videoIp: nodeData.nvrIp,
|
||||||
|
// videoPort: nodeData.nvrPort,
|
||||||
|
// factoryNo: nodeData.nvrFactoryNo,
|
||||||
|
// account: nodeData.nvrAccount,
|
||||||
|
// pwd: nodeData.nvrPwd,
|
||||||
|
// channelId: nodeData.nvrChannelNo,
|
||||||
|
// };
|
||||||
|
// } else {
|
||||||
|
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;
|
||||||
|
// 将url 绑定到 nodeData
|
||||||
|
nodeData.url = url;
|
||||||
|
closePlayer(index);
|
||||||
|
const videoConfig = {
|
||||||
|
type: 'flv',
|
||||||
|
url: url,
|
||||||
|
isLive: true,
|
||||||
|
hasAudio: false,
|
||||||
|
hasVideo: true,
|
||||||
|
enableWorker: true, // 启用分离的线程进行转码
|
||||||
|
enableStashBuffer: false, // 关闭IO隐藏缓冲区
|
||||||
|
stashInitialSize: 256, // 减少首帧显示等待时长
|
||||||
|
};
|
||||||
|
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 changeElPlayer(playerInfo: any, index: number) {
|
||||||
|
const playerData = playerInfo.data;
|
||||||
|
const oldPlayer = playerInfo.player;
|
||||||
|
if (oldPlayer) {
|
||||||
|
closePlayVieo(oldPlayer);
|
||||||
|
}
|
||||||
|
const videoConfig = {
|
||||||
|
type: 'flv',
|
||||||
|
url: playerData.url,
|
||||||
|
isLive: true,
|
||||||
|
hasAudio: false,
|
||||||
|
hasVideo: true,
|
||||||
|
enableWorker: true, // 启用分离的线程进行转码
|
||||||
|
enableStashBuffer: false, // 关闭IO隐藏缓冲区
|
||||||
|
stashInitialSize: 256, // 减少首帧显示等待时长
|
||||||
|
};
|
||||||
|
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: playerData,
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
console.log('视频播放元素获取异常');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function closePlayVieo(plInfo: any) {
|
||||||
|
if (plInfo) {
|
||||||
|
try {
|
||||||
|
plInfo.pause(); // 暂停
|
||||||
|
plInfo.unload(); // 卸载
|
||||||
|
plInfo.destroy(); // 销毁
|
||||||
|
} catch (e) {
|
||||||
|
console.log('播放器关闭失败,e=', e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
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);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<style>
|
||||||
|
.player {
|
||||||
|
border: 1px solid #e4e4e7;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
video {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
object-fit: fill;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.player.selected {
|
||||||
|
border: 2px solid deepskyblue;
|
||||||
|
}
|
||||||
|
</style>
|
@@ -1,11 +1,11 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed, ref } from 'vue'
|
import { computed, ref } from 'vue';
|
||||||
|
|
||||||
import { useVbenModal } from '@vben/common-ui'
|
import { useVbenModal } from '@vben/common-ui';
|
||||||
import { $t } from '@vben/locales'
|
import { $t } from '@vben/locales';
|
||||||
import { cloneDeep, getPopupContainer, handleNode } from '@vben/utils'
|
import { cloneDeep, getPopupContainer, handleNode } from '@vben/utils';
|
||||||
|
|
||||||
import { useVbenForm } from '#/adapter/form'
|
import { useVbenForm } from '#/adapter/form';
|
||||||
import {
|
import {
|
||||||
accessControlAdd,
|
accessControlAdd,
|
||||||
accessControlInfo,
|
accessControlInfo,
|
||||||
@@ -14,15 +14,15 @@ import {
|
|||||||
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
import { defaultFormValueGetter, useBeforeCloseDiff } from '#/utils/popup';
|
||||||
import { communityTree } from '#/api/property/community';
|
import { communityTree } from '#/api/property/community';
|
||||||
import { modalSchema } from './data';
|
import { modalSchema } from './data';
|
||||||
import type {DeviceManageQuery} from "#/api/sis/deviceManage/model";
|
import type { DeviceManageQuery } from '#/api/sis/deviceManage/model';
|
||||||
import {deviceManageList} from "#/api/sis/deviceManage";
|
import { deviceManageList } from '#/api/sis/deviceManage';
|
||||||
|
|
||||||
const emit = defineEmits<{ reload: [] }>()
|
const emit = defineEmits<{ reload: [] }>();
|
||||||
|
|
||||||
const isUpdate = ref(false)
|
const isUpdate = ref(false);
|
||||||
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 [BasicForm, formApi] = useVbenForm({
|
const [BasicForm, formApi] = useVbenForm({
|
||||||
commonConfig: {
|
commonConfig: {
|
||||||
@@ -38,14 +38,14 @@ const [BasicForm, formApi] = useVbenForm({
|
|||||||
schema: modalSchema(),
|
schema: modalSchema(),
|
||||||
showDefaultActions: false,
|
showDefaultActions: false,
|
||||||
wrapperClass: 'grid-cols-1',
|
wrapperClass: 'grid-cols-1',
|
||||||
})
|
});
|
||||||
|
|
||||||
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
const { onBeforeClose, markInitialized, resetInitialized } = useBeforeCloseDiff(
|
||||||
{
|
{
|
||||||
initializedGetter: defaultFormValueGetter(formApi),
|
initializedGetter: defaultFormValueGetter(formApi),
|
||||||
currentGetter: defaultFormValueGetter(formApi),
|
currentGetter: defaultFormValueGetter(formApi),
|
||||||
},
|
},
|
||||||
)
|
);
|
||||||
|
|
||||||
const [BasicModal, modalApi] = useVbenModal({
|
const [BasicModal, modalApi] = useVbenModal({
|
||||||
// 在这里更改宽度
|
// 在这里更改宽度
|
||||||
@@ -56,58 +56,58 @@ const [BasicModal, modalApi] = useVbenModal({
|
|||||||
onConfirm: handleConfirm,
|
onConfirm: handleConfirm,
|
||||||
onOpenChange: async (isOpen) => {
|
onOpenChange: async (isOpen) => {
|
||||||
if (!isOpen) {
|
if (!isOpen) {
|
||||||
return null
|
return null;
|
||||||
}
|
}
|
||||||
modalApi.modalLoading(true)
|
modalApi.modalLoading(true);
|
||||||
setupCommunitySelect()
|
setupCommunitySelect();
|
||||||
const { id } = modalApi.getData() as { id?: number | string }
|
const { id } = modalApi.getData() as { id?: number | string };
|
||||||
isUpdate.value = !!id
|
isUpdate.value = !!id;
|
||||||
|
|
||||||
if (isUpdate.value && id) {
|
if (isUpdate.value && id) {
|
||||||
const record = await accessControlInfo(id)
|
const record = await accessControlInfo(id);
|
||||||
await formApi.setValues(record)
|
await formApi.setValues(record);
|
||||||
}
|
}
|
||||||
await markInitialized()
|
await markInitialized();
|
||||||
|
|
||||||
modalApi.modalLoading(false)
|
modalApi.modalLoading(false);
|
||||||
},
|
},
|
||||||
})
|
});
|
||||||
|
|
||||||
async function handleConfirm() {
|
async function handleConfirm() {
|
||||||
try {
|
try {
|
||||||
modalApi.lock(true)
|
modalApi.lock(true);
|
||||||
const { valid } = await formApi.validate()
|
const { valid } = await formApi.validate();
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
// getValues获取为一个readonly的对象 需要修改必须先深拷贝一次
|
||||||
const data = cloneDeep(await formApi.getValues())
|
const data = cloneDeep(await formApi.getValues());
|
||||||
await (isUpdate.value ? accessControlUpdate(data) : accessControlAdd(data))
|
await (isUpdate.value ? accessControlUpdate(data) : accessControlAdd(data));
|
||||||
resetInitialized()
|
resetInitialized();
|
||||||
emit('reload')
|
emit('reload');
|
||||||
modalApi.close()
|
modalApi.close();
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error(error)
|
console.error(error);
|
||||||
} finally {
|
} finally {
|
||||||
modalApi.lock(false)
|
modalApi.lock(false);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function setupCommunitySelect() {
|
async function setupCommunitySelect() {
|
||||||
const areaList = await communityTree(3)
|
const areaList = await communityTree(3);
|
||||||
// 选中后显示在输入框的值 即父节点 / 子节点
|
// 选中后显示在输入框的值 即父节点 / 子节点
|
||||||
// addFullName(areaList, 'areaName', ' / ');
|
// addFullName(areaList, 'areaName', ' / ');
|
||||||
const splitStr = '/'
|
const splitStr = '/';
|
||||||
handleNode(areaList, 'label', splitStr, function (node: any) {
|
handleNode(areaList, 'label', splitStr, function (node: any) {
|
||||||
if (node.level != 3) {
|
if (node.level != 3) {
|
||||||
node.disabled = true
|
node.disabled = true;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
// 加载监控
|
// 加载监控
|
||||||
const params: DeviceManageQuery = {
|
const params: DeviceManageQuery = {
|
||||||
pageNum: 1,
|
pageNum: 1,
|
||||||
pageSize: 500,
|
pageSize: 500,
|
||||||
deviceType: 1
|
deviceType: 1,
|
||||||
};
|
};
|
||||||
const res = await deviceManageList(params);
|
const res = await deviceManageList(params);
|
||||||
const arr = res.rows.map((item) => {
|
const arr = res.rows.map((item) => {
|
||||||
@@ -116,8 +116,8 @@ async function setupCommunitySelect() {
|
|||||||
value: item.id,
|
value: item.id,
|
||||||
deviceIp: item.deviceIp,
|
deviceIp: item.deviceIp,
|
||||||
deviceId: item.id,
|
deviceId: item.id,
|
||||||
}
|
};
|
||||||
})
|
});
|
||||||
formApi.updateSchema([
|
formApi.updateSchema([
|
||||||
{
|
{
|
||||||
componentProps: () => ({
|
componentProps: () => ({
|
||||||
@@ -158,8 +158,8 @@ async function setupCommunitySelect() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function handleClosed() {
|
async function handleClosed() {
|
||||||
await formApi.resetForm()
|
await formApi.resetForm();
|
||||||
resetInitialized()
|
resetInitialized();
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@@ -136,11 +136,9 @@ function handleCheck(checked: Key[] | { checked: Key[]; halfChecked: Key[] }, in
|
|||||||
info.checkedNodesPositions.forEach((item: any) => {
|
info.checkedNodesPositions.forEach((item: any) => {
|
||||||
switch (item.node.label) {
|
switch (item.node.label) {
|
||||||
case 'accessControl':
|
case 'accessControl':
|
||||||
console.log('item.node', item.node)
|
|
||||||
acIds.value = acIds.value.concat(item.node.code)
|
acIds.value = acIds.value.concat(item.node.code)
|
||||||
break
|
break
|
||||||
case 'floor':
|
case 'floor':
|
||||||
console.log('item.node', item.node)
|
|
||||||
floorIds.value = floorIds.value.concat(item.node.code)
|
floorIds.value = floorIds.value.concat(item.node.code)
|
||||||
eleIds.value = eleIds.value.concat(item.node.parentCode)
|
eleIds.value = eleIds.value.concat(item.node.parentCode)
|
||||||
break
|
break
|
||||||
|
@@ -29,7 +29,7 @@ export default defineConfig(async () => {
|
|||||||
// 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.13.27:8080',
|
target: 'http://127.0.0.1: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,
|
||||||
|
Reference in New Issue
Block a user