From fa2bbe82b73ff975f520caf8f9d32b2c98c7bd56 Mon Sep 17 00:00:00 2001
From: Tcsm <1377977403@qq.com>
Date: 星期日, 17 九月 2023 23:49:20 +0800
Subject: [PATCH] 完善成长经历阅历,解决折叠面板文字重叠,自传的新增样式已修改,自传已可以成功修改内容
---
ruoyi-ui/src/views/index.vue | 68 +++++++++++++++++++++-------------
1 files changed, 42 insertions(+), 26 deletions(-)
diff --git a/ruoyi-ui/src/views/index.vue b/ruoyi-ui/src/views/index.vue
index 965fe11..873fdf0 100644
--- a/ruoyi-ui/src/views/index.vue
+++ b/ruoyi-ui/src/views/index.vue
@@ -2,6 +2,11 @@
<div class="app-container">
<div class="image-container">
<img class="bottom-image" src="../assets/images/shouye.png" alt="Bottom Image">
+ <div class="notification-box" :class="{ 'has-new-message': hasNewMessage }">
+ <div class="left-section">娑堟伅閫氱煡</div>
+ <el-button class="right-section " type="text" @click="handleClick">鐐瑰嚮杩涘叆</el-button>
+ <div class="new-message-dot" v-if="hasNewMessage"></div>
+ </div>
</div>
</div>
@@ -15,10 +20,15 @@
dicts: ['sys_normal_disable'],
data(){
return {
-
+ hasNewMessage:false,
};
+ },
+ created() {},
+ methods:{
+ handleClick(){
+ this.$router.push("/shouye/shouye" );
+ }
}
-
};
</script>
@@ -32,35 +42,41 @@
height: 100%;
}
.bottom-image {
- z-index: -1; /* 璁剧疆搴曞眰鍥剧墖鐨勫眰绾т负1 */
+ position: relative;
width: 100%;
height: 100%;
- /*position: absolute;*/
- top: 0;
+ z-index: 1;
}
-.text-box1 {
- position: absolute;
- top: 17.5%;
- left: 47.5%;
- transform: translate(-50%, -50%);
- width: 320px;
-}
-.text-box1 ::placeholder{
- color:#000000;
- font-size: 15px;
- font-family: Microsoft YaHei UI-Light, Microsoft YaHei UI;
-}
-.text-box2 {
+.notification-box {
position: absolute;
- top: 51%;
- left: 80%;
- transform: translate(-50%, -50%);
- width: 345px;
+ top: 500px;
+ left: 150px;
+ display: flex;
+ align-items: center;
+ width: 20%;
+ height: 8%;
+ background-color: rgba(227, 219, 219, 0.51);
+ padding: 10px;
+ /*color: white;*/
+ z-index: 2; /* 璁剧疆閫氱煡妗嗗眰绾т负2锛屾瘮鍥剧墖楂� */
}
-.text-box2 ::placeholder{
- color:#000000;
- font-size: 15px;
- font-family: Microsoft YaHei UI-Light, Microsoft YaHei UI;
+
+.left-section {
+ flex-grow: 1;
+}
+
+.right-section {
+ margin-left: 10px;
+}
+
+.new-message-dot {
+ position: absolute;
+ top: 10px;
+ right: 10px;
+ width: 8px;
+ height: 8px;
+ background-color: red;
+ border-radius: 50%;
}
</style>
--
Gitblit v1.9.1