<template>
  <div>
    <el-dialog  :title="title" :visible.sync="showDialog" width="600px" :close-on-click-modal="false"  :before-close="handleClose" append-to-body>
        <div class="infinite-list" style="overflow:auto;height:calc(100vh - 350px)">
            <div v-for="(item,index) in featuresHistory" :key="index" class="infinite-list-item">
                <div style="margin-bottom:10px;">
                    <el-radio-group v-model="radio" @input="getFeature(item)">
                        <el-radio :label="index">组合{{ index+1 }}</el-radio>
                    </el-radio-group>
                </div>
                <div>
                    <el-table
                        :data="item.featureSplitContent"
                        border
                        style="width: 100%"
                    >
                        <el-table-column  prop="sysOrder" label="特征" width="180">
                            <template slot-scope="scope">
                                <div>
                                    特征{{ scope.row.sysOrder }}
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="featureText"  label="特征内容" ></el-table-column>
                    </el-table>
                </div>
            </div>
        </div>
    </el-dialog>
    
  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
        radio:'',
        showDialog:false,
        title:'特征拆分历史',
        claimId:'',
        featuresHistory:[]
    };
  },
  watch: {},
  computed: {},
  created() {},
  mounted() {},
  methods: {
    open(claimId){
        this.claimId = claimId
        this.radio = ''
        this.getFeatureHistory()
        this.showDialog = true
    },
    handleClose(){
        this.showDialog = false
    },
    getFeatureHistory () {
        if(this.featuresHistory.length>0){
            return false
        }
        var params = {
            claimId:this.claimId
        }
        this.$api.queryClaimSplitHistory(params).then(response=>{
            if(response.code == 200){
                this.featuresHistory = response.data.data
            }
        }).catch(error=>{

        })
    },
    getFeature(val){
        var data = val.featureSplitContent.map(item=>{
            return {
                featureId:item.id,
                featureOrder:item.sysOrder,
                featureText:item.featureText,
                literatureId:[]
            }
        })
        this.$emit('feature',data)
        this.handleClose()
    }
  },
};
</script>
<style lang="scss" scoped>
</style>