diff --git a/packages/components/analyses/src/defaultProps.ts b/packages/components/analyses/src/defaultProps.ts index a0dda535..1313f447 100644 --- a/packages/components/analyses/src/defaultProps.ts +++ b/packages/components/analyses/src/defaultProps.ts @@ -1,8 +1,8 @@ /* * @Author: zouyaoji@https://github.com/zouyaoji * @Date: 2021-10-18 10:40:15 - * @LastEditTime: 2022-07-05 11:28:27 - * @LastEditors: zouyaoji + * @LastEditTime: 2023-02-09 18:16:24 + * @LastEditors: XIAOLIJUN * @Description: * @FilePath: \vue-cesium@next\packages\components\analyses\src\defaultProps.ts */ @@ -113,6 +113,8 @@ const viewshedAnalysisDefault: VcViewshedAnalysisOpts = Object.assign({}, polygo } }) +const fabActionOptsDefault: VcActionTooltipProps = Object.assign({}, {}) + const mainFabDefault = Object.assign({}, actionOptions, { direction: 'right', icon: 'vc-icons-analysis-button', @@ -149,6 +151,10 @@ const analysesProps = { type: Object as PropType, default: () => mainFabDefault }, + fabActionOpts: { + type: Object as PropType, + default: () => fabActionOptsDefault + }, sightlineActionOpts: { type: Object as PropType, default: () => sightlineAnalysisActionDefault @@ -218,6 +224,10 @@ export type VcAnalysesProps = { * Specify the style options of the floating action button of the VcAnalyses component. */ mainFabOpts?: VcActionTooltipProps & VcFabProps + /** + * Style options for other action buttons. + */ + fabActionOpts?: VcActionTooltipProps /** * Specify the style options of the sightline analysis action button. */ diff --git a/packages/components/analyses/src/index.ts b/packages/components/analyses/src/index.ts index 4abb8fe4..3ca3eac4 100644 --- a/packages/components/analyses/src/index.ts +++ b/packages/components/analyses/src/index.ts @@ -1,8 +1,8 @@ /* * @Author: zouyaoji@https://github.com/zouyaoji * @Date: 2022-01-06 10:23:09 - * @LastEditTime: 2022-05-16 00:29:00 - * @LastEditors: zouyaoji + * @LastEditTime: 2023-02-09 18:17:23 + * @LastEditors: XIAOLIJUN * @Description: * @FilePath: \vue-cesium@next\packages\components\analyses\src\index.ts */ @@ -18,6 +18,7 @@ import useDrawingFab from '@vue-cesium/composables/use-drawing/use-drawing-fab' import VcAnalysisSightline from './sightline' import VcAnalysisViewshed from './viewshed' import { drawingEmit } from '@vue-cesium/utils/emits' +import { isEqual } from 'lodash-es' const emits = { ...drawingEmit, @@ -38,10 +39,12 @@ export default defineComponent({ const clearActionOpts = reactive(Object.assign({}, defaultOptions.clearActionOpts, props.clearActionOpts)) const mainFabOpts = reactive(Object.assign({}, defaultOptions.mainFabOpts, props.mainFabOpts)) - const sightlineActionOpts = reactive(Object.assign({}, defaultOptions.sightlineActionOpts, props.sightlineActionOpts)) + const fabActionOpts = reactive(Object.assign({}, defaultOptions.fabActionOpts, props.fabActionOpts)) + + const sightlineActionOpts = reactive(Object.assign({}, defaultOptions.sightlineActionOpts, mergeActionOpts('sightlineActionOpts'))) const sightlineAnalysisOpts = reactive(Object.assign({}, defaultOptions.sightlineAnalysisOpts, props.sightlineAnalysisOpts)) - const viewshedActionOpts = reactive(Object.assign({}, defaultOptions.viewshedActionOpts, props.viewshedActionOpts)) + const viewshedActionOpts = reactive(Object.assign({}, defaultOptions.viewshedActionOpts, mergeActionOpts('viewshedActionOpts'))) const viewshedAnalysisOpts = reactive(Object.assign({}, defaultOptions.viewshedAnalysisOpts, props.viewshedAnalysisOpts)) options.sightlineActionOpts = sightlineActionOpts @@ -80,6 +83,10 @@ export default defineComponent({ } } + function mergeActionOpts(actionName) { + return isEqual(defaultOptions[actionName], props[actionName]) ? fabActionOpts : Object.assign({}, fabActionOpts, props[actionName]) + } + return useDrawingFab(props, ctx, instance, drawingActionInstances, mainFabOpts, clearActionOpts, 'analysis')?.renderContent } }) diff --git a/packages/components/drawings/src/defaultProps.ts b/packages/components/drawings/src/defaultProps.ts index 6f7f2c4c..e34d6054 100644 --- a/packages/components/drawings/src/defaultProps.ts +++ b/packages/components/drawings/src/defaultProps.ts @@ -1,8 +1,8 @@ /* * @Author: zouyaoji@https://github.com/zouyaoji * @Date: 2021-10-18 10:40:15 - * @LastEditTime: 2022-06-24 16:54:54 - * @LastEditors: zouyaoji + * @LastEditTime: 2023-02-09 18:11:26 + * @LastEditors: XIAOLIJUN * @Description: * @FilePath: \vue-cesium@next\packages\components\drawings\src\defaultProps.ts */ @@ -69,6 +69,8 @@ const pinDrawingDefault: VcDrawingOpts = Object.assign({}, pointDrawingDefault, showLabel: true }) +const fabActionOptsDefault: VcActionTooltipProps = Object.assign({}, {}) + const mainFabDefault = Object.assign({}, actionOptions, { direction: 'right', icon: 'vc-icons-drawing-button', @@ -105,6 +107,10 @@ const drawingsProps = { type: Object as PropType, default: () => mainFabDefault }, + fabActionOpts: { + type: Object as PropType, + default: () => fabActionOptsDefault + }, pinActionOpts: { type: Object as PropType, default: () => pinDrawingActionDefault @@ -222,6 +228,10 @@ export type VcDrawingsProps = { * Specify the style options of the floating action button of the VcMeasurements component. */ mainFabOpts?: VcActionTooltipProps & VcFabProps + /** + * Style options for other action buttons. + */ + fabActionOpts?: VcActionTooltipProps /** * Specify the style options of the pin drawing action button. */ diff --git a/packages/components/drawings/src/index.ts b/packages/components/drawings/src/index.ts index 3f80b312..d0bba8a0 100644 --- a/packages/components/drawings/src/index.ts +++ b/packages/components/drawings/src/index.ts @@ -14,6 +14,7 @@ import useDrawingFab from '@vue-cesium/composables/use-drawing/use-drawing-fab' import { useLocale } from '@vue-cesium/composables' import { drawingEmit } from '@vue-cesium/utils/emits' import { VcDrawingsProps } from '..' +import { isEqual } from 'lodash-es' const emits = { ...drawingEmit, @@ -33,19 +34,20 @@ export default defineComponent({ // computed const clearActionOpts = reactive(Object.assign({}, defaultOptions.clearActionOpts, props.clearActionOpts)) const mainFabOpts = reactive(Object.assign({}, defaultOptions.mainFabOpts, props.mainFabOpts)) - const pointActionOpts = reactive(Object.assign({}, defaultOptions.pointActionOpts, props.pointActionOpts)) + const fabActionOpts = reactive(Object.assign({}, defaultOptions.fabActionOpts, props.fabActionOpts)) + const pointActionOpts = reactive(Object.assign({}, defaultOptions.pointActionOpts, mergeActionOpts('pointActionOpts'))) const pointDrawingOpts = reactive(Object.assign({}, defaultOptions.pointDrawingOpts, props.pointDrawingOpts)) - const polylineActionOpts = reactive(Object.assign({}, defaultOptions.polylineActionOpts, props.polylineActionOpts)) + const polylineActionOpts = reactive(Object.assign({}, defaultOptions.polylineActionOpts, mergeActionOpts('polylineActionOpts'))) const polylineDrawingOpts = reactive(Object.assign({}, defaultOptions.polylineDrawingOpts, props.polylineDrawingOpts)) - const polygonActionOpts = reactive(Object.assign({}, defaultOptions.polygonActionOpts, props.polygonActionOpts)) + const polygonActionOpts = reactive(Object.assign({}, defaultOptions.polygonActionOpts, mergeActionOpts('polygonActionOpts'))) const polygonDrawingOpts = reactive(Object.assign({}, defaultOptions.polygonDrawingOpts, props.polygonDrawingOpts)) - const rectangleActionOpts = reactive(Object.assign({}, defaultOptions.rectangleActionOpts, props.rectangleActionOpts)) + const rectangleActionOpts = reactive(Object.assign({}, defaultOptions.rectangleActionOpts, mergeActionOpts('rectangleActionOpts'))) const rectangleDrawingOpts = reactive(Object.assign({}, defaultOptions.rectangleDrawingOpts, props.rectangleDrawingOpts)) - const circleActionOpts = reactive(Object.assign({}, defaultOptions.circleActionOpts, props.circleActionOpts)) + const circleActionOpts = reactive(Object.assign({}, defaultOptions.circleActionOpts, mergeActionOpts('circleActionOpts'))) const circleDrawingOpts = reactive(Object.assign({}, defaultOptions.circleDrawingOpts, props.circleDrawingOpts)) - const regularActionOpts = reactive(Object.assign({}, defaultOptions.regularActionOpts, props.regularActionOpts)) + const regularActionOpts = reactive(Object.assign({}, defaultOptions.regularActionOpts, mergeActionOpts('regularActionOpts'))) const regularDrawingOpts = reactive(Object.assign({}, defaultOptions.regularDrawingOpts, props.regularDrawingOpts)) - const pinActionOpts = reactive(Object.assign({}, defaultOptions.pinActionOpts, props.pinActionOpts)) + const pinActionOpts = reactive(Object.assign({}, defaultOptions.pinActionOpts, mergeActionOpts('pinActionOpts'))) const pinDrawingOpts = reactive(Object.assign({}, defaultOptions.pinDrawingOpts, props.pinDrawingOpts)) options.pointActionOpts = pointActionOpts @@ -107,6 +109,10 @@ export default defineComponent({ } } + function mergeActionOpts(actionName) { + return isEqual(defaultOptions[actionName], props[actionName]) ? fabActionOpts : Object.assign({}, fabActionOpts, props[actionName]) + } + return useDrawingFab(props, ctx, instance, drawingActionInstances, mainFabOpts, clearActionOpts, 'drawing')?.renderContent } }) diff --git a/packages/components/measurements/src/defaultProps.ts b/packages/components/measurements/src/defaultProps.ts index 4c5731c3..185cdf97 100644 --- a/packages/components/measurements/src/defaultProps.ts +++ b/packages/components/measurements/src/defaultProps.ts @@ -1,8 +1,8 @@ /* * @Author: zouyaoji@https://github.com/zouyaoji * @Date: 2021-10-13 09:21:13 - * @LastEditTime: 2022-06-24 16:56:16 - * @LastEditors: zouyaoji + * @LastEditTime: 2023-02-09 17:59:27 + * @LastEditors: XIAOLIJUN * @Description: * @FilePath: \vue-cesium@next\packages\components\measurements\src\defaultProps.ts */ @@ -295,6 +295,8 @@ const circleMeasurementDefault: VcRegularMeasurementOpts = Object.assign({}, rec showAngleLabel: false }) +const fabActionOptsDefault: VcActionTooltipProps = Object.assign({}, {}) + const mainFabDefault = Object.assign({}, actionOptions, { direction: 'right', icon: 'vc-icons-measurement-button', @@ -346,6 +348,10 @@ const measurementsProps = { type: Object as PropType, default: () => mainFabDefault }, + fabActionOpts: { + type: Object as PropType, + default: () => fabActionOptsDefault + }, distanceActionOpts: { type: Object as PropType, default: () => distanceMeasurementActionDefault @@ -511,6 +517,10 @@ export type VcMeasurementsProps = { * Specify the style options of the floating action button of the VcMeasurements component. */ mainFabOpts?: VcActionTooltipProps & VcFabProps + /** + * Style options for other action buttons. + */ + fabActionOpts?: VcActionTooltipProps /** * Specify the style options of the distance measurement action button. */ diff --git a/packages/components/measurements/src/index.ts b/packages/components/measurements/src/index.ts index c481c00c..22d666fe 100644 --- a/packages/components/measurements/src/index.ts +++ b/packages/components/measurements/src/index.ts @@ -24,6 +24,7 @@ import type { VcActionTooltipProps, VcComponentInternalInstance, VcComponentPubl import { useLocale } from '@vue-cesium/composables' import useDrawingFab from '@vue-cesium/composables/use-drawing/use-drawing-fab' import { drawingEmit } from '@vue-cesium/utils/emits' +import { isEqual } from 'lodash-es' const emits = { ...drawingEmit, @@ -42,53 +43,67 @@ export default defineComponent({ const clearActionOpts = reactive(Object.assign({}, defaultOptions.clearActionOpts, props.clearActionOpts)) const mainFabOpts = reactive(Object.assign({}, defaultOptions.mainFabOpts, props.mainFabOpts)) - const distanceActionOpts = reactive(Object.assign({}, defaultOptions.distanceActionOpts, props.distanceActionOpts)) + const fabActionOpts = reactive(Object.assign({}, defaultOptions.fabActionOpts, props.fabActionOpts)) + + const distanceActionOpts = reactive( + Object.assign({}, defaultOptions.distanceActionOpts, mergeActionOpts('distanceActionOpts')) + ) const distanceMeasurementOpts = reactive( Object.assign({}, defaultOptions.distanceMeasurementOpts, props.distanceMeasurementOpts) ) const componentDistanceActionOpts = reactive( - Object.assign({}, defaultOptions.componentDistanceActionOpts, props.componentDistanceActionOpts) + Object.assign({}, defaultOptions.componentDistanceActionOpts, mergeActionOpts('componentDistanceActionOpts')) ) const componentDistanceMeasurementOpts = reactive( Object.assign({}, defaultOptions.componentDistanceMeasurementOpts, props.componentDistanceMeasurementOpts) ) - const polylineActionOpts = reactive(Object.assign({}, defaultOptions.polylineActionOpts, props.polylineActionOpts)) + const polylineActionOpts = reactive( + Object.assign({}, defaultOptions.polylineActionOpts, mergeActionOpts('polylineActionOpts')) + ) const polylineMeasurementOpts = reactive( Object.assign({}, defaultOptions.polylineMeasurementOpts, props.polylineMeasurementOpts) ) - const horizontalActionOpts = reactive(Object.assign({}, defaultOptions.horizontalActionOpts, props.horizontalActionOpts)) + const horizontalActionOpts = reactive( + Object.assign({}, defaultOptions.horizontalActionOpts, mergeActionOpts('horizontalActionOpts')) + ) const horizontalMeasurementOpts = reactive( Object.assign({}, defaultOptions.horizontalMeasurementOpts, props.horizontalMeasurementOpts) ) - const verticalActionOpts = reactive(Object.assign({}, defaultOptions.verticalActionOpts, props.verticalActionOpts)) + const verticalActionOpts = reactive( + Object.assign({}, defaultOptions.verticalActionOpts, mergeActionOpts('verticalActionOpts')) + ) const verticalMeasurementOpts = reactive( Object.assign({}, defaultOptions.verticalMeasurementOpts, props.verticalMeasurementOpts) ) - const heightActionOpts = reactive(Object.assign({}, defaultOptions.heightActionOpts, props.heightActionOpts)) + const heightActionOpts = reactive(Object.assign({}, defaultOptions.heightActionOpts, mergeActionOpts('heightActionOpts'))) const heightMeasurementOpts = reactive(Object.assign({}, defaultOptions.heightMeasurementOpts, props.heightMeasurementOpts)) - const areaActionOpts = reactive(Object.assign({}, defaultOptions.areaActionOpts, props.areaActionOpts)) + const areaActionOpts = reactive(Object.assign({}, defaultOptions.areaActionOpts, mergeActionOpts('areaActionOpts'))) const areaMeasurementOpts = reactive(Object.assign({}, defaultOptions.areaMeasurementOpts, props.areaMeasurementOpts)) - const pointActionOpts = reactive(Object.assign({}, defaultOptions.pointActionOpts, props.pointActionOpts)) + const pointActionOpts = reactive(Object.assign({}, defaultOptions.pointActionOpts, mergeActionOpts('pointActionOpts'))) const pointMeasurementOpts = reactive(Object.assign({}, defaultOptions.pointMeasurementOpts, props.pointMeasurementOpts)) - const rectangleActionOpts = reactive(Object.assign({}, defaultOptions.rectangleActionOpts, props.rectangleActionOpts)) + const rectangleActionOpts = reactive( + Object.assign({}, defaultOptions.rectangleActionOpts, mergeActionOpts('rectangleActionOpts')) + ) const rectangleMeasurementOpts = reactive( Object.assign({}, defaultOptions.rectangleMeasurementOpts, props.rectangleMeasurementOpts) ) - const regularActionOpts = reactive(Object.assign({}, defaultOptions.regularActionOpts, props.regularActionOpts)) + const regularActionOpts = reactive( + Object.assign({}, defaultOptions.regularActionOpts, mergeActionOpts('regularActionOpts')) + ) const regularMeasurementOpts = reactive( Object.assign({}, defaultOptions.regularMeasurementOpts, props.regularMeasurementOpts) ) - const circleActionOpts = reactive(Object.assign({}, defaultOptions.circleActionOpts, props.circleActionOpts)) + const circleActionOpts = reactive(Object.assign({}, defaultOptions.circleActionOpts, mergeActionOpts('circleActionOpts'))) const circleMeasurementOpts = reactive( Object.assign({}, defaultOptions.circleMeasurementOpts, props.circleMeasurementOpts) ) @@ -164,6 +179,10 @@ export default defineComponent({ } } + function mergeActionOpts(actionName) { + return isEqual(defaultOptions[actionName], props[actionName]) ? fabActionOpts : Object.assign({}, fabActionOpts, props[actionName]) + } + return useDrawingFab(props, ctx, instance, drawingActionInstances, mainFabOpts, clearActionOpts, 'measurement')?.renderContent } })