Merge branch 'master' of http://47.115.223.229:8888/yangjun/hldy_vue
This commit is contained in:
commit
a2c54d328e
|
@ -0,0 +1,39 @@
|
|||
import { defHttp } from '/@/utils/http/axios';
|
||||
|
||||
enum Api {
|
||||
queryTreeSync = '/admin/institutionArea/queryTreeSync',
|
||||
searchBy = '/admin/institutionArea/searchBy',
|
||||
add = '/admin/institutionArea/add',
|
||||
edit = '/admin/institutionArea/edit',
|
||||
delete = '/admin/institutionArea/delete',
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 获取机构树列表
|
||||
* @param params
|
||||
*/
|
||||
export const queryTreeSync = (params?) => defHttp.get({ url: Api.queryTreeSync, params });
|
||||
|
||||
/**
|
||||
* 根据关键字搜索机构
|
||||
*/
|
||||
export const searchByKeywords = (params) => defHttp.get({ url: Api.searchBy, params });
|
||||
|
||||
/**
|
||||
* 保存或者更新机构
|
||||
* @param params
|
||||
*/
|
||||
export const saveOrUpdateInst = (params, isUpdate) => {
|
||||
let url = isUpdate ? Api.edit : Api.add;
|
||||
return defHttp.post({ url: url, params });
|
||||
};
|
||||
|
||||
/**
|
||||
* 删除机构
|
||||
*/
|
||||
export const deleteInst = (params,handleSuccess) => {
|
||||
return defHttp.post({ url: Api.delete, params }, { joinParamsToUrl: true }).then(() => {
|
||||
handleSuccess();
|
||||
});
|
||||
};
|
|
@ -0,0 +1,73 @@
|
|||
import { FormSchema } from '/@/components/Form';
|
||||
|
||||
// 部门基础表单
|
||||
export function useBasicFormSchema() {
|
||||
const basicFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'instName',
|
||||
label: '名称',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入机构/区域名称',
|
||||
},
|
||||
rules: [{ required: true, message: '名称不能为空' }],
|
||||
},
|
||||
{
|
||||
field: 'parentId',
|
||||
label: '上级',
|
||||
component: 'TreeSelect',
|
||||
componentProps: {
|
||||
treeData: [],
|
||||
placeholder: '无',
|
||||
dropdownStyle: { maxHeight: '200px', overflow: 'auto' },
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'orgCode',
|
||||
label: '编码',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入编码',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'orgCategory',
|
||||
label: '类型',
|
||||
component: 'RadioButtonGroup',
|
||||
componentProps: { options: [] },
|
||||
},
|
||||
{
|
||||
field: 'instOrder',
|
||||
label: '排序',
|
||||
component: 'InputNumber',
|
||||
componentProps: {},
|
||||
},
|
||||
{
|
||||
field: 'mobile',
|
||||
label: '电话',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入电话',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'address',
|
||||
label: '地址',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入地址',
|
||||
},
|
||||
},
|
||||
];
|
||||
return { basicFormSchema };
|
||||
}
|
||||
|
||||
// 机构类型选项
|
||||
export const orgCategoryOptions = {
|
||||
// 一级部门
|
||||
root: [{ value: '1', label: '机构' }],
|
||||
// 子级部门
|
||||
child: [
|
||||
{ value: '2', label: '区域' },
|
||||
],
|
||||
};
|
|
@ -0,0 +1,119 @@
|
|||
<template>
|
||||
<BasicDrawer
|
||||
v-bind="$attrs"
|
||||
@register="registerDrawer"
|
||||
:title="getTitle"
|
||||
:width="adaptiveWidth"
|
||||
@ok="handleSubmit"
|
||||
:showFooter="showFooter"
|
||||
destroyOnClose
|
||||
>
|
||||
<BasicForm @register="registerForm" />
|
||||
</BasicDrawer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { defineComponent, ref, computed, unref, useAttrs } from 'vue';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||
import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth';
|
||||
import { getTenantId } from "/@/utils/auth";
|
||||
import { useBasicFormSchema, orgCategoryOptions } from "../InstitutionArea.data";
|
||||
import { saveOrUpdateInst} from "../InstitutionArea.api";
|
||||
|
||||
// 声明Emits
|
||||
const emit = defineEmits(['success', 'register']);
|
||||
const props = defineProps({
|
||||
rootTreeData: { type: Array, default: () => [] },
|
||||
});
|
||||
const attrs = useAttrs();
|
||||
const isUpdate = ref(true);
|
||||
const isChild = ref(true);
|
||||
const rowId = ref('');
|
||||
let isFormDepartUser = false;
|
||||
//表单配置
|
||||
const [registerForm, { setProps, resetFields, setFieldsValue, validate, updateSchema }] = useForm({
|
||||
labelWidth: 90,
|
||||
schemas: useBasicFormSchema().basicFormSchema,
|
||||
showActionButtonGroup: false,
|
||||
});
|
||||
const showFooter = ref(true);
|
||||
//表单赋值
|
||||
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||
await resetFields();
|
||||
showFooter.value = data?.showFooter ?? true;
|
||||
setDrawerProps({ confirmLoading: false, showFooter: showFooter.value });
|
||||
// 当前是否为添加子级
|
||||
isChild.value = unref(data?.isChild);
|
||||
let categoryOptions = isChild.value ? orgCategoryOptions.child : orgCategoryOptions.root;
|
||||
console.log(props.rootTreeData);
|
||||
// 隐藏不需要展示的字段
|
||||
updateSchema([
|
||||
{
|
||||
field: 'parentId',
|
||||
show: isChild.value,
|
||||
componentProps: {
|
||||
// 如果是添加子部门,就禁用该字段
|
||||
disabled: isChild.value,
|
||||
treeData: props.rootTreeData,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'orgCode',
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
field: 'orgCategory',
|
||||
componentProps: { options: categoryOptions },
|
||||
},
|
||||
]);
|
||||
|
||||
let record = unref(data?.record);
|
||||
if (typeof record !== 'object') {
|
||||
record = {};
|
||||
}
|
||||
// 赋默认值
|
||||
record = Object.assign(
|
||||
{
|
||||
departOrder: 0,
|
||||
orgCategory: categoryOptions[0].value,
|
||||
},
|
||||
record
|
||||
);
|
||||
console.log(record);
|
||||
await setFieldsValue({ ...record });
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
// 隐藏底部时禁用整个表单
|
||||
setProps({ disabled: !showFooter.value });
|
||||
});
|
||||
//获取标题
|
||||
const getTitle = computed(() => {
|
||||
let title = '机构';
|
||||
if(isChild.value){
|
||||
title = '区域';
|
||||
}
|
||||
if (!unref(isUpdate)) {
|
||||
return '新增'+title;
|
||||
} else {
|
||||
return unref(showFooter) ? '编辑'+title : title+'详情';
|
||||
}
|
||||
});
|
||||
const { adaptiveWidth } = useDrawerAdaptiveWidth();
|
||||
|
||||
//提交事件
|
||||
async function handleSubmit() {
|
||||
try {
|
||||
let values = await validate();
|
||||
setDrawerProps({ confirmLoading: true });
|
||||
let params = values;
|
||||
let isUpdateVal = unref(isUpdate);
|
||||
await saveOrUpdateInst(params,isUpdateVal);
|
||||
//关闭弹窗
|
||||
closeDrawer();
|
||||
//刷新列表
|
||||
emit('success');
|
||||
} finally {
|
||||
setDrawerProps({ confirmLoading: false });
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -0,0 +1,117 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<BasicForm @register="registerForm" />
|
||||
<div class="j-box-bottom-button offset-20" style="margin-top: 30px">
|
||||
<div class="j-box-bottom-button-float">
|
||||
<a-button preIcon="ant-design:sync-outlined" @click="onReset">重置</a-button>
|
||||
<a-button type="primary" preIcon="ant-design:save-filled" @click="onSubmit">保存</a-button>
|
||||
</div>
|
||||
</div>
|
||||
</a-spin>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { watch, computed, inject, ref, unref, onMounted } from 'vue';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { saveOrUpdateInst } from '../InstitutionArea.api';
|
||||
import { useBasicFormSchema, orgCategoryOptions } from '../InstitutionArea.data';
|
||||
const emit = defineEmits(['success']);
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
rootTreeData: { type: Array, default: () => [] },
|
||||
});
|
||||
const loading = ref<boolean>(false);
|
||||
// 当前是否是更新模式
|
||||
const isUpdate = ref<boolean>(true);
|
||||
// 当前的弹窗数据
|
||||
const model = ref<object>({});
|
||||
|
||||
//注册表单
|
||||
const [registerForm, { resetFields, setFieldsValue, validate, updateSchema }] = useForm({
|
||||
schemas: useBasicFormSchema().basicFormSchema,
|
||||
showActionButtonGroup: false,
|
||||
});
|
||||
|
||||
const categoryOptions = computed(() => {
|
||||
if (!!props?.data?.parentId) {
|
||||
return orgCategoryOptions.child;
|
||||
} else {
|
||||
return orgCategoryOptions.root;
|
||||
}
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// 禁用字段
|
||||
updateSchema([
|
||||
{ field: 'parentId', componentProps: { disabled: true } },
|
||||
{ field: 'orgCode', componentProps: { disabled: true } },
|
||||
]);
|
||||
// data 变化,重填表单
|
||||
watch(
|
||||
() => props.data,
|
||||
async () => {
|
||||
let record = unref(props.data);
|
||||
if (typeof record !== 'object') {
|
||||
record = {};
|
||||
}
|
||||
model.value = record;
|
||||
await resetFields();
|
||||
await setFieldsValue({ ...record });
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
// 更新 父部门 选项
|
||||
watch(
|
||||
() => props.rootTreeData,
|
||||
async () => {
|
||||
updateSchema([
|
||||
{
|
||||
field: 'parentId',
|
||||
componentProps: { treeData: props.rootTreeData },
|
||||
},
|
||||
]);
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
// 监听并更改 orgCategory options
|
||||
watch(
|
||||
categoryOptions,
|
||||
async () => {
|
||||
updateSchema([
|
||||
{
|
||||
field: 'orgCategory',
|
||||
componentProps: { options: categoryOptions.value },
|
||||
},
|
||||
]);
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
});
|
||||
|
||||
// 重置表单
|
||||
async function onReset() {
|
||||
await resetFields();
|
||||
await setFieldsValue({ ...model.value });
|
||||
}
|
||||
|
||||
// 提交事件
|
||||
async function onSubmit() {
|
||||
try {
|
||||
loading.value = true;
|
||||
let values = await validate();
|
||||
values = Object.assign({}, model.value, values);
|
||||
//提交表单
|
||||
await saveOrUpdateInst(values, isUpdate.value);
|
||||
//刷新列表
|
||||
emit('success');
|
||||
Object.assign(model.value, values);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
|
||||
|
||||
</style>
|
|
@ -0,0 +1,287 @@
|
|||
<template>
|
||||
<a-card :bordered="false" style="height: 100%">
|
||||
<a-spin :spinning="syncoading">
|
||||
<div class="j-table-operator" style="width: 100%">
|
||||
<a-button preIcon="ant-design:sync-outlined" @click="loadRootTreeData">刷新</a-button>
|
||||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleAdd">新增</a-button>
|
||||
<a-button type="primary" preIcon="ant-design:plus-outlined" @click="handleAddChild()">新增下级</a-button>
|
||||
</div>
|
||||
<a-spin :spinning="loading">
|
||||
<a-input-search placeholder="按名称搜索…" style="margin-bottom: 10px" @search="onSearch" />
|
||||
<!--分组树-->
|
||||
<template v-if="treeData.length > 0">
|
||||
<a-tree
|
||||
v-if="!treeReloading"
|
||||
:clickRowToExpand="false"
|
||||
:treeData="treeData"
|
||||
:selectedKeys="selectedKeys"
|
||||
:checkStrictly="checkStrictly"
|
||||
:load-data="loadChildrenTreeData"
|
||||
:checkedKeys="checkedKeys"
|
||||
v-model:expandedKeys="expandedKeys"
|
||||
@select="onSelect"
|
||||
>
|
||||
<template #title="{ key: treeKey, title, dataRef }">
|
||||
<a-dropdown :trigger="['contextmenu']">
|
||||
<span>{{ title }}</span>
|
||||
<template #overlay>
|
||||
<a-menu @click="">
|
||||
<a-menu-item key="1" @click="handleAddChild(dataRef)">添加子级</a-menu-item>
|
||||
<a-menu-item key="2" @click="handleDeleteNode(dataRef)">
|
||||
<span style="color: red">删除</span>
|
||||
</a-menu-item>
|
||||
</a-menu>
|
||||
</template>
|
||||
</a-dropdown>
|
||||
</template>
|
||||
</a-tree>
|
||||
</template>
|
||||
<a-empty v-else description="暂无数据" />
|
||||
</a-spin>
|
||||
</a-spin>
|
||||
</a-card>
|
||||
<!-- 表单分组 -->
|
||||
<InstitutionAreaDrawer :rootTreeData="treeData" @register="registerDrawer" @success="handleSuccess" />
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {createVNode, nextTick, ref} from 'vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useMethods } from '/@/hooks/system/useMethods';
|
||||
import {useDrawer} from "@/components/Drawer";
|
||||
import {Modal} from "ant-design-vue";
|
||||
import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
|
||||
import InstitutionAreaDrawer from './InstitutionAreaDrawer.vue';
|
||||
import {queryTreeSync,searchByKeywords,deleteInst} from '../InstitutionArea.api';
|
||||
const { createMessage } = useMessage();
|
||||
const emit = defineEmits(['select', 'rootTreeData']);
|
||||
const syncoading = ref<boolean>(false);
|
||||
const loading = ref<boolean>(false);
|
||||
// 分组树列表数据
|
||||
const treeData = ref<any[]>([]);
|
||||
// 当前选中的项
|
||||
const checkedKeys = ref<any[]>([]);
|
||||
// 当前展开的项
|
||||
const expandedKeys = ref<any[]>([]);
|
||||
// 当前选中的项
|
||||
const selectedKeys = ref<any[]>([]);
|
||||
// 树组件重新加载
|
||||
const treeReloading = ref<boolean>(false);
|
||||
// 树父子是否关联
|
||||
const checkStrictly = ref<boolean>(true);
|
||||
// 当前选中的区域
|
||||
const currentInst = ref<any>(null);
|
||||
//注册drawer
|
||||
const [registerDrawer, { openDrawer : openDrawer }] = useDrawer();
|
||||
// 搜索关键字
|
||||
const searchKeyword = ref('');
|
||||
|
||||
// 加载顶级分组信息
|
||||
async function loadRootTreeData() {
|
||||
searchKeyword.value = "";
|
||||
try {
|
||||
loading.value = true;
|
||||
treeData.value = [];
|
||||
const result = await queryTreeSync();
|
||||
if (Array.isArray(result)) {
|
||||
treeData.value = result;
|
||||
}
|
||||
if (expandedKeys.value.length === 0) {
|
||||
autoExpandParentNode();
|
||||
} else {
|
||||
if (selectedKeys.value.length === 0) {
|
||||
let item = treeData.value[0];
|
||||
if (item) {
|
||||
// 默认选中第一个
|
||||
setSelectedKey(item.id, item);
|
||||
}
|
||||
} else {
|
||||
emit('select', currentInst.value);
|
||||
}
|
||||
}
|
||||
emit('rootTreeData', treeData.value);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
syncoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
loadRootTreeData();
|
||||
|
||||
/**
|
||||
* 加载子级分组信息
|
||||
*/
|
||||
async function loadChildrenTreeData(treeNode) {
|
||||
try {
|
||||
const result = await queryTreeSync({
|
||||
pid: treeNode.dataRef.id,
|
||||
});
|
||||
if (result.length == 0) {
|
||||
treeNode.dataRef.isLeaf = true;
|
||||
} else {
|
||||
treeNode.dataRef.children = result;
|
||||
if (expandedKeys.value.length > 0) {
|
||||
// 判断获取的子级是否有当前展开的项
|
||||
let subKeys: any[] = [];
|
||||
for (let key of expandedKeys.value) {
|
||||
if (result.findIndex((item) => item.id === key) !== -1) {
|
||||
subKeys.push(key);
|
||||
}
|
||||
}
|
||||
if (subKeys.length > 0) {
|
||||
expandedKeys.value = [...expandedKeys.value];
|
||||
}
|
||||
}
|
||||
}
|
||||
treeData.value = [...treeData.value];
|
||||
emit('rootTreeData', treeData.value);
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
return Promise.resolve();
|
||||
}
|
||||
|
||||
/**
|
||||
* 自动展开父节点,只展开一级
|
||||
*/
|
||||
function autoExpandParentNode() {
|
||||
let item = treeData.value[0];
|
||||
if (item) {
|
||||
if (!item.isLeaf) {
|
||||
expandedKeys.value = [item.key];
|
||||
}
|
||||
// 默认选中第一个
|
||||
setSelectedKey(item.id, item);
|
||||
reloadTree();
|
||||
} else {
|
||||
emit('select', null);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 重新加载树组件,防止无法默认展开数据
|
||||
*/
|
||||
async function reloadTree() {
|
||||
await nextTick();
|
||||
treeReloading.value = true;
|
||||
await nextTick();
|
||||
treeReloading.value = false;
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置当前选中的行
|
||||
*/
|
||||
function setSelectedKey(key: string, data?: object) {
|
||||
selectedKeys.value = [key];
|
||||
if (data) {
|
||||
currentInst.value = data;
|
||||
emit('select', data);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 树选择事件
|
||||
*/
|
||||
function onSelect(selKeys, event) {
|
||||
if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
|
||||
setSelectedKey(selKeys[0], event.selectedNodes[0]);
|
||||
} else {
|
||||
// 这样可以防止用户取消选择
|
||||
setSelectedKey(selectedKeys.value[0]);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 新增
|
||||
*/
|
||||
function handleAdd() {
|
||||
openDrawer(true, {
|
||||
isUpdate: false,
|
||||
isChild: false,
|
||||
showFooter: true,
|
||||
tenantSaas: false,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 添加子级
|
||||
*/
|
||||
function handleAddChild(data = currentInst.value){
|
||||
if (data == null) {
|
||||
createMessage.warning('请先选择一个节点');
|
||||
return;
|
||||
}
|
||||
console.log(data);
|
||||
const record = { parentId: data.id };
|
||||
openDrawer(true, {
|
||||
record,
|
||||
isUpdate: false,
|
||||
isChild: true,
|
||||
showFooter: true,
|
||||
tenantSaas: false,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
*删除节点
|
||||
*/
|
||||
function handleDeleteNode(data = currentInst.value){
|
||||
if (data == null) {
|
||||
createMessage.warning('请先选择一个节点');
|
||||
return;
|
||||
}
|
||||
let title = "";
|
||||
if(data.orgCategory == "1"){
|
||||
title = "机构";
|
||||
}else{
|
||||
title = "区域";
|
||||
}
|
||||
Modal.confirm({
|
||||
title: "删除"+title,
|
||||
width: '500px',
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: createVNode('div', { style: 'color:red;' }, title+'删除后,该'+title+'下的所有关联将被移除,确定要删除该'+title+'吗?'),
|
||||
okText: '确定',
|
||||
onOk() {
|
||||
deleteInst(data, handleSuccess);
|
||||
},
|
||||
onCancel() {
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
}
|
||||
|
||||
// 搜索事件
|
||||
async function onSearch(value: string) {
|
||||
if (value) {
|
||||
try {
|
||||
loading.value = true;
|
||||
treeData.value = [];
|
||||
let result = await searchByKeywords({ keyWord: value });
|
||||
if (Array.isArray(result)) {
|
||||
treeData.value = result;
|
||||
}
|
||||
autoExpandParentNode();
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
} else {
|
||||
loadRootTreeData();
|
||||
}
|
||||
searchKeyword.value = value;
|
||||
}
|
||||
|
||||
function handleSuccess(){
|
||||
loadRootTreeData();
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
loadRootTreeData,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
|
||||
</style>
|
|
@ -0,0 +1,63 @@
|
|||
<template>
|
||||
<a-row class="p-2" type="flex" :gutter="10">
|
||||
<a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px">
|
||||
<InstitutionAreaLeftTree ref="leftTree" @select="onTreeSelect" @rootTreeData="onRootTreeData" />
|
||||
</a-col>
|
||||
<a-col :xl="12" :lg="24" :md="24" style="margin-bottom: 10px">
|
||||
<div style="height: 100%;" class="form-content">
|
||||
<a-tabs v-show="nodeData != null" defaultActiveKey="base-info">
|
||||
<a-tab-pane tab="基本信息" key="base-info" forceRender style="position: relative">
|
||||
<div style="padding: 20px">
|
||||
<InstitutionAreaForm :data="nodeData" :rootTreeData="rootTreeData" @success="onSuccess" />
|
||||
</div>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
<div v-show="nodeData == null" style="padding-top: 40px">
|
||||
<a-empty description="请选择区域" />
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
|
||||
<script lang="ts" name="iot-nuIotRegionInfo" setup>
|
||||
import { ref } from 'vue';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import InstitutionAreaLeftTree from './components/InstitutionAreaLeftTree.vue'
|
||||
import InstitutionAreaForm from './components/InstitutionAreaForm.vue';
|
||||
|
||||
// 给子组件定义一个ref变量
|
||||
const leftTree = ref();
|
||||
// 当前选中的区域信息
|
||||
const nodeData = ref({});
|
||||
const rootTreeData = ref<any[]>([]);
|
||||
// 左侧树选择后触发
|
||||
function onTreeSelect(data) {
|
||||
nodeData.value = data;
|
||||
}
|
||||
// 左侧树rootTreeData触发
|
||||
function onRootTreeData(data) {
|
||||
rootTreeData.value = data;
|
||||
}
|
||||
|
||||
function onSuccess() {
|
||||
leftTree.value.loadRootTreeData();
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
.p-2{
|
||||
height: calc(100vh - 120px);
|
||||
}
|
||||
|
||||
.form-content{
|
||||
background-color: #ffffff;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
:deep(.ant-tabs-nav ){
|
||||
padding: 0 20px;
|
||||
}
|
||||
</style>
|
|
@ -157,7 +157,7 @@
|
|||
import { getValueType } from '/@/utils';
|
||||
import { Form } from 'ant-design-vue';
|
||||
import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
|
||||
import { getVideoParams,setVideoParams } from "@/views/iot/tplink/camera/camera.api";
|
||||
import { getVideoParams,setVideoParams } from "../camera.api";
|
||||
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
|
|
|
@ -131,7 +131,7 @@
|
|||
getTamperNotif,
|
||||
setTamperNotif,
|
||||
testAudio
|
||||
} from "@/views/iot/tplink/camera/camera.api";
|
||||
} from "../camera.api";
|
||||
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
|
|
|
@ -216,7 +216,7 @@ import {
|
|||
setImageCommon,
|
||||
configRecovery,
|
||||
getPreviewUrl,
|
||||
} from "@/views/iot/tplink/camera/camera.api";
|
||||
} from "../camera.api";
|
||||
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
|
@ -350,7 +350,6 @@ import {
|
|||
"deviceIndex": deviceIndex,
|
||||
"type": "switch"
|
||||
}).then(res=>{
|
||||
// console.log(res);
|
||||
formData.flip_type = res.flip_type; //画面镜像翻转
|
||||
formData.night_vision_mode = res.night_vision_mode; //照明模式
|
||||
});
|
||||
|
|
|
@ -19,13 +19,12 @@
|
|||
<script lang="ts" setup>
|
||||
import {defineComponent, ref, computed, unref, useAttrs, createVNode, h} from 'vue';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { formSchema } from "@/views/iot/tplink/camera/camera.data";
|
||||
import { update,rebootDevice } from '@/views/iot/tplink/camera/camera.api';
|
||||
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||
import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth';
|
||||
import { getTenantId } from "/@/utils/auth";
|
||||
import {Modal} from "ant-design-vue";
|
||||
import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
|
||||
import { formSchema } from "../camera.data";
|
||||
import { update,rebootDevice } from '../camera.api';
|
||||
|
||||
// 声明Emits
|
||||
const emit = defineEmits(['success', 'register']);
|
||||
|
@ -111,7 +110,6 @@ function restartNow(record){
|
|||
});
|
||||
},
|
||||
onCancel() {
|
||||
// console.log('Cancel');
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
|
|
|
@ -22,8 +22,8 @@
|
|||
import {ref, reactive, createVNode, h, onMounted, watch, unref} from 'vue';
|
||||
import { BasicTable, useTable, TableAction } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { columns, searchFormSchema } from '@/views/iot/tplink/camera/camera.data';
|
||||
import { list } from '@/views/iot/tplink/camera/camera.api';
|
||||
import { columns, searchFormSchema } from '../camera.data';
|
||||
import { list } from '../camera.api';
|
||||
import { useUserStore } from '/@/store/modules/user';
|
||||
import { useDrawer } from "@/components/Drawer";
|
||||
import { useRouter } from 'vue-router';
|
||||
|
@ -78,10 +78,8 @@ import {ref, reactive, createVNode, h, onMounted, watch, unref} from 'vue';
|
|||
watch(
|
||||
() => props.data,
|
||||
async () => {
|
||||
console.log(props.data);
|
||||
queryParam.projectId = props.data.projectId;
|
||||
queryParam.regionId = props.data.regionId;
|
||||
console.log(queryParam);
|
||||
let record = unref(props.data);
|
||||
if (typeof record !== 'object') {
|
||||
record = {};
|
||||
|
@ -160,7 +158,6 @@ import {ref, reactive, createVNode, h, onMounted, watch, unref} from 'vue';
|
|||
* 左侧树选择后触发
|
||||
*/
|
||||
function onTreeSelect(data) {
|
||||
console.log('onTreeSelect: ', data);
|
||||
// departData.value = data;
|
||||
}
|
||||
|
||||
|
@ -168,7 +165,6 @@ import {ref, reactive, createVNode, h, onMounted, watch, unref} from 'vue';
|
|||
* 左侧树rootTreeData触发
|
||||
*/
|
||||
function onRootTreeData(data) {
|
||||
console.log('onRootTreeData: ', data);
|
||||
// rootTreeData.value = data;
|
||||
}
|
||||
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useMethods } from '/@/hooks/system/useMethods';
|
||||
const { createMessage } = useMessage();
|
||||
import { queryProjectTreeSync, queryRegionTreeSync, syncProject, syncRegion } from '@/views/iot/tplink/camera/camera.api';
|
||||
import { queryProjectTreeSync, queryRegionTreeSync, syncProject, syncRegion } from '../camera.api';
|
||||
|
||||
const emit = defineEmits(['select', 'rootTreeData']);
|
||||
const syncoading = ref<boolean>(false);
|
||||
|
@ -152,7 +152,6 @@
|
|||
* 设置当前选中的行
|
||||
*/
|
||||
function setSelectedKey(key: string, data?: object) {
|
||||
console.log('setSelectedKey: ', key);
|
||||
selectedKeys.value = [key];
|
||||
if (data) {
|
||||
currentRegion.value = data;
|
||||
|
@ -164,7 +163,6 @@
|
|||
* 树选择事件
|
||||
*/
|
||||
function onSelect(selKeys, event) {
|
||||
console.log('onSelect: ', selKeys, event);
|
||||
if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
|
||||
setSelectedKey(selKeys[0], event.selectedNodes[0]);
|
||||
} else {
|
||||
|
|
|
@ -101,7 +101,7 @@
|
|||
import {
|
||||
getAlarmInfo, setAlarmInfo,
|
||||
getAlarmPlan, setAlarmPlan,
|
||||
} from "@/views/iot/tplink/camera/camera.api";
|
||||
} from "../camera.api";
|
||||
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
|
@ -365,23 +365,6 @@
|
|||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
// console.log('星期一', mondayArr.value);
|
||||
// console.log('星期二', tuesdayArr.value);
|
||||
// console.log('星期三', wednesdayArr.value);
|
||||
// console.log('星期四', thursdayArr.value);
|
||||
// console.log('星期五', fridayArr.value);
|
||||
// console.log('星期六', saturdayArr.value);
|
||||
// console.log('星期七', sundayArr.value);
|
||||
|
||||
// console.log('星期一', mondayMergeArr.value);
|
||||
// console.log('星期二', tuesdayMergeArr.value);
|
||||
// console.log('星期三', wednesdayMergeArr.value);
|
||||
// console.log('星期四', thursdayMergeArr.value);
|
||||
// console.log('星期五', fridayMergeArr.value);
|
||||
// console.log('星期六', saturdayMergeArr.value);
|
||||
// console.log('星期七', sundayMergeArr.value);
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
|
@ -540,7 +523,6 @@
|
|||
* 鼠标按下
|
||||
*/
|
||||
function handleMouseDown(){
|
||||
// console.log('鼠标按下', event);
|
||||
planVisible.value = true;
|
||||
}
|
||||
|
||||
|
@ -548,7 +530,6 @@
|
|||
* 鼠标抬起
|
||||
*/
|
||||
function handleMouseUp(){
|
||||
// console.log('鼠标抬起', event);
|
||||
planVisible.value = false;
|
||||
}
|
||||
|
||||
|
|
|
@ -35,7 +35,7 @@
|
|||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { getValueType } from '/@/utils';
|
||||
import { Form } from 'ant-design-vue';
|
||||
import { getMultitransUrl } from "@/views/iot/tplink/camera/camera.api";
|
||||
import { getMultitransUrl } from "../camera.api";
|
||||
|
||||
const TumsPlayer = window['tums-player'].default;
|
||||
const props = defineProps({
|
||||
|
@ -148,7 +148,6 @@
|
|||
* 销毁
|
||||
*/
|
||||
function destroy(){
|
||||
console.log("destroy");
|
||||
if (player.value){
|
||||
player.value.destroy().then(() => { }); // 回放销毁时自动调用接口,跨域导致失败
|
||||
initContainerMultitrans.value = false
|
||||
|
|
|
@ -90,7 +90,7 @@
|
|||
getOsd,
|
||||
setOsd,
|
||||
getPreviewUrl
|
||||
} from "@/views/iot/tplink/camera/camera.api";
|
||||
} from "../camera.api";
|
||||
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
|
|
|
@ -123,8 +123,8 @@
|
|||
import { useRouter } from 'vue-router';
|
||||
import type { TabsProps } from 'ant-design-vue';
|
||||
import { useListPage } from "@/hooks/system/useListPage";
|
||||
import { getImageCommon,setImageCommon } from "@/views/iot/tplink/camera/camera.api";
|
||||
import { recordingColumns,searchRecording } from "@/views/iot/tplink/camera/camera.data";
|
||||
import { getImageCommon,setImageCommon } from "../camera.api";
|
||||
import { recordingColumns,searchRecording } from "../camera.data";
|
||||
import CameraCommonForm from './CameraCommonForm.vue';//画面公共信息
|
||||
import CameraOsdForm from './CameraOsdForm.vue';//OSD信息
|
||||
import CameraBitrateForm from './CameraBitrateForm.vue';//码流参数
|
||||
|
|
|
@ -38,7 +38,7 @@
|
|||
import {
|
||||
getPlaybackUrlList,
|
||||
deletePlaybackChn
|
||||
} from "@/views/iot/tplink/camera/camera.api";
|
||||
} from "../camera.api";
|
||||
|
||||
const TumsPlayer = window['tums-player'].default;
|
||||
const props = defineProps({
|
||||
|
@ -110,7 +110,6 @@
|
|||
"endTime":formData.endTime,
|
||||
}).then(res=>{
|
||||
confirmLoading.value=false;
|
||||
// console.log(res);
|
||||
const error = res.error;
|
||||
if(error==null||error==''){
|
||||
formData.sessionId = '';
|
||||
|
@ -119,15 +118,6 @@
|
|||
formData.sessionId += item.sessionId+","
|
||||
let startTime = item.startTime*1000;
|
||||
let endTime = item.endTime*1000;
|
||||
// console.log("url:"+item.url);
|
||||
// console.log("socket:"+item.wssUrl);
|
||||
// console.log("queryAddress:"+item.queryAddress);
|
||||
// console.log("videoSessionId:"+item.sessionId);
|
||||
// console.log("videoDevId:"+item.videoDevId);
|
||||
// console.log("storageDevId:"+item.storageDevId);
|
||||
// console.log("startTime:"+startTime);
|
||||
// console.log("endTime:"+endTime);
|
||||
// console.log("scale:"+item.scale);
|
||||
player.value = new TumsPlayer('video-container-playback', {
|
||||
"autoplay": true,
|
||||
"resolution": "HD",
|
||||
|
@ -165,13 +155,11 @@
|
|||
* 销毁
|
||||
*/
|
||||
async function destroy(){
|
||||
console.log("destroy");
|
||||
if (player.value){
|
||||
deletePlaybackChn({
|
||||
"deviceIndex":formData.videoDevId,
|
||||
"sessionId":formData.sessionId
|
||||
}).then(res=>{
|
||||
console.log(res)
|
||||
});
|
||||
// player.value.destroy().then(() => { }); // 回放销毁时自动调用接口,跨域导致失败
|
||||
initContainerPlayback.value = false
|
||||
|
|
|
@ -77,7 +77,7 @@
|
|||
getPreviewUrl,
|
||||
setImageCommon,
|
||||
testAudio
|
||||
} from "@/views/iot/tplink/camera/camera.api";
|
||||
} from "../camera.api";
|
||||
|
||||
const props = defineProps({
|
||||
formDisabled: { type: Boolean, default: false },
|
||||
|
@ -151,10 +151,6 @@
|
|||
|
||||
createPreview();
|
||||
getSwitch();
|
||||
|
||||
/* await getIpcCapability({"deviceIndex":formData.deviceIndex}).then(res=>{
|
||||
console.log(res);
|
||||
});*/
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -286,7 +282,6 @@
|
|||
izRecording.value = true;
|
||||
player.value.startRecording({micStream:true}).then((res) => {
|
||||
// 设置成功,返回resolve
|
||||
console.log(res);
|
||||
}).catch((errData) => {
|
||||
// 设置失败,包括网络错误以及接口调用报错
|
||||
// 具体错误见errData.error_code
|
||||
|
@ -302,7 +297,6 @@
|
|||
let fileName = formData.deviceIndex+'-'+(new Date().getTime());
|
||||
player.value.stopRecording(fileName, true).then((res) => {
|
||||
// 设置成功,返回resolve
|
||||
console.log(res);
|
||||
}).catch((errData) => {
|
||||
// 设置失败,包括网络错误以及接口调用报错
|
||||
// 具体错误见errData.error_code
|
||||
|
@ -317,7 +311,6 @@
|
|||
getMultitransUrl({
|
||||
"videoDevId":formData.deviceIndex
|
||||
}).then(res=>{
|
||||
console.log(res);
|
||||
player.value.startVoiceIntercom({
|
||||
"url": res.url, // 该url为一次性 需要通过接口实时获取
|
||||
"wssUrl": res.wssUrl,
|
||||
|
@ -339,7 +332,6 @@
|
|||
* 销毁
|
||||
*/
|
||||
function destroy(){
|
||||
console.log("destroy");
|
||||
if (player){
|
||||
player.value.destroy().then(() => {
|
||||
}); // 销毁
|
||||
|
|
|
@ -21,11 +21,11 @@
|
|||
import {ref, reactive, createVNode, h, onMounted, watch, unref} from 'vue';
|
||||
import { BasicTable, useTable, TableAction } from '/@/components/Table';
|
||||
import { useListPage } from '/@/hooks/system/useListPage';
|
||||
import { recordingColumns,searchRecording } from '@/views/iot/tplink/camera/camera.data';
|
||||
import { searchVideo } from '@/views/iot/tplink/camera/camera.api';
|
||||
import { useUserStore } from '/@/store/modules/user';
|
||||
import { useDrawer } from "@/components/Drawer";
|
||||
import { useRouter } from 'vue-router';
|
||||
import { recordingColumns,searchRecording } from '../camera.data';
|
||||
import { searchVideo } from '../camera.api';
|
||||
import CameraPlaybackModal from './CameraPlaybackModal.vue';//普通回放
|
||||
import CameraMultitransModal from './CameraMultitransModal.vue';//Multitrans模式回放
|
||||
|
||||
|
|
|
@ -101,7 +101,7 @@
|
|||
import {
|
||||
getAlarmInfo, setAlarmInfo,
|
||||
getAlarmPlan, setAlarmPlan,
|
||||
} from "@/views/iot/tplink/camera/camera.api";
|
||||
} from "../camera.api";
|
||||
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
|
@ -365,23 +365,6 @@
|
|||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
// console.log('星期一', mondayArr.value);
|
||||
// console.log('星期二', tuesdayArr.value);
|
||||
// console.log('星期三', wednesdayArr.value);
|
||||
// console.log('星期四', thursdayArr.value);
|
||||
// console.log('星期五', fridayArr.value);
|
||||
// console.log('星期六', saturdayArr.value);
|
||||
// console.log('星期七', sundayArr.value);
|
||||
|
||||
// console.log('星期一', mondayMergeArr.value);
|
||||
// console.log('星期二', tuesdayMergeArr.value);
|
||||
// console.log('星期三', wednesdayMergeArr.value);
|
||||
// console.log('星期四', thursdayMergeArr.value);
|
||||
// console.log('星期五', fridayMergeArr.value);
|
||||
// console.log('星期六', saturdayMergeArr.value);
|
||||
// console.log('星期七', sundayMergeArr.value);
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
|
@ -540,7 +523,6 @@
|
|||
* 鼠标按下
|
||||
*/
|
||||
function handleMouseDown(){
|
||||
// console.log('鼠标按下', event);
|
||||
planVisible.value = true;
|
||||
}
|
||||
|
||||
|
@ -548,7 +530,6 @@
|
|||
* 鼠标抬起
|
||||
*/
|
||||
function handleMouseUp(){
|
||||
// console.log('鼠标抬起', event);
|
||||
planVisible.value = false;
|
||||
}
|
||||
|
||||
|
|
|
@ -65,7 +65,7 @@ import {
|
|||
import { getValueType } from '/@/utils';
|
||||
import { Form } from 'ant-design-vue';
|
||||
import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
|
||||
import {uploadToServer,stopUploadToServer,getUploadToServerProcess} from "@/views/iot/tplink/camera/camera.api";
|
||||
import {uploadToServer,stopUploadToServer,getUploadToServerProcess} from "../camera.api";
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
});
|
||||
|
@ -196,7 +196,6 @@ import {
|
|||
formData.regionId = props.data.regionId;
|
||||
formData.multitrans = props.data.multitrans;
|
||||
formData.scale = props.data.scale;
|
||||
console.log(formData);
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
import { ref } from 'vue';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import CameraLeftTree from './components/CameraLeftTree.vue'
|
||||
import CameraInfoList from "@/views/iot/tplink/camera/components/CameraInfoList.vue";
|
||||
import CameraInfoList from './components/CameraInfoList.vue';
|
||||
|
||||
// 给子组件定义一个ref变量
|
||||
const leftTree = ref();
|
||||
|
@ -28,7 +28,6 @@
|
|||
const rootTreeData = ref<any[]>([]);
|
||||
// 左侧树选择后触发
|
||||
function onTreeSelect(data) {
|
||||
console.log('onTreeSelect: ', data);
|
||||
cameraData.value = data;
|
||||
}
|
||||
// 左侧树rootTreeData触发
|
||||
|
|
|
@ -16,7 +16,7 @@ export const columns: BasicColumn[] = [
|
|||
{
|
||||
title: '机构名称',
|
||||
align: 'center',
|
||||
dataIndex: 'institutionalId_dictText',
|
||||
dataIndex: 'institutionId_dictText',
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
|
@ -56,10 +56,10 @@ export const columns: BasicColumn[] = [
|
|||
export const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
label: '机构',
|
||||
field: 'institutionalId',
|
||||
field: 'institutionId',
|
||||
component: 'JDictSelectTag',
|
||||
componentProps: {
|
||||
dictCode: 'sys_depart,depart_name,id,org_category = 1 order by depart_name asc',
|
||||
dictCode: 'nu_admin_institution_area,inst_name,id,org_category = 1 order by inst_name asc',
|
||||
placeholder: '请选择机构',
|
||||
},
|
||||
},
|
||||
|
@ -104,10 +104,10 @@ export const formSchema: FormSchema[] = [
|
|||
},
|
||||
{
|
||||
label: '机构名称',
|
||||
field: 'institutionalId',
|
||||
field: 'institutionId',
|
||||
component: 'JDictSelectTag',
|
||||
componentProps: {
|
||||
dictCode: 'sys_depart,depart_name,id,org_category = 1 order by depart_name asc',
|
||||
dictCode: 'nu_admin_institution_area,inst_name,id,org_category = 1 order by inst_name asc',
|
||||
placeholder: '请选择机构',
|
||||
},
|
||||
},
|
||||
|
|
|
@ -109,7 +109,6 @@
|
|||
deletePrject(record, reload);
|
||||
},
|
||||
onCancel() {
|
||||
// console.log('Cancel');
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
|
|
|
@ -13,8 +13,8 @@
|
|||
<script lang="ts" setup>
|
||||
import { watch, computed, inject, ref, unref, onMounted } from 'vue';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { saveOrUpdateProject } from '@/views/iot/tplink/project/ProjectInfo.api';
|
||||
import { formSchema } from '@/views/iot/tplink/project/ProjectInfo.data';
|
||||
import { saveOrUpdateProject } from '../ProjectInfo.api';
|
||||
import { formSchema } from '../ProjectInfo.data';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
|
||||
const emit = defineEmits(['success']);
|
||||
|
|
|
@ -11,6 +11,7 @@ enum Api {
|
|||
add = '/iot/regionInfo/add',
|
||||
edit = '/iot/regionInfo/edit',
|
||||
delete = '/iot/regionInfo/delete',
|
||||
queryChildrenByParentId = '/admin/institutionArea/queryChildrenByParentId',
|
||||
}
|
||||
|
||||
|
||||
|
@ -21,7 +22,7 @@ enum Api {
|
|||
export const queryProjectTreeSync = (params?) => defHttp.get({ url: Api.queryProjectTreeSync, params });
|
||||
|
||||
/**
|
||||
* 获取区域树列表
|
||||
* 获取分组树列表
|
||||
* @param params
|
||||
*/
|
||||
export const queryRegionTreeSync = (params?) => defHttp.get({ url: Api.queryRegionTreeSync, params });
|
||||
|
@ -33,17 +34,23 @@ export const queryRegionTreeSync = (params?) => defHttp.get({ url: Api.queryRegi
|
|||
export const syncProject = (params?) => defHttp.get({ url: Api.syncProject, params });
|
||||
|
||||
/**
|
||||
* 同步区域
|
||||
* 同步分组
|
||||
* @param params
|
||||
*/
|
||||
export const syncRegionChildren = (params?) => defHttp.get({ url: Api.syncRegionChildren, params });
|
||||
|
||||
/**
|
||||
* 同步子区域
|
||||
* 同步子分组
|
||||
* @param params
|
||||
*/
|
||||
export const syncRegion = (params?) => defHttp.get({ url: Api.syncRegion, params });
|
||||
|
||||
/**
|
||||
* 通过parentId获取区域列表
|
||||
* @param params
|
||||
*/
|
||||
export const queryArea = (params?) => defHttp.get({ url: Api.queryChildrenByParentId, params });
|
||||
|
||||
/**
|
||||
* 列表接口
|
||||
* @param params
|
||||
|
@ -57,7 +64,7 @@ export const list = (params) => defHttp.get({ url: Api.list, params });
|
|||
export const sync = (params) => defHttp.get({ url: Api.sync, params });
|
||||
|
||||
/**
|
||||
* 保存或者更新区域
|
||||
* 保存或者更新分组
|
||||
* @param params
|
||||
*/
|
||||
export const saveOrUpdateRegion = (params, isUpdate) => {
|
||||
|
@ -66,7 +73,7 @@ export const saveOrUpdateRegion = (params, isUpdate) => {
|
|||
};
|
||||
|
||||
/**
|
||||
* 删除区域
|
||||
* 删除分组
|
||||
*/
|
||||
export const deleteRegion = (params,handleSuccess) => {
|
||||
return defHttp.post({ url: Api.delete, params }, { joinParamsToUrl: true }).then(() => {
|
||||
|
|
|
@ -4,17 +4,17 @@ import {FormSchema} from '/@/components/Table';
|
|||
//列表数据
|
||||
export const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '区域序号',
|
||||
title: '分组序号',
|
||||
align: "center",
|
||||
dataIndex: 'regionId'
|
||||
},
|
||||
{
|
||||
title: '区域名称',
|
||||
title: '分组名称',
|
||||
align: "center",
|
||||
dataIndex: 'regionName'
|
||||
},
|
||||
{
|
||||
title: '区域层级',
|
||||
title: '分组层级',
|
||||
align: "center",
|
||||
dataIndex: 'regionLevel'
|
||||
},
|
||||
|
@ -24,7 +24,7 @@ export const columns: BasicColumn[] = [
|
|||
dataIndex: 'parentName'
|
||||
},
|
||||
{
|
||||
title: '机构名称',
|
||||
title: '项目名称',
|
||||
align: "center",
|
||||
dataIndex: 'projectName'
|
||||
},
|
||||
|
@ -34,7 +34,7 @@ export const columns: BasicColumn[] = [
|
|||
dataIndex: 'updateTime'
|
||||
},
|
||||
{
|
||||
title: '区域次序',
|
||||
title: '分组次序',
|
||||
align: "center",
|
||||
dataIndex: 'sort'
|
||||
},
|
||||
|
@ -42,7 +42,7 @@ export const columns: BasicColumn[] = [
|
|||
|
||||
export const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
label: '机构',
|
||||
label: '项目',
|
||||
field: 'projectId',
|
||||
component: 'JDictSelectTag',
|
||||
componentProps: {
|
||||
|
@ -67,6 +67,12 @@ export const formSchema: FormSchema[] = [
|
|||
component: 'Input',
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
label: '',
|
||||
field: 'institutionId',
|
||||
component: 'Input',
|
||||
show: false,
|
||||
},
|
||||
{
|
||||
label: '',
|
||||
field: 'parentId',
|
||||
|
@ -74,18 +80,24 @@ export const formSchema: FormSchema[] = [
|
|||
show: false,
|
||||
},
|
||||
{
|
||||
label: '区域序号',
|
||||
label: '分组序号',
|
||||
field: 'regionId',
|
||||
component: 'Input',
|
||||
dynamicDisabled: true
|
||||
},
|
||||
{
|
||||
label: '区域名称',
|
||||
label: '分组名称',
|
||||
field: 'regionName',
|
||||
component: 'Input',
|
||||
},
|
||||
{
|
||||
label: '区域层级',
|
||||
label: '区域名称',
|
||||
field: 'areaId',
|
||||
component: 'Input',
|
||||
slot: 'areaSelect'
|
||||
},
|
||||
{
|
||||
label: '分组层级',
|
||||
field: 'regionLevel',
|
||||
component: 'Input',
|
||||
dynamicDisabled: true
|
||||
|
@ -97,7 +109,7 @@ export const formSchema: FormSchema[] = [
|
|||
dynamicDisabled: true
|
||||
},
|
||||
{
|
||||
label: '机构名称',
|
||||
label: '项目名称',
|
||||
field: 'projectName',
|
||||
component: 'Input',
|
||||
dynamicDisabled: ({model})=>{
|
||||
|
@ -115,7 +127,7 @@ export const formSchema: FormSchema[] = [
|
|||
dynamicDisabled: true
|
||||
},
|
||||
{
|
||||
label: '区域次序',
|
||||
label: '分组次序',
|
||||
field: 'sort',
|
||||
component: 'Input',
|
||||
dynamicDisabled: true
|
||||
|
|
|
@ -1,6 +1,17 @@
|
|||
<template>
|
||||
<a-spin :spinning="loading">
|
||||
<BasicForm @register="registerForm" />
|
||||
<BasicForm @register="registerForm">
|
||||
<template #areaSelect ="{model,field}">
|
||||
<a-select v-model:value="model[field]" @change="(value,option) => handleChange(value,option,model)">
|
||||
<a-select-option :value="null">请选择…</a-select-option>
|
||||
<template v-for="item in areaOptions" :key="`${item.id}`">
|
||||
<a-select-option :value="item.id" :label="item.instName">
|
||||
{{item.instName}}
|
||||
</a-select-option>
|
||||
</template>
|
||||
</a-select>
|
||||
</template>
|
||||
</BasicForm>
|
||||
<div class="j-box-bottom-button offset-20" style="margin-top: 30px">
|
||||
<div class="j-box-bottom-button-float">
|
||||
<a-button preIcon="ant-design:sync-outlined" @click="onReset">重置</a-button>
|
||||
|
@ -13,15 +24,22 @@
|
|||
<script lang="ts" setup>
|
||||
import { watch, computed, inject, ref, unref, onMounted } from 'vue';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { saveOrUpdateRegion } from '@/views/iot/tplink/region/RegionInfo.api';
|
||||
import { formSchema } from '@/views/iot/tplink/region/RegionInfo.data';
|
||||
import {
|
||||
queryArea,
|
||||
queryRegionTreeSync,
|
||||
saveOrUpdateRegion
|
||||
} from '../RegionInfo.api';
|
||||
import { formSchema } from '../RegionInfo.data';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import {propTypes} from "@/utils/propTypes";
|
||||
const { createMessage, createSuccessModal } = useMessage();
|
||||
const emit = defineEmits(['success']);
|
||||
const props = defineProps({
|
||||
data: { type: Object, default: () => ({}) },
|
||||
rootTreeData: { type: Array, default: () => [] },
|
||||
});
|
||||
const areaOptions = ref<any[]>([]);
|
||||
const loading = ref<boolean>(false);
|
||||
// 当前是否是更新模式
|
||||
const isUpdate = ref<boolean>(true);
|
||||
|
@ -46,6 +64,7 @@
|
|||
model.value = record;
|
||||
await resetFields();
|
||||
await setFieldsValue({ ...record });
|
||||
await fetchArea(record.institutionId);
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
|
@ -72,6 +91,25 @@
|
|||
loading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
const fetchArea = async (institutionId) => {
|
||||
if (!institutionId){
|
||||
institutionId = '-1';
|
||||
}
|
||||
areaOptions.value = [];
|
||||
const data = await queryArea({ pid : institutionId });
|
||||
Object.assign(areaOptions.value, data);
|
||||
}
|
||||
|
||||
async function handleChange(value,option:Option,formData){
|
||||
if(value == null){
|
||||
formData["regionName"] = model.value["regionName"];
|
||||
}else{
|
||||
formData["regionName"] = option.label;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less">
|
||||
|
||||
|
|
|
@ -8,25 +8,33 @@
|
|||
:showFooter="showFooter"
|
||||
destroyOnClose
|
||||
>
|
||||
<BasicForm @register="registerForm" />
|
||||
<BasicForm @register="registerForm">
|
||||
<template #areaSelect ="{model,field}">
|
||||
<a-select v-model:value="model[field]" @change="(value,option) => handleChange(value,option,model)">
|
||||
<template v-for="item in areaOptions" :key="`${item.id}`">
|
||||
<a-select-option :value="item.id" :label="item.instName">
|
||||
{{item.instName}}
|
||||
</a-select-option>
|
||||
</template>
|
||||
</a-select>
|
||||
</template>
|
||||
</BasicForm>
|
||||
</BasicDrawer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { defineComponent, ref, computed, unref, useAttrs } from 'vue';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { formSchema } from "@/views/iot/tplink/region/RegionInfo.data";
|
||||
import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
|
||||
import { useDrawerAdaptiveWidth } from '/@/hooks/jeecg/useAdaptiveWidth';
|
||||
import { getTenantId } from "/@/utils/auth";
|
||||
import { saveOrUpdateRegion } from "@/views/iot/tplink/region/RegionInfo.api";
|
||||
import { formSchema } from "../RegionInfo.data";
|
||||
import {queryArea, saveOrUpdateRegion} from "../RegionInfo.api";
|
||||
|
||||
// 声明Emits
|
||||
const emit = defineEmits(['success', 'register']);
|
||||
const attrs = useAttrs();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
const departOptions = ref([]);
|
||||
let isFormDepartUser = false;
|
||||
//表单配置
|
||||
const [registerForm, { setProps, resetFields, setFieldsValue, validate, updateSchema }] = useForm({
|
||||
|
@ -35,6 +43,7 @@ const [registerForm, { setProps, resetFields, setFieldsValue, validate, updateSc
|
|||
showActionButtonGroup: false,
|
||||
});
|
||||
const showFooter = ref(true);
|
||||
const areaOptions = ref<any[]>([]);
|
||||
//表单赋值
|
||||
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
|
||||
await resetFields();
|
||||
|
@ -46,6 +55,7 @@ const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (
|
|||
setFieldsValue({
|
||||
...data.record,
|
||||
});
|
||||
await fetchArea(data.record.institutionId);
|
||||
}
|
||||
// 隐藏底部时禁用整个表单
|
||||
setProps({ disabled: !showFooter.value });
|
||||
|
@ -76,6 +86,25 @@ async function handleSubmit() {
|
|||
setDrawerProps({ confirmLoading: false });
|
||||
}
|
||||
}
|
||||
|
||||
const fetchArea = async (institutionId) => {
|
||||
if (!institutionId){
|
||||
institutionId = '-1';
|
||||
}
|
||||
areaOptions.value = [];
|
||||
const data = await queryArea({ pid : institutionId });
|
||||
Object.assign(areaOptions.value, data);
|
||||
}
|
||||
|
||||
async function handleChange(value,option:Option,formData){
|
||||
if(value == null){
|
||||
formData["regionName"] = "";
|
||||
}else{
|
||||
formData["regionName"] = option.label;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
</template>
|
||||
</div>
|
||||
<a-spin :spinning="loading">
|
||||
<a-input-search placeholder="按名称搜索…" style="margin-bottom: 10px" @search="onSearch" />
|
||||
<!-- <a-input-search placeholder="按名称搜索…" style="margin-bottom: 10px" @search="onSearch" />-->
|
||||
<!--分组树-->
|
||||
<template v-if="treeData.length > 0">
|
||||
<a-tree
|
||||
|
@ -54,15 +54,15 @@ import {createVNode, nextTick, ref} from 'vue';
|
|||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useMethods } from '/@/hooks/system/useMethods';
|
||||
import {
|
||||
deleteRegion,
|
||||
queryProjectTreeSync,
|
||||
queryRegionTreeSync,
|
||||
syncProject,
|
||||
syncRegion,
|
||||
syncRegionChildren
|
||||
} from '../RegionInfo.api';
|
||||
const { createMessage } = useMessage();
|
||||
import {
|
||||
deleteRegion,
|
||||
queryProjectTreeSync,
|
||||
queryRegionTreeSync,
|
||||
syncProject,
|
||||
syncRegion,
|
||||
syncRegionChildren
|
||||
} from '@/views/iot/tplink/region/RegionInfo.api';
|
||||
import {useDrawer} from "@/components/Drawer";
|
||||
import ProjectInfoDrawer from '@/views/iot/tplink/project/components/ProjectInfoDrawer.vue';
|
||||
import RegionInfoDrawer from './RegionInfoDrawer.vue';
|
||||
|
@ -187,7 +187,6 @@ import {
|
|||
* 设置当前选中的行
|
||||
*/
|
||||
function setSelectedKey(key: string, data?: object) {
|
||||
console.log('setSelectedKey: ', key);
|
||||
selectedKeys.value = [key];
|
||||
if (data) {
|
||||
currentRegion.value = data;
|
||||
|
@ -199,7 +198,6 @@ import {
|
|||
* 树选择事件
|
||||
*/
|
||||
function onSelect(selKeys, event) {
|
||||
console.log('onSelect: ', selKeys, event);
|
||||
if (selKeys.length > 0 && selectedKeys.value[0] !== selKeys[0]) {
|
||||
setSelectedKey(selKeys[0], event.selectedNodes[0]);
|
||||
} else {
|
||||
|
@ -266,6 +264,11 @@ import {
|
|||
parentId: data.regionId,
|
||||
parentName: data.regionName,
|
||||
};
|
||||
if(data.regionId != null){
|
||||
record["institutionId"] = data.areaId;
|
||||
}else{
|
||||
record["institutionId"] = data.institutionId;
|
||||
}
|
||||
openRegionDrawer(true, {
|
||||
record,
|
||||
isUpdate: false,
|
||||
|
@ -282,14 +285,17 @@ import {
|
|||
createMessage.warning('请先选择一个节点');
|
||||
return;
|
||||
}
|
||||
console.log(data);
|
||||
let record = {
|
||||
projectId: data.projectId,
|
||||
projectName: data.projectName,
|
||||
parentId: data.regionId,
|
||||
parentName: data.regionName,
|
||||
};
|
||||
console.log(record);
|
||||
if(data.regionId != null){
|
||||
record["institutionId"] = data.areaId;
|
||||
}else{
|
||||
record["institutionId"] = data.institutionId;
|
||||
}
|
||||
openRegionDrawer(true, {
|
||||
record,
|
||||
isUpdate: false,
|
||||
|
@ -327,7 +333,6 @@ import {
|
|||
deletePrject(record, handleSuccess);
|
||||
},
|
||||
onCancel() {
|
||||
// console.log('Cancel');
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
|
@ -347,7 +352,6 @@ import {
|
|||
deleteRegion(record, handleSuccess);
|
||||
},
|
||||
onCancel() {
|
||||
// console.log('Cancel');
|
||||
},
|
||||
class: 'test',
|
||||
});
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
<div v-show="nodeData == null" style="padding-top: 40px">
|
||||
<a-empty description="请选择区域" />
|
||||
<a-empty description="请选择分组" />
|
||||
</div>
|
||||
</div>
|
||||
</a-col>
|
||||
|
@ -27,8 +27,8 @@
|
|||
import { ref } from 'vue';
|
||||
import { useDesign } from '/@/hooks/web/useDesign';
|
||||
import RegionLeftTree from './components/RegionLeftTree.vue'
|
||||
import RegionForm from "@/views/iot/tplink/region/components/RegionForm.vue";
|
||||
import ProjectForm from "@/views/iot/tplink/project/components/ProjectForm.vue";
|
||||
import RegionForm from './components/RegionForm.vue';
|
||||
import ProjectForm from '@/views/iot/tplink/project/components/ProjectForm.vue';
|
||||
|
||||
// 给子组件定义一个ref变量
|
||||
const leftTree = ref();
|
||||
|
@ -37,7 +37,6 @@
|
|||
const rootTreeData = ref<any[]>([]);
|
||||
// 左侧树选择后触发
|
||||
function onTreeSelect(data) {
|
||||
console.log('onTreeSelect: ', data);
|
||||
nodeData.value = data;
|
||||
}
|
||||
// 左侧树rootTreeData触发
|
||||
|
|
Loading…
Reference in New Issue