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

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

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

export default {
	name: 'Author',
	components: {
		QrCode,
		Qcode
	},
	data() {
		return {
			EffectiveTypeList: [],
			PermissionTypeList: [],
			pagerConfig: {
				pageSize: 'pageSize',
				pageIndex: 'pageNum'
			},
			queryForm: {
				labelWidth: '140px',
				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: '状态',
						value: '1',
						config: {
							data: []
						}
					}
				}
			},
			queryList: {
				query: this.queryFunction,
				selectCheckShow: false,
				indexShow: true,
				columns: [
					{
						title: this.$t('orderAuthor.organizationOrEnterprise'),
						prop: 'organizationName'
					},
					{
						title: this.$t('orderAuthor.permissionName'),
						prop: 'permissionName'
					},
					{
						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 'warning';
							}
						}
					},
					{
						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 'warning';
							}
						}
					},
					{
						title: '总数量',
						prop: 'amount'
					},
					{
						title: '剩余数量',
						prop: 'remains'
					},
					{
						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: '状态',
						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: this.$i18n.locale == 'en' ? '400': '300',
						hide: (row) => { return this.$store.state.user.roles.indexOf(admin) < 0; },
						buttons: [
							{
								name: this.$t('orderAuthor.obtainQrCode'),
								handleClick: this.handleRtCodeShow,
								type: '',
								showControl: (row) => { return row.status == '1'; }
							},
							{
								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 },
					{ text: '领取权限', handler: this.handlerPermission, show: process.env.NODE_ENV == 'development' }
				]
			}
		};
	},

	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) {
			return row[porpInfo.property] ? 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(() => {
				this.$messageBox(this.$t('tip.getQRCodeFailure'));
			});
		},
		handleRestore(index, row) {
			this.$confirm(this.$t('tip.recoveryPrivilegeTip'), this.$t('global.tips'), {
				confirmButtonText: this.$t('global.confirm'),
				cancelButtonText: this.$t('global.cancel'),
				type: 'warning'
			}).then(() => {
				restorePackagePermission(row.id).then(resp => {
					this.reloadTable();
					this.$message.success(this.$t('tip.recoveryPrivilegesSuccessful'));
				}).catch(() => {
					this.$messageBox(this.$t('tip.recoveryPrivilegesFailed'));
				});
			}).catch(() => { });
		},
		handleUnPackage(index, row) {
			this.$confirm(this.$t('tip.unpackingTip'), this.$t('global.tips'), {
				confirmButtonText: this.$t('global.confirm'),
				cancelButtonText: this.$t('global.cancel'),
				type: 'warning'
			}).then(() => {
				permissionDistributeUnPackage(row.id).then(resp => {
					this.reloadTable();
					this.$message.success(this.$t('tip.unpackingSuccessful'));
				}).catch(() => {
					this.$messageBox(this.$t('tip.unpackingFailed'));
				});
			}).catch(() => { });
		},
		handlePackage() {
			this.$router.push({ path: `${UrlConfig.orderauthor.trainferPackage}` });
		},
		handlerPermission() {
			this.$refs.qcode.doShow();
		}
	}
};
</script>