更新

package.json

@@ -8,9 +8,8 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@antv/g2plot": "^1.1.6",
+    "@antv/g2plot": "^1.1.7",
     "@stomp/stompjs": "^5.4.4",
-    "stomp": "^0.1.1",
     "axios": "^0.19.2",
     "core-js": "^3.6.5",
     "element-ui": "^2.13.2",
@@ -19,10 +18,11 @@
     "loadsh": "0.0.4",
     "naf-core": "^0.1.2",
     "qrcode": "^1.4.4",
+    "stomp": "^0.1.1",
     "trtc-js-sdk": "^4.4.0",
     "vue": "^2.6.11",
-    "vue-meta": "^2.3.4",
-    "vue-router": "^3.2.0",
+    "vue-meta": "^2.4.0",
+    "vue-router": "^3.3.4",
     "vuex": "^3.4.0",
     "wangeditor": "^3.1.1",
     "xlsx": "^0.16.2"
@@ -36,9 +36,9 @@
     "@vue/eslint-config-prettier": "^6.0.0",
     "babel-eslint": "^10.1.0",
     "eslint": "^6.7.2",
-    "eslint-plugin-prettier": "^3.1.3",
+    "eslint-plugin-prettier": "^3.1.4",
     "eslint-plugin-vue": "^6.2.2",
-    "less": "^3.0.4",
+    "less": "^3.11.3",
     "less-loader": "^5.0.0",
     "prettier": "^1.19.1",
     "script-loader": "^0.7.2",

src/layout/live/detailmetting.vue

@@ -57,7 +57,10 @@
           <el-col :span="6" class="noVideo">
             <el-col :span="24" class="chatList">
               <el-col :span="24" class="list" v-for="(item, index) in dataList" :key="index">
-                <span class="">{{ item.sendname }}:{{ item.content }}</span>
+                <p>
+                  <span :class="item.sendname == user.name ? 'selfColor' : ''">{{ item.sendname }}</span>
+                  <span>{{ item.content }}</span>
+                </p>
               </el-col>
             </el-col>
             <el-col :span="24" class="chatInput">
@@ -354,16 +357,35 @@ export default {
       }
     }
     .noVideo {
+      position: relative;
       min-height: 640px;
-      background-color: #c0c4cc;
+      background-color: #000;
+      border-left: 1px solid #fff;
+      color: #fff;
       .chatList {
-        border: 1px solid #ccc;
-        min-height: 550px;
-        margin: 0 0 10px 0;
-        border-radius: 10px;
-        padding: 5px 10px;
+        height: 598px;
+        padding: 5px 5px 5px 0px;
+        overflow-y: auto;
+        .list {
+          margin: 0 0 10px 0;
+          span:first-child {
+            float: left;
+            width: 17%;
+            text-align: center;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            // font-weight: bold;
+          }
+          span:last-child {
+            float: right;
+            width: 82%;
+          }
+        }
       }
       .chatInput {
+        position: absolute;
+        bottom: 0;
         .el-button {
           width: 100%;
           padding: 13px 0;
@@ -391,4 +413,12 @@ export default {
   min-height: 160px;
   grid-area: 1/1/3/4;
 }
+/deep/.el-textarea__inner {
+  padding: 0 15px;
+  line-height: 20px;
+  border-radius: 0;
+}
+.selfColor {
+  color: #ff0000;
+}
 </style>