rt-sim-training-client/src/views/orderauthor/permission/index.vue

<template>
    <div>
        <QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList">
        </QueryListPage>
        <qr-code ref="qrCode"></qr-code>
    </div>
</template>

<script>
    import { superAdmin } from '@/router';
    import { listPackagePermission, restorePackagePermission, getPackageQrCode, permissionDistributeUnPackage } from '@/api/management/distribute';
    import { UrlConfig } from '@/router/index';
    import QrCode from "@/components/QrCode";

    export default {
        name: 'author',
        components: {
            QrCode
        },
        data() {
            return {
                EffectiveTypeList: [],
                PermissionTypeList: [],
                pagerConfig: {
                    pageSize: 'pageSize',
                    pageIndex: 'pageNum'
                },
                queryForm: {
                    labelWidth: '120px',
                    reset: true,
                    queryObject: {
                        'userMobile': {
                            type: 'text',
                            label: this.$t('orderAuthor.founderPhone')
                        },
                        'userName': {
                            type: 'text',
                            label: this.$t('orderAuthor.founder')
                        },
                        'permissionType': {
                            type: 'select',
                            label: this.$t('orderAuthor.permissionType'),
                            config: {
                                data: []
                            }
                        },
                        'status': {
                            type: 'select',
                            label: this.$t('orderAuthor.authorityStatus'),
                            value: '1',
                            config: {
                                data: []
                            }
                        }
                    }
                },
                queryList: {
                    query: this.queryFunction,
                    selectCheckShow: false,
                    indexShow: true,
                    columns: [
                        {
                            title: this.$t('orderAuthor.organizationOrEnterprise'),
                            prop: 'organizationName'
                        },
                        {
                            title: this.$t('orderAuthor.founder'),
                            prop: 'userName'
                        },
                        {
                            title: this.$t('orderAuthor.founderPhone'),
                            prop: 'userMobile'
                        },
                        {
                            title: this.$t('orderAuthor.mapName'),
                            prop: 'mapName',
                        },
                        {
                            title: this.$t('orderAuthor.mapProductName'),
                            prop: 'mapProductName',
                        },
                        {
                            title: this.$t('orderAuthor.courseName'),
                            prop: 'lessonName',
                        },
                        {
                            title: this.$t('orderAuthor.permissionType'),
                            prop: 'permissionType',
                            type: 'tag',
                            columnValue: (row) => { return this.$convertField(row.permissionType, this.PermissionTypeList, ['value', 'label']) },
                            tagType: (row) => { return '' }
                        },
                        {
                            title: this.$t('orderAuthor.publicOrPrivate'),
                            prop: 'canDistribute',
                            type: 'tag',
                            columnValue: (row) => { return this.$ConstSelect.translate(row.canDistribute, 'PermissionUseList') },
                            tagType: (row) => {
                                switch (row.canDistribute) {
                                    case true: return 'success';
                                    case false: return 'danger';
                                }
                            }
                        },
                        {
                            title: this.$t('orderAuthor.permanenceOrNot'),
                            prop: 'forever',
                            type: 'tag',
                            columnValue: (row) => { return this.$ConstSelect.translate(row.forever, 'Whether') },
                            tagType: (row) => {
                                switch (row.forever) {
                                    case true: return 'success';
                                    case false: return 'danger';
                                }
                            }
                        },
                        {
                            title: this.$t('orderAuthor.startTime'),
                            prop: 'startTime',
                            type: 'formatter',
                            formatter: this.formatterDate

                        },
                        {
                            title: this.$t('orderAuthor.endTime'),
                            prop: 'endTime',
                            type: 'formatter',
                            formatter: this.formatterDate
                        },
                        {
                            title: this.$t('orderAuthor.authorityStatus'),
                            prop: 'status',
                            type: 'tag',
                            columnValue: (row) => { return this.$convertField(row.status, this.EffectiveTypeList, ['value', 'label']) },
                            tagType: (row) => {
                                switch (row.status) {
                                    case '1': return 'success';
                                    default: return 'danger';
                                }
                            }
                        },
                        {
                            type: 'button',
                            title: this.$t('global.operate'),
                            width: '300',
                            hide: (row) => { return this.$store.state.user.roles.indexOf(superAdmin) < 0; },
                            buttons: [
                                {
                                    name: this.$t('orderAuthor.obtainQrCode'),
                                    handleClick: this.handleRtCodeShow,
                                    type: '',
                                    showControl: (row) => { return true }
                                },
                                {
                                    name: this.$t('orderAuthor.authorityDetails'),
                                    handleClick: this.handlePermissionDetail,
                                    type: '',
                                    showControl: (row) => { return row.status == '1' && (row.source == '02' || row.source == '04') }
                                },
                                {
                                    name: this.$t('orderAuthor.recovery'),
                                    handleClick: this.handleRestore,
                                    type: 'danger',
                                    showControl: (row) => { return row.status == '1' && row.source == '04' }
                                },
                                {
                                    name: this.$t('orderAuthor.unpacking'),
                                    handleClick: this.handleUnPackage,
                                    type: 'danger',
                                    showControl: (row) => { return row.status == '1' && row.source == '02' }
                                }
                            ]
                        }
                    ],
                    actions: [
                        { text: this.$t('orderAuthor.privilegePackaging'), btnCode: 'employee_insert', handler: this.handlePackage },
                    ]
                }
            }
        },

        mounted() {
            this.loadInitData();
        },
        methods: {
            loadInitData() {
                this.$Dictionary.effectiveType().then(list => {
                    list.forEach(elem => {
                        this.queryForm.queryObject.status.config.data.push({ value: elem.code, label: elem.name });
                    })
                    this.$convertList(list, this.EffectiveTypeList, elem => {
                        return true;
                    });
                });
                this.$Dictionary.permissionType().then(list => {
                    list.forEach(elem => {
                        this.queryForm.queryObject.permissionType.config.data.push({ value: elem.code, label: elem.name });
                    });
                    this.$convertList(list, this.PermissionTypeList, elem => {
                        return true;
                    });
                    this.PermissionTypeList.push({ value: undefined, label: this.$t('orderAuthor.permissionPack') });
                });
            },
            formatterDate(row, porpInfo) {
                if (row.hasOwnProperty(porpInfo.property)) {
                }
                return row[porpInfo.property];
            },
            queryFunction(params) {
                return listPackagePermission(params);
            },
            reloadTable() {
                if (this.queryList && this.queryList.reload) {
                    this.queryList.reload()
                }
            },
            handlePermissionDetail(index, row) {
                this.$router.push({ path: `${UrlConfig.orderauthor.transferDetail}/${row.id}` })
            },
            handleRtCodeShow(index, row) {
                getPackageQrCode({ id: row.id }).then(resp => {
                    this.$refs.qrCode.doShow({
                        url: resp.data,
                        title: this.$t('orderAuthor.privilegeTransferQRCode')
                    });
                }).catch(error => {
                    this.$messageBox(this.$t('tip.getQRCodeFailure'));
                })
            },
            handleRestore(index, row) {
                this.$confirm(this.$t('tip.recoveryPrivilegeTip'), this.$t('tip.hint'), {
                    confirmButtonText: this.$t('tip.confirm'),
                    cancelButtonText: this.$t('tip.cancel'),
                    type: 'warning'
                }).then(() => {
                    restorePackagePermission(row.id).then(resp => {
                        this.reloadTable();
                        this.$message.success(this.$t('tip.recoveryPrivilegesSuccessful'));
                    }).catch(error => {
                        this.$messageBox(this.$t('tip.recoveryPrivilegesFailed'));
                    })
                }).catch(() => { });
            },
            handleUnPackage(index, row) {
                this.$confirm(this.$t('tip.unpackingTip'), this.$t('tip.hint'), {
                    confirmButtonText: this.$t('tip.confirm'),
                    cancelButtonText: this.$t('tip.cancel'),
                    type: 'warning'
                }).then(() => {
                    permissionDistributeUnPackage(row.id).then(resp => {
                        this.reloadTable();
                        this.$message.success(this.$t('tip.unpackingSuccessful'));
                    }).catch(error => {
                        this.$messageBox(this.$t('tip.unpackingFailed'));
                    })
                }).catch(() => { });
            },
            handlePackage() {
                this.$router.push({ path: `${UrlConfig.orderauthor.trainferPackage}` })
            }
        }
    }
</script>