Commit 0864e10479346e95a10ca28b59f1644115a31288

Authored by ww
1 parent 9091ac16

fix: data component create map component limit data source length

@@ -7,7 +7,7 @@ @@ -7,7 +7,7 @@
7 } from '@ant-design/icons-vue'; 7 } from '@ant-design/icons-vue';
8 import { Tooltip, Button, Alert } from 'ant-design-vue'; 8 import { Tooltip, Button, Alert } from 'ant-design-vue';
9 import { FormActionType, useForm } from '/@/components/Form'; 9 import { FormActionType, useForm } from '/@/components/Form';
10 - import { basicSchema, DataSourceField, isMapComponent } from '../config/basicConfiguration'; 10 + import { basicSchema, DataSourceField } from '../config/basicConfiguration';
11 import BasicForm from '/@/components/Form/src/BasicForm.vue'; 11 import BasicForm from '/@/components/Form/src/BasicForm.vue';
12 import { ref, shallowReactive, unref, nextTick, watch, computed, onMounted } from 'vue'; 12 import { ref, shallowReactive, unref, nextTick, watch, computed, onMounted } from 'vue';
13 import VisualOptionsModal from './VisualOptionsModal.vue'; 13 import VisualOptionsModal from './VisualOptionsModal.vue';
@@ -17,7 +17,7 @@ @@ -17,7 +17,7 @@
17 import { useMessage } from '/@/hooks/web/useMessage'; 17 import { useMessage } from '/@/hooks/web/useMessage';
18 import { DataBoardLayoutInfo } from '../../types/type'; 18 import { DataBoardLayoutInfo } from '../../types/type';
19 import { getDataSourceComponent } from './DataSourceForm/help'; 19 import { getDataSourceComponent } from './DataSourceForm/help';
20 - import { FrontComponent } from '../../const/const'; 20 + import { FrontComponent, FrontComponentCategory } from '../../const/const';
21 import { isNullAndUnDef } from '/@/utils/is'; 21 import { isNullAndUnDef } from '/@/utils/is';
22 import { useSortable } from '/@/hooks/web/useSortable'; 22 import { useSortable } from '/@/hooks/web/useSortable';
23 import { cloneDeep } from 'lodash-es'; 23 import { cloneDeep } from 'lodash-es';
@@ -32,6 +32,7 @@ @@ -32,6 +32,7 @@
32 record: DataBoardLayoutInfo; 32 record: DataBoardLayoutInfo;
33 frontId?: FrontComponent; 33 frontId?: FrontComponent;
34 defaultConfig?: Partial<ComponentInfo>; 34 defaultConfig?: Partial<ComponentInfo>;
  35 + componentCategory?: FrontComponentCategory;
35 }>(); 36 }>();
36 37
37 const { createMessage } = useMessage(); 38 const { createMessage } = useMessage();
@@ -167,7 +168,15 @@ @@ -167,7 +168,15 @@
167 dataSourceEl[data.id] = null; 168 dataSourceEl[data.id] = null;
168 }; 169 };
169 170
  171 + const isMapComponent = computed(() => {
  172 + return props.componentCategory === FrontComponentCategory.MAP;
  173 + });
  174 +
170 const handleAdd = () => { 175 const handleAdd = () => {
  176 + if (unref(isMapComponent) && unref(dataSource).length === 2) {
  177 + createMessage.warning('地图组件只能绑定两条数据源');
  178 + return;
  179 + }
171 unref(dataSource).push({ 180 unref(dataSource).push({
172 id: buildUUID(), 181 id: buildUUID(),
173 componentInfo: props.defaultConfig || {}, 182 componentInfo: props.defaultConfig || {},
@@ -255,10 +264,6 @@ @@ -255,10 +264,6 @@
255 return isControlComponent(props.frontId as FrontComponent); 264 return isControlComponent(props.frontId as FrontComponent);
256 }); 265 });
257 266
258 - const isMapCmp = computed(() => {  
259 - return isMapComponent(props.frontId as FrontComponent);  
260 - });  
261 -  
262 onMounted(() => handleSort()); 267 onMounted(() => handleSort());
263 268
264 defineExpose({ 269 defineExpose({
@@ -283,7 +288,7 @@ @@ -283,7 +288,7 @@
283 </div> 288 </div>
284 </template> 289 </template>
285 </Alert> 290 </Alert>
286 - <Alert type="info" show-icon v-if="isMapCmp"> 291 + <Alert type="info" show-icon v-if="isMapComponent">
287 <template #description> 292 <template #description>
288 <div> 293 <div>
289 地图组件,需绑定两个数据源,且数据源为同一设备。第一数据源为经度,第二数据源为维度,否则地图组件不能正常显示。 294 地图组件,需绑定两个数据源,且数据源为同一设备。第一数据源为经度,第二数据源为维度,否则地图组件不能正常显示。
@@ -13,6 +13,7 @@ @@ -13,6 +13,7 @@
13 import { ComponentInfo } from '/@/api/dataBoard/model'; 13 import { ComponentInfo } from '/@/api/dataBoard/model';
14 import { useCalcGridLayout } from '../../hook/useCalcGridLayout'; 14 import { useCalcGridLayout } from '../../hook/useCalcGridLayout';
15 import { FrontComponent } from '../../const/const'; 15 import { FrontComponent } from '../../const/const';
  16 + import { frontComponentMap } from '../../components/help';
16 17
17 interface DataComponentRouteParams extends RouteParams { 18 interface DataComponentRouteParams extends RouteParams {
18 id: string; 19 id: string;
@@ -40,6 +41,10 @@ @@ -40,6 +41,10 @@
40 41
41 const componentDefaultConfig = ref<Partial<ComponentInfo>>({}); 42 const componentDefaultConfig = ref<Partial<ComponentInfo>>({});
42 43
  44 + const getComponentCategory = computed(() => {
  45 + return frontComponentMap.get(unref(frontId))?.ComponentCategory;
  46 + });
  47 +
43 const [register, { closeModal, changeOkLoading }] = useModalInner( 48 const [register, { closeModal, changeOkLoading }] = useModalInner(
44 (data: { isEdit: boolean; record?: DataBoardLayoutInfo }) => { 49 (data: { isEdit: boolean; record?: DataBoardLayoutInfo }) => {
45 componentRecord.value = data.record || ({} as unknown as DataBoardLayoutInfo); 50 componentRecord.value = data.record || ({} as unknown as DataBoardLayoutInfo);
@@ -149,6 +154,7 @@ @@ -149,6 +154,7 @@
149 :front-id="frontId" 154 :front-id="frontId"
150 :record="componentRecord" 155 :record="componentRecord"
151 :defaultConfig="componentDefaultConfig" 156 :defaultConfig="componentDefaultConfig"
  157 + :componentCategory="getComponentCategory"
152 /> 158 />
153 </Tabs.TabPane> 159 </Tabs.TabPane>
154 <Tabs.TabPane key="visualConfig" tab="可视化配置"> 160 <Tabs.TabPane key="visualConfig" tab="可视化配置">