This commit is contained in:
joylink_cuiweidong 2021-01-28 14:45:52 +08:00
commit cea7af664e
2 changed files with 98 additions and 77 deletions

View File

@ -3,6 +3,7 @@
v-dialogDrag
:title="title"
:visible.sync="dialogVisible"
append-to-body
width="500px"
:before-close="handleClose"
center

View File

@ -1,69 +1,82 @@
<template>
<div>
<!-- style="position:relative" -->
<div class="scriptRecordNew" :style="{bottom:(offsetBottom-15)+'px'}">
<div v-show="isShow" class="scriptRecordNewIn">
<el-tabs type="card">
<el-tab-pane :label="$t('scriptRecord.scriptRecordTitle')+'('+language+')'">
<div class="eachScriptPanel">
<div class="scriptPanelLeft">
<div class="panelLeftSelect">
<div>
<span style="font-size:13px;">当前剧本角色:</span>
<span style="font-size:13px;">{{ getRoleName(memberId) }}</span>
</div>
<div class="quickChange">
<div class="quickChangeList" style="margin:10px 0px 10px 0px;overflow-y:auto;height:200px;">
<div v-for="member in quickChangeMember.list" :key="member.id" class="setGroupOut">
<span style="font-size: 14px">{{ member.normalName }}</span>
<span class="setGroup">
<span v-if="member.userId" class="hasSetted">已设置</span>
<span v-else class="settingBtn" @click="changeRole(member)">设置</span>
</span>
<div class="scriptRecordNew">
<div v-if="!dialogVisible" class="scriptRecordNewTitle" @click="minisize">
<span class="titleStyle">{{ $t('scriptRecord.scriptRecordTitle') }}</span>
</div>
</div>
<div>
<el-dialog
v-dialogDrag
:title="$t('scriptRecord.scriptRecordTitle')"
z-index="2008"
class="__scriptRecord"
:visible.sync="dialogVisible"
:modal="false"
append-to-body
:close-on-click-modal="false"
width="700px"
>
<div class="scriptRecordNewIn">
<el-tabs type="card">
<el-tab-pane :label="$t('scriptRecord.scriptRecordTitle')+'('+language+')'">
<div class="eachScriptPanel">
<div class="scriptPanelLeft">
<div class="panelLeftSelect">
<div>
<span style="font-size:13px;">当前剧本角色:</span>
<span style="font-size:13px;">{{ getRoleName(memberId) }}</span>
</div>
<div class="quickChange">
<div class="quickChangeList" style="margin:10px 0px 10px 0px;overflow-y:auto;height:200px;">
<div v-for="member in quickChangeMember.list" :key="member.id" class="setGroupOut">
<span style="font-size: 14px">{{ member.normalName }}</span>
<span class="setGroup">
<span v-if="member.userId" class="hasSetted">已设置</span>
<span v-else class="settingBtn" @click="changeRole(member)">设置</span>
</span>
</div>
</div>
</div>
</div>
<el-button-group v-if="!isReplaceBg" class="button-group">
<el-button v-if="isPause" size="small" type="primary" :disabled="executeDisabled" @click="pauseScript">{{ $t('scriptRecord.drivingPause') }}</el-button>
<el-button v-else size="small" type="primary" :disabled="executeDisabled" @click="executePlayScript">恢复</el-button>
<el-button size="small" type="danger" :disabled="!backDisabled" @click="dumpScenesData">{{ $t('scriptRecord.resetScript') }}</el-button>
<el-button v-if="backDisabled" size="small" type="primary" @click="startReplaceBg">{{ $t('scriptRecord.startReplaceBg') }}</el-button>
<el-button v-else size="small" type="primary" :disabled="backDisabled" @click="saveScenesStage">{{ $t('scriptRecord.saveBackground') }}</el-button>
<el-button size="small" type="success" :loading="isSavingScript" @click="saveScenesData">{{ $t('scriptRecord.saveData') }}</el-button>
</el-button-group>
</div>
<el-button-group v-if="!isReplaceBg" class="button-group">
<div class="scriptPanelRight">
<get-action-new ref="getAction" :group="group" :size="size" :member-list="memberList" @showConditionManage="showConditionManage" />
</div>
</div>
<template v-if="isReplaceBg">
<div class="mask" />
<el-button-group class="button-group">
<el-button v-if="isPause" size="small" type="primary" :disabled="executeDisabled" @click="pauseScript">{{ $t('scriptRecord.drivingPause') }}</el-button>
<el-button v-else size="small" type="primary" :disabled="executeDisabled" @click="executePlayScript">恢复</el-button>
<el-button size="small" type="danger" :disabled="!backDisabled" @click="dumpScenesData">{{ $t('scriptRecord.resetScript') }}</el-button>
<el-button v-if="backDisabled" size="small" type="primary" @click="startReplaceBg">{{ $t('scriptRecord.startReplaceBg') }}</el-button>
<el-button v-else size="small" type="primary" :disabled="backDisabled" @click="saveScenesStage">{{ $t('scriptRecord.saveBackground') }}</el-button>
<el-button size="small" type="success" :loading="isSavingScript" @click="saveScenesData">{{ $t('scriptRecord.saveData') }}</el-button>
<el-button size="small" type="primary" @click="confirmReplaceBg">{{ $t('scriptRecord.confirmReplaceBg') }}</el-button>
<el-button size="small" type="info" @click="cancelReplaceBg">{{ $t('scriptRecord.cancelReplaceBg') }}</el-button>
</el-button-group>
</template>
</el-tab-pane>
<el-tab-pane label="所有成员">
<div class="eachScriptPanel">
<all-script-role
ref="allScriptRole"
:member-id="memberId"
:tree-data="treeData"
:group="group"
@changeMode="changeMode"
@addMember="addMember"
/>
</div>
<div class="scriptPanelRight">
<get-action-new ref="getAction" :group="group" :size="size" :member-list="memberList" @showConditionManage="showConditionManage" />
</div>
</div>
<template v-if="isReplaceBg">
<div class="mask" />
<el-button-group class="button-group">
<el-button v-if="isPause" size="small" type="primary" :disabled="executeDisabled" @click="pauseScript">{{ $t('scriptRecord.drivingPause') }}</el-button>
<el-button v-else size="small" type="primary" :disabled="executeDisabled" @click="executePlayScript">恢复</el-button>
<el-button size="small" type="primary" @click="confirmReplaceBg">{{ $t('scriptRecord.confirmReplaceBg') }}</el-button>
<el-button size="small" type="info" @click="cancelReplaceBg">{{ $t('scriptRecord.cancelReplaceBg') }}</el-button>
</el-button-group>
</template>
</el-tab-pane>
<el-tab-pane label="所有成员">
<div class="eachScriptPanel">
<all-script-role
ref="allScriptRole"
:member-id="memberId"
:tree-data="treeData"
:group="group"
@changeMode="changeMode"
@addMember="addMember"
/>
</div>
</el-tab-pane>
</el-tabs>
</div>
<div class="scriptRecordNewTitle" @click="minisize">
<span class="titleStyle">{{ $t('scriptRecord.scriptRecordTitle') }}</span>
</div>
</el-tab-pane>
</el-tabs>
</div>
</el-dialog>
</div>
<add-script-member ref="addScriptMember" @addScriptMember="addScriptMember" />
<condition-manage ref="conditionManage" @clearConditionActionId="clearConditionActionId" />
@ -94,10 +107,6 @@ export default {
type: String,
required: true
},
offsetBottom:{
type: Number,
required: true
},
offset:{
type: Number,
required: true
@ -109,7 +118,6 @@ export default {
},
data() {
return {
isShow:true,
isFirst:true,
language:'',
isPause:false,
@ -128,7 +136,8 @@ export default {
memberList:[],
driverList:[],
activeTrainList:[],
oldMember:{id:null, type:''}
oldMember:{id:null, type:''},
dialogVisible: false
};
},
computed:{
@ -295,11 +304,7 @@ export default {
return '';
},
minisize() {
if (this.isShow) {
this.isShow = false;
} else {
this.isShow = true;
}
this.dialogVisible = true;
},
covert(data, roleTypeList) {
let lastData = data;
@ -568,10 +573,29 @@ export default {
}
};
</script>
<style lang="scss">
.__scriptRecord {
padding: 0;
pointer-events: none !important;
}
.__scriptRecord {
.el-dialog__header {
padding: 10px 0;
pointer-events: all !important;
text-align: center;
}
.el-dialog__body {
padding: 0;
pointer-events: all !important;
}
.el-dialog__headerbtn {
top: 10px;
right: 10px;
}
}
</style>
<style lang="scss" scoped>
.selectRolesTitle{
}
.button-group{
position: absolute;
left: 0;
@ -598,18 +622,16 @@ export default {
}
.scriptRecordNew{
position: absolute;
width: 700px;
z-index: 10;
left: 50%;
bottom: 0px;
transform: translateX(-50%) translateY(0);
right: 12px;
top: calc(45% + 100px);
}
.scriptRecordNewTitle{
position: absolute;
background: #fff;
border-radius: 5px 5px 0px 0px ;
border-radius: 5px 0px 0px 5px ;
padding: 5px 0px;
width: 100px;
width: 23px;
text-align: center;
left: 50%;
transform: translateX(-50%);
@ -619,9 +641,7 @@ export default {
.scriptRecordNewIn{
padding: 10px;
background: #fff;
border-radius: 5px 5px 0px 0px ;
height: 380px;
box-shadow: -1px -1px 3px #656565;
}
.scriptPanelRight{