rt-sim-training-client/src/views/scriptManage/home.vue
2020-10-28 15:53:45 +08:00

337 lines
14 KiB
Vue

<template>
<div class="joylink-card">
<div class="scriptHeader">
<div class="scriptList">草稿{{ $t('scriptRecord.scriptList') }}</div>
<el-button size="small" type="primary" class="createScript" @click="handleCreate">{{ $t('scriptRecord.scriptCreate') }}</el-button>
<el-button type="primary" class="uploadDemo" size="mini" @click="importScript">
导入剧本
</el-button>
</div>
<QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" style="width: 91%;margin-left:4%;margin-top:20px;" />
<script-publish ref="publishScript" :title="$t('scriptRecord.publishScript')" @reloadTable="reloadTable" @create="handleConfirmPublish" />
<create-script ref="createScript" :title="$t('scriptRecord.createScript')" @reloadTable="reloadTable" @create="handleConfirmCreate" />
<create-script ref="modifyScript" :title="$t('scriptRecord.modifyScript')" @reloadTable="reloadTable" @create="handleConfirmModify" />
<import-script ref="importScript" @refresh="reloadTable" />
</div>
</template>
<script>
import Cookies from 'js-cookie';
import ConstConfig from '@/scripts/ConstConfig';
import { UrlConfig } from '@/scripts/ConstDic';
import { admin, superAdmin} from '@/router/index_APP_TARGET';
import {retractScript, publishScript, updateScript, deleteScript, getScriptPageList, createScript, getScriptExport} from '@/api/script';
import { launchFullscreen } from '@/utils/screen';
import { scriptDraftRecordNotifyNew, scriptRecordNotifyNew } from '@/api/simulation';
import CreateScript from './create';
import ScriptPublish from './publish';
import ImportScript from './importScript';
import { getSessionStorage } from '@/utils/auth';
export default {
name: 'ScriptDraft',
components: {
CreateScript,
ScriptPublish,
ImportScript
},
data() {
return {
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '100px',
reset: true,
show:false
},
loadingProjectList: ['login', 'design', 'xty', 'designxty', 'gzb', 'designxty', 'xadt', 'designxadt', 'drts', 'designdrts'],
queryList: {
query: this.queryFunction,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: this.$t('scriptRecord.scriptName'),
prop: 'name'
},
{
title: this.$t('scriptRecord.scriptDescription'),
prop: 'description'
},
{
title: this.$t('scriptRecord.status'),
prop: 'status',
type: 'tag',
columnValue: (row) => { return this.covertData(row); },
tagType: (row) => { return ''; }
},
{
title: this.$t('scriptRecord.revokeReason'),
prop: 'explanation'
},
{
type: 'button',
title: this.$t('scriptRecord.operate'),
width: '450',
buttons: [
{
name: this.$t('scriptRecord.scriptRecord'),
handleClick: this.drawUp,
type: 'success',
showControl:(row) => { return !(row.status == 1); }
},
{
name: this.$t('scriptRecord.scriptModify'),
handleClick: this.handleModify,
type: 'primary',
showControl:(row) => { return !(row.status == 1); }
},
{
name: this.$t('scriptRecord.scriptDelete'),
handleClick: this.deleteScript,
type: 'danger',
showControl:(row) => { return !(row.status == 1); }
},
{
name: this.covertButtonname(),
handleClick: this.publishScript,
type: 'primary',
showControl:(row) => { return row.status == 0; }
},
{
name: this.$t('scriptRecord.applyRevoke'),
handleClick: this.revokeScript,
type: 'primary',
showControl:(row) => { return row.status == 1; }
},
{
name: this.$t('scriptRecord.preview'),
handleClick: this.previewScript,
type: 'success'
// showControl:(row) => { return row.status==1},
},
{
name: '导出',
handleClick: this.exportScript,
type: 'primary',
showControl:(row) => { return !(row.status == 1); }
}
]
}
]
}
};
},
computed:{
project() {
return getSessionStorage('project');
}
},
watch: {
'$route' () {
this.reloadTable();
}
},
methods: {
queryFunction(params) {
return getScriptPageList(this.$route.params.mapId, params);
},
reloadTable() {
if (this.queryList && this.queryList.reload) {
this.queryList.reload();
}
},
drawUp(index, row) {
scriptRecordNotifyNew(row.id).then(resp => {
const query = { mapId: row.mapId, group: resp.data, scriptId: row.id, lang:row.lang, lineCode:this.$route.query.lineCode};
this.$router.push({ path: `${UrlConfig.scriptDisplayNew}/script`, query });
launchFullscreen();
}).catch(error => {
this.$messageBox(`${this.$t('scriptRecord.createSimulationFail')}: ${error.message}`);
});
},
deleteScript(index, row) {
this.$confirm(this.$t('scriptRecord.deleteScriptTip'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
deleteScript(row.id).then(response => {
this.$message.success(this.$t('scriptRecord.deleteScriptSucess'));
this.reloadTable();
}).catch(() => {
this.$messageBox(this.$t('scriptRecord.deleteScriptFail'));
});
}).catch(() => { });
},
// 确定创建
handleConfirmCreate(data) {
if (Cookies.get('user_lang') == 'en') {
data.lang = 'en';
} else {
data.lang = 'zh';
}
createScript(data).then(resp => {
this.reloadTable();
this.$message.success(this.$t('scriptRecord.createScriptSuccess'));
}).catch(error => {
this.$messageBox(`${this.$t('scriptRecord.createScriptFail')}: ${error.message}`);
});
},
// 修改
handleModify(index, row) {
this.$refs.modifyScript.doShow(row.id);
},
// 确认修改
handleConfirmModify(data) {
if (Cookies.get('user_lang') == 'en') {
data.lang = 'en';
} else {
data.lang = 'zh';
}
updateScript(data.id, data).then(resp => {
this.reloadTable();
this.$message.success(this.$t('scriptRecord.modifyScriptSuccess'));
}).catch(error => {
this.$messageBox(`${this.$t('scriptRecord.modifyScriptFail')}: ${error.message}`);
});
},
// 创建
handleCreate() {
this.$refs.createScript.doShow(null);
},
covertData(row) {
const releaseReview = ConstConfig.ConstSelect.releaseReview;
const lastData = Object.assign({}, row);
if (Cookies.get('user_lang') == 'en') {
releaseReview.forEach(function(element) {
const rolename = element.value;
if (lastData.status == rolename) {
lastData.status = element.enlabel;
}
});
} else {
releaseReview.forEach(function(element) {
const rolename = element.value;
if (lastData.status == rolename) {
lastData.status = element.label;
}
});
}
return lastData.status;
},
handleConfirmPublish(data) {
publishScript(data.id, {'scriptName':data.scriptName}).then(resp => {
this.reloadTable();
this.$message.success(this.$t('scriptRecord.publishScriptSuccess'));
}).catch(error => {
this.$messageBox(`${this.$t('scriptRecord.publishScriptFailed')}: ${error.message}`);
});
},
publishScript(index, row) {
// if (this.$store.getters.roles.indexOf(admin) >= 0 || this.$store.getters.roles.indexOf(superAdmin) >= 0) {
this.$refs.publishScript.doShow(row);
// } else {
// this.$confirm(this.$t('scriptRecord.releaseScriptTip'), this.$t('global.tips'), {
// confirmButtonText: this.$t('global.confirm'),
// cancelButtonText: this.$t('global.cancel'),
// type: 'warning'
// }).then(() => {
// publishScript(row.id, {name:''}).then(resp => {
// this.reloadTable();
// this.$message.success(this.$t('scriptRecord.releaseScriptSuccess'));
// }).catch(error => {
// this.$messageBox(`${this.$t('scriptRecord.releaseScriptFailed')}: ${error.message}`);
// });
// }).catch(() => { });
// }
},
covertButtonname() {
if (this.$store.getters.roles.indexOf(admin) >= 0 || this.$store.getters.roles.indexOf(superAdmin) >= 0) {
return this.$t('scriptRecord.publish');
} else {
return this.$t('scriptRecord.applyPublish');
}
},
revokeScript(index, row) {
this.$confirm(this.$t('scriptRecord.revokeScriptTip'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
retractScript(row.id).then(resp => {
this.reloadTable();
this.$message.success(this.$t('approval.revokeScriptSuccess'));
}).catch(error => {
this.$messageBox(`${this.$t('approval.revokeScriptFailed')}: ${error.message}`);
});
}).catch(() => { });
},
// 剧本预览
previewScript(index, row) {
scriptDraftRecordNotifyNew(row.id).then(resp => {
if (this.loadingProjectList.includes(this.project)) {
this.$store.dispatch('app/transitionAnimations');
}
const query = { mapId: row.mapId, group: resp.data, scriptId: row.id, try:0, lineCode:this.$route.query.lineCode};
this.$router.push({ path: `${UrlConfig.design.displayNew}/demon`, query });
launchFullscreen();
}).catch(error => {
this.$messageBox(`${this.$t('scriptRecord.createSimulationFail')}: ${error.message}`);
});
},
exportScript(index, row) {
getScriptExport(row.id).then(res=>{
const resultData = res.data;
if (resultData === false) {
return;
}
const content = new Blob([JSON.stringify(resultData)]);
const urlObject = window.URL || window.webkitURL || window;
const url = urlObject.createObjectURL(content);
const el = document.createElement('a');
el.href = url;
el.download = `${resultData.name}.json`;
el.click();
urlObject.revokeObjectURL(url);
});
},
importScript() {
this.$refs.importScript.doShow();
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.joylink-card{
height: 100%;
overflow: auto;
}
.createScript{
float: right;
margin-right:20px;
}
.scriptHeader{
display:inline-block;margin-top:40px;width: 90%;margin-left:5%;
}
.scriptList{
display:inline-block;padding:7px 0px
}
/deep/.el-button+.el-button {
margin-left: 5px;
margin-top: 5px;
}
.uploadDemo {
position: relative;
overflow: hidden;
float: right;
margin-right: 10px;
cursor: pointer;
padding: 10px 15px;
margin-top: 0px !important;
}
</style>