<template>
    <el-container style="height: 100%;width: 100%;position: relative">
        <el-button type="primary" size="mini" v-if="tableObj.formOperate == 'view'" class="one-button" @click="execEvent">
            {{nameObj[tableObj.formOperate]}}
        </el-button>
        <el-button type="primary" size="mini" v-if="tableObj.formOperate != 'view'" class="two-button" @click="execEvent">
            {{nameObj[tableObj.formOperate]}}
        </el-button>
        <el-button type="primary" v-if="tableObj.formOperate != 'view'" size="mini" class="one-button" @click="cancel">
            取消
        </el-button>

        <table-form-render ref="singleRef"
                           is-sign-form
                           is-edit-data
                           v-if="reload"
                           :sourceId="sourceId"
                           :tableview-id="tableObj.tableViewId"
                           :data-id="tableObj.dataId"
                           :form-operate="tableObj.formOperate"
                           :form-id="tableObj.formId">
        </table-form-render>
    </el-container>
</template>

<script>
    export default {
        name: "table-resource-view",
        props:{
            tableObj:{type:Object},
            sourceId:{type:String},
        },
        data(){
            return {
                nameObj:{'add':"保存","view":"修改","update":"保存"},
                loginUser:{},
                reload:true,
            }
        },
        created() {
            this.init();
        },
        methods:{
            init(){
                this.loginUser = this.CACHE_GLOBAL.getLoginUser() || {};
            },
            /**
             * 修改保存
             */
            execEvent(){
                let vm = this;
                switch (this.tableObj.formOperate){
                    case "add":
                    case "update":
                        vm.save();
                        break;
                    case "view":
                        vm.update();
                        break;
                    default:
                        break;
                }
            },
            /**
             * 取消
             */
            cancel(){
                this.tableObj.formOperate = 'view';
                this.reload = false;
                this.$nextTick(() => {
                    this.reload = true;
                })
            },
            save(){
                let vm = this;
                let contentForm = vm.$refs.singleRef.optFormData || {};
                let optType = "add";
                if(contentForm.ID){
                    optType = "update";
                }
                let formDataRef = vm.$refs.singleRef;
                let formDataRefArr = Object.keys(vm.$refs.singleRef.$refs) || [];
                // formDataRef.$refs.tableFormRef.validate(validate => {
                //     if (!validate) {
                //         return;
                //     }
                let saveMessage = "保存成功！";
                if(!vm.loginUser){
                    vm.loginUser = {};
                }
                formDataRef.saveData(vm.loginUser.id||"",saveMessage,'','').then(async res=> {
                    if(res){
                        if(formDataRefArr.length > 0) {
                            formDataRefArr.forEach(arr => {
                                if(arr.includes("editTableRef_")) {
                                    let newRelationId = res.operateObj + "_" + arr.substring(arr.indexOf("_") + 1, arr.length);
                                    formDataRef.$refs[arr].saveData(this.loginUser.id || "","success","2",newRelationId);
                                }
                            })
                        }
                        // await vm.executShow(); //重新
                        this.tableObj["dataId"] = res.operateObj;
                        vm.tableObj.formOperate = 'view';
                        this.reload = false;
                        this.$nextTick(() => {
                            this.reload = true;
                        })
                    }
                });
                // });
            },

            update(){
                this.tableObj.formOperate = "update";
                this.$refs["singleRef"] && this.$refs["singleRef"].initData();
            }
        }
    }
</script>

<style scoped>
    .one-button,.two-button{
        position: absolute;top: 25px;right: 20px;z-index: 100;
    }
    .two-button{
        right: 80px;
    }
</style>
