rt-sim-training-client/src/views/orderauthor/rules/belong.vue

<template>
  <el-dialog v-dialogDrag :title="this.$t('orderAuthor.transferAttribution')" :visible.sync="dialogShow" width="90%" top="20px" :before-close="close">
    <div>
      <QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogShow = false">{{ $t('map.cancel') }}</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { gotPermissionUserList } from '@/api/management/author';

export default {
    name: 'Belong',
    components: {
    },
    props:{
        permissionTypeList:{
            required:true,
            type:Array
        },
        effectiveTypeList: {
            required:true,
            type:Array
        }
    },
    data() {
        return {
            dialogShow: false,
            userPermissionId: '',
            pagerConfig: {
                pageSize: 'pageSize',
                pageIndex: 'pageNum'
            },
            queryForm: {
                labelWidth: '140px',
                reset: true,
                show: false,
                queryObject: {
                }
            },
            queryList: {
                query: this.queryFunction,
                selectCheckShow: false,
                indexShow: true,
                columns: [
                    {
                        title: this.$t('permission.userName'),
                        prop: 'userName'
                    },
                    {
                        title: this.$t('permission.permissionName'),
                        width: '200',
                        prop: 'permissionName'
                    },
                    {
                        title: this.$t('permission.permissionType'),
                        prop: 'permissionType',
                        type: 'tag',
                        columnValue: (row) => { return this.$convertField(row.permissionType, this.permissionTypeList, ['value', 'label']); },
                        tagType: (row) => { return ''; }
                    },
                    {
                        title: this.$t('permission.permissionUseType'),
                        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('permission.isForever'),
                        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 'warning';
                            }
                        }
                    },
                    {
                        title: this.$t('permission.permissionTotal'),
                        prop: 'amount'
                    },
                    {
                        title: this.$t('permission.permissionRemains'),
                        prop: 'remains'
                    },
                    {
                        title: this.$t('permission.startTime'),
                        prop: 'startTime',
                        type: 'formatter',
                        formatter: this.formatterDate

                    },
                    {
                        title: this.$t('permission.endTime'),
                        prop: 'endTime',
                        type: 'formatter',
                        formatter: this.formatterDate
                    },
                    {
                        title: this.$t('permission.permissionStatus'),
                        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';
                            }
                        }
                    }
                ],
                actions: [
                ]
            }
        };
    },
    methods: {
        doShow(id) {
            this.userPermissionId = id;
            this.dialogShow = true;
            this.reloadTable();
        },
        close() {
            this.id = '';
            this.dialogShow = false;
        },
        queryFunction(params) {
            if (this.userPermissionId) {
                params['userPermissionId'] = this.userPermissionId;
                return gotPermissionUserList(params);
            }
        },
        reloadTable() {
            if (this.queryList && this.queryList.reload) {
                this.queryList.reload();
            }
        },
        turnback() {
            this.$router.go(-1);
        }
    }
};
</script>