瀏覽代碼

feat: pc端新增检查身份权限切换提示

cuiyalong 1 年之前
父節點
當前提交
beb03e84a5

+ 19 - 0
apps/bigmember_pc/src/api/modules/user.js

@@ -149,3 +149,22 @@ export function readMark(data) {
     data
   })
 }
+
+// 获取用户最高权限身份
+export function getUserHighestPowerIdentity(data) {
+  data = qs.stringify(data)
+  return request({
+    url: '/publicapply/identity/newProduct',
+    method: 'post',
+    data
+  })
+}
+
+export function changeUserIdentity(data) {
+  data = qs.stringify(data)
+  return request({
+    url: '/publicapply/identity/switch',
+    method: 'post',
+    data
+  })
+}

+ 121 - 0
apps/bigmember_pc/src/components/dialog/CheckPowerAndSwitch.vue

@@ -0,0 +1,121 @@
+<template>
+  <CustomDialog
+    show-close
+    width="336px"
+    top="30vh"
+    class="check-power-and-switch-dialog"
+    title="身份切换提醒"
+    :visible.sync="visible"
+    @close="onClose"
+  >
+    <div class="content-text" v-html="messageText"></div>
+    <template #footer>
+      <button
+        class="action-button confirm"
+        @click="onClickConfirm"
+        v-loading="loading"
+      >
+        立即切换
+      </button>
+      <button class="action-button cancel" @click="onClickCancel">
+        暂不切换
+      </button>
+    </template>
+  </CustomDialog>
+</template>
+<script>
+import Dialog from './Dialog.vue'
+import { getUserHighestPowerIdentity, changeUserIdentity } from '@/api/modules/'
+
+export default {
+  name: 'CheckPowerAndSwitch',
+  components: {
+    [Dialog.name]: Dialog
+  },
+  data() {
+    return {
+      visible: false,
+      loading: false,
+      targetIdentity: {
+        currentIdentity: '',
+        entId: '',
+        entName: '',
+        productType: '',
+        token: ''
+      }
+    }
+  },
+  computed: {
+    messageText() {
+      const { entName, productType, currentIdentity } = this.targetIdentity
+      const arr = [
+        '当前访问身份为',
+        `<span class="highlight-text">“${currentIdentity || ''}”</span>`,
+        ',系统识别您在',
+        `<span class="highlight-text">“${entName || ''}”</span>身份下有`,
+        `<span class="highlight-text">“${productType || ''}”</span>权限`,
+        ',建议您切换到该身份下使用剑鱼标讯。'
+      ]
+      return arr.join('')
+    }
+  },
+  created() {
+    this.getUserHighestIdentity()
+  },
+  methods: {
+    onClose() {
+      this.getUserHighestIdentity(true)
+    },
+    onClickCancel() {
+      this.getUserHighestIdentity(true)
+      this.showDialog(false)
+    },
+    async onClickConfirm() {
+      this.switchNow()
+    },
+    showDialog(f = false) {
+      this.visible = f
+    },
+    async getUserHighestIdentity(clear) {
+      let payload = {
+        isClear: clear ? true : undefined
+      }
+      const { error_code: code, data } = await getUserHighestPowerIdentity(payload)
+      if (code === 0 && data) {
+        this.targetIdentity = data
+        if (data.token) {
+          this.showDialog(true)
+        }
+      }
+    },
+    async switchNow() {
+      const p = this.targetIdentity
+      if (!p.token) return
+      try {
+        this.loading = true
+        const { error_code: code, data } = await changeUserIdentity({
+          token: p.token
+        })
+        if (code === 0 && data === 1) {
+          location.reload()
+        } else {
+          this.$toast('身份切换失败')
+        }
+        this.loading = false
+      } catch (error) {
+        this.loading = false
+      }
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+.content-text {
+  text-align: center;
+}
+.action-button {
+  &.cancel {
+    color: #1d1d1d;
+  }
+}
+</style>

+ 10 - 0
apps/bigmember_pc/src/components/dialog/Dialog.vue

@@ -5,6 +5,7 @@
     v-bind="$props"
     :show-close="showClose"
     :visible="visible"
+    :before-close="beforeClose"
     @update:visible="update"
     v-component-change-mount="{ selector: comMount }"
     @open="$emit('open')"
@@ -42,6 +43,7 @@ export default {
   props: {
     visible: Boolean,
     showClose: Boolean,
+    beforeClose: Function,
     comMount: {
       type: String,
       default: ''
@@ -99,6 +101,14 @@ export default {
     font-size: 14px;
     line-height: 22px;
   }
+  .el-dialog__body,
+  .el-dialog__footer {
+    padding-left: 32px;
+    padding-right: 32px;
+  }
+  .el-dialog__footer {
+    padding-top: 6px;
+  }
   .dialog-footer {
     display: flex;
     align-items: center;