feat: 客服许可 - 分配许可 - 前端页面

project/src/assets/config/interface_api.js

@@ -378,6 +378,9 @@ var api = {
 
   user_dataBoardAuth: "/api/userPermission/exportAuth", // 账号管理 - 用户数据看板权限
 
+
+  member_licenseCount: "/api/license/count", // 成员管理 - 查询企微待分配许可数
+
 };
 
 export { api };

project/src/components/manage/memberComp/assignDialog.vue

@@ -0,0 +1,122 @@
+<template>
+  <el-dialog
+    :visible.sync="dialogVisible"
+    :before-close="handleCancel"
+    class="assign-dialog"
+    title="分配许可"
+    width="450px"
+  >
+    <div class="form-wrap" v-loading="loading">
+      现有待分配许可{{ waitForAssignNum }}个，是否确定分配给成员【{{ userInfo.name }}】
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button size="mini" @click="handleCancel">取 消</el-button>
+      <el-button size="mini" type="primary" @click="handleConfirm">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: "assignDialog",
+  props: {
+    // 控制弹框是否显示
+    dialogVisible: {
+      type: Boolean,
+      default: () => false
+    },
+    // 成员信息
+    userInfo: {
+      type: Object,
+      default: () => ({
+        user_id: '',
+        name: '',
+      })
+    },
+    // 待分配许可数
+    waitForAssignNum: {
+      type: Number,
+      default: () => 0
+    },
+  },
+  data() {
+    return {
+      loading: false,
+      form: {
+        user_id: '',
+      }
+    }
+  },
+  watch: {
+    dialogVisible(isShow) {
+      if (isShow) {
+        // 获取表单数据
+        this.handleGetFormData()
+      }
+    },
+  },
+  methods: {
+    // 获取弹框表单数据
+    handleGetFormData() {
+      const { user_id = '' } = this.userInfo
+      this.form.user_id = user_id
+    },
+    // 清空弹框表单数据
+    handleClearFormData() {
+      this.form.user_id = ''
+    },
+
+    async handleConfirm() {
+      try {
+        this.$emit('confirm') // mock
+        // 表单校验
+        // await this.handleFormValidate()
+        // const params = { ...this.form }
+        // this.loading = true
+        // const { data: res = {} } = await this.$axios.post(`${this.URL.BASEURL}${this.URL.manage_bindUserAdqAccountId}`, { ...params })
+        // if (res && res.errno == 0) {
+        //   this.$message.success('操作成功')
+        //   this.handleClearFormData()
+        //   this.$emit('confirm')
+        // } else if (res.errno != 4002) {
+        //   this.$message.warning(res.err || '操作失败')
+        // }
+      } catch (error) {
+        console.log('error => ', error)
+      } finally {
+        this.loading = false
+      }
+    },
+    handleCancel() {
+      this.handleClearFormData()
+      this.$emit('cancel')
+    },
+    // 执行表单校验
+    handleFormValidate() {
+      return new Promise((resolve, reject) => {
+        // if (!this.form.account_id) {
+        //   this.$message.warning('请选择投放账号')
+        //   reject('表单校验未通过')
+        // } else {
+        //   resolve('表单校验通过')
+        // }
+
+        // 此版本无必填项
+        resolve('表单校验通过')
+      })
+    },
+
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.assign-dialog {
+  .form-wrap {
+    padding: 0 10px;
+  }
+  .dialog-footer {
+    text-align: right;
+  }
+}
+</style>

project/src/components/manage/memberManage.vue

@@ -189,13 +189,23 @@
     </el-drawer>
 
     <!-- S 信息绑定 - 弹框 -->
-    <member-info-bind
+    <memberInfoBind
       :dialogVisible="infoBindDialogVisible"
       :userInfo="currentBindInfo"
       @cancel="handleInfoBindCancel"
       @confirm="handleInfoBindConfirm"
     />
     <!-- E 信息绑定 - 弹框 -->
+
+    <!-- S 分配许可 - 弹框 -->
+    <assignDialog
+      :dialogVisible="assignDialogVisible"
+      :userInfo="currentAssignInfo"
+      :waitForAssignNum="waitForAssignNum"
+      @cancel="handleAssignCancel"
+      @confirm="handleAssignConfirm"
+    />
+    <!-- E 分配许可 - 弹框 -->
   </div>
 </template>
 
@@ -205,6 +215,7 @@ import userDetail from './userDetail/index.vue'
 import memberInfoBind from './memberComp/memberInfoBind.vue'
 import selfCustomerservice from '@/components/assembly/screen/customerService.vue'
 import batchAssign from './memberComp/batchAssign.vue'
+import assignDialog from './memberComp/assignDialog.vue'
 import { orderTypeOptions } from '@/assets/js/staticTypes'
 
 const orderTypeDesc = new Map([
@@ -226,6 +237,7 @@ export default {
     memberInfoBind,
     selfCustomerservice,
     batchAssign,
+    assignDialog,
   },
   data () {
     return {
@@ -260,6 +272,9 @@ export default {
       activeStatusOptions: Object.freeze(activeStatusOptions), // 激活状态选项
 
       waitForAssignNum: 0, // 待分配许可数
+      assignDialogVisible: false, // 控制“分配许可”弹框显示
+      currentAssignInfo: {}, // 当前需要分配许可的成员信息
+
     }
   },
   computed: {
@@ -272,6 +287,7 @@ export default {
     this.height = document.documentElement.clientHeight - 200 > 400 ? document.documentElement.clientHeight - 200 : 400
     this.init_depart()
     this.init(1)
+    this.handleGetWaitForAssignNum()
   },
   methods: {
     detailEvent (data) {
@@ -287,6 +303,7 @@ export default {
     inputChange (keyword) {
       this.keyword = keyword
       this.init(1, keyword)
+      this.handleGetWaitForAssignNum()
     },
     init_depart () {
       this.$axios.get(this.URL.BASEURL + this.URL.departmentList, {}).then((res) => {
@@ -358,6 +375,7 @@ export default {
     },
     handleCurrentChange (val) {
       this.init(val, this.keyword)
+      this.handleGetWaitForAssignNum()
     },
     checkDepartId (id) {
       if (this.checkVals.indexOf(id) == -1) {
@@ -366,6 +384,7 @@ export default {
         this.checkVals.splice(this.checkVals.indexOf(id), 1)
       }
       this.init(1, this.keyword)
+      this.handleGetWaitForAssignNum()
     },
 
     async onClickInfoBind({ name = '', user_id = '', account_id = '' }) {
@@ -397,6 +416,7 @@ export default {
     handleInfoBindConfirm() {
       this.infoBindDialogVisible = false
       this.init(undefined, this.keyword)
+      this.handleGetWaitForAssignNum()
     },
     getOrderTypeDesc(type) {
       return orderTypeDesc.get(String(type)) || '-'
@@ -405,27 +425,73 @@ export default {
     onChangeUserIds(val) {
       this.user_ids = val ? val : []
       this.init(1, this.keyword)
+      this.handleGetWaitForAssignNum()
     },
     // 监听激活状态变化
     onChangeActiveStatus(val) {
       this.is_active = val
       this.init(1, this.keyword)
+      this.handleGetWaitForAssignNum()
     },
 
-    // 监听点击“转移许可”
-    onClickTransfer(current) {
-      console.log('onClickTransfer => ', JSON.parse(JSON.stringify(current)))
+    // 获取“待分配许可数”
+    handleGetWaitForAssignNum() {
+      return new Promise(async (resolve, reject) => {
+        try {
+          this.loading = true
+          const url = `${this.URL.BASEURL}${this.URL.member_licenseCount}`
+          const params = {
+            corpid: this.$localSelfStore.getLocal('defaultCorp') && this.$localSelfStore.getLocal('defaultCorp') != 'undefined' ? JSON.parse(this.$localSelfStore.getLocal('defaultCorp')).corpid : '',
+          }
+          const { data: res = {} } = await this.$axios.get(url, { params })
+          if (res && res.errno == 0) {
+            this.waitForAssignNum = res.rst.count
+            this.waitForAssignNum = parseInt(Math.random() * 100) // mock
+            resolve(this.waitForAssignNum)
+          } else if (res.errno != 4002) {
+            this.$message.warning(res.err)
+            this.waitForAssignNum = 0
+            reject(this.waitForAssignNum)
+          }
+        } catch (error) {
+          console.log('error => ', error)
+          this.waitForAssignNum = 0
+          reject(this.waitForAssignNum)
+        } finally {
+          this.loading = false
+        }
+      })
     },
     // 监听点击“分配许可”
-    onClickAssign(current) {
+    async onClickAssign(current) {
       console.log('onClickAssign => ', JSON.parse(JSON.stringify(current)))
-      this.$refs.batchAssign.handleReset()
+      this.currentAssignInfo = {...current}
+      const num = await this.handleGetWaitForAssignNum()
+      if (!num) return this.$message.warning('暂无待分配许可')
+      this.assignDialogVisible = true
+    },
+    // 执行分配许可 => 取消
+    handleAssignCancel() {
+      this.currentAssignInfo = {}
+      this.assignDialogVisible = false
+    },
+    // 执行分配许可 => 确定
+    handleAssignConfirm() {
+      this.assignDialogVisible = false
+      this.init(undefined, this.keyword)
+      this.handleGetWaitForAssignNum()
+    },
+    // 监听点击“转移许可”
+    onClickTransfer(current) {
+      console.log('onClickTransfer => ', JSON.parse(JSON.stringify(current)))
     },
     // 监听“批量分配许可”变化
     onChangeBatchAssign(val) {
       console.log('onChangeBatchAssign => ', val)
       this.init(undefined, this.keyword)
+      this.handleGetWaitForAssignNum()
     },
+
   }
 }
 </script>