导航

core/core-frontend/src/components/visualization/DvSidebar.vue

@@ -587,4 +587,7 @@ color: #ffffff !important;
 .ed-input-number__decrease:hover, .ed-input-number__increase:hover {
   color: #0089ff;
 }
+.ed-select .ed-input.is-disabled:not(.ed-input--dark) .ed-input__wrapper:hover{
+  box-shadow: none!important;;
+}
 </style>

core/core-frontend/src/viewsnew/application/module/Leftmenu/index.vue

@@ -544,4 +544,10 @@ function delTreeClic(){ // 删除
   box-shadow: none;
   border: 1px solid #5f5f5f;
 }
+.ed-select .ed-input.is-disabled:not(.ed-input--dark) .ed-input__wrapper:hover{
+  box-shadow: none !important;
+}
+.ed-input.is-disabled .ed-input__wrapper{
+  box-shadow: none !important;
+}
 </style>

core/core-frontend/src/viewsnew/application/module/Navbar/index.vue

@@ -0,0 +1,99 @@
+<script lang="ts" setup>
+import { ref, onMounted } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+
+const navtitle = ref('这里显示的是一个标题的名称')
+const navmenulist = ref([
+    { name: '菜单名称1', children: [{ name: '子菜单名称1' }] },
+    { name: '菜单名称2', children: [] },
+    { name: '菜单名称3', children: [{ name: '子菜单名称1' }, { name: '子菜单名称2' }] },
+    { name: '菜单名称4', children: [{ name: '子菜单名称1' }] },
+])
+const checkindex = ref(null)
+</script>
+<template>
+    <div class="Navbar-box">
+        <div class="Navbar-box-titie">{{ navtitle }}</div>
+        <div class="Navbar-menu-box">
+            <div class="Navbar-menu-content">
+                <div class="Navbar-menu-time">
+                    <div class="Navbar-menu-time-text">12:45:35</div>
+                    <div class="Navbar-menu-time-text2">2022-08-16 星期二</div>
+                </div>
+                <div class="Navbar-menu-item" :class=""  v-for="(item, index) in navmenulist" :key="index">
+                    <div>{{ item.name }}</div>
+                </div>
+            </div>
+            <div class="Navbar-box-right">
+                <div style="margin-right: 10px;"><img src="@/assets/img/nav1.png" alt=""></div>
+                <div style="margin-right: 15px;">admin</div>
+                <div style="margin-right: 15px;"><img src="@/assets/img/nav3.png" alt=""></div>
+                <div><img src="@/assets/img/nav4.png" alt=""></div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<style lang="less" scoped>
+.Navbar-box {
+    width: 100%;
+    height: 65px;
+    display: flex;
+    align-items: center;
+    color: #fff;
+    background: url(@/assets/img/navbg.png);
+    background-size: 100% 100%;
+    padding-left: 25px;
+
+    .Navbar-box-titie {
+        font-size: 25px;
+        font-weight: 700;
+        background: linear-gradient(to bottom, #ffffff, #0089ff);
+        -webkit-background-clip: text;
+        background-clip: text;
+        color: transparent;
+        width: 340px;
+    }
+
+    .Navbar-menu-box {
+        width: calc(100% - 340px);
+        display: flex;
+        align-items: center;
+        padding-left: 43px;
+        padding-right: 20px;
+        justify-content: space-between;
+
+        .Navbar-menu-content {
+            display: flex;
+            align-items: center;
+
+            .Navbar-menu-time {
+                width: 150px;
+                .Navbar-menu-time-text {
+                    font-size: 16px;
+                    font-weight: 700;
+                }
+
+                .Navbar-menu-time-text2 {
+                    font-size: 13px;
+                    font-weight: 700;
+                }
+            }
+            .Navbar-menu-item{
+                font-size: 14px;
+                padding: 5px 15px;
+                background: url(@/assets/img/navmenu.png);
+                background-size: 100% 100%;
+                margin-left: 15px;
+            }
+        }
+
+        .Navbar-box-right {
+            width: 165px;
+            display: flex;
+            align-items: center;
+            font-size: 14px;
+        }
+    }
+}
+</style>

core/core-frontend/src/viewsnew/application/module/index.vue

@@ -7,7 +7,7 @@ import { findApplicationById } from "@/api/application/application";
 import { useRouter, useRoute } from 'vue-router'
 import DvPreview from '@/viewsnew/data-visualization/DvPreview.vue'
 import FormCreate from '@/viewsnew/common/FormCreate.vue'
-
+import Navbar from '@/viewsnew/application/module/Navbar/index.vue'
 
 import DePreview from '@/components/data-visualization/canvas/DePreview.vue'
 import { initCanvasData, initCanvasDataPrepare, onInitReady } from '@/utils/canvasUtils'
@@ -27,6 +27,7 @@ const dataInitState = ref(true)
 const downloadStatus = ref(false)
 const dvPreviewRef = ref(null)
 const showPosition = ref("preview")
+const isNavbar = ref(false)
 // const noClose = ref(false)
 // const props = defineProps({
 //   showPosition: {
@@ -110,6 +111,7 @@ const loadCanvasData = (dvId, weight?, ext?) => {
 function handleNodeClick(e){
   isFormCreate.value = false
   dataInitState.value = false
+  isNavbar.value = false
   if(e.type == '0301'){
     busiFlag.value = 'dashboard'
     loadCanvasData(e.id,9,0)
@@ -119,6 +121,8 @@ function handleNodeClick(e){
   }else if(e.type == '09'){
     moduleInfo.value = e
     isFormCreate.value = true
+  } else if(e.type == '02'){
+    isNavbar.value = true
   }
 }
 onBeforeMount(() => {
@@ -143,6 +147,7 @@ onBeforeMount(() => {
             :download-status="downloadStatus"
           ></dv-preview> 
           <form-create v-if="isFormCreate" :moduleInfo="moduleInfo"></form-create>
+          <Navbar v-if="isNavbar"></Navbar>
     </div>
   </div>
 </template>