<template>
    <div><button @click="showMaterialList()" class="btn btn-success "> 显示数据字典</button>  {{isShow}}</div>
  <!--      材料列表-->
  <modal :show.sync="isShow" width="900px"  >
    <header slot="modal-header" class="modal-header" style="height: 60px">
      <button type="button" class="close" @click="showMaterialList()"><span>关闭&times;</span></button>
      <h4 class="modal-title" align="center">材料列表</h4>
    </header>
    <!--材料列表-->
    <article slot="modal-body" class="modal-body" style="height: 600px">
      <div class="span " v-show="isShow" style="height: 560px">
        <material-data-list ></material-data-list>
      </div>
    </article>
    <footer slot="modal-footer" class="modal-footer" style="height: 70px">
      <button  type="button" class="btn btn-info btn-ln fr" @click='showMaterialList()'>关闭</button>
    </footer>
  </modal>
</template>

<script>
    export default {
        title:'数据字典',
        name: "materialData.vue",

      data(){
          return{

            //控制modal
            isShow : false,
          }
      },

      methods:{
        showMaterialList(){
          this.isShow = !this.isShow
        }
      }
    }
</script>

<style scoped>

</style>
