直播中台v2.2优化

src/api/system.js

@@ -17,6 +17,8 @@ export function operateLog(params) {
 export function searchUserList(params) {
   return httpRequest.get('/api/live/common/v1/sso-user/search', { params })
 }
+
+/* ----------------------------系统用户管理---------------------------- */
 /**
  * 获取当前用户的角色
  */
@@ -32,8 +34,8 @@ export function createRole(data) {
 /**
  * 更新角色
  */
-export function updateRole(params) {
-  return httpRequest.get(`/api/live/admin/v2/role/${params.role_id}/update`, { params })
+export function updateRole(id, params) {
+  return httpRequest.put(`/api/live/admin/v2/role/${id}/update`, params)
 }
 /**
  * 获取角色详情
@@ -44,8 +46,8 @@ export function getRoleDetails(params) {
 /**
  * 删除
  */
-export function deleteRole(params) {
-  return httpRequest.get(`/api/live/admin/v2/role/${params.role_id}/delete`, { params })
+export function deleteRole(id) {
+  return httpRequest.delete(`/api/live/admin/v2/role/${id}/delete`)
 }
 /**
  * 获取角色列表
@@ -83,3 +85,23 @@ export function getPermissions(params) {
 export function permissionToRole(data) {
   return httpRequest.post('/api/live/admin/v2/assign/permission-to-role', data)
 }
+
+/* ----------------------------系统用户管理---------------------------- */
+/**
+ * 创建系统用户
+ */
+export function createAccount(data) {
+  return httpRequest.post('/api/live/admin/v2/user/create', data)
+}
+/**
+ * 删除系统用户
+ */
+export function deleteAccount(data) {
+  return httpRequest.post('/api/live/admin/v2/user/batch-delete', data)
+}
+/**
+ * 获取系统用户列表(分页)
+ */
+export function getAccountList(params) {
+  return httpRequest.get('/api/live/admin/v2/users', { params })
+}

src/api/tencent.js

+import httpRequest from '@/utils/axios'
+/**
+ * 创建腾讯用户
+ */
+export function createTxAccount(data) {
+  return httpRequest.post('/api/live/admin/v2-2/tencent/user/create', data)
+}
+/**
+ * 更新腾讯用户
+ */
+export function updateTxAccount(id, data) {
+  return httpRequest.put(`/api/live/admin/v2-2/tencent/user/${id}/update`, data)
+}
+/**
+ * 删除腾讯用户
+ */
+export function deleteTxAccount(data) {
+  return httpRequest.post('/api/live/admin/v2-2/tencent/user/batch-delete', data)
+}
+/**
+ * 获取腾讯用户列表(分页)
+ */
+export function getTxAccountList(params) {
+  return httpRequest.get('/api/live/admin/v2-2/tencent/users', { params })
+}
+/**
+ * 获取所有腾讯用户列表(分页)
+ */
+export function getAllTxAccountList(params) {
+  return httpRequest.get('/api/live/admin/v2-2/tencent/user/list', { params })
+}
\ No newline at end of file

src/components/UserSearch/index.vue

+<template>
+  <el-select v-model="userId" v-bind="options" placeholder="输入邮箱/手机号码搜索" filterable remote :remote-method="fetchUserList" :loading="searchUsersloading" @change="handleChange">
+    <el-option :label="user.real_name || user.nickname " :value="user.id" v-for="user in userList" :key="user.id" >
+      <span style="float: left">
+        {{ user.real_name || user.nickname }}
+        <template v-if="user.mobile">(手机号：{{user.mobile}})</template>
+      </span>
+      <span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-if="user.email">邮箱：{{ user.email }}</span>
+      <span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-else>ID：{{ user.id }}</span>
+    </el-option>
+  </el-select>
+</template>
+<script>
+const MOBILE_REG = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{4,8}$/
+const EMAIL_REG = /^[A-Za-z0-9]+([_.\\-][A-Za-z0-9]+)*@[A-Za-z0-9-.]+$/
+export default {
+  props: {
+    value: {
+      type: [Array, String]
+    },
+    defaultList: {
+      type: Array,
+      default: []
+    },
+    fetchApi: {
+      type: Function,
+      require: true
+    },
+    options: {
+      type: Object,
+      default: () => {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      userId: this.value,
+      searchUsersloading: false,
+      userList: []
+    }
+  },
+  watch: {
+    value: {
+      handler: function (nv) {
+        this.userId = nv
+      },
+      immediate: true,
+      deep: true
+    },
+    defaultList: {
+      handler: function (nv) {
+        this.userList = nv
+      },
+      immediate: true,
+      deep: true
+    }
+  },
+  methods: {
+    handleChange() {
+      const selectedUser = this.userList.find(item => item.id === this.userId)
+      this.$emit('input', this.userId)
+      this.$emit('select', selectedUser)
+    },
+    fetchUserList(val) {
+      let searchType = 'username'
+      if (EMAIL_REG.test(val)) {
+        searchType = 'email'
+      } else if (MOBILE_REG.test(val)) {
+        searchType = 'mobile'
+      }
+      if (!val) return false
+      else {
+        const params = {
+          [searchType]: val
+        }
+        this.searchUsersloading = true
+        this.fetchApi(params)
+          .then(res => {
+            this.searchUsersloading = false
+            if (res.data && Array.isArray(res.data.items)) {
+              this.userList = res.data.items
+            }
+          })
+          .catch(() => {})
+      }
+    }
+  }
+}
+</script>
+<style scoped>
+.el-select{
+  width:100%;
+}
+</style>
\ No newline at end of file

src/components/layout/Sidebar/index.vue

@@ -49,12 +49,27 @@ const defaultMenu = [
         path: '/system/role'
       },
       {
-        title: '账号管理',
+        title: '用户管理',
         icon: 'el-icon-key',
         path: '/system/account'
       }
     ]
   },
+  {
+    title: '腾讯会议设置',
+    icon: 'el-icon-message',
+    path: '/tencent',
+    meta: {
+      roles: ['administrator']
+    },
+    children: [
+      {
+        title: '腾讯账号管理',
+        icon: '',
+        path: '/tencent/account'
+      }
+    ]
+  },
   {
     title: '个人设置',
     icon: 'el-icon-user',
@@ -137,7 +152,7 @@ export default {
 <style scoped>
 .logo {
   height: 48px;
-  width: 166px;
+  width: 170px;
   background: #fff;
   padding-top: 4px;
   transition: width 0.295s ease-in-out;

src/components/layout/index.vue

@@ -35,7 +35,7 @@ export default {
 }
 .sidebar-container {
   /* transition: width 0.28s; */
-  width: 166px;
+  width: 180px;
   height: 100%;
   position: fixed;
   font-size: 0px;
@@ -52,7 +52,7 @@ export default {
   min-height: 100%;
   -webkit-transition: margin-left 0.28s;
   transition: margin-left 0.28s;
-  margin-left: 166px;
+  margin-left: 180px;
   position: relative;
 }
 .sidebar-collapse .main-container {

src/pages/meeting/tencent-meeting/components/MeetingForm.vue

@@ -67,7 +67,7 @@
     <el-form-item label="指定会议管理员">
       <p style="line-height:24px;font-size:12px;">(会议管理员有修改会议，复制、取消会议等所有管理本次会议的权限)</p>
       <el-col :span="24">
-        <el-select style="width: 100%" v-model="form.managers" placeholder="输入邮箱/手机号码搜索" size="small" multiple filterable remote :remote-method="fetchUserList" :loading="searchUsersloading" clearable>
+        <!-- <el-select style="width: 100%" v-model="form.managers" placeholder="输入邮箱/手机号码搜索" size="small" multiple filterable remote :remote-method="fetchUserList" :loading="searchUsersloading" clearable>
           <el-option :label="user.real_name || user.nickname " :value="user.id" v-for="user in userList" :key="user.id" >
             <span style="float: left">
               {{ user.real_name || user.nickname }}
@@ -76,9 +76,21 @@
             <span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-if="user.email">邮箱：{{ user.email }}</span>
             <span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-else>ID：{{ user.id }}</span>
           </el-option>
-        </el-select>
+        </el-select> -->
+        <user-search v-model="form.managers" :fetchApi="fetchApiSearch" :defaultList="userList" :options="{ size: 'small', multiple: true, clearable: true }"/>
       </el-col>
     </el-form-item>
+    <el-form-item label="会议主持人">
+      <el-select style="width: 100%" v-model="form.hosts" placeholder="请选择腾讯会议用户，支持关键字搜索" size="small" multiple filterable remote :remote-method="fetchTxAccountList" :loading="searchLoading" clearable>
+          <el-option :label="user.username" :value="user.userid" v-for="user in txAccountList" :key="user.id" >
+            <span style="float: left">
+              {{ user.username }}
+              <template v-if="user.phone">(手机号：{{user.phone}})</template>
+            </span>
+            <span style="float: right; color: #8492a6; font-size: 13px; margin:0 20px 0 10px;" v-if="user.email">邮箱：{{ user.email }}</span>
+          </el-option>
+        </el-select>
+    </el-form-item>
     <el-form-item label="会议设置" style="margin-bottom:2px;">
       <el-col :span="10">
         <el-checkbox style="width: 120px" v-model="form.hasPwd">开启会议密码</el-checkbox>
@@ -131,24 +143,34 @@
   </el-form>
 </template>
 <script>
+import UserSearch from '@/components/UserSearch/index'
 import { timeTrans, dateFormat, getYMDByDate, getTimestampYMD, getCurHalfHour, computedDateByRateTimes, computedTimesByRateDate } from '@/utils/dateAlgs'
 import { searchUserList } from '@api/common'
+import { getTxAccountList } from '@api/tencent'
 import { mapGetters } from 'vuex'
 // import _ from 'lodash'
 const DAY_TIMESTAMP = 8.64e7
-const MOBILE_REG = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{4,8}$/
-const EMAIL_REG = /^[A-Za-z0-9]+([_.\\-][A-Za-z0-9]+)*@[A-Za-z0-9-.]+$/
 export default {
+  components: { UserSearch },
   props: {
     data: {
       type: Object
     },
     users: {
-      type: Array
+      type: Array,
+      default: () => {
+        return []
+      }
     },
     isReviewRecurring: {
       type: Boolean,
       default: false
+    },
+    reviewList: {
+      type: Object,
+      default: () => {
+        return {}
+      }
     }
   },
   data() {
@@ -241,19 +263,15 @@ export default {
           enable_live_password: false,
           live_password: '',
           enable_live_im: false
-        }
+        },
+        managers: [],
+        hosts: []
       },
       recurringTypeOptions: ['每天', '每个工作日', '每周', '每两周', '每月'],
       userList: [],
-      searchType: 'username',
-      searchTypeOptions: {
-        username: '通过用户名搜索',
-        nickname: '通过昵称搜索',
-        email: '通过邮箱搜索',
-        mobile: '通过手机号搜索',
-        id: '通过ID搜索'
-      },
-      searchUsersloading: false,
+      txAccountList: [],
+      searchLoading: false,
+      fetchApiSearch: searchUserList,
       rules: {
         subject: [{ required: true, message: '请填写会议主题', trigger: 'blur' }],
         startDate: [
@@ -423,7 +441,9 @@ export default {
     data: {
       handler: function (val) {
         if (val && val.startDate) {
-          this.userList = this.users
+          console.log(this.reviewList)
+          this.userList = this.reviewList.userList
+          this.txAccountList = this.reviewList.accountList
           this.deepSet(this.form, val)
           // if (val.meeting_type === 1) {
           //   val.recurring_rule.until_type === 0 ? this.setUntilCount() : this.setUntilDate()
@@ -435,6 +455,9 @@ export default {
     }
   },
   created() {
+    if (this.$route.name !== 'MeetingUpdate') {
+      this.fetchTxAccountList()
+    }
     this.setUntilDate()
   },
   methods: {
@@ -536,6 +559,9 @@ export default {
         enable_live: form.enable_live,
         managers: form.managers.length > 0 ? form.managers : [this.user.id]
       }
+      if (form.hosts.length > 0) {
+        params.hosts = form.hosts
+      }
       if (form.hasPwd) params.password = form.password
       const settings = { ...form.settings }
       if (!form.auto_record) {
@@ -563,28 +589,21 @@ export default {
       }
       return params
     },
-    fetchUserList(val) {
-      let searchType = 'username'
-      if (EMAIL_REG.test(val)) {
-        searchType = 'email'
-      } else if (MOBILE_REG.test(val)) {
-        searchType = 'mobile'
-      }
-      if (!val) return false
-      else {
-        const params = {
-          [searchType]: val
-        }
-        this.searchUsersloading = true
-        searchUserList(params)
-          .then(res => {
-            this.searchUsersloading = false
-            if (res.data && Array.isArray(res.data.items)) {
-              this.userList = res.data.items
-            }
-          })
-          .catch(() => {})
+    fetchTxAccountList(val) {
+      const params = {
+        page: 1,
+        limit: 100
       }
+      if (val) params.search = val
+      this.searchLoading = true
+      getTxAccountList(params)
+        .then(res => {
+          this.searchLoading = false
+          if (res.data && Array.isArray(res.data.data)) {
+            this.txAccountList = res.data.data
+          }
+        })
+        .catch(() => {})
     }
   }
 }

src/pages/meeting/tencent-meeting/meeting-update.vue

 <template>
   <div class="meeting-update">
     <div class="inner">
-      <meeting-form :data="reviewData" :isReviewRecurring="isReviewRecurring" :users="userList" @submitForm="handleSubmit"></meeting-form>
+      <meeting-form :data="reviewData" :isReviewRecurring="isReviewRecurring" :users="userList" :reviewList="reviewList" @submitForm="handleSubmit"></meeting-form>
     </div>
     <meeting-success-dialog :dialogVisible.sync="dialogVisible" :details="details"/>
   </div>
@@ -19,7 +19,11 @@ export default ({
       reviewData: {},
       userList: [],
       dialogVisible: false,
-      details: {}
+      details: {},
+      reviewList: {
+        userList: [],
+        accountList: []
+      }
     }
   },
   computed: {
@@ -122,6 +126,12 @@ export default ({
         const _managers = details.managers.map(it => it.user_id)
         reviewData.managers = _managers;
         this.userList = details.managers
+        this.reviewList.userList = details.managers
+      }
+      if (Array.isArray(details.hosts) && details.hosts.length > 0) {
+        const _hosts = details.hosts.map(it => it.userid)
+        reviewData.hosts = _hosts;
+        this.reviewList.accountList = details.hosts
       }
       this.reviewData = reviewData
       // console.log(reviewData)

src/pages/system/role/index.vue

@@ -2,7 +2,7 @@
   <div class="account">
     <h5>
       角色管理
-      <!-- <el-button style="float: right; margin: 12px 30px 0 0" size="mini" type="primary" plain @click="handleAdd">添加角色</el-button> -->
+      <el-button style="float: right; margin: 12px 30px 0 0" size="mini" type="primary" plain @click="handleAdd">添加角色</el-button>
     </h5>
     <div class="inner">
       <el-table :data="listData" style="width: 100%" height="calc(100% - 32px)" v-loading="loading">
@@ -10,51 +10,67 @@
         <el-table-column prop="display_name" label="角色名称" min-width="120"></el-table-column>
         <el-table-column prop="description" label="角色描述" min-width="120"></el-table-column>
         <el-table-column prop="updated_at" label="创建时间" min-width="120"></el-table-column>
-        <!-- <el-table-column label="操作" min-width="140">
+        <el-table-column label="操作" min-width="140">
           <template slot-scope="scope">
-            <el-button type="text" size="small" @click="handleUsers(scope.row)">分配用户</el-button>
-            <el-button type="text" size="small" @click="handlePermission(scope.row)">设置权限</el-button>
+            <!-- <el-button type="text" size="small" @click="handlePermission(scope.row)">设置权限</el-button> -->
             <el-button type="text" size="small" @click="handleEdit(scope.row)">编辑</el-button>
-            <el-button type="text" size="small" @click="handleDelete(scope.row.userid)">删除</el-button>
+            <el-button type="text" size="small" @click="handleDelete(scope.row)">删除</el-button>
           </template>
-        </el-table-column> -->
+        </el-table-column>
       </el-table>
       <el-pagination :current-page.sync="curPage" :page-size="pageSize" layout="total, prev, pager, next, jumper" :total="total" @current-change="pageChange" style="float:right;"></el-pagination>
     </div>
+    <el-dialog :title="domicTitle" :visible.sync="dialogVisible" width="420px" center>
+      <el-form :model="form" :rules="rules" ref="ruleForm" label-width="80px" class="demo-ruleForm">
+        <el-form-item label="角色名称" prop="display_name">
+          <el-input v-model="form.display_name" size="small"></el-input>
+        </el-form-item>
+        <el-form-item label="角色key" prop="name">
+          <el-input v-model="form.name" size="small"></el-input>
+        </el-form-item>
+        <el-form-item label="角色描述" prop="description">
+          <el-input v-model="form.description" size="small"></el-input>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="handleEnter" size="mini">确 定</el-button>
+        <el-button @click="dialogVisible = false" size="mini">取 消</el-button>
+      </span>
+    </el-dialog>
   </div>
 </template>
 <script>
-import { getRoles } from '@api/system'
+import { getRoles, createRole, operateLog, deleteRole, updateRole } from '@api/system'
 import { mapGetters } from 'vuex'
+const defaultForm = {
+  name: '',
+  display_name: '',
+  description: '',
+  id: ''
+}
 export default {
   data() {
     return {
-      listData: [
-        {
-          id: 2,
-          name: 'general_admin',
-          display_name: '普通管理员',
-          description: '拥有超级管理员下的最高权限',
-          created_at: '2021-04-01 09:38:25',
-          updated_at: '2021-04-01 09:38:25'
-        },
-        {
-          id: 1,
-          name: 'administrator',
-          display_name: '超级管理员',
-          description: '拥有所有的权限',
-          created_at: '2021-04-01 09:29:41',
-          updated_at: '2021-04-01 09:29:41'
-        }
-      ],
+      listData: [],
       curPage: 1,
       pageSize: 20,
       total: 0,
-      loading: false
+      loading: false,
+      dialogVisible: false,
+      dialogType: 'add',
+      form: Object.assign({}, defaultForm),
+      rules: {
+        name: { required: true, message: '请输入角色key', trigger: 'blur' },
+        display_name: { required: true, message: '请输入角色名称', trigger: 'blur' },
+        description: { required: true, message: '请输入角色描述', trigger: 'blur' }
+      }
     }
   },
   computed: {
-    ...mapGetters(['isSuperAdmin'])
+    ...mapGetters(['isSuperAdmin']),
+    domicTitle() {
+      return this.dialogType === 'add' ? '新增角色' : '编辑角色'
+    }
   },
   created() {
     this.fetchRoleList()
@@ -67,12 +83,30 @@ export default {
       console.log(val)
     },
     handleEdit(val) {
-      console.log(val)
+      this.form = Object.assign({}, val)
+      this.dialogVisible = true
+      this.dialogType = 'edit'
     },
     handleDelete(val) {
-      console.log(val)
+      this.$confirm('删除此角色将导致相关联的用户不可用, 是否继续执行?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消'
+      }).then(() => {
+        this.fetchDeleteRole(val.id)
+      }).catch(() => {})
+    },
+    handleAdd() {
+      this.dialogVisible = true
+      this.dialogType = 'add'
+    },
+    handleEnter() {
+      this.$refs.ruleForm.validate((valid) => {
+        if (valid) {
+          this.dialogType === 'add' ? this.fetchCreateRole() : this.fetchUpdateRole()
+          this.dialogVisible = false
+        }
+      })
     },
-    handleAdd() {},
     pageChange() {
       this.fetchRoleList()
     },
@@ -89,6 +123,37 @@ export default {
           this.total = res.data.total
         }
       })
+    },
+    fetchCreateRole() {
+      createRole(this.form).then((res) => {
+        this.loading = false
+        if (res.code === 0 && res.data.id) {
+          this.$message.success('创建角色成功')
+          this.fetchRoleList()
+          operateLog({ type: '创建角色', user: this.user })
+        }
+      })
+    },
+    fetchUpdateRole() {
+      updateRole(this.form.id, this.form).then((res) => {
+        if (res.code === 0 && res.data.status) {
+          this.$message.success('更新角色成功')
+          this.fetchRoleList()
+          operateLog({ type: '更新角色', user: this.user })
+        }
+      })
+    },
+    fetchDeleteRole(id) {
+      deleteRole(id).then((res) => {
+        if (res.code === 0 && res.data.status === true) {
+          this.$message.success('删除角色成功')
+          this.fetchRoleList()
+          operateLog({ type: `删除角色，被删除角色id：${id}`, user: this.user })
+          this.deleteId = ''
+        } else {
+          this.$message.error(res.message || '删除角色失败')
+        }
+      })
     }
   }
 }

src/router/routes.js

@@ -81,6 +81,21 @@ export default [
       }
     ]
   },
+  {
+    path: '/tencent',
+    component: Layout,
+    redirect: '/tencent/account',
+    name: 'System',
+    meta: { title: '腾讯会议管理', icon: 'el-icon-setting' },
+    children: [
+      {
+        path: 'account',
+        name: 'Account',
+        component: () => import('@/pages/tencent/account/index'),
+        meta: { title: '账号管理', icon: 'el-icon-key' }
+      }
+    ]
+  },
   {
     path: '/my',
     component: Layout,

src/store/modules/user.js

@@ -33,19 +33,6 @@ const user = {
         commit('setUser', response)
       })
     },
-    setUserRoles({ commit }) {
-      getUserRoles().then(res => {
-        const roles = res.data.roles
-        let isSuperAdmin = false
-        if (roles && Array.isArray(roles)) {
-          roles.forEach(it => {
-            if (it.name === 'administrator') isSuperAdmin = true
-          })
-          commit('setRoles', roles)
-          commit('setSuperAdmin', isSuperAdmin)
-        }
-      })
-    },
     // 退出登录
     logout({ commit }) {
       return logout().then(response => {

src/style.scss

@@ -113,3 +113,6 @@ body {
   font-family: 'PingFang SC', 'PingFangSC-Regular', 'Source Han Sans CN', -apple-system, 'Microsoft YaHei', 'Helvetica', 'Arial', Verdana,
     'Hiragino Sans GB', 'Wenquanyi Micro Hei', sans-serif;
 }
+.app-main .el-table th:first-child .cell{
+  padding-left:14px;
+}

src/utils/beforeEnter.js

@@ -33,7 +33,6 @@ export default class BeforeEnter {
       }
       next()
     }
-    store.dispatch('setUserRoles')
     next()
   }
 }