Ver código fonte

新增消息组件

asd26269546 2 anos atrás
pai
commit
254fb0b3d0
3 arquivos alterados com 118 adições e 28 exclusões
  1. 1 0
      src/components/header-bar.vue
  2. 86 0
      src/components/notice.vue
  3. 31 28
      src/views/main.vue

+ 1 - 0
src/components/header-bar.vue

@@ -172,6 +172,7 @@ export default {
 		getData() {
 			const v = this
 			v.$get('/api/blade-system/menu/routes').then((res) => {
+				if(res.msg == '暂无承载数据') return
 				res.data.map(item=>{
 					if(item.id === '1619633989348249601') this.menuData = item
 				})

+ 86 - 0
src/components/notice.vue

@@ -0,0 +1,86 @@
+<template>
+    <div class="commons-notice">
+        <el-dialog
+            title="系统公告"
+            :visible.sync="value"
+            width="460px"
+            :before-close="handleClose">
+            <div class="title">
+                {{ data.length == 0 ? '暂无数据' :  data[indexCopy].title}}
+            </div>
+            <div class="text-content" v-if="data.length > 0">
+                {{ data[indexCopy].conetnt}}
+            </div>
+            <span slot="footer" class="dialog-footer">
+                <el-button size="small" :disabled="data.length < 2">上一条</el-button>
+                <el-button size="small" :disabled="data.length == indexCopy">下一条</el-button>
+                <el-button type="primary" size="small" :disabled="data.length == 0">确认已读</el-button>
+                <span class="more" @click="more">查看更多 &gt;</span>
+            </span>
+        </el-dialog>
+    </div>
+</template>
+<script>
+export default {
+    props:{
+        //数据源
+        data: {
+            type: Array,
+            default: () => []
+        },
+        //控制显示隐藏
+        value: {
+            type: Boolean,
+            default: () => true
+        },
+        //展示索引
+        index:{
+            type: Number,
+            default: () => 0
+        },
+    },
+    data(){
+        return {
+            indexCopy:this.index * 1        
+        }
+    },
+    methods:{
+        more(){
+
+        },
+        handleClose(){
+            this.$emit("input", false)
+        },
+
+    },
+}
+</script>
+<style>
+    .commons-notice .el-dialog__footer{
+        text-align: left!important;
+        margin-top: 24px;
+    }
+    .commons-notice .more{
+        color:#0084FF;
+        float: right;
+        cursor: pointer;
+    }
+    .commons-notice .el-dialog__header{
+        background: #EEEEEE;
+    }
+    .commons-notice .el-dialog__title{
+        position: relative;
+        padding-left: 30px;
+        color: #333333;
+        font-weight: bold;
+    }
+    .commons-notice .el-dialog__title::before{
+        content: " ";
+        position: absolute;
+        left: 0;
+        top: 0;
+        width: 20px;
+        height: 20px;
+        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABHNCSVQICAgIfAhkiAAAAftJREFUOE+tlT9MU1EUxr9zWwgBI/D6Boh/EnbCRiImMhBCGqNhcnDQrbgRAyxGBgYICzXYDbrB4OBENIaY4GAMrmqc3DQxMrxWNGkH0Hv83m0ptvS1EHqTm/fuO+f+zjn3nHueoGYoIFju7kGXGeTrJOd1qlwqq30HdJdzCwX7GY9+7QsX/yO4Ph66gHb0+EkiUzAyRklnrcHyugirb4jKYj/YlgUcHOlVgJrxLkLMHJVSEOmLAFV/Vt2j8SzUrsh0/ncodEDnmec9BswsYV1Vu1RD6+842zmvUR6vkRcAm0Y+vxR6Ku7MVv3bMFir65nVT/gZDNNgBw1+oM7ACe9DTy0e4GHwQnS5uxedbRs8s1t1w1S7I9O5cRfJU/8j9Ybq6ll9ieLhfdFM7w1IfDsyAacFAkXonySB3gokNhuZhNMDGcLfNIGJXWZ3pDVA+z4EfiXwaouA384GzDApEpEUlzXrgI1Dhn7B4cEITOwCYob1aK40iCYMuVlS1BLAY0GMz8ssWxMNdElpVjaaJ+RZCaJ3GbIXASyXTdPC1udAcK8E8TcJvNO4sJtePfsa/bmbDvIj8QrGTDS8ei6QsDkk/Hl2mpm6zUH0bSliGaU8bBLHQ7XA832CXLDomsORxLUvgDfGTJ2pfcGuc1+6qn1VoK1ssBXoOX8B/wDYqv5bje949AAAAABJRU5ErkJggg==);
+    }
+</style>

+ 31 - 28
src/views/main.vue

@@ -1,7 +1,7 @@
 <template>
   <div id="main" class="main">
 	<header-bar></header-bar>
-	<img src="/file/2023-02/08/17fa5541-541e-4ac2-a3d5-ff0eb88652f7.jpg " alt="">
+	<notice :data="[{title:'123',content:'434'}]" v-model="open"></notice>
 	<!-- <el-table
 		:data="tableData"
 		style="width: 100%;margin;top:200px"
@@ -93,6 +93,7 @@
 import leftMneu from '@/components/left-menu'
 import { registerMicroApps, start } from 'qiankun'
 import headerBar from '@/components/header-bar'
+import notice from '@/components/notice'
 import { getAll } from '@/libs/micros'
 import router from '../router'
 import store from '../store'
@@ -102,15 +103,15 @@ state.router = router
 const isTest = window.location.host == '36.134.91.96:10003'
 const isServe = process.env.NODE_ENV === "development"
 registerMicroApps([
-	{
-		name: 'app-vue-hash',
-		entry: 'http://localhost:8081',
-		container: '#appContainer',
-		activeRule: '/main/app-vue-hash',
-		props:{
+	// {
+	// 	name: 'app-vue-hash',
+	// 	entry: 'http://localhost:8081',
+	// 	container: '#appContainer',
+	// 	activeRule: '/main/app-vue-hash',
+	// 	props:{
 			
-		},
-	},
+	// 	},
+	// },
 	{
 		name: 'fjhxCloudVue',
 		entry: isServe ?  
@@ -122,36 +123,38 @@ registerMicroApps([
 			data:state,
 		},
 	},
-	{
-		name: 'iotPlatformRoom',
-		entry: 'http://localhost:1888',
-		container: '#appContainer',
-		activeRule: '/main/iotPlatformRoom',
-		props:{
-			data:state,
-		},
-	},
-	{
-		name: 'canvas',
-		entry: 'http://localhost:8080',
-		container: '#appContainer',
-		activeRule: '/main/canvas',
-		props:{
-			data:getAll()
-		},
-	},
+	// {
+	// 	name: 'iotPlatformRoom',
+	// 	entry: 'http://localhost:1888',
+	// 	container: '#appContainer',
+	// 	activeRule: '/main/iotPlatformRoom',
+	// 	props:{
+	// 		data:state,
+	// 	},
+	// },
+	// {
+	// 	name: 'canvas',
+	// 	entry: 'http://localhost:8080',
+	// 	container: '#appContainer',
+	// 	activeRule: '/main/canvas',
+	// 	props:{
+	// 		data:getAll()
+	// 	},
+	// },
 ]);
 start();
 export default {
 	components:{
 		leftMneu,
-		headerBar
+		headerBar,
+		notice
 	},
 	data() {
 		return {
 			input1: null,
 			tableData:[],
 			bankList:[],
+			open:true,
 		}
 	},
 	computed: {