ngds/backendEle/src/views/user/empty-list.vue

<template>
  <div v-loading="loading">
    <div class="white-box">
      <div class="filter-box">
        <filter-user :filter-types="filterTypes" @select-value="handleFilterUser"></filter-user>
      </div>
      <el-table ref="wrapper" :data="tableData" stripe style="width: 100%;" @selection-change="handleSelectionChange"
                :height="tool.getTableHeight()">
        <el-table-column fixed type="selection" width="55" v-if="tableHeaders"></el-table-column>
        <el-table-column v-for="(tableHeader, key) in tableHeaders" :key="key" :label="tableHeader.header"
                         :width="tableHeader.other.width ? tableHeader.other.width : ''" :fixed="tableHeader.index=='USER_NAME' || tableHeader.index=='REAL_NAME' ?true:false">
          <template slot-scope="scope">
            <template v-if="scope.row[tableHeader.index].other.tag">
              <el-tag
                  :type="scope.row[tableHeader.index].other.tag.type ? scope.row[tableHeader.index].other.tag.type : null"
                  :size="scope.row[tableHeader.index].other.tag.size ? scope.row[tableHeader.index].other.tag.size : null"
                  :class="scope.row[tableHeader.index].other.tag.class ? scope.row[tableHeader.index].other.tag.class : null">
                {{scope.row[tableHeader.index].value}}
              </el-tag>
            </template>
            <template v-else>
              <!--<template v-if="tableHeader.index === 'USER_NAME'">-->
                <!--<el-dropdown v-if="permission.hasPermission(`user/login-to-frontend`)">-->
  <!--<span class="el-dropdown-link">-->
    <!--{{scope.row.USER_NAME.value}} <i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>-->
  <!--</span>-->
                  <!--<el-dropdown-menu slot="dropdown">-->
                    <!--<el-dropdown-item command="login" v-show="scope.row.BTF_URL !== null">-->
                      <!--<a :href="`${frontendServer}/#/login-by-backend?${scope.row.BTF_URL}`" target="_blank"-->
                         <!--style="color:#606266;">快速登录</a>-->
                    <!--</el-dropdown-item>-->
                  <!--</el-dropdown-menu>-->
                <!--</el-dropdown>-->
                <!--<el-tag type="primary" size="small" class="no-border"-->
                        <!--v-if="!permission.hasPermission(`user/login-to-frontend`)">{{scope.row.USER_NAME.value}}-->
                <!--</el-tag>-->
              <!--</template>-->
              <!--<template v-else>-->
                <div v-html="scope.row[tableHeader.index].value"></div>
              <!--</template>-->
            </template>
          </template>
        </el-table-column>
<!--        <el-table-column fixed="right" label="operation" width="180">&lt;!&ndash; 操作 &ndash;&gt;-->
<!--          <template slot-scope="scope">-->
<!--            <el-dropdown size="small" trigger="click">-->
<!--              <el-button type="primary" size="small" @click.stop="">-->
<!--                Operate on this data&lt;!&ndash; 操作该数据 &ndash;&gt;<i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>-->
<!--              </el-button>-->
<!--              <el-dropdown-menu slot="dropdown">-->
<!--                <el-dropdown-item @click.native="handleModifyPassword(scope.row)"-->
<!--                                  v-if="permission.hasPermission(`user/modify-password`)">Change Password&lt;!&ndash; 修改密码 &ndash;&gt;-->
<!--                </el-dropdown-item>-->
<!--                <el-dropdown-item @click.native="handleModifyProfile(scope.row)"-->
<!--                                  v-if="permission.hasPermission(`user/modify-profile`)">Modify personal data&lt;!&ndash; 修改个人资料 &ndash;&gt;-->
<!--                </el-dropdown-item>-->
<!--                <el-dropdown-item @click.native="handleStatusActive(scope.row)">Status activation&lt;!&ndash; 状态激活 &ndash;&gt; </el-dropdown-item>-->
<!--                <el-dropdown-item @click.native="handleStatusLock(scope.row)">Status lock&lt;!&ndash; 状态锁定 &ndash;&gt; </el-dropdown-item>-->
<!--              </el-dropdown-menu>-->
<!--            </el-dropdown>-->
<!--          </template>-->
<!--        </el-table-column>-->
      </el-table>
      <div class="white-box-footer">
        <!--<el-dropdown size="small" trigger="click" v-show="permission.hasPermission(`user/is-dec`)">-->
          <!--<el-button type="primary" size="small" @click.stop="">-->
            <!--报单中心管理<i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>-->
          <!--</el-button>-->
          <!--<el-dropdown-menu slot="dropdown">-->
            <!--<el-dropdown-item command="isDec" @click.native="handleIsDecManage(true)">设为报单中心</el-dropdown-item>-->
            <!--<el-dropdown-item command="notDec" @click.native="handleIsDecManage(false)">取消报单中心-->
            <!--</el-dropdown-item>-->
          <!--</el-dropdown-menu>-->
        <!--</el-dropdown>-->

        <!--<el-dropdown size="small" trigger="click" v-show="permission.hasPermission(`user/is-atlas`)">-->
          <!--<el-button type="primary" size="small" @click.stop="">-->
            <!--图谱管理<i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>-->
          <!--</el-button>-->
          <!--<el-dropdown-menu slot="dropdown">-->
            <!--<el-dropdown-item command="isAtlas" @click.native="handleIsAtlasManage(true)">显示图谱</el-dropdown-item>-->
            <!--<el-dropdown-item command="notAtlas" @click.native="handleIsAtlasManage(false)">隐藏图谱-->
            <!--</el-dropdown-item>-->
          <!--</el-dropdown-menu>-->
        <!--</el-dropdown>-->

        <!--<el-button type="success" size="small" @click="handleExport"-->
                   <!--v-show="permission.hasPermission(`user/index-export`)">Export Excel-->
        <!--</el-button>-->
        <pagination :total="totalCount" :page_size="pageSize" @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"></pagination>
      </div>
    </div>
    <el-dialog :title="formModifyPassword.typeName" :visible.sync="dialogModifyPasswordVisible" width="50%">
      <el-form ref="form" :model="formModifyPassword" label-width="120px" class="form-dialog">
        <el-form-item label="type"><!-- 类型 -->
          <el-select v-model="formModifyPassword.passwordType" placeholder="Please select a type"><!-- 请选择类型 -->
            <el-option v-for="(item,key) in passwordType" :label="item.label" :value="item.type"
                       :key="key"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="password"><!-- 密码 -->
          <el-input placeholder="password" v-model="formModifyPassword.password"><!-- 密码 -->
          </el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="handleModifyPasswordSubmit" :loading="submitPasswordButtonStat">Submit<!-- 提交 --></el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-dialog :title="formModifyProfile.typeName" :visible.sync="dialogModifyProfileVisible" width="50%">
      <el-form ref="form" :model="formModifyProfile" label-width="120px" class="form-dialog">
        <el-form-item label="nation"><!-- 民族 -->
          <el-select v-model="formModifyProfile.nation" placeholder="Please select nationality"><!-- 请选择民族 -->
            <el-option v-for="(item,index) in allNation" :key="index" :label="item.name"
                       :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="Member name"><!-- 会员姓名 -->
          <el-input v-model="formModifyProfile.realName"></el-input>
        </el-form-item>
        <el-form-item label="ID"><!-- 身份证号 -->
          <el-input v-model="formModifyProfile.idCard"></el-input>
        </el-form-item>
        <el-form-item label="Phone Number"><!-- 手机号 -->
          <el-input v-model="formModifyProfile.mobile"></el-input>
        </el-form-item>
        <el-form-item label="Bank name"><!-- 银行名称 -->
          <el-select v-model="formModifyProfile.openBank" placeholder="Please select a bank name"><!-- 请选择银行名称 -->
            <el-option v-for="(item,index) in allOpenBank" :key="index" :label="item.BANK_NAME"
                       :value="item.BANK_CODE"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="Bank Address"><!-- 开户行地址 -->
          <el-input v-model="formModifyProfile.bankAddress"></el-input>
        </el-form-item>
        <el-form-item label="Bank account number"><!-- 银行帐号 -->
          <el-input v-model="formModifyProfile.bankNo"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="handleModifyProfileSubmit" :loading="submitProfileButtonStat">Submit<!-- 提交 --></el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
  import network from './../../utils/network'
  import tool from './../../utils/tool'
  import {FRONTEND_SERVER} from '@/utils/config'
  import baseInfo from '@/utils/baseInfo'
  import FilterUser from '../../components/FilterUser'
  import store from './../../utils/vuexStore'
  import permission from '@/utils/permission'
  import Pagination from '@/components/Pagination'
  import filterHelper from '../../utils/filterHelper'

  export default {
    name: 'user_empty_list',
    components: {FilterUser, Pagination},
    mounted() {
      let _this = this
      if (permission.hasPermission(`user/close-login`) || permission.hasPermission(`user/close-area-login`) || permission.hasPermission(`user/batch-close-login`)) {
        network.getData('user/close-login-get').then(response => {
          _this.apps = response.apps
          _this.closeSwitch = response.closeSwitch
          if (permission.hasPermission(`user/close-dec`) || permission.hasPermission(`user/close-area-dec`) || permission.hasPermission(`user/batch-close-dec`)) {
            network.getData('user/close-dec-get').then(response => {
              _this.closeDecSwitch = response.closeSwitch
              _this.getData()
            }).catch(error => {
            })
          } else {
            _this.getData()
          }
        }).catch(error => {
        })
      } else {
        if (permission.hasPermission(`user/close-dec`) || permission.hasPermission(`user/close-area-dec`) || permission.hasPermission(`user/batch-close-dec`)) {
          network.getData('user/close-dec-get').then(response => {
            _this.closeDecSwitch = response.closeSwitch
            _this.getData()
          }).catch(error => {
          })
        } else {
          _this.getData()
        }
      }
      store.state.socket.onMessageCallback = this.onMessageCallback
    },
    data() {
      return {
        tableHeaders: null,
        tableData: null,
        loading: true,
        multipleSelection: [],
        currentPage: 1,
        totalPages: 1,
        totalCount: 1,
        pageSize: 20,
        frontendServer: FRONTEND_SERVER,
        baseDecLevels: baseInfo.decLevels(),
        baseEmpLevels: baseInfo.empLevels(),
        tool: tool,
        permission: permission,
        filterTypes: null,
        filterModel: {},
        dialogVisible: false,
        formCloseLogin: {
          userName: null,
          typeName: 'Login management',//登录管理
          type: null,
          isClose: 0,
          remark: '',
          areaSelected: null,
        },
        regionDataPlus: store.state.regionInfo.regionData,
        apps: null,
        closeSwitch: null,
        submitButtonStat: false,
        dialogDecVisible: false,
        dialogModifyPasswordVisible: false,
        dialogModifyProfileVisible: false,
        formCloseDec: {
          userName: null,
          typeName: 'Manage entry',//管理报单
          type: null,
          isClose: 0,
          remark: '',
          areaSelected: null,
        },
        formModifyPassword: {
            userId:'',
            password: '',
            typeName: 'Change Password',//修改密码
            passwordType: 'password',
            // remark: '',
        },
        formModifyProfile: {
            userId:'',
            typeName: 'Modify personal data',//修改个人资料
            nation: '',
            realName: '',
            idCard: '',
            mobile: '',
            openBank: '',
            bankAddress: '',
            bankNo: '',
        },
        passwordType: [
            {
                type:"password",
                label:"Login password"//登录密码
            },
            {
                type:"payPassword",
                label:"Payment password"//支付密码
            },
        ],
        allOpenBank:null,
        allNation:null,
        submitDecButtonStat: false,
        submitPasswordButtonStat: false,
        submitProfileButtonStat: false,
        transferPropForm: {
          userIds: [],
          allowTransfer: true,
          transferProp: 100,
          withdrawProp: 0,
          remark: '',
        },
        closeUserData: null,
      }
    },
    methods: {
      handleSelectionChange(val) {
        this.multipleSelection = val
      },
      handleCurrentChange(page) {
        this.getData(page, this.pageSize)
      },
      handleSizeChange(pageSize) {
        this.getData(this.currentPage, pageSize)
      },
      handleAdd() {
        this.$router.push('/user/user-add')
      },
      handleFilterUser(filterData) {
        filterHelper.handleFilterUser(this, filterData)
      },
      handleFilter() {
        this.getData()
      },
      getData(page, pageSize, isLoading = true) {
        network.getPageData(this, 'user/empty-list', page, pageSize, this.filterModel, response => {
          this.filterTypes = response.filterTypes
        }, isLoading)
      },
      handleGroupManage(isGroup) {
        if (this.multipleSelection.length < 1) {
          this.$message({
            message: 'Please check the member to be operated',//请勾选要操作的会员
            type: 'warning'
          })
          return
        }
        let groupTip = isGroup === true ? 'set as team leader ':' Cancel team leader '//'设为团队领导人' : '取消团队领导人'
        this.$confirm(`Are you sure you want to【${groupTip}】？`, 'Hint', {//`确定要对所选会员【${groupTip}】吗？`, '提示'
          confirmButtonText: 'confirm', // 确定
          cancelButtonText: 'cancel', // 取消
          type: 'warning'
        }).then(() => {
          let selectedIds = []
          for (let val of this.multipleSelection) {
            selectedIds.push(val.USER_ID)
          }
          return network.postData(`user/is-group`, {userIds: selectedIds, isGroup: isGroup})
        }).then(response => {
          this.$message({
            message: response,
            type: 'success'
          })
          this.getData(this.currentPage, this.pageSize)
        }).catch(response => {

        })
      },
      handleIsDecManage(isDec) {
          if (this.multipleSelection.length < 1) {
              this.$message({
                  message: 'Please check the member to be operated',//请勾选要操作的会员
                  type: 'warning'
              })
              return
          }
          let isDecTip = isDec === true ? 'set as Stockist ':' Cancel Stockist ' //'设为报单中心' : '取消报单中心'
          this.$confirm(`Are you sure you want to【${isDecTip}】？`, 'Hint', {//`确定要对所选会员【${isDecTip}】吗？`, '提示'
              confirmButtonText: 'confirm', // 确定
              cancelButtonText: 'cancel', // 取消
              type: 'warning'
          }).then(() => {
              let selectedIds = []
              for (let val of this.multipleSelection) {
                  selectedIds.push(val.USER_ID)
              }
              return network.postData(`user/is-dec`, {userIds: selectedIds, isDec: isDec})
          }).then(response => {
              this.$message({
                  message: response,
                  type: 'success'
              })
              this.getData(this.currentPage, this.pageSize)
          }).catch(response => {

          })
      },
        handleIsAtlasManage(isAtlas) {
            if (this.multipleSelection.length < 1) {
                this.$message({
                    message: 'Please check the member to be operated',//请勾选要操作的会员
                    type: 'warning'
                })
                return
            }
            let isAtlasTip = isAtlas === true ? 'show chart': 'hide chart'//'显示图谱' : '隐藏图谱'
            this.$confirm(`Are you sure you want to【${isAtlasTip}】？`, 'Hint', {//`确定要对所选会员【${isAtlasTip}】吗？`, '提示'
                confirmButtonText: 'confirm', // 确定
                cancelButtonText: 'cancel', // 取消
                type: 'warning'
            }).then(() => {
                let selectedIds = []
                for (let val of this.multipleSelection) {
                    selectedIds.push(val.USER_ID)
                }
                return network.postData(`user/is-atlas`, {userIds: selectedIds, isAtlas: isAtlas})
            }).then(response => {
                this.$message({
                    message: response,
                    type: 'success'
                })
                this.getData(this.currentPage, this.pageSize)
            }).catch(response => {

            })
        },
      getTypeName(type) {
        switch (type) {
          case 1:
            return 'By designated member'//按指定会员
          case 2:
            return 'Expand network by'//按开拓网络
          case 3:
            return 'By placement network'//按安置网络
          case 4:
            return 'By membership system'//按会员体系
          case 5:
            return 'By province and region'//按省份地区
          default:
            return ''
        }
      },
      handleLoginManage(type) {
        if (type === 2 || type === 3 || type === 4) {
          if (this.multipleSelection.length > 1) {
            this.$message({
              message: 'Multiple members are not allowed to be checked in this login management',//此登录管理不允许勾选多名会员
              type: 'warning'
            })
            return;
          } else if (this.multipleSelection.length < 1) {
            this.$message({
              message: 'Please select a member number',//请选择会员编号
              type: 'warning'
            })
            return;
          }
        }
        if (type === 1 && this.multipleSelection.length <= 0) {
          this.$message({
            message: 'Please select a member number',//请选择会员编号
            type: 'warning'
          })
          return;
        }
        if (type === 5 && this.multipleSelection.length > 0) {
          this.$message({
            message: 'Closing login by region without checking member',//按照地区关闭登录无需勾选会员
            type: 'warning'
          })
          return;
        }
        this.formCloseLogin = {
          userName: null,
          typeName: 'Login management',//登录管理
          type: null,
          isClose: 0,
          remark: '',
          areaSelected: null,
        },
          this.formCloseLogin.typeName = this.getTypeName(type) + 'Manage logins'//管理登录
        this.formCloseLogin.type = type
        this.dialogVisible = true
      },
      handleCloseLoginSubmit() {
        this.submitButtonStat = true
        // 获取所购选的会员，如果是批量关闭指定会员，则走批量关闭方法
        if (this.formCloseLogin.type === 1) {
          this.handleCloseLogin(this.formCloseLogin.isClose, this.formCloseLogin.remark)
        } else {
          for (let val of this.multipleSelection) {
            this.formCloseLogin.userName = val.USER_NAME.value
          }
          let path = 'user/close-login'
          if (this.formCloseLogin.type === 5) {
            path = 'user/close-area-login'
          }
          network.postData(path, this.formCloseLogin).then(response => {
            this.$message({
              message: response,
              type: 'success'
            })
            this.getData(this.currentPage, this.pageSize)
            this.submitButtonStat = false
            this.dialogVisible = false
          }).catch(response => {
            this.submitButtonStat = false
          })
        }
      },
      handleCloseLogin(isClose, remark = '') {
        let selectedIds = []
        for (let val of this.multipleSelection) {
          selectedIds.push(val.USER_ID)
        }
        console.log(selectedIds);
        network.postData(`user/batch-close-login`, {
          userIds: selectedIds,
          isClose: isClose,
          remark: remark,
          type: 1,
        }).then(response => {
          this.$message({
            message: response,
            type: 'success'
          })
          this.getData(this.currentPage, this.pageSize)
          this.submitButtonStat = false
          this.dialogVisible = false
        }).catch(response => {
          this.submitButtonStat = false
        })
        // let tipStr = isClose ? '禁止' : '允许'
        // this.$confirm(`确定要${tipStr}所选会员登录？`, 'Hint', {
        //   confirmButtonText: 'confirm', // 确定
        //   cancelButtonText: 'cancel', // 取消
        //   type: 'warning'
        // }).then(() => {
        //   return network.postData(`user/batch-close-login`, {userIds: selectedIds, isClose: isClose})
        // }).then(response => {
        //   this.$message({
        //     message: response,
        //     type: 'success'
        //   })
        //   this.getData(this.currentPage, this.pageSize)
        // }).catch(response => {
        //
        // })
      },
      handleExport() {
        this.$confirm(`Are you sure you want to export the current data？`, 'Hint', {//`确定要导出当前数据吗？`, '提示'
          confirmButtonText: 'confirm',//确定
          cancelButtonText: 'cancel',//取消
          type: 'warning'
        }).then(() => {
          return network.getData(`user/index-export`, this.filterModel)
        }).then(response => {
          this.$message({
            message: response,
            type: 'success'
          })
        }).catch(response => {

        })
      },
      onMessageCallback(data) {
        //this.getData(this.currentPage, this.pageSize, false)
      },
      handleDecManage(type) {
        if (type === 2 || type === 3 || type === 4) {
          if (this.multipleSelection.length > 1) {
            this.$message({
              message: 'Multiple members are not allowed to be checked in this entry management',//此报单管理不允许勾选多名会员
              type: 'warning'
            })
            return;
          } else if (this.multipleSelection.length < 1) {
            this.$message({
              message: 'Please check the member to manage the entry',//请勾选要管理报单的会员
              type: 'warning'
            })
            return;
          }
        }
        if (type === 1 && this.multipleSelection.length <= 0) {
          this.$message({
            message: 'Please check the member to manage the entry',//请勾选要管理报单的会员
            type: 'warning'
          })
          return;
        }
        if (type === 5 && this.multipleSelection.length > 0) {
          this.$message({
            message: 'Closing entry by region without checking memberManage entry',//按照地区关闭报单无需勾选会员
            type: 'warning'
          })
          return;
        }
        this.formCloseDec = {
          userName: null,
          typeName: 'Manage entry',//管理报单
          type: null,
          isClose: 0,
          remark: '',
          areaSelected: null,
        },
          this.formCloseDec.typeName = this.getTypeName(type) + 'Manage entry'//管理报单
        this.formCloseDec.type = type
        this.dialogDecVisible = true
      },
      handleModifyPassword(row){
        this.formModifyPassword.userId = row.USER_ID;
        this.dialogModifyPasswordVisible = true
      },
      handleModifyProfile(row){
          this.dialogModifyProfileVisible = true
          let vueObj = this
          network.getData('user/profile-get', {id: row.USER_ID}).then(response => {
              vueObj.formModifyProfile = response.userInfo
              vueObj.allOpenBank = response.allOpenBank
              vueObj.allNation = response.allNation
          })
      },
      handleCloseDecSubmit() {
        this.submitDecButtonStat = true
        // 获取所购选的会员，如果是批量关闭指定会员，则走批量关闭方法
        if (this.formCloseDec.type === 1) {
          this.handleCloseDec(this.formCloseDec.isClose, this.formCloseDec.remark)
        } else {
          for (let val of this.multipleSelection) {
            this.formCloseDec.userName = val.USER_NAME.value
          }
          let path = 'user/close-dec'
          if (this.formCloseDec.type === 5) {
            path = 'user/close-area-dec'
          }
          network.postData(path, this.formCloseDec).then(response => {
            this.$message({
              message: response,
              type: 'success'
            })
            this.getData(this.currentPage, this.pageSize)
            this.submitDecButtonStat = false
            this.dialogDecVisible = false
          }).catch(response => {
            this.submitDecButtonStat = false
          })
        }
      },
      handleCloseDec(isClose, remark = '') {
        let selectedIds = []
        for (let val of this.multipleSelection) {
          selectedIds.push(val.USER_ID)
        }
        network.postData(`user/batch-close-dec`, {
          userIds: selectedIds,
          isClose: isClose,
          remark: remark,
          type: 1,
        }).then(response => {
          this.$message({
            message: response,
            type: 'success'
          })
          this.getData(this.currentPage, this.pageSize)
          this.submitDecButtonStat = false
          this.dialogDecVisible = false
        }).catch(response => {
          this.submitDecButtonStat = false
        })
      },
        handleStatusActive(row){
            network.postData('user/modify-status',{userId:row.USER_ID,status:1}).then(response=>{
                    this.$message({
                        message: response,
                        type: 'success'
                    })
                    this.getData(this.currentPage, this.pageSize)
                })
        },
        handleStatusLock(row){
            network.postData('user/modify-status',{userId:row.USER_ID,status:0}).then(response=>{
                    this.$message({
                        message: response,
                        type: 'success'
                    })
                    this.getData(this.currentPage, this.pageSize)
                })
        },
      handleModifyPasswordSubmit() {
            this.submitPasswordButtonStat = true
              let path = 'user/modify-password'
              network.postData(path, this.formModifyPassword).then(response => {
                  this.$message({
                      message: response,
                      type: 'success'
                  })
                  this.getData(this.currentPage, this.pageSize)
                  this.submitPasswordButtonStat = false
                  this.dialogModifyPasswordVisible = false
              }).catch(response => {
                  this.submitPasswordButtonStat = false
              })
        },
        handleModifyProfileSubmit() {
            this.submitProfileButtonStat = true
            let path = 'user/modify-profile'
            network.postData(path, this.formModifyProfile).then(response => {
                this.$message({
                    message: response,
                    type: 'success'
                })
                this.getData(this.currentPage, this.pageSize)
                this.submitProfileButtonStat = false
                this.dialogModifyProfileVisible = false
            }).catch(response => {
                this.submitProfileButtonStat = false
            })
        },
    }
  }

</script>