Explorar el Código

feat: logo设置

lvkun hace 2 años
padre
commit
02306e2130
Se han modificado 2 ficheros con 52 adiciones y 3 borrados
  1. 4 1
      src/pages/Iot/device/topology.vue
  2. 48 2
      src/pages/Iot/sys/logo.vue

+ 4 - 1
src/pages/Iot/device/topology.vue

@@ -110,7 +110,10 @@ const vueTreeRef = ref('')
 const zoomCount = ref(100)
 
 const treeData = reactive({
-  richMediaData: {},
+  richMediaData: {
+    name: '产品模型',
+    value: '产品模型'
+  },
   treeConfig: { nodeWidth: 120, nodeHeight: 80, levelHeight: 200 }
 }
 )

+ 48 - 2
src/pages/Iot/sys/logo.vue

@@ -1,12 +1,58 @@
 <template>
-  <a-card>
-    logo
+  <a-card style="padding: 40px;">
+    <a-row>
+      <a-col :span="4" >
+        <a-row>
+          <a-col span="24" class="center" >
+            <img class="logo" :src="logoPng" />
+          </a-col>
+          <a-col span="24" class="center">
+            <div class="label" >{{ state.sys.sysLabel}}</div>
+          </a-col>
+        </a-row>
+      </a-col>
+    </a-row>
   </a-card>
 </template>
 
 <script lang="ts" setup >
+import { SysController } from '@/controller'
+import { onMounted, reactive } from 'vue'
 
+const logoPng = require('@/assets/logo.png')
+
+const state = reactive<{
+  sys: IOT.API.SYS.Sys
+}>({
+  sys: {}
+})
+
+const getLogo = async () => {
+  const { data } = await SysController.sysConf()
+  state.sys = data
+}
+
+onMounted(() => {
+  getLogo()
+})
 </script>
 
 <style lang="less" scoped >
+.logo {
+  width: 200px;
+  height: 200px;
+  border-radius: 50%;
+  border: 1px solid #ccc;
+}
+
+.label {
+  font-size: 32px;
+  margin-top: 20px;
+}
+
+.center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
 </style>