<template>
    <div class="main-Style" style="width: 100%;" >
        <Container>
            <Button @click="addArr()" type="success">添加</Button>
        </Container>
        <ul class="main-ul">
            <li v-for="(item,index) in getArrList" class="main-li" >
                <div class="main-li-div" >
                    <Label class="main-li-label" >关联属性</Label>
                    <Select v-model="item.key" class="main-li-item">
                        <Option v-for="item in propList" :value="item.busiName" :key="item.busiName">{{ item.busiDesc }}</Option>
                    </Select><!--<Input v-model="item.changeKey" />-->
                </div>
                <div  class="main-li-div">
                    <Label class="main-li-label">值</Label>
                </div>
                <div  class="main-li-div">
                    <Input class="main-li-item" clearable v-model="item.value" />
                </div>
                <div class="main-li-btn">
                    <Button  @click="delArr(index)" type="error">删除当前数组</Button>
                </div>
            </li>
        </ul>
    </div>
</template>

<script>
import * as components from './style';
import {PropertyMixin} from '../../service/main-tool-editor-type-mixin';
import Service from "../../service/tool-service";

export default {
    components: {
        ...components
    },
    mixins: [PropertyMixin],
    position: 'mainToolEditorTypeShowFlag',
    name: 'main-tool-editor-type-showFlag',
    data () {
        return {
            val: false,
            propList:[],
            arrList:[]
        };
    },
    mounted () {
        this.initCurrtField();
    },
    computed: {
        /*getChildList(){

            let currentInstance= this.$store.state.viewport.instances.get(this.$store.state.viewport.currentEditInstanceKey);
            // 为事件新增一项
            if (!currentInstance.data.linkageChangeValue) {
                currentInstance.data.linkageChangeValue = [];
            }
            if (!currentInstance.data.linkageChangeValue.values) {
                currentInstance.data.linkageChangeValue.values = [];
            }
            return currentInstance.data.linkageChangeValue.values;
        },*/
        getPropList(){

        },
        getArrList(){
            debugger;
            let currentInstance= this.$store.state.viewport.instances.get(this.$store.state.viewport.currentEditInstanceKey);
            // 为事件新增一项
            if (!currentInstance.data.extend.showFlag) {
                currentInstance.data.extend.showFlag = [];
            }
            return currentInstance.data.extend.showFlag;
        },
        applicationState () {
            return this.$store.state.application;
        },
        viewportState () {
            return this.$store.state.viewport;
        }
    },
    methods: {
        typeChange(val){
            debugger;
            this.into=false;
            this.isShow=false;
            switch (val){
                case "out":{

                }break;
                case "into":{
                  this.into=true;
                }break;
                case "isShow":{
                    this.isShow=true;
                }break;

            }
        },
        delArr(index){
            this.$store.commit('viewport/delShowFlagEventArr',{index:index});
        },
        addArr(){
            this.$store.commit('viewport/addShowFlagEventArr',{});
        },

        initPropList(){
            if(localStorage.propInfo&&localStorage.propInfo!="undefined") {
                let res = JSON.parse(localStorage.propInfo);
                let propArr = [];
                let targetArr = [];
                for (let propObj in res.prop) {
                    propArr = [...propArr, ...res.prop[propObj]];
                }
                let mockData = [];
                if(localStorage.selectProp&&localStorage.selectProp!="undefined") {
                    let pageObj = eval('(' + localStorage.selectProp + ')');//JSON.parse(localStorage.getItem("page"));
                    console.log(pageObj);
                    //  title:"",
                    propArr = [...propArr, ...pageObj];
                }
                this.propList = propArr;
                //});
            }
           // });
        },
        handleChange () {

        }
    },
    watch: {
        val (n, o) {
            if (n === o) {
                return;
            }
            this.setInstanceProps(n);
        },
        input1 (n, o) {
            if (n === o) {
                return;
            }
            this.setInstanceProps(n);
        },
        input2 (n, o) {
            if (n === o) {
                return;
            }
            this.setInstanceProps(n);
        }
    },
    created() {
        this.initPropList();
    }
};
</script>

<style lang="less" scoped>
</style>
