feat: Add fabActionOpts properties to components such as Measurements, Drawings, and Analyses

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<VcActionTooltipProps & VcFabProps>,
     default: () => mainFabDefault
   },
+  fabActionOpts: {
+    type: Object as PropType<VcActionTooltipProps>,
+    default: () => fabActionOptsDefault
+  },
   sightlineActionOpts: {
     type: Object as PropType<VcActionTooltipProps>,
     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.
    */

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<VcActionTooltipProps>(Object.assign({}, defaultOptions.clearActionOpts, props.clearActionOpts))
     const mainFabOpts = reactive<VcActionTooltipProps & VcFabProps>(Object.assign({}, defaultOptions.mainFabOpts, props.mainFabOpts))
 
-    const sightlineActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.sightlineActionOpts, props.sightlineActionOpts))
+    const fabActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.fabActionOpts, props.fabActionOpts))
+
+    const sightlineActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.sightlineActionOpts, mergeActionOpts('sightlineActionOpts')))
     const sightlineAnalysisOpts = reactive<VcDrawingOpts>(Object.assign({}, defaultOptions.sightlineAnalysisOpts, props.sightlineAnalysisOpts))
 
-    const viewshedActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.viewshedActionOpts, props.viewshedActionOpts))
+    const viewshedActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.viewshedActionOpts, mergeActionOpts('viewshedActionOpts')))
     const viewshedAnalysisOpts = reactive<VcViewshedAnalysisOpts>(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
   }
 })

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<VcActionTooltipProps & VcFabProps>,
     default: () => mainFabDefault
   },
+  fabActionOpts: {
+    type: Object as PropType<VcActionTooltipProps>,
+    default: () => fabActionOptsDefault
+  },
   pinActionOpts: {
     type: Object as PropType<VcActionTooltipProps>,
     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.
    */

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<VcActionTooltipProps>(Object.assign({}, defaultOptions.clearActionOpts, props.clearActionOpts))
     const mainFabOpts = reactive<VcActionTooltipProps & VcFabProps>(Object.assign({}, defaultOptions.mainFabOpts, props.mainFabOpts))
-    const pointActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.pointActionOpts, props.pointActionOpts))
+    const fabActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.fabActionOpts, props.fabActionOpts))
+    const pointActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.pointActionOpts, mergeActionOpts('pointActionOpts')))
     const pointDrawingOpts = reactive<VcDrawingOpts>(Object.assign({}, defaultOptions.pointDrawingOpts, props.pointDrawingOpts))
-    const polylineActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.polylineActionOpts, props.polylineActionOpts))
+    const polylineActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.polylineActionOpts, mergeActionOpts('polylineActionOpts')))
     const polylineDrawingOpts = reactive<VcDrawingOpts>(Object.assign({}, defaultOptions.polylineDrawingOpts, props.polylineDrawingOpts))
-    const polygonActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.polygonActionOpts, props.polygonActionOpts))
+    const polygonActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.polygonActionOpts, mergeActionOpts('polygonActionOpts')))
     const polygonDrawingOpts = reactive<VcDrawingOpts>(Object.assign({}, defaultOptions.polygonDrawingOpts, props.polygonDrawingOpts))
-    const rectangleActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.rectangleActionOpts, props.rectangleActionOpts))
+    const rectangleActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.rectangleActionOpts, mergeActionOpts('rectangleActionOpts')))
     const rectangleDrawingOpts = reactive<VcDrawingOpts>(Object.assign({}, defaultOptions.rectangleDrawingOpts, props.rectangleDrawingOpts))
-    const circleActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.circleActionOpts, props.circleActionOpts))
+    const circleActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.circleActionOpts, mergeActionOpts('circleActionOpts')))
     const circleDrawingOpts = reactive<VcDrawingOpts>(Object.assign({}, defaultOptions.circleDrawingOpts, props.circleDrawingOpts))
-    const regularActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.regularActionOpts, props.regularActionOpts))
+    const regularActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.regularActionOpts, mergeActionOpts('regularActionOpts')))
     const regularDrawingOpts = reactive<VcDrawingOpts>(Object.assign({}, defaultOptions.regularDrawingOpts, props.regularDrawingOpts))
-    const pinActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.pinActionOpts, props.pinActionOpts))
+    const pinActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.pinActionOpts, mergeActionOpts('pinActionOpts')))
     const pinDrawingOpts = reactive<VcDrawingOpts>(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
   }
 })

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<VcActionTooltipProps & VcFabProps>,
     default: () => mainFabDefault
   },
+  fabActionOpts: {
+    type: Object as PropType<VcActionTooltipProps>,
+    default: () => fabActionOptsDefault
+  },
   distanceActionOpts: {
     type: Object as PropType<VcActionTooltipProps>,
     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.
    */

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<VcActionTooltipProps>(Object.assign({}, defaultOptions.clearActionOpts, props.clearActionOpts))
     const mainFabOpts = reactive<VcActionTooltipProps & VcFabProps>(Object.assign({}, defaultOptions.mainFabOpts, props.mainFabOpts))
 
-    const distanceActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.distanceActionOpts, props.distanceActionOpts))
+    const fabActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.fabActionOpts, props.fabActionOpts))
+
+    const distanceActionOpts = reactive<VcActionTooltipProps>(
+      Object.assign({}, defaultOptions.distanceActionOpts, mergeActionOpts('distanceActionOpts'))
+    )
     const distanceMeasurementOpts = reactive<VcMeasurementOpts>(
       Object.assign({}, defaultOptions.distanceMeasurementOpts, props.distanceMeasurementOpts)
     )
 
     const componentDistanceActionOpts = reactive<VcActionTooltipProps>(
-      Object.assign({}, defaultOptions.componentDistanceActionOpts, props.componentDistanceActionOpts)
+      Object.assign({}, defaultOptions.componentDistanceActionOpts, mergeActionOpts('componentDistanceActionOpts'))
     )
     const componentDistanceMeasurementOpts = reactive<VcComponentDistanceMeasurementOpts>(
       Object.assign({}, defaultOptions.componentDistanceMeasurementOpts, props.componentDistanceMeasurementOpts)
     )
 
-    const polylineActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.polylineActionOpts, props.polylineActionOpts))
+    const polylineActionOpts = reactive<VcActionTooltipProps>(
+      Object.assign({}, defaultOptions.polylineActionOpts, mergeActionOpts('polylineActionOpts'))
+    )
     const polylineMeasurementOpts = reactive<VcPolylineMeasurementOpts>(
       Object.assign({}, defaultOptions.polylineMeasurementOpts, props.polylineMeasurementOpts)
     )
 
-    const horizontalActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.horizontalActionOpts, props.horizontalActionOpts))
+    const horizontalActionOpts = reactive<VcActionTooltipProps>(
+      Object.assign({}, defaultOptions.horizontalActionOpts, mergeActionOpts('horizontalActionOpts'))
+    )
     const horizontalMeasurementOpts = reactive<VcHorizontalMeasurementOpts>(
       Object.assign({}, defaultOptions.horizontalMeasurementOpts, props.horizontalMeasurementOpts)
     )
 
-    const verticalActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.verticalActionOpts, props.verticalActionOpts))
+    const verticalActionOpts = reactive<VcActionTooltipProps>(
+      Object.assign({}, defaultOptions.verticalActionOpts, mergeActionOpts('verticalActionOpts'))
+    )
     const verticalMeasurementOpts = reactive<VcMeasurementOpts>(
       Object.assign({}, defaultOptions.verticalMeasurementOpts, props.verticalMeasurementOpts)
     )
 
-    const heightActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.heightActionOpts, props.heightActionOpts))
+    const heightActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.heightActionOpts, mergeActionOpts('heightActionOpts')))
     const heightMeasurementOpts = reactive<VcMeasurementOpts>(Object.assign({}, defaultOptions.heightMeasurementOpts, props.heightMeasurementOpts))
 
-    const areaActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.areaActionOpts, props.areaActionOpts))
+    const areaActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.areaActionOpts, mergeActionOpts('areaActionOpts')))
     const areaMeasurementOpts = reactive<VcPolylineMeasurementOpts>(Object.assign({}, defaultOptions.areaMeasurementOpts, props.areaMeasurementOpts))
 
-    const pointActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.pointActionOpts, props.pointActionOpts))
+    const pointActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.pointActionOpts, mergeActionOpts('pointActionOpts')))
     const pointMeasurementOpts = reactive<VcMeasurementOpts>(Object.assign({}, defaultOptions.pointMeasurementOpts, props.pointMeasurementOpts))
 
-    const rectangleActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.rectangleActionOpts, props.rectangleActionOpts))
+    const rectangleActionOpts = reactive<VcActionTooltipProps>(
+      Object.assign({}, defaultOptions.rectangleActionOpts, mergeActionOpts('rectangleActionOpts'))
+    )
     const rectangleMeasurementOpts = reactive<VcRegularMeasurementOpts>(
       Object.assign({}, defaultOptions.rectangleMeasurementOpts, props.rectangleMeasurementOpts)
     )
 
-    const regularActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.regularActionOpts, props.regularActionOpts))
+    const regularActionOpts = reactive<VcActionTooltipProps>(
+      Object.assign({}, defaultOptions.regularActionOpts, mergeActionOpts('regularActionOpts'))
+    )
     const regularMeasurementOpts = reactive<VcRegularMeasurementOpts>(
       Object.assign({}, defaultOptions.regularMeasurementOpts, props.regularMeasurementOpts)
     )
 
-    const circleActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.circleActionOpts, props.circleActionOpts))
+    const circleActionOpts = reactive<VcActionTooltipProps>(Object.assign({}, defaultOptions.circleActionOpts, mergeActionOpts('circleActionOpts')))
     const circleMeasurementOpts = reactive<VcRegularMeasurementOpts>(
       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
   }
 })

website/docs/zh-CN/analyses/vc-analyses.md

@@ -1,8 +1,8 @@
 <!--
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2022-01-06 11:30:01
- * @LastEditTime: 2022-05-14 10:31:04
- * @LastEditors: zouyaoji
+ * @LastEditTime: 2023-02-10 09:38:38
+ * @LastEditors: XIAOLIJUN
  * @Description:
  * @FilePath: \vue-cesium@next\website\docs\zh-CN\analyses\vc-analyses.md
 -->
@@ -162,6 +162,7 @@
 | activeColor | string | `'positive'` | `optional` 指定绘制实例激活时的颜色。 |
 | editable | boolean | `false` | `optional` 指定绘制结果对象是否可编辑。 |
 | mainFabOpts | VcActionTooltipProps & VcFabProps | | `optional` 指定分析组件浮动按钮的样式选项。 |
+| fabActionOpts | VcActionTooltipProps | | `optional` 指定其他分析按钮的公共样式选项。 |
 | sightlineActionOpts | VcActionTooltipProps |  | `optional` 指定通视分析绘制按钮的样式选项。|
 | sightlineAnalysisOpts | VcDrawingOpts | | `optional` 指定通视分析绘制参数。|
 | viewshedActionOpts | VcActionTooltipProps |  | `optional` 指定可视域分析按钮的样式选项。|

website/docs/zh-CN/analyses/vc-drawings.md

@@ -267,6 +267,7 @@ ctrl + 右键取消绘制。
 | editable | boolean | `false` | `optional` 指定绘制结果对象是否可编辑。 |
 | clampToGround | boolean | `false` | `optional` 指定绘制结果对象是否贴地或模型。仅线、面对象生效。 |
 | mainFabOpts | VcActionTooltipProps & VcFabProps | | `optional` 指定绘制组件浮动按钮的样式选项。 |
+| fabActionOpts | VcActionTooltipProps | | `optional` 指定其他绘制按钮的公共样式选项。 |
 | pinActionOpts | VcActionTooltipProps | `` | `optional` 指定图标点绘制按钮的样式选项。|
 | pinDrawingOpts | VcDrawingOpts | | `optional` 指定图标点绘制参数。|
 | pointActionOpts | VcActionTooltipProps | `` | `optional` 指定点绘制按钮的样式选项。|

website/docs/zh-CN/analyses/vc-measurements.md

@@ -273,6 +273,7 @@ ctrl + 右键取消绘制。
 | activeColor | string | `'positive'` | `optional` 指定量算实例激活时的颜色。 |
 | editable | boolean | `false` | `optional` 指定量算结果对象是否可编辑。 |
 | mainFabOpts | VcActionTooltipProps & VcFabProps | | `optional` 指定量算组件浮动按钮的样式风格选项。 |
+| fabActionOpts | VcActionTooltipProps | | `optional` 指定其他量算按钮的公共样式选项。 |
 | distanceActionOpts | VcActionTooltipProps | | `optional` 指定距离量算按钮的样式风格选项。|
 | distanceMeasurementOpts | VcMeasurementOpts | | `optional` 指定距离量算参数。|
 | componentDistanceActionOpts | VcActionTooltipProps | | `optional` 指定三角量算按钮的样式风格选项。|