Просмотр исходного кода

同步企微聊天、企微员工代码

Long 2 месяцев назад
Родитель
Сommit
023c0755c9
4 измененных файлов с 485 добавлено и 150 удалено
  1. 2 2
      src/main.js
  2. 208 135
      src/views/company/companyUser/index.vue
  3. 35 13
      src/views/qw/qwChat/qq.vue
  4. 240 0
      src/views/qw/qwChat/userDetail/index.vue

+ 2 - 2
src/main.js

@@ -51,8 +51,8 @@ Vue.prototype.callMobile = callMobile
 import LemonIMUI from '@/components/LemonUI';
 Vue.use(LemonIMUI);
 
-// import qwIm  from "@/utils/webSocket";
-// Vue.prototype.qwIm = qwIm
+import qwIm  from "@/utils/webSocket";
+Vue.prototype.qwIm = qwIm
 
 // Vue.prototype.callOffMobile = callOffMobile
 // Vue.prototype.getSipAccount = getSipAccount

+ 208 - 135
src/views/company/companyUser/index.vue

@@ -12,9 +12,9 @@
       </el-col>
       <!--用户数据-->
       <el-col :span="20" :xs="24">
-        <el-form  :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
-          <el-form-item label="员工姓名" prop="nickName">
-            <el-input v-model="queryParams.nickName" placeholder="请输入员工姓名" clearable size="small" style="width: 240px" @keyup.enter.native="handleQuery" />
+        <el-form  :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
+          <el-form-item label="员工后台昵称" prop="nickName">
+            <el-input v-model="queryParams.nickName" placeholder="请输入员工后台昵称" clearable size="small" style="width: 240px" @keyup.enter.native="handleQuery" />
           </el-form-item>
           <el-form-item label="手机号码" prop="phonenumber">
             <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable size="small" style="width: 240px" @keyup.enter.native="handleQuery" />
@@ -29,6 +29,7 @@
               <el-option v-for="dict in qwStatusOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
             </el-select>
           </el-form-item>
+
           <el-form-item label="创建时间">
             <el-date-picker v-model="dateRange" size="small" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
           </el-form-item>
@@ -55,13 +56,22 @@
             <el-button  plain type="warning" icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['company:user:export']">导出</el-button>
           </el-col>
           <el-col :span="1.5">
-           <el-button
-             type="primary"
-             plain
-             size="mini"
-             @click="synOpen=true"
-             v-hasPermi="['qw:user:sync']"
-           >同步企微员工和部门</el-button>
+            <el-button
+              type="primary"
+              plain
+              size="mini"
+              @click="synOpen=true"
+              v-hasPermi="['qw:user:sync']"
+            >同步企微员工和部门</el-button>
+          </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              plain
+              size="mini"
+              @click="synNameOpen=true"
+              v-hasPermi="['qw:user:sync']"
+            >同步企微员工名称</el-button>
           </el-col>
           <el-col :span="1.5">
             <el-button
@@ -78,8 +88,8 @@
         <el-table  height="500" border v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
           <el-table-column type="selection" width="50" align="center" />
           <el-table-column label="ID" align="center" prop="userId" :show-overflow-tooltip="true" />
-          <el-table-column label="员工号" align="center" prop="userName" :show-overflow-tooltip="true" />
-          <el-table-column label="员工姓名" align="center" prop="nickName" :show-overflow-tooltip="true" />
+          <el-table-column label="员工后台账号" align="center" prop="userName" :show-overflow-tooltip="true" width="100" />
+          <el-table-column label="员工后台昵称" align="center" prop="nickName" :show-overflow-tooltip="true" 员工后台  width="100"/>
           <el-table-column label="部门" align="center" prop="deptName" :show-overflow-tooltip="true" />
           <el-table-column label="手机号码" align="center" prop="phonenumber" width="120" />
           <el-table-column label="状态" align="center">
@@ -92,6 +102,8 @@
               <dict-tag :options="qwStatusOptions" :value="scope.row.qwStatus"/>
             </template>
           </el-table-column>
+          <el-table-column label="区域" align="center" prop="addressId">
+          </el-table-column>
           <el-table-column label="创建时间"  sortable align="center" prop="createTime" width="160">
             <template slot-scope="scope">
               <span>{{ parseTime(scope.row.createTime) }}</span>
@@ -99,14 +111,6 @@
           </el-table-column>
           <el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
             <template slot-scope="scope">
-              <el-button
-                size="mini"
-                type="text"
-                icon="el-icon-edit"
-                @click="gwBind(scope.row)"
-                v-hasPermi="['qw:user:bind']"
-              >绑定个微</el-button>
-
               <el-button
                 v-if="scope.row.qwStatus == 0"
                 size="mini"
@@ -126,7 +130,7 @@
               >查或换绑企微</el-button>
 
               <el-button v-if="scope.row.userType !== '00'" size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['company:user:edit']">修改</el-button>
-              <el-button v-if="scope.row.userType !== '00'" size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['company:user:remove']">删除</el-button>
+              <!--<el-button v-if="scope.row.userType !== '00'" size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['company:user:remove']">删除</el-button>-->
               <el-button size="mini" type="text" icon="el-icon-key" @click="handleResetPwd(scope.row)" v-hasPermi="['company:user:resetPwd']">重置密码</el-button>
             </template>
           </el-table-column>
@@ -162,27 +166,27 @@
         <el-button @click="qwCancel">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog title="绑定个微账号" :visible.sync="gwOpen" width="800px" append-to-body>
-      <el-form ref="gwForm" :model="gwForm" label-width="80px">
-        <el-form-item label="查询"  prop="companyUserId">
-          <el-button type="primary" icon="el-icon-search"  @click="selectGwUser()"  size="mini">搜索账号</el-button>
-        </el-form-item>
-        <el-form-item label="个微账号"  prop="companyUserId">
 
-          <el-tag
-            style="margin-left: 5px"
-            size="medium"
-            :key="id"
-            v-for="id in qwUser"
-            closable
-            :disable-transitions="false"
-            @close="handleClosegroupUser(id)">
-            <span v-for="list in qwUserList" :key="list.qwUserId" v-if="list.id==id">{{list.qwUserName}}({{list.corpName}})
-            </span>
-          </el-tag>
+    <el-dialog title="选择企微主体" :visible.sync="synNameOpen" width="800px" append-to-body>
+
+      <el-form   label-width="80px">
+        <el-form-item label="企微公司" prop="corpId">
+          <el-select v-model="synNameform.corpId" placeholder="企微公司"  >
+            <el-option
+              v-for="dict in myQwCompanyList"
+              :key="dict.dictValue"
+              :label="dict.dictLabel"
+              :value="dict.dictValue"
+            />
+          </el-select>
         </el-form-item>
       </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="synNameSubmitForm">确 定</el-button>
+        <el-button @click="synNameOpen=false">取 消</el-button>
+      </div>
     </el-dialog>
+
     <el-dialog title="选择企微主体" :visible.sync="synOpen" width="800px" append-to-body>
 
       <el-form   label-width="80px">
@@ -196,8 +200,6 @@
             />
           </el-select>
         </el-form-item>
-
-
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="synSubmitForm">确 定</el-button>
@@ -210,7 +212,7 @@
         <el-row>
           <el-col :span="12">
             <el-form-item label="员工姓名" prop="nickName">
-              <el-input v-model="form.nickName" placeholder="请输入员工姓名" />
+              <el-input v-model="form.nickName" placeholder="请输入员工后台昵称搜索" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
@@ -243,6 +245,7 @@
             </el-form-item>
           </el-col>
         </el-row>
+
         <el-row>
           <el-col :span="12">
             <el-form-item label="员工性别">
@@ -277,13 +280,27 @@
           </el-col>
 
         </el-row>
-         <el-row>
+        <el-row>
           <el-col :span="12">
             <el-form-item label="身份证号">
               <el-input v-model="form.idCard" placeholder="请输入身份证号" maxlength="18" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
+            <el-form-item label="销售区域" prop="addressId">
+              <el-select v-model="form.addressId"  filterable placeholder="请选择所属销售的区域" style="width: 200px;">
+                <el-option
+                  v-for="item in citysAreaList"
+                  :key="item.cityId"
+                  :label="item.cityName"
+                  :value="item.cityId"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="24">
             <el-form-item label="数据权限">
               <el-radio-group v-model="form.userType">
                 <el-radio v-for="dict in userTypeOptions" :key="dict.dictValue" :label="dict.dictValue">{{dict.dictLabel}}</el-radio>
@@ -307,30 +324,37 @@
           </el-col>
 
         </el-row>
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="销售区域" prop="addressId">
-              <el-select v-model="form.addressId"  filterable placeholder="请选择所属销售的区域" style="width: 200px;">
-                <el-option
-                  v-for="item in citysAreaList"
-                  :key="item.cityId"
-                  :label="item.cityName"
-                  :value="item.cityId"
-                ></el-option>
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
-    <el-dialog :title="user.title" :visible.sync="user.open" width="800px" append-to-body>
+
+    <!--    &lt;!&ndash; 用户导入对话框 &ndash;&gt;-->
+    <!--    <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>-->
+    <!--      <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>-->
+    <!--        <i class="el-icon-upload"></i>-->
+    <!--        <div class="el-upload__text">-->
+    <!--          将文件拖到此处,或-->
+    <!--          <em>点击上传</em>-->
+    <!--        </div>-->
+    <!--        <div class="el-upload__tip" slot="tip">-->
+    <!--          <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据-->
+    <!--          <el-link type="info" style="font-size:12px" @click="importTemplate">下载模板</el-link>-->
+    <!--        </div>-->
+    <!--        <div class="el-upload__tip" style="color:red" slot="tip">提示:仅允许导入“xls”或“xlsx”格式文件!</div>-->
+    <!--      </el-upload>-->
+    <!--      <div slot="footer" class="dialog-footer">-->
+    <!--        <el-button type="primary" @click="submitFileForm">确 定</el-button>-->
+    <!--        <el-button @click="upload.open = false">取 消</el-button>-->
+    <!--      </div>-->
+    <!--    </el-dialog>-->
+    <el-dialog :title="user.title" :visible.sync="user.open" width="1000px" append-to-body>
       <selectUser ref="selectUser" @bindQwUser="bindQwUser"></selectUser>
     </el-dialog>
-    <gw-query-list-dialog :visible="gwSearchOpen"/>
+
+
     <el-dialog :title="companyUserArea.title" :visible.sync="companyUserArea.open" width="300px" append-to-body>
       <el-select v-model="addressId"  filterable placeholder="请选择所属销售的区域" style="width: 200px;">
         <el-option
@@ -366,24 +390,15 @@ import { getToken } from "@/utils/auth";
 import { treeselect } from "@/api/company/companyDept";
 import Treeselect from "@riophae/vue-treeselect";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
-import {bindQwUser, getQwUserList, addQwUser, getQwUser, getQwUserByIds} from '@/api/qw/user';
+import {bindQwUser, getQwUserList, addQwUser, getQwUser, getQwUserByIds,addQwUserName} from '@/api/qw/user';
 import { syncDept } from '@/api/qw/qwDept';
 import { getMyQwUserList,getMyQwCompanyList } from "@/api/qw/user";
 import  selectUser  from "@/views/company/components/selectQwUser.vue";
-import {listWxUser} from "@/api/wxUser/wxUser";
-import GwQueryListDialog from "@/views/company/companyUser/gwQueryListDialog/gwQueryListDialog.vue";
 export default {
   name: "User",
-  components: {GwQueryListDialog, Treeselect ,selectUser},
+  components: { Treeselect ,selectUser},
   data() {
     return {
-      companyUserArea:{
-        open:false,
-        title:"分配区域",
-      },
-      //选择的区域
-      addressId:null,
-      citysAreaList:[],
       // 遮罩层
       loading: false,
       qwUserList:[],
@@ -398,6 +413,8 @@ export default {
       ids: [],
       synform:{corpId:null},
       synOpen:false,
+      synNameform:{corpId:null},
+      synNameOpen:false,
       // 非单个禁用
       single: true,
       // 非多个禁用
@@ -415,9 +432,6 @@ export default {
       // 是否显示弹出层
       open: false,
       qwOpen:false,
-      gwOpen: false,
-      gwSearchOpen: false,
-      wxUserList: [],
       // 部门名称
       deptName: undefined,
       // 日期范围
@@ -438,8 +452,14 @@ export default {
         id:null,
         companyUserId:null,
       },
-      gwForm: {
+      companyUserArea:{
+        open:false,
+        title:"分配区域",
       },
+      //选择的区域
+      addressId:null,
+
+      citysAreaList:[],
       // 表单参数
       form: {},
       defaultProps: {
@@ -483,6 +503,9 @@ export default {
         deptId: [
           { required: true, message: "归属部门不能为空", trigger: "blur" },
         ],
+        addressId: [
+          { required: true, message: "销售所属区域不能为空", trigger: "blur" },
+        ],
         password: [
           { required: true, message: "员工密码不能为空", trigger: "blur" },
           {
@@ -491,9 +514,6 @@ export default {
             trigger: ["blur", "change"],
           }
         ],
-        addressId: [
-          { required: true, message: "销售所属区域不能为空", trigger: "blur" },
-        ],
         idCard: [
           { required: true, message: "身份证号不能为空", trigger: "blur" },
         ],
@@ -530,9 +550,6 @@ export default {
     },
   },
   created() {
-    getCitysAreaList().then(res=>{
-      this.citysAreaList=res.data;
-    })
     this.getList();
     this.getTreeselect();
     this.getDicts("sys_normal_disable").then((response) => {
@@ -542,46 +559,16 @@ export default {
       this.sexOptions = response.data;
     });
     this.getDicts("sys_qw_user_status").then(response => {
-          this.qwStatusOptions = response.data;
+      this.qwStatusOptions = response.data;
     });
-
+    getCitysAreaList().then(res=>{
+      this.citysAreaList=res.data;
+    })
     getMyQwCompanyList().then(response => {
       this.myQwCompanyList = response.data;
     });
   },
   methods: {
-    submitFormArea(address){
-      const uIds = this.ids;
-
-      if (address == null){
-        this.$message.error("请选择地区");
-        return;
-      }
-      updateCompanyUserAreaList({userIds:uIds,addressId:address}).then(res=>{
-        this.companyUserArea.open=false;
-        this.getList();
-        this.msgSuccess("操作成功");
-
-      })
-
-    },
-    cancelArea(){
-      this.companyUserArea.open=false;
-      this.addressId=null;
-    },
-    handerCompanyUserAreaList(){
-      this.companyUserArea.open=true;
-    },
-    // 绑定个微
-    gwBind(row){
-      this.gwOpen = true
-    },
-    // 查询个微账号
-    selectGwUser(){
-      listWxUser().then(res=>{
-        this.gwSearchOpen = true;
-      })
-    },
     /** 查询用户列表 */
     getList() {
       this.loading = true;
@@ -590,6 +577,7 @@ export default {
           this.userList = response.rows;
           this.total = response.total;
           this.loading = false;
+          console.log(" this.userList ", this.userList )
         }
       );
     },
@@ -645,10 +633,34 @@ export default {
       this.open = false;
       this.reset();
     },
+
+    submitFormArea(address){
+      const uIds = this.ids;
+
+      if (address == null){
+        this.$message.error("请选择地区");
+        return;
+      }
+      updateCompanyUserAreaList({userIds:uIds,addressId:address}).then(res=>{
+        this.companyUserArea.open=false;
+        this.getList();
+        this.msgSuccess("操作成功");
+
+      })
+
+    },
+    cancelArea(){
+      this.companyUserArea.open=false;
+      this.addressId=null;
+    },
     qwCancel() {
       this.qwOpen = false;
       this.qwUserId=null;
     },
+
+    handerCompanyUserAreaList(){
+      this.companyUserArea.open=true;
+    },
     // 表单重置
     reset() {
       this.form = {
@@ -704,15 +716,15 @@ export default {
       this.qwForm.companyUserId=row.userId
       getUser(row.userId).then((response) => {
         if(response.data.qwUserId!=null){
-           this.qwUser=((response.data.qwUserId).split(",").map(Number))
+          this.qwUser=((response.data.qwUserId).split(",").map(Number))
           getQwUserByIds(this.qwUser).then(res => {
             this.qwUserList=res.data;
           })
-           // this.qwUser.forEach(item => {
-           //     getQwUser(item).then(response => {
-           //         this.qwUserList.push(response.data);
-           //     });
-           // });
+          // this.qwUser.forEach(item => {
+          //     getQwUser(item).then(response => {
+          //         this.qwUserList.push(response.data);
+          //     });
+          // });
         }
         this.qwOpen = true;
       });
@@ -723,13 +735,13 @@ export default {
       this.user.open=false;
 
 
-        if (!this.qwUserList.some(item => item.id == row.id)) {
-          this.qwUserList.push(row)
-        }
-        console.log(this.qwUserList)
-        if (!this.qwUser.some(item => item == row.id)) {
-          this.qwUser.push(row.id);
-        }
+      if (!this.qwUserList.some(item => item.id == row.id)) {
+        this.qwUserList.push(row)
+      }
+
+      if (!this.qwUser.some(item => item == row.id)) {
+        this.qwUser.push(row.id);
+      }
 
     },
     /** 修改按钮操作 */
@@ -753,9 +765,18 @@ export default {
       this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
-        inputPattern: /^(?=.*[A-Za-z])(?=.*\d)(?=.*[^A-Za-z0-9]).{8,20}$/,
-        inputErrorMessage: "密码格式错误:需包含字母、数字和特殊字符,长度为 8-20 位",
-        inputPlaceholder: "8-20 位,包含字母、数字和特殊字符"
+        inputPlaceholder: "8-20 位,包含字母、数字和特殊字符",
+        inputValidator: (value) => {
+          const pattern = /^(?=.*[A-Za-z])(?=.*\d)(?=.*[^A-Za-z0-9]).{8,20}/;
+          const hasChinese = /[\u4e00-\u9fa5]/.test(value);
+          const hasFullWidth = /[!-~]/.test(value);
+
+          if (hasChinese) return '不能包含中文字符';
+          if (hasFullWidth) return '不能包含全角符号,请使用英文输入法';
+          if (!pattern.test(value)) return '密码格式错误:需包含字母、数字和英文特殊字符,长度为 8-20 位';
+
+          return true;
+        }
       })
         .then(({ value }) => {
           resetUserPwd(row.userId, value).then((response) => {
@@ -791,11 +812,21 @@ export default {
       });
     },
     /**
-    * 同步企业微信员工
-    */
+     * 同步企业微信员工
+     */
     synSubmitForm() {
+      this.synOpen=false;
       this.loading=true;
-      this.msgSuccess("同步中.....请等待.....");
+      this.msgSuccess("");
+
+      let loadingRock = this.$loading({
+        lock: true,
+        text: '同步中.....请等待.....请不要重复点击!!',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      });
+
+
       addQwUser(this.synform.corpId).then(response => {
         this.msgSuccess("同步成功");
         this.getList();
@@ -803,11 +834,38 @@ export default {
       }).finally(()=>{
         this.loading=false;
         this.synOpen=false;
+        loadingRock.close();
       });
     },
+
+    synNameSubmitForm() {
+      this.synNameOpen=false;
+      this.loading=true;
+      this.msgSuccess("");
+
+      let loadingRock = this.$loading({
+        lock: true,
+        text: '同步中.....请等待.....请不要重复点击!!',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      });
+
+
+      addQwUserName(this.synNameform.corpId).then(response => {
+        this.msgSuccess("同步成功");
+        this.getList();
+        this.synNameOpen=false;
+      }).finally(()=>{
+        this.loading=false;
+        this.synNameOpen=false;
+        loadingRock.close();
+      });
+    },
+
+
     /**
-    * 同步企业微信部门
-    */
+     * 同步企业微信部门
+     */
     qwSyncDept(){
       syncDept().then(response => {
         this.msgSuccess("同步成功");
@@ -817,7 +875,14 @@ export default {
       })
     },
     qwSubmitForm(){
-      this.msgSuccess("绑定中.....同步信息中.....");
+
+      let loadingRock = this.$loading({
+        lock: true,
+        text: '绑定中.....同步客户信息中.....',
+        spinner: 'el-icon-loading',
+        background: 'rgba(0, 0, 0, 0.7)'
+      });
+
       this.qwForm.id = (this.qwUser).join(',');
 
       bindQwUser(this.qwForm).then(response => {
@@ -825,8 +890,16 @@ export default {
         this.qwOpen = false;
         this.getList();
         this.qwUserId=null;
+        this.qwUser=[];
+      }).finally(res=>{
+        loadingRock.close()
       });
     },
+
+
+
+
+
     /** 删除按钮操作 */
     handleDelete(row) {
       const userIds = row.userId || this.ids;

+ 35 - 13
src/views/qw/qwChat/qq.vue

@@ -1,14 +1,13 @@
 <template>
   <div class="app-container">
 
-    <el-select filterable v-model="qwUserId"  @change="qwUserChange" placeholder="请选择企微账号" clearable size="small">
-      <el-option
+    <el-tabs type="card" v-model="appKey" @tab-click="qwUserChange">
+      <el-tab-pane
         v-for="item in qwUserList"
         :key="item.id"
         :label="item.qwUserId"
-        :value="item.id">
-      </el-option>
-    </el-select>
+        :name="item.appKey"/>
+    </el-tabs>
 
     <div class="imui-center qq-lemon-imui" v-show="showQW">
       <lemon-imui  class="lemon-slot"
@@ -44,7 +43,8 @@
             <div style="display:flex;justify-content:space-between">
               <span>{{contact.displayName}}</span>
               <span style="font-size:12px;">
-                      <el-button size="mini"  @click="openDrawer('right')">侧边栏</el-button>
+                <el-button size="mini" @click="showDetail">详情</el-button>
+<!--                      <el-button size="mini"  @click="openDrawer('right')">侧边栏</el-button>-->
                 <!--                      <span style="cursor:pointer;"  @click="openDrawer('right')">-->
                 <!--                        右侧  |-->
                 <!--                      </span>-->
@@ -126,6 +126,13 @@
                     :source="dialogVideoUrl" :cover="dialogVideoCover" ref="player"></videoPlayer>
     </el-dialog>
 
+    <!-- 用户详情 -->
+    <el-drawer
+      :with-header="false"
+      size="75%"
+      :title="detail.title" :visible.sync="detail.open">
+      <userDetail ref="userDetail" />
+    </el-drawer>
 
   </div>
 </template>
@@ -139,12 +146,14 @@ import Conversations from "@/components/LemonUI/database/conversations";
 import EmojiData from "@/components/LemonUI/database/emoji";
 import '@/components/LemonUI/index.css';
 import VideoPlayer from '@/components/VideoPlayer/VueAliplayer.vue'
+import UserDetail from "@/views/qw/qwChat/userDetail/index.vue";
 
 let pages = {};
 export default {
   name: "qqChat",
   components: {
-    VideoPlayer
+    VideoPlayer,
+    UserDetail
   },
   data() {
     return {
@@ -242,6 +251,11 @@ export default {
         conversationId: null,
         userId:null
       },
+      sessionId: null,
+      detail: {
+        title: '',
+        open: false
+      }
     };
   },
   created(){
@@ -419,12 +433,11 @@ export default {
 
 
     },
-
-    qwUserChange(id){
-      let index= this.qwUserList.findIndex(item => item.id === id);
+    // 切换企微账号
+    qwUserChange(tab, event){
+      this.appKey = tab.name;
+      let index= this.qwUserList.findIndex(item => item.appKey === tab.name);
       this.qwUser=this.qwUserList[index];
-      // this.qwUser.userId = this.qwUser.id.toString();
-      // console.log("zyp qwUser:...",this.qwUser)
       this.getConversation();   //获取会话信息
       this.setQwUserInfo();
       this.initSocket(this.qwUser.appKey);
@@ -513,6 +526,7 @@ export default {
     },
     handleChangeConversation(conversation, instance) {
       //console.log("qxj ChangeConversation:"+JSON.stringify(conversation));
+      this.sessionId = conversation.conversationId
       if (!pages[conversation.conversationId]){
         pages[conversation.conversationId] =1;
       }
@@ -526,7 +540,7 @@ export default {
       // instance.closeDrawer();
     },
     handleChangeContact(contact, instance) {
-
+      console.log("ChangeContact:", contact, instance)
     },
 
     //收到消息后添加消息显示
@@ -764,6 +778,14 @@ export default {
       this.dialogImageUrl = url;
       this.dialogVisible = true;
     },
+    // 详情
+    showDetail() {
+      console.log("Event:show-userDetail", this.sessionId)
+      this.detail.open = true
+      setTimeout(() => {
+        this.$refs.userDetail.getDetail(this.sessionId);
+      }, 1);
+    }
   },
 };
 </script>

+ 240 - 0
src/views/qw/qwChat/userDetail/index.vue

@@ -0,0 +1,240 @@
+<template>
+
+  <div style="background-color: #f0f2f5; padding-bottom: 20px; min-height: 100%; " >
+    <div style="padding: 20px; background-color: #fff;">
+      用户详情
+    </div>
+
+    <div class="contentx" v-if="item!=null" >
+      <div class="desct">
+        基本信息
+      </div>
+      <el-descriptions title="" :column="3" border>
+
+        <el-descriptions-item label="会员id" >
+          <span v-if="item!=null">{{item.userId}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="用户昵称" >
+          <span v-if="item!=null">{{item.nickName}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="用户头像" >
+          <el-image v-if="item.avatar!=null"
+                    style="width: 50px;"
+                    :src="item.avatar">
+          </el-image>
+        </el-descriptions-item>
+        <el-descriptions-item label="手机号码" >
+          <span v-if="item!=null">{{item.phone}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="用户积分" >
+          <span v-if="item!=null">{{item.integral}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="状态" >
+             <span v-if="item!=null">
+                   <dict-tag :options="userOptions" :value="item.status"/>
+             </span>
+        </el-descriptions-item>
+
+        <el-descriptions-item label="上级昵称" >
+          <span v-if="item!=null">{{item.tuiName}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="上级手机号码" >
+          <span v-if="item!=null">{{item.tuiPhone}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="推广员关联时间" >
+          <span v-if="item!=null">{{item.tuiTime}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="下级人数" >
+          <span v-if="item!=null">{{item.tuiUserCount}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="最后一次登录ip" >
+          <span v-if="item!=null">{{item.lastIp}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="余额" >
+          <span v-if="item!=null">{{item.balance}}</span>
+        </el-descriptions-item>
+        <el-descriptions-item label="创建时间" >
+          <span v-if="item!=null">{{item.createTime}}</span>
+        </el-descriptions-item>
+
+        <el-descriptions-item label="更新时间" >
+          <span v-if="item!=null">{{item.updateTime}}</span>
+        </el-descriptions-item>
+      </el-descriptions>
+    </div>
+
+    <div class="contentx" v-if="item!=null">
+      <div class="desct"> 优惠劵领取信息</div>
+      <el-tabs type="card" v-model="actName" @tab-click="handleClickX">
+        <el-tab-pane label="全部" name="10"></el-tab-pane>
+        <el-tab-pane v-for="(item,index) in couponStatusOptions" :label="item.dictLabel" :name="item.dictValue"></el-tab-pane>
+      </el-tabs>
+      <el-table v-loading="loading" :data="userCouponList">
+        <el-table-column label="优惠劵标题" align="center" prop="title" />
+        <el-table-column label="券号" align="center" prop="couponCode" />
+        <el-table-column label="会员昵称" align="center" prop="nickName" />
+        <el-table-column label="会员电话" align="center" prop="phone" />
+        <el-table-column label="关联订单ID" align="center" prop="businessId" />
+        <el-table-column label="订单类型" align="center" prop="businessType">
+          <template slot-scope="scope">
+            <dict-tag :options="businessTypeOptions" :value="scope.row.businessType"/>
+          </template>
+        </el-table-column>
+        <el-table-column label="状态" align="center" prop="status">
+          <template slot-scope="scope">
+            <dict-tag :options="couponStatusOptions" :value="scope.row.status"/>
+          </template>
+        </el-table-column>
+        <el-table-column label="领取时间" align="center" prop="createTime" width="180"/>
+        <el-table-column label="使用时间" align="center" prop="useTime" width="180"/>
+      </el-table>
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
+
+
+
+    <div class="contentx" v-if="item!=null">
+      <div class="desct">
+        患者信息
+      </div>
+      <userPatietDetails  ref="userPatietDetail" />
+
+    </div>
+
+    <div class="contentx" v-if="item!=null" >
+      <div class="desct">
+        用户地址
+      </div>
+      <userAddDetails  ref="userAddDetail" />
+
+    </div>
+    <div class="contentx" v-if="item!=null" >
+      <div class="desct">
+        用户药品订单
+      </div>
+      <userStorerDetails  ref="userDetails" />
+    </div>
+    <div class="contentx" v-if="item!=null" >
+      <div class="desct">
+        用户问诊订单
+      </div>
+      <userInquiryOrderDetails  ref="InquiryDetails" />
+    </div>
+  </div>
+</template>
+
+
+
+<script>
+export default {
+  name: "userDetail",
+  data() {
+    return {
+      addr:[],
+      patient:[],
+      userOptions: [],
+      statusOptions: [],
+      sexOptions: [],
+      pOptions: [],
+      item:null,
+      total: 0,
+      loading: true,
+      // 会员优惠券表格数据
+      userCouponList: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        userId: null,
+        couponId: null,
+      },
+      actName:"10",
+      businessTypeOptions:[],
+      couponStatusOptions:[],
+    }
+  },
+  created() {
+
+  },
+  methods: {
+    handleClickX(tab, event) {
+      if(tab.name=="10"){
+        this.queryParams.status=null;
+      }else{
+        this.queryParams.status=tab.name;
+      }
+      this.queryParams.pageNum = 1;
+      this.getList();
+
+    },
+    getList() {
+      this.loading = true;
+      getListUserCoupon(this.queryParams).then(response => {
+        this.userCouponList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+
+    getDetail(sessionId) {
+      console.log("sessionId",sessionId)
+      // this.item=null;
+      // getUser(orderId).then(response => {
+      //   this.item = response.data;
+      //   setTimeout(() => {
+      //     this.$refs.userDetails.getUserDetails(orderId);
+      //   }, 1);
+      //   setTimeout(() => {
+      //     this.$refs.InquiryDetails.getInquiryDetails(orderId,1);
+      //   }, 1);
+      //   setTimeout(() => {
+      //     this.$refs.userPatietDetail.getPatList(orderId);
+      //   }, 1);
+      //   setTimeout(() => {
+      //     this.$refs.userAddDetail.getAddList(orderId);
+      //   }, 1);
+      //
+      // });
+      // this.patient=null;
+      // getPatientByUserId(orderId).then(response => {
+      //   this.patient = response.data;
+      // });
+      // getUserAddr(orderId).then(response => {
+      //   this.addr = response.data;
+      // });
+      // this.queryParams.userId=orderId;
+      // this.getList();
+
+    },
+  }
+}
+</script>
+<style>
+
+.contentx{
+  height: 100%;
+  background-color: #fff;
+  padding: 0px 20px 20px;
+
+
+  margin: 20px;
+}
+.el-descriptions-item__label.is-bordered-label{
+  font-weight: normal;
+}
+.el-descriptions-item__content {
+  max-width: 150px;
+  min-width: 100px;
+}
+.desct{
+  padding-top: 20px;
+  padding-bottom: 20px;
+  color: #524b4a;
+  font-weight: bold;
+}
+</style>