智慧园区前端大屏
linwe
2024-11-25 03450f93e418c4b953247f9abab29b3249106711
工具优化
2 files modified
129 ■■■■ changed files
src/pages/layout/components/scomponents/tool/measure.vue 55 ●●●● patch | view | raw | blame | history
src/pages/layout/components/scomponents/toolList.vue 74 ●●●● patch | view | raw | blame | history
src/pages/layout/components/scomponents/tool/measure.vue
@@ -55,16 +55,16 @@
function calcDistance() {
    measure.distance()
}
// 地面距离
// 贴地距离
function distanceSurface() {
    measure.distanceSurface()
}
// 平面面积
// 水平面积
function calcArea(item) {
    console.log('calcArea********************************', item)
    measure.area()
}
// 地面面积
// 贴地面积
function areaSurface() {
    measure.areaSurface()
}
@@ -82,7 +82,7 @@
function calcHeight() {
    measure.height()
}
//   模型高度
//   贴物高度
function calcModelHeight() {
    measure.height({
        clampToModel: true
@@ -127,11 +127,11 @@
        imges: '../../../../../assets/images/add.png',
        click: distanceSurface
    },
    {
        label: '剖面',
        value: 'volume',
        imges: '../../../../../assets/images/add.png'
    },
    // {
    //     label: '剖面',
    //     value: 'volume',
    //     imges: '../../../../../assets/images/add.png'
    // },
    {
        label: '水平面积',
        value: 'volume',
@@ -163,9 +163,10 @@
        click: calcModelTriangleHeight
    },
    {
        label: '坐标测量',
        label: '贴物高度',
        value: 'volume',
        imges: '../../../../../assets/images/add.png'
        imges: '../../../../../assets/images/add.png',
        click: calcModelHeight
    },
]
@@ -179,9 +180,7 @@
    width: 230px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    font-size: 12px;
    /* 水平居中 */
}
.icon_img {
@@ -190,18 +189,10 @@
}
.item {
    flex: 1 0 33.33%;
    /* 每个项占 1/3 的宽度 */
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 水平居中 */
    justify-content: center;
    /* 垂直居中 */
    box-sizing: border-box;
    /* 确保 padding 和 border 不影响宽度 */
    padding: 10px;
    /* 可选:增加内边距 */
    width: 60px;
    margin: 8px;
    text-align: center;
    padding: 3px;
}
.button-clear {
@@ -211,17 +202,21 @@
}
.button-clear button {
    background-color: rgb(25, 0, 255);
    padding: 10px;
    padding: 6px;
    border: none;
}
.button-clear button:hover {
    background-color: blue;
    color: #fff;
}
.container-box .text:hover {
    color: blue;
.container-box .item:hover {
    box-shadow: inset 0px 0px 30px 20px rgba(31, 139, 247, 0.949);
    border-radius: 20%;
}
.text {
    color: pink;
    // color: pink;
}
</style>
src/pages/layout/components/scomponents/toolList.vue
@@ -40,55 +40,55 @@
    title: '图上量算',
    component: measure,
  },
  {
    icon: 'fa fa-bar-chart',
    title: '空间分析',
  },
  // {
  //   icon: 'fa fa-bar-chart',
  //   title: '空间分析',
  // },
  {
    name: 'location',
    icon: 'fa fa-map-pin',
    title: '坐标定位',
    component: location
  },
  {
    icon: 'fa fa-paper-plane',
    title: '地区导航',
  },
  {
    icon: 'fa fa-edit',
    title: '我的标记',
  },
  {
    icon: 'fa fa-tags',
    title: '视角书签',
  },
  // {
  //   icon: 'fa fa-paper-plane',
  //   title: '地区导航',
  // },
  // {
  //   icon: 'fa fa-edit',
  //   title: '我的标记',
  // },
  // {
  //   icon: 'fa fa-tags',
  //   title: '视角书签',
  // },
  {
    name: 'exportScene',
    icon: 'fa fa-download',
    title: '场景导出',
    component: exportScene
  },
  {
    icon: 'fa fa-object-group',
    title: '图上标绘',
  },
  {
    icon: 'fa fa-helicopter',
    title: '飞行漫游',
  },
  {
    icon: 'fa fa-level-up',
    title: '路线导航',
  },
  {
    icon: 'fa fa-columns',
    title: '卷帘对比',
    component: curtain
  },
  {
    icon: 'fa fa-window-restore',
    title: '分屏对比',
  },
  // {
  //   icon: 'fa fa-object-group',
  //   title: '图上标绘',
  // },
  // {
  //   icon: 'fa fa-helicopter',
  //   title: '飞行漫游',
  // },
  // {
  //   icon: 'fa fa-level-up',
  //   title: '路线导航',
  // },
  // {
  //   icon: 'fa fa-columns',
  //   title: '卷帘对比',
  //   component: curtain
  // },
  // {
  //   icon: 'fa fa-window-restore',
  //   title: '分屏对比',
  // },
]
const showComponent = (component) => {