@ganwei-web/ganwei-pc-cli 6.2.6 → 6.2.7

package/ganwei-iotcenter-index-6.2.3/packages/ganwei-iotcenter-index/src/components/indexRightContent/normalPage/index.scss

@@ -0,0 +1,44 @@
+.normalPage {
+    width: 100%;
+    height: 100%;
+
+    .noLabelPage {
+        height: calc(100% - 48px);
+    }
+}
+
+.el-main {
+    padding: 0px !important;
+    overflow: hidden;
+
+    iframe {
+        border: none;
+    }
+}
+
+// 面包屑导航
+.breadcrumb {
+    width: 100%;
+    height: 48px;
+    padding-left: 16px;
+    background-color: var(--con-bgColor3);
+
+    >div {
+        height: 100%;
+        line-height: 48px;
+        font-size: 14px;
+    }
+
+    ::v-deep .el-breadcrumb {
+
+        .is-link,
+        span {
+            font-weight: 500;
+            color: var(--frame-main-color);
+
+            &:hover {
+                color: var(--frame-main-color);
+            }
+        }
+    }
+}

package/ganwei-iotcenter-index-6.2.3/packages/ganwei-iotcenter-index/src/components/indexRightContent/normalPage/index.vue

@@ -0,0 +1,21 @@
+<template>
+    <div class="normalPage">
+        <div class="breadcrumb">
+            <el-breadcrumb separator-class="el-icon-arrow-right">
+                <el-breadcrumb-item>{{ $t('login.framePro.label.home') }}</el-breadcrumb-item>
+                <el-breadcrumb-item v-for="(item, i) in breadcrumbList" :key="i">{{
+                    $t(item.title || '') }}</el-breadcrumb-item>
+            </el-breadcrumb>
+        </div>
+        <el-main class="container-main noLabelPage" id="pane-normalPage">
+            <transition name="slide-fade" class="wh100">
+                <Suspense>
+                    <router-view :key="$route.fullPath"></router-view>
+                </Suspense>
+            </transition>
+        </el-main>
+    </div>
+</template>
+
+<script src="./index.js"></script>
+<style src="./index.scss" scoped></style>

package/ganwei-iotcenter-index-6.2.3/packages/ganwei-iotcenter-index/src/components/isDebug/isDebug.vue

@@ -0,0 +1,57 @@
+<!--
+ * @Description:
+ * @Version: v1
+ * @Author: zkx
+ * @LastEditTime: 2023-10-09 13:37:02
+ * Copyright (c) 2023 by 敢为软件, All Rights Reserved.
+-->
+<template>
+    <div class="top-tip" v-if="showDebugInfo">
+        <img class="top-img" src="./warning.png">
+        {{ $t('login.tips.debugging') }}
+    </div>
+</template>
+<script>
+export default {
+    data () {
+        return {
+            showDebugInfo: false
+        }
+    },
+    mounted () {
+        this.$api.getServiceStatus().then(res => {
+            if (res.data.code == 200 && 'data' in res.data) {
+                let data = res.data.data;
+                if (data.isDebug) {
+                    this.showDebugInfo = true;
+                }
+            } else {
+                this.showDebugInfo = false
+            }
+        })
+            .catch(err => {
+                this.showDebugInfo = false
+            });
+    }
+}
+</script>
+<style lang="scss" scoped>
+.top-tip {
+    position: absolute;
+    top: 65px;
+    right: 1px;
+    height: 38px;
+    color: #FF0024;
+    padding: 0 15px;
+    background: rgba(43, 19, 9, 0.7);
+    border: 1px solid rgba(255, 192, 82, 0.4);
+    display: flex;
+    align-items: center;
+    z-index: 99;
+
+    .top-img {
+        width: 22px;
+        margin-right: 16px;
+    }
+}
+</style>

package/ganwei-iotcenter-index-6.2.3/packages/ganwei-iotcenter-index/src/components/layouts/Navigation/AsideMenu.vue

@@ -0,0 +1,473 @@
+<template>
+  <el-sub-menu v-if="isSubMenu" :key="`${data.resourceId}-sub-menu`" :index="String(data.resourceId)"
+    :class="menuItemClass" :title="data.name">
+    <template #title>
+      <div :class="$style.menuItemContent" :style="{ paddingLeft: contentIndent }">
+        <div :class="$style.iconBox">
+          <i class="iconfont" :class="menuIcon" />
+        </div>
+        <label :class="$style.menuLabel">{{ data.name }}</label>
+      </div>
+    </template>
+    <AsideMenu v-for="item in data.children" :key="item.resourceId" :data="item" :is-collapse="isCollapse" has-parent />
+  </el-sub-menu>
+
+  <el-menu-item v-else-if="isMenuItem" :name="data.resourceId" :key="`${data.resourceId}-menu-item`" :index="data.route"
+    :class="menuItemClass" :title="showTitle ? data.name : ''" @click="handleMenuClick">
+    <div :class="$style.menuItemContent" :style="{ paddingLeft: contentIndent }">
+      <div :class="$style.iconBox">
+        <i class="iconfont" :class="data.icon" />
+      </div>
+      <label :class="$style.menuLabel">{{ data.name }}</label>
+    </div>
+  </el-menu-item>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { getCurrentInstance } from 'vue'
+
+/**
+ * 菜单数据类型定义
+ */
+interface MenuData {
+  resourceId: string | number
+  name: string
+  route?: string
+  icon?: string
+  backgroundColor?: string
+  menuOwner: number // 1:WEB 2:APP 3:桌面 4:三维 5:小程序 6:全部
+  nodeType: number // 1:目录 2:菜单
+  level: number // 1:一级菜单 2:二级菜单 3:三级菜单
+  children?: MenuData[]
+}
+
+interface Props {
+  data: MenuData
+  isCollapse?: boolean
+  hasParent?: boolean
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  isCollapse: false,
+  hasParent: false,
+})
+
+// 获取当前组件实例，用于访问 $bus
+const instance = getCurrentInstance()
+
+/**
+ * 判断是否为子菜单（目录）
+ */
+const isSubMenu = computed(() => {
+  return (
+    props.data.menuOwner === 1 &&
+    props.data.nodeType === 1 &&
+    props.data.children &&
+    props.data.children.length > 0 &&
+    props.data.level >= 0
+  )
+})
+
+/**
+ * 判断是否为菜单项
+ */
+const isMenuItem = computed(() => {
+  return props.data.menuOwner === 1 && props.data.nodeType === 2
+})
+
+/**
+ * 菜单项样式类
+ */
+const menuItemClass = computed(() => {
+  return props.isCollapse ? 'menu-list-item-scale' : 'menu-list-item'
+})
+
+/**
+ * 是否显示标题（tooltip）
+ */
+const showTitle = computed(() => {
+  return props.data.level === 1
+})
+
+/**
+ * 图标盒子样式
+ */
+const iconBoxStyle = computed(() => {
+  return props.data.backgroundColor
+    ? { backgroundColor: props.data.backgroundColor }
+    : {}
+})
+
+/**
+ * 菜单图标
+ */
+const menuIcon = computed(() => {
+  if (props.data.icon) {
+    return props.data.icon
+  }
+
+  // 如果没有图标，尝试使用第一个子菜单的图标
+  if (props.data.children && props.data.children.length > 0) {
+    const firstChild = props.data.children[0]
+    return firstChild.icon || ''
+  }
+
+  return ''
+})
+
+/**
+ * 处理菜单点击事件
+ */
+const handleMenuClick = () => {
+  if (instance?.appContext.config.globalProperties.$bus) {
+    instance.appContext.config.globalProperties.$bus.emit('jumpUrl', props.data.route)
+  }
+}
+
+/**
+ * 计算内容区域的缩进
+ */
+const contentIndent = computed(() => {
+  // 如果有父级，根据层级计算缩进（从第2层开始缩进）
+  if (props.hasParent) {
+    // level: 1(一级菜单), 2(二级菜单), 3(三级菜单)...
+    // 我们希望：一级菜单不缩进，二级菜单缩进20px，三级菜单缩进40px...
+    // 所以缩进 = (level - 1) * 22px
+    return `${(props.data.level - 2) * 22}px`
+  }
+  return '0px'
+})
+
+</script>
+
+<style module lang="scss">
+.iconBox {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 6px;
+  width: 32px;
+  height: 32px;
+  flex-shrink: 0;
+
+  .iconfont {
+    width: auto !important;
+    margin-right: 0 !important;
+    color: var(--menu-color);
+    font-size: 16px;
+  }
+}
+
+.menuLabel {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  color: var(--menu-color);
+  flex: 1;
+}
+
+.menuItemContent {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  transition: padding-left 0.2s;
+}
+</style>
+
+<style lang="scss" scoped>
+// 注意：以下全局样式需要保留在非 module 的 style 中，以便影响 Element Plus 组件
+
+// 展开状态
+.maxActive .max {
+  > :deep(.el-menu) {
+
+    >.el-menu-item,
+    >.el-sub-menu>.el-sub-menu__title {
+      display: flex;
+      align-items: center;
+      height: 44px;
+      padding: 0;
+      margin-bottom: 4px;
+
+      :deep(.menuItemContent) label {
+        font-size: 14px;
+        color: var(--menu-color);
+      }
+
+      :deep(.menuItemContent) :deep(.iconBox) {
+        flex-shrink: 0;
+        width: 32px;
+        height: 32px;
+        margin-right: 12px;
+        min-width: 32px;
+        border-radius: 6px;
+
+        i {
+          font-size: 16px;
+          color: var(--menu-color);
+        }
+      }
+    }
+
+    >.el-sub-menu>.el-menu {
+
+      .el-menu-item,
+      .el-sub-menu__title {
+        display: flex;
+        align-items: center;
+        height: 40px;
+        padding: 0;
+        margin-bottom: 2px;
+
+        :deep(.menuItemContent) label {
+          font-size: 14px;
+          color: var(--menu-color);
+        }
+
+        :deep(.menuItemContent) :deep(.iconBox) {
+          flex-shrink: 0;
+          width: 28px;
+          height: 28px;
+          margin-right: 12px;
+          min-width: 28px;
+          border-radius: 6px;
+
+          i {
+            font-size: 14px;
+            color: var(--menu-color);
+          }
+        }
+      }
+    }
+  }
+}
+
+.max :deep(.el-menu .el-menu-item.is-active) {
+  :deep(.menuItemContent) :deep(.iconBox) {
+    i {
+      color: var(--menu-color__active) !important;
+    }
+  }
+}
+
+.menu-list-item :deep(.el-menu-item.is-active) {
+  background-color: var(--menu-background__active) !important;
+  color: var(--menu-color__active) !important;
+
+  i,
+  label {
+    color: var(--menu-color__active) !important;
+  }
+
+  :deep(.menuItemContent) :deep(.iconBox) {
+    i {
+      color: var(--menu-color__active) !important;
+    }
+  }
+}
+
+.el-menu>.menu-list-item {
+
+  i,
+  label {
+    color: var(--menu-color);
+    cursor: pointer;
+  }
+}
+
+.menu-list-item {
+  font-size: 14px;
+  border-radius: 8px;
+  cursor: pointer;
+  width: 100%;
+
+  :deep(.el-sub-menu__title) {
+    display: flex;
+    align-items: center;
+    height: 44px;
+
+    margin-bottom: 4px;
+
+    :deep(.menuItemContent) label {
+      font-size: 14px;
+      color: var(--menu-color);
+    }
+
+    border-radius: 8px;
+    padding: 0 !important;
+
+    &:hover {
+      background-color: var(--menu-background__hover);
+      color: var(--menu-color__hover);
+
+      i,
+      label {
+        color: var(--menu-color__hover);
+
+      }
+    }
+
+    .el-sub-menu__icon-arrow {
+      color: var(--gw-color-Neutrals11);
+      margin-right: 0;
+    }
+  }
+
+  .menuDot {
+    display: none !important;
+  }
+
+  >:deep(.menuItemContent) label,
+  :deep(.el-sub-menu__title)>:deep(.menuItemContent) label {
+    cursor: pointer;
+  }
+
+  :deep(.el-menu-item) {
+    display: flex;
+    align-items: center;
+    height: 44px;
+    border-radius: 8px;
+    cursor: pointer;
+    padding: 0 !important;
+    margin-bottom: 4px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+
+    :deep(.menuItemContent) label {
+      color: var(--menu-color);
+    }
+
+    &:hover {
+      background-color: var(--menu-background__hover);
+      color: var(--menu-color__hover);
+
+      i,
+      label {
+        color: var(--menu-color__hover);
+      }
+    }
+  }
+
+  .menu-list-level {
+    display: flex;
+    width: 100%;
+    flex-wrap: wrap;
+    gap: 10px;
+    padding-left: 35px;
+
+    >p {
+      width: 100%;
+      display: flex;
+      margin: 10px 0 0 -35px;
+
+      label {
+        padding-left: 10px;
+        opacity: 0.3;
+      }
+    }
+
+    >li {
+      display: inline-block;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    .menu-list-level {
+      padding-left: 35px;
+    }
+  }
+}
+
+// 弹出菜单样式
+:deep(.el-menu--popup) {
+  width: 100%;
+
+  .el-menu-item {
+    display: flex;
+    align-items: center;
+    padding: 0 12px;
+    height: 40px;
+    margin-bottom: 2px;
+    border-radius: 8px;
+
+    :deep(.menuItemContent) :deep(.iconBox) {
+      width: 28px;
+      height: 28px;
+      margin-right: 12px;
+    }
+
+    :deep(.menuItemContent) label {
+      color: var(--menu-color);
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      flex: 1;
+    }
+
+    &:hover {
+      background-color: var(--menu-background__hover);
+      color: var(--menu-color__hover);
+
+      i,
+      label {
+        color: var(--menu-color__hover);
+      }
+    }
+
+    &.is-active {
+      background-color: var(--menu-background__active);
+      color: var(--menu-color__active);
+
+      :deep(.menuItemContent) label {
+        color: var(--menu-color__active);
+      }
+    }
+  }
+
+  .el-sub-menu__title {
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    padding: 0 12px;
+    height: 40px;
+    margin-bottom: 2px;
+    border-radius: 8px;
+
+    :deep(.menuItemContent) :deep(.iconBox) {
+      width: 28px;
+      height: 28px;
+      margin-right: 12px;
+    }
+
+    :deep(.menuItemContent) label {
+      color: var(--menu-color);
+    }
+
+    .el-sub-menu__icon-arrow {
+      color: var(--gw-color-Neutrals11);
+    }
+
+    &:hover {
+      background-color: var(--menu-background__hover);
+      color: var(--menu-color__hover);
+
+      i,
+      label {
+        color: var(--menu-color__hover);
+      }
+    }
+
+    &.is-active {
+      background-color: var(--menu-background__active);
+      color: var(--menu-color__active);
+
+      :deep(.menuItemContent) label {
+        color: var(--menu-color__active);
+      }
+    }
+  }
+}
+</style>