rt-sim-training-client/src/views/publish/runPlanCommon/chooseTemplatePlan.vue
2019-11-08 16:22:05 +08:00

111 lines
3.4 KiB
Vue

<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="dialogShow" width="80%" :before-close="doClose" :modal="false" :close-on-click-modal="false">
<QueryListPage ref="pageRules" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
<el-row type="flex" justify="center" class="button-group">
<el-button type="primary" :loading="loading" @click="handleConfirm">{{ $t('global.select') }}</el-button>
<el-button @click="dialogShow = false">{{ $t('global.cancel') }}</el-button>
</el-row>
</el-dialog>
</template>
<script>
import { runPlanTemplateList } from '@/api/runplan';
import { getPublishMapListOnline } from '@/api/jmap/map';
export default {
name: 'ChooseTemplatePlan',
data() {
return {
dialogShow: false,
loading: false,
mapIdList: [],
model: {},
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
reset: true,
labelWidth: '140px',
queryObject: {
name: {
type: 'text',
label: this.$t('publish.runPlanName')
}
}
},
queryList: {
query: this.queryFunction,
selectCheckShow: false,
radioShow: true,
columns: [
{
title: this.$t('publish.runPlanName'),
prop: 'name'
},
{
title: this.$t('publish.mapName'),
prop: 'mapId',
type: 'tag',
columnValue: (row) => {
return this.$convertField(row.mapId, this.mapIdList, ['id', 'name']);
},
tagType: (row) => { return 'success'; }
}
]
},
currentModel: {}
};
},
computed: {
title() {
return this.$t('publish.selectTemplateRunPlan');
}
},
methods: {
loadInitData() {
this.mapIdList = [];
getPublishMapListOnline().then(response => {
this.mapIdList = response.data;
});
},
doShow(model) {
this.loading = false;
this.dialogShow = true;
this.model = model;
this.loadInitData();
},
doClose() {
this.dialogShow = false;
},
queryFunction(params) {
params['mapId'] = this.model.mapId || '';
return runPlanTemplateList(params);
},
handleConfirm() {
this.doClose();
if (this.$refs && this.$refs.pageRules) {
const choose = this.$refs.pageRules.currentChoose();
if (choose) {
this.$emit('chooseConfirm', choose);
} else {
this.$messageBox(this.$t('publish.pleaseSelectTemplate'));
}
}
},
reloadTable() {
this.queryList.reload();
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.button-group {
margin-top: 20px;
}
</style>