<template>
    <div>
        <div class="actionList">
            <i class="el-icon-back" @click="backToMember"></i>
            <span>动作列表</span>
        </div>
        <el-table
            :data="actionList" border class="actionListTable" lazy="true">
            <el-table-column prop="reply" label="回复消息" width="150">
            </el-table-column>
            <el-table-column prop="time" label="完成时间" width="100">
            </el-table-column>
            <el-table-column prop="type" label="动作类型" width="150">
            </el-table-column>
            <el-table-column label="操作" width="100">
                <template slot-scope="scope">
                    <el-row>
                        <el-button type="primary" size="mini" @click="deleteAction(scope.row)">删除</el-button>
                    </el-row>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>
<script>
    import Vue from 'vue';
    import {getMembersByGroup,deleteMemberBehaviorAction} from '@/api/simulation';
    export default {
        name: 'addAction',
        props: {
            group: {
                type: String,
                required: true
            },
            memberId:{
                type:String,
                required: true
            },
            behaviorId:{
                type:String,
                required: true
            }
        },
        data() {
            return {
                actionList:[],
            }
        },
        mounted(){
            this.loadInitData(this.$route.query);
        },
        methods:{
            loadInitData(obj) {
                let group=obj.group;
                let memberId=this.$props.memberId;
                let behaviorId=this.$props.behaviorId;
                getMembersByGroup(group).then(response=>{
                    let datalist=response.data;
                    for(let i=0;i<datalist.length;i++)
                    {
                        if(datalist[i].id==memberId)
                        {
                            let behaviorList=datalist[i].behaviorVOList;
                            for(let i=0;i<behaviorList.length;i++)
                            {
                                if(behaviorList[i].id==behaviorId)
                                {
                                    this.actionList=behaviorList[i].actionVOList;
                                    return;
                                }
                            }
                        }
                    }
                });
            },
            backToMember:function(){
                this.$emit('backToBehavior');
            },
            deleteAction(row){
                let group=this.$props.group;
                let memberId=this.$props.memberId;
                let behaviorId=this.$props.behaviorId;
                let actionId=row.id;
                deleteMemberBehaviorAction(group,memberId,behaviorId,actionId).then(resp => {
                    this.reloadTable();
                    this.$message.success('删除任务角色行为动作成功');
                }).catch(error => {
                    this.$messageBox(`删除任务角色行为动作失败: ${error.message}`);
                });
            },
            reloadTable(){
                this.loadInitData(this.$route.query);
            },
        }
    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    @import "src/styles/mixin.scss";
    .actionListTable{
        margin-top: 20px;
        margin-left: 5px;
        font-size: 15px;
        width:502px;
    }
    .actionList{
        margin-top: 20px;
        margin-left: 5px;
        font-size: 15px;
    }
</style>
