feat: 添加用户信息

src/api/business/chat.js

@@ -22,4 +22,19 @@ export function sendChatMsg(params) {
     data: params
   })
 }
+export function findChatUserInfo(params) {
+  return request({
+    url: '/sysIM/findChatUserInfo',
+    method: 'post',
+    data: params
+  })
+}
+
+export function setChatUserRemark(params) {
+  return request({
+    url: '/sysIM/setChatUserRemark',
+    method: 'post',
+    data: params
+  })
+}
 

src/views/customerService/components/chatUserInfo.vue

+<template>
+  <div class="component-chatUserInfo">
+    <div class="info flex">
+      <div class="info-title">机器人昵称：</div>
+      <div class="info-content">{{ chatUserInfo.aiAssistant && chatUserInfo.aiAssistant.name || '-' }}</div>
+    </div>
+    <div class="info flex">
+      <div class="info-title">简介：</div>
+      <div class="info-content">{{ chatUserInfo.aiAssistant && chatUserInfo.aiAssistant.profile || '-' }}</div>
+    </div>
+    <el-divider />
+
+    <div class="info flex">
+      <div class="info-title">用户昵称：</div>
+      <div class="info-content">{{ chatUserInfo.user && chatUserInfo.user.nickname || '-' }}</div>
+    </div>
+    <div class="info flex">
+      <div class="info-title">手机号：</div>
+      <div class="info-content">{{ chatUserInfo.user && chatUserInfo.user.mobile || '-' }}</div>
+    </div>
+    <div class="info flex">
+      <div class="info-title">备注：</div>
+      <el-input
+        v-model="chatUserInfo.user.remark"
+        :autosize="{ minRows: 4, maxRows: 4}"
+        maxlength="30"
+        type="textarea"
+        show-word-limit
+        style="border: 1px solid #DCDFE6; border-radius: 4px;margin: 0;"
+        placeholder="请输入备注"
+        @blur="handleBlur"/>
+    </div>
+
+  </div>
+
+</template>
+
+<script>
+import { setChatUserRemark } from '@/api/business/chat'
+export default {
+  name: 'ChatUserInfo',
+  props: {
+    chatUserInfo: {
+      type: Object,
+      required: true
+    }
+  },
+  data() {
+    return {
+      preRemark: this.chatUserInfo.user && this.chatUserInfo.user.remark || ''
+    }
+  },
+  methods: {
+    handleBlur() {
+      if (this.chatUserInfo.user.remark && this.chatUserInfo.user.remark !== this.preRemark) {
+        const params = {
+          user: this.chatUserInfo.user.id,
+          remark: this.chatUserInfo.user.remark
+        }
+        setChatUserRemark(params).then(response => {
+          this.preRemark = this.chatUserInfo.user.remark
+        }).catch(response => {
+          this.closeLoading()
+          this.$notify.error({
+            title: '失败',
+            message: response.data.errmsg || '请求失败'
+          })
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.component-chatUserInfo {
+  display: flex;
+  flex-direction: column;
+
+  .info {
+    font-size: 14px;
+    display: flex;
+    align-items: start;
+    line-height: 20px;
+    margin-top: 10px;
+
+    .info-title {
+      width: 90px;
+      text-align: end;
+      font-weight: bold;
+    }
+
+    .info-content {
+      flex: 1;
+    }
+  }
+}
+
+</style>