130 lines
4.0 KiB
Vue
130 lines
4.0 KiB
Vue
<template>
|
|
<div>
|
|
<el-table
|
|
:data="dataPostProcessor(courseModel.pmsList)"
|
|
border
|
|
:summary-method="getSummaries"
|
|
show-summary
|
|
style="width: 100%; margin-top: 20px;"
|
|
>
|
|
<el-table-column prop="index" :label="`${$t('global.index')}`" />
|
|
<el-table-column prop="startTime" :label="`${$t('permission.startTime')}`" />
|
|
<el-table-column prop="endTime" :label="`${$t('permission.endTime')}`">
|
|
<template slot-scope="scope">
|
|
<span>{{ scope.row.endTime? scope.row.endTime: $t('global.perpetual') }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="amount" :label="$t('global.permissionAllNum')" />
|
|
<el-table-column prop="remains" :label="$t('global.remains')" />
|
|
<el-table-column prop="canDistribute" :label="$t('global.status')" width="100">
|
|
<template slot-scope="scope">
|
|
<el-tag :type="scope.row.canDistribute == true ? 'success':'danger'" disable-transitions>
|
|
{{ computedName(scope.row.canDistribute, 'PermissionUseList') }}</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<distribute-draft ref="distribute" @QrCodeShow="QrCodeShow" @initLoadPage="initLoadPage" />
|
|
<qr-code ref="qrCode" />
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import DistributeDraft from './distribute';
|
|
import QrCode from '@/components/QrCode';
|
|
|
|
export default {
|
|
name: 'LimitList',
|
|
components: {
|
|
DistributeDraft,
|
|
QrCode
|
|
},
|
|
props: {
|
|
courseModel: {
|
|
type: Object,
|
|
required: true
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
};
|
|
},
|
|
mounted() {
|
|
},
|
|
methods: {
|
|
computedName(prop, listType) {
|
|
return this.$ConstSelect.translate(prop, listType);
|
|
},
|
|
initLoadPage() {
|
|
this.$emit('initLoadPage');
|
|
},
|
|
dataPostProcessor(data) {
|
|
let index = 0;
|
|
if (data && data.length) {
|
|
data.map(elem => {
|
|
elem.index = ++index;
|
|
});
|
|
}
|
|
return data;
|
|
},
|
|
getSummaries(param) {
|
|
const { columns, data } = param;
|
|
const sums = [];
|
|
const needSumPropertys = ['remains', 'total'];
|
|
columns.forEach((column, index) => {
|
|
if (index === 0) {
|
|
sums[index] = this.$t('global.total');
|
|
return;
|
|
}
|
|
needSumPropertys.forEach(property => {
|
|
if (property === column.property) {
|
|
const values = data.map(item => Number(item[property]));
|
|
if (!values.every(value => isNaN(value))) {
|
|
let allow = 0; let notAllow = 0;
|
|
data.forEach((item) => {
|
|
if (item.canDistribute) {
|
|
allow = allow + Number(item.remains);
|
|
} else {
|
|
notAllow = notAllow + Number(item.remains);
|
|
}
|
|
});
|
|
sums[index] = this.$t('global.hasPermissionTip').replace('{0}', allow).replace('{1}', notAllow);
|
|
}
|
|
}
|
|
});
|
|
if (!sums[index]) {
|
|
sums[index] = '-';
|
|
}
|
|
});
|
|
return sums;
|
|
},
|
|
distribute(courseModel) { // 分发
|
|
if (this.$refs) {
|
|
this.$refs.distribute.doShow(courseModel);
|
|
}
|
|
},
|
|
QrCodeShow(data) {
|
|
if (this.$refs && data) {
|
|
this.$refs.qrCode.doShow(data);
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
@import "src/styles/mixin.scss";
|
|
|
|
.menu li {
|
|
border-right: solid white 1px;
|
|
}
|
|
|
|
ul {
|
|
line-height: 22px;
|
|
margin: 5px;
|
|
}
|
|
|
|
.noList {
|
|
text-align: center;
|
|
padding-top: 20px;
|
|
font-size: 20px;
|
|
}
|
|
</style>
|