2

src/views/dashboard/admin/index.vue

@@ -1,4 +1,5 @@
 <template>
+
     <div class="dashboard-editor-container">
         <!--超级管理员10000√ 个人会员1× 政务会员2× 企业会员3× 调研员4×-->
         <div v-if="userType == 10000">
@@ -6,6 +7,7 @@
 
 
 
+
             <el-row :gutter="32">
                 <el-col :xs="24" :sm="24" :lg="24">
                     <div class="topDataBox">
@@ -274,16 +276,19 @@
                 </el-col>
             </el-row>
 
-
+            <!--lj 系统消息开始 -->
             <el-row :gutter="32">
                 <el-col :xs="24" :sm="24" :lg="12">
                     <div class="chartBox">
                         <div class="chartTitle">系统消息</div>
                         <div class="chart-wrapper">
                             <div v-for="item in sys_msg" :key="item.id" class="sys_msg_item">
-                                <div class="sys_msg_class">{{ item.class }}</div>
-                                <div @click="goToDetail(item.id, item.class)" class="sys_msg_title">{{ item.title }}
+                                <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                    truncateTitle(item.title) }}
+                                    <span class="tick">...提交了审核</span>
                                 </div>
+
                                 <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
                             </div>
 
@@ -297,9 +302,13 @@
                             <div class="chartTitle">聊天消息</div>
                             <div class="chart-wrapper">
                                 <div v-for="item in chat_msg" :key="item.id" class="sys_msg_item">
-                                    <div class="sys_msg_class">{{ item.class }}</div>
-                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title">{{ item.content
-                                    }}</div>
+                                    <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                        truncateTitle(item.content) }}
+                                        <span class="tick" v-if="item.class == '群聊'">..收到了一条群消息</span>
+                                        <span class="tick" v-if="item.class == '单聊'">..收到了一条消息</span>
+                                        <span class="tick" v-if="item.class == '话题'">..收到了一条评论</span>
+                                    </div>
                                     <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
                                 </div>
 
@@ -319,8 +328,9 @@
                             <div class="chartTitle">通知投诉</div>
                             <div class="chart-wrapper">
                                 <div v-for="item in notice_msg" :key="item.id" class="sys_msg_item">
-                                    <div class="sys_msg_class">{{ item.class }}</div>
-                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title">{{ item.title }}
+                                    <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                        truncateTitle(item.title) }}
                                     </div>
                                     <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
                                 </div>
@@ -334,6 +344,8 @@
             <div style="height: 20px;" class="noticeTabs">
             </div>
 
+            <!-- 系统消息结束 -->
+
 
         </div>
 
@@ -427,15 +439,19 @@
                 </el-col>
             </el-row>
 
+            <!--lj 系统消息开始 -->
             <el-row :gutter="32">
                 <el-col :xs="24" :sm="24" :lg="12">
                     <div class="chartBox">
                         <div class="chartTitle">系统消息</div>
                         <div class="chart-wrapper">
                             <div v-for="item in sys_msg" :key="item.id" class="sys_msg_item">
-                                <div class="sys_msg_class">{{ item.class }}</div>
-                                <div @click="goToDetail(item.id, item.class)" class="sys_msg_title">{{ item.title }}
+                                <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                    truncateTitle(item.title) }}
+                                    <span class="tick">...提交了审核</span>
                                 </div>
+
                                 <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
                             </div>
 
@@ -449,9 +465,13 @@
                             <div class="chartTitle">聊天消息</div>
                             <div class="chart-wrapper">
                                 <div v-for="item in chat_msg" :key="item.id" class="sys_msg_item">
-                                    <div class="sys_msg_class">{{ item.class }}</div>
-                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title">{{ item.content
-                                    }}</div>
+                                    <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                        truncateTitle(item.content) }}
+                                        <span class="tick" v-if="item.class == '群聊'">..收到了一条群消息</span>
+                                        <span class="tick" v-if="item.class == '单聊'">..收到了一条消息</span>
+                                        <span class="tick" v-if="item.class == '话题'">..收到了一条评论</span>
+                                    </div>
                                     <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
                                 </div>
 
@@ -471,8 +491,9 @@
                             <div class="chartTitle">通知投诉</div>
                             <div class="chart-wrapper">
                                 <div v-for="item in notice_msg" :key="item.id" class="sys_msg_item">
-                                    <div class="sys_msg_class">{{ item.class }}</div>
-                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title">{{ item.title }}
+                                    <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                        truncateTitle(item.title) }}
                                     </div>
                                     <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
                                 </div>
@@ -486,6 +507,8 @@
             <div style="height: 20px;" class="noticeTabs">
             </div>
 
+            <!-- 系统消息结束 -->
+
 
             <!-- <div class="chartBox">
                 <div class="chartTitle">已审核文章</div>
@@ -560,66 +583,19 @@
 
 
 
-            <el-row :gutter="32">
-                <el-col :xs="24" :sm="24" :lg="24">
-                    <div class="topDataBox">
-                        <div class="topDataBoxTitle">
-                            <div class="chatIconBox cibStyle1">
-                                <img src="@/assets/index/top_time.png">
-                            </div>
-                            <div class="topDataBoxTitleText">待审核列表</div>
-                        </div>
-                        <div class="topDataBoxList">
-                            <div class="topDataLi1">
-                                <div class="topDataMain">
-                                    <span @click="goToList(1)">待审核资讯</span>
-                                    <span @click="goToList(1)">{{ articleCount }}</span>
-                                </div>
-                            </div>
-                            <div class="topDataLi2">
-                                <div class="topDataMainCenter">
-                                    <span @click="goToList(2)">待审核商品</span>
-                                    <span @click="goToList(2)">{{ goodsCount }}</span>
-                                </div>
-                                <div class="topDataMainCenter">
-                                    <span @click="goToList(3)">待审核书刊音像</span>
-                                    <span @click="goToList(3)">{{ bookCount }}</span>
-                                </div>
-                            </div>
-                            <div class="topDataLi3">
-                                <div class="topDataMainCenter">
-                                    <span @click="goToList(4)">待审核招聘</span>
-                                    <span @click="goToList(4)">{{ jobRecruitingCount }}</span>
-                                </div>
-                                <div class="topDataMainCenter">
-                                    <span @click="goToList(5)">待审核求职</span>
-                                    <span @click="goToList(5)">{{ jobHuntingCount }}</span>
-                                </div>
-                            </div>
-                            <div class="topDataLi4">
-                                <!-- <div class="topDataMain">
-                                    <span @click="goToList(6)">待审核行政通知</span>
-                                    <span @click="goToList(6)">{{noticeCount}}</span>
-                                </div> -->
-                                <div class="topDataMain">
-                                    <span @click="goToList(7)">待审核行政投诉</span>
-                                    <span @click="goToList(7)">{{ complaintCount }}</span>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </el-col>
-            </el-row>
-
+            <!--lj 系统消息开始 -->
             <el-row :gutter="32">
                 <el-col :xs="24" :sm="24" :lg="12">
                     <div class="chartBox">
                         <div class="chartTitle">系统消息</div>
                         <div class="chart-wrapper">
                             <div v-for="item in sys_msg" :key="item.id" class="sys_msg_item">
-                                <div class="sys_msg_class">{{ item.class }}</div>
-                                <div @click="goToDetail(item.id, item.class)" class="sys_msg_title">{{ item.title }}
+                                <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                    truncateTitle(item.title) }}
+                                    <span class="tick">...提交了审核</span>
                                 </div>
+
                                 <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
                             </div>
 
@@ -633,9 +609,13 @@
                             <div class="chartTitle">聊天消息</div>
                             <div class="chart-wrapper">
                                 <div v-for="item in chat_msg" :key="item.id" class="sys_msg_item">
-                                    <div class="sys_msg_class">{{ item.class }}</div>
-                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title">{{ item.content
-                                        }}</div>
+                                    <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                        truncateTitle(item.content) }}
+                                        <span class="tick" v-if="item.class == '群聊'">..收到了一条群消息</span>
+                                        <span class="tick" v-if="item.class == '单聊'">..收到了一条消息</span>
+                                        <span class="tick" v-if="item.class == '话题'">..收到了一条评论</span>
+                                    </div>
                                     <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
                                 </div>
 
@@ -647,54 +627,32 @@
             <div style="height: 20px;" class="noticeTabs">
             </div>
 
-
-
             <el-row :gutter="32">
-                <el-col :xs="24" :sm="24" :lg="6">
-                    <div class="topWindowBox">
-                        <div class="twbTitle">
-                            <div class="twbIconbg bg3">
-                                <img src="@/assets/index/topIcon3.png" />
-                            </div>
-                            资讯发布数量
-                        </div>
-                        <div class="twbNumber">{{ allWebsiteCount }}</div>
-                    </div>
-                </el-col>
-                <el-col :xs="24" :sm="24" :lg="6">
-                    <div class="topWindowBox">
-                        <div class="twbTitle">
-                            <div class="twbIconbg bg4">
-                                <img src="@/assets/index/topIcon4.png" />
-                            </div>
-                            商品发布数量
-                        </div>
-                        <div class="twbNumber">{{ allGoodsCount }}</div>
-                    </div>
-                </el-col>
-                <el-col :xs="24" :sm="24" :lg="6">
-                    <div class="topWindowBox">
-                        <div class="twbTitle">
-                            <div class="twbIconbg bg5">
-                                <img src="@/assets/index/topIcon5.png" />
-                            </div>
-                            书刊音像发布数量
-                        </div>
-                        <div class="twbNumber">{{ allBookCount }}</div>
-                    </div>
-                </el-col>
-                <el-col :xs="24" :sm="24" :lg="6">
-                    <div class="topWindowBox">
-                        <div class="twbTitle">
-                            <div class="twbIconbg bg6">
-                                <img src="@/assets/index/topIcon6.png" />
+                <el-col :xs="24" :sm="24" :lg="12">
+                    <div class="chartBox">
+
+                        <div class="chartBox">
+                            <div class="chartTitle">通知投诉</div>
+                            <div class="chart-wrapper">
+                                <div v-for="item in notice_msg" :key="item.id" class="sys_msg_item">
+                                    <div class="sys_msg_class" :class="item.class">{{ item.class }}</div>
+                                    <div @click="goToDetail(item.id, item.class)" class="sys_msg_title"> {{
+                                        truncateTitle(item.title) }}
+                                    </div>
+                                    <div class="sys_msg_time">{{ item.formatted_updated_at }}</div>
+                                </div>
                             </div>
-                            招聘发布数量
                         </div>
-                        <div class="twbNumber">{{ allJobRecruitingCount }}</div>
                     </div>
                 </el-col>
             </el-row>
+
+
+            <div style="height: 20px;" class="noticeTabs">
+            </div>
+
+            <!-- 系统消息结束 -->
+
         </div>
 
         <!--超级管理员10000× 个人会员1× 政务会员2× 企业会员3× 调研员4√-->
@@ -830,6 +788,7 @@ export default {
             sys_msg: {},//系统消息
             chat_msg: {},
             notice_msg: {},
+            originUrl: '', //网站地址
 
             //折线图
             chatType: '1', //用户选择的哪个数据
@@ -853,6 +812,9 @@ export default {
         }
     },
     methods: {
+        truncateTitle(title) {
+            return title.length > 22 ? title.substring(0, 22) + '...' : title;
+        },
         handleClick(row) {
             //跳转
             this.$router.push({
@@ -881,6 +843,7 @@ export default {
                     this.chat_msg = res.data.chat_msg;
                     //通知消息
                     this.notice_msg = res.data.notice_msg;
+                    this.originUrl = res.data.originUrl;
                     //待审核数据
                     this.articleCount = res.data.apply.article;
                     this.adCount = res.data.apply.order;
@@ -946,7 +909,12 @@ export default {
                     this.$router.push({ path: '/addNcomplaint', query: { id: id } });
                     break;
                 case '话题':
-                    this.$router.push({ path: '/creatTopic', query: { id: id } });
+                    // this.$router.push({ path: '/creatTopic', query: { id: id } });
+                    //判断是否有http，加上
+                    if (this.originUrl.indexOf('http') == -1) {
+                        this.originUrl = 'http://' + this.originUrl;
+                    }
+                    window.open(this.originUrl + '/topic/' + id, '_blank');
                     break;
                 case '单聊':
                     this.$router.push({ path: '/hall', query: { id: id } });
@@ -1216,7 +1184,7 @@ export default {
 
 .chartBox {
     width: 100%;
-    height: 640px;
+    height: 600px;
     border-radius: 20px;
     overflow: hidden;
     background-color: @bgColor;
@@ -1314,16 +1282,122 @@ export default {
 
 .sys_msg_class {
     font-weight: bold;
-    width: 20%;
-    /* Adjust based on your preference */
+    width: 6%;
+    border-radius: 5%;
+    display: flex;
+    align-items: center;
+    padding: 2px;
+    justify-content: center;
+    margin-right: 2px;
+    font-size: 14px;
+    line-height: 12px;
+    text-align: center;
+    vertical-align: middle;
+    border: 1px solid transparent; // 初始化边框，颜色由具体类决定
+}
+
+// 资讯
+.sys_msg_class.资讯 {
+    background-color: #66BFBF; // 资讯的背景色
+    border-color: #006666; // 资讯的边框色
+    color: #006666;
+}
+
+// 商品
+.sys_msg_class.商品 {
+    background-color: #FFCC99; // 商品的背景色
+    border-color: #FF9933; // 商品的边框色
+    color: #FF9933;
+}
+
+// 书刊
+.sys_msg_class.书刊 {
+    background-color: #FFCCCC; // 书刊的背景色
+    border-color: #FF6666; // 书刊的边框色
+    color: #FF6666;
+}
+
+// 招聘
+.sys_msg_class.招聘 {
+    background-color: #99CCFF; // 招聘的背景色
+    border-color: #3366CC; // 招聘的边框色
+    color: #3366CC;
+}
+
+// 求职
+.sys_msg_class.求职 {
+    background-color: #CCFFCC; // 求职的背景色
+    border-color: #669966; // 求职的边框色
+    color: #669966;
+}
+
+// 通知
+.sys_msg_class.通知 {
+    background-color: #FFCCFF; // 通知的背景色
+    border-color: #CC66CC; // 通知的边框色
+    color: #CC66CC;
+}
+
+// 投诉
+.sys_msg_class.投诉 {
+    background-color: #FFCCCC; // 投诉的背景色
+    border-color: #CC3333; // 投诉的边框色
+    color: #CC3333;
+}
+
+// 话题
+.sys_msg_class.话题 {
+    background-color: #FFFFCC; // 话题的背景色
+    border-color: #CCCC66; // 话题的边框色
+    color: #CCCC66;
+}
+
+//公告
+.sys_msg_class.公告 {
+    background-color: #CCFFFF; // 公告的背景色
+    border-color: #3399FF; // 公告的边框色
+    color: #3399FF;
+}
+
+// 单聊
+.sys_msg_class.单聊 {
+    background-color: #CCFFFF; // 单聊的背景色
+    border-color: #66CCCC; // 单聊的边框色
+    color: #66CCCC;
+}
+
+// 群聊
+.sys_msg_class.群聊 {
+    background-color: #FFCCFF; // 群聊的背景色
+    border-color: #CC66CC; // 群聊的边框色
+    color: #CC66CC;
+}
+
+// 通用样式，设置边框宽度和样式
+.sys_msg_class {
+    border: 1px solid transparent; // 初始化边框，颜色由具体类决定
+}
+
+// 根据 class 区分不同的边框颜色
+.sys_msg_class.zhaopin {
+    background-color: #7f93f7; // 通知的背景色
+    border-color: #2541cc; // 通知的边框色
+    color: #2541cc;
+}
+
+
+.tick {
+    width: 14%;
+    color: #797e96;
+    font-size: 14px;
 }
 
 .sys_msg_title {
-    width: 60%;
+    width: 80%;
     /* Adjust based on your preference */
     white-space: nowrap;
     overflow: hidden;
-    text-overflow: ellipsis;
+    // text-overflow: ellipsis;
     //点击图标
     cursor: pointer;
 }