aaa
wujingjing
2025-02-08 40d796814fc688c760004719b773c0b8caf2e334
src/components/chat/chatComponents/summaryCom/components/recordSetTable/map/panelTool/index.vue
@@ -1,43 +1,53 @@
<template>
   <div class="flex shadow">
   <div class="flex">
      <!-- <div class="size-2 border border-solid " >
                <span class="ywifont ywicon ywicon-liebiao"></span>
            </div> -->
      <div
         class="size-8 rounded flex-center cursor-pointer border border-solid border-[#494949] bg-[#fcfcfc]"
         :class="{
            'bg-[#1676fd]': MapPanelTool.Property === activeMapToolPanel,
            'text-white': MapPanelTool.Property === activeMapToolPanel,
            'hover:text-[#1676fd]': MapPanelTool.Property !== activeMapToolPanel,
            'hover:border-[#1676fd]': MapPanelTool.Property !== activeMapToolPanel,
            '!hidden': activeMapToolPanel === MapPanelTool.Property,
         }"
         :title="mapPanelToolMap[MapPanelTool.Property]"
         @click="mapToolPanelClick(MapPanelTool.Property)"
      >
         <span class="ywifont ywicon ywicon-liebiao"></span>
      <div class="flex flex-col gap-2 translate-y-20">
         <div
            v-for="item in Object.keys(mapPanelToolMap)"
            :key="item"
            class="size-8 rounded flex-center cursor-pointer border border-solid border-[#494949] bg-[#fcfcfc]"
            :class="{
               '!bg-[#1676fd]': item === activeMapToolPanel,
               'text-white': item === activeMapToolPanel,
               'hover:text-[#1676fd]': item !== activeMapToolPanel,
               'hover:border-[#1676fd]': item !== activeMapToolPanel,
            }"
            :title="mapPanelToolMap[item]"
            @click="mapToolPanelClick(item as any)"
         >
            <span class="ywifont ywicon" :class="[`ywicon-${mapPanelToolMapIcon[item].name}`]"></span>
         </div>
      </div>
      <div class="shadow">
         <PropertyPanel
            ref="propertyPanelRef"
            v-show="activeMapToolPanel === MapPanelTool.Property"
            @close="propertyPanelClose"
            :propertyMap="propertyMap"
            :propertyConfigMap="propertyConfigMap"
         ></PropertyPanel>
      <PropertyPanel
         ref="propertyPanelRef"
         v-show="activeMapToolPanel === MapPanelTool.Property"
         @close="propertyPanelClose"
         :propertyMap = propertyMap
         :propertyConfigMap="propertyConfigMap"
      ></PropertyPanel>
         <LayerControl v-show="activeMapToolPanel === MapPanelTool.Layer" :olMap="olMap"></LayerControl>
         <ThemeControl v-show="activeMapToolPanel === MapPanelTool.Theme" :olMap="olMap"></ThemeControl>
      </div>
   </div>
</template>
<script setup lang="ts" name="PanelTool">
import type { CollapseModelValue } from 'element-plus';
import { ref } from 'vue';
import { useTextOverflow } from '/@/hooks/useOverflow';
import PropertyPanel from './PropertyPanel.vue';
import { MapPanelTool, mapPanelToolMap } from '../types';
import { MapPanelTool, mapPanelToolMap, mapPanelToolMapIcon } from '../types';
import { useCompRef } from '/@/utils/types';
const props = defineProps(['propertyMap','propertyConfigMap'])
import ThemeControl from './ThemeControl.vue';
import LayerControl from './LayerControl.vue';
const props = defineProps(['propertyMap', 'propertyConfigMap', 'olMap']);
const activeMapToolPanel = ref<MapPanelTool>();
const mapToolPanelClick = (type: MapPanelTool) => {
   activeMapToolPanel.value = activeMapToolPanel.value === type ? null : type;
   switch (type) {