bill-form.vue

<template>
  <Modal class-name="file-modal" v-model="modalShow"
    :mask-closable="false"
    :fullscreen="true" 
    :title="title">
    <div style="overflow: auto">
      <gms-bill-form
        :templateName="billtemplate"
        :id="billId"
        type="load"
        state="readOnly"
        v-if="init"
      ></gms-bill-form>
    </div>
    <div slot="footer">
      <Button @click="modalShow = false">关闭</Button>
      <Button @click="updateBatch" type="primary">已阅</Button>
    </div>
  </Modal>
</template>
<script>
export default {
  props: {
    title: {
      type: String,
      default: "单据详情"
    },
    billDefine: {
      type: String,
      default: ""
    },
    billId: {
      type: String,
      default: ""
    },
    id: {
      type: String,
      default: ""
    },
    billtemplate:{
      type: String,
      default: ""
    }
  },
  computed: {},
  filters: {},
  watch: {
    id: {
      handler(newVal, oldVal) {
        this.modalShow = newVal?true:false;
        this.init = false;
        this.$nextTick(() => {
          this.init = true;
        });
      },
    },
  },
  data() {
    return {
      modalShow:false,
      init:false,
    };
  },
  methods: {
    updateBatch(){
      let arr=[
        { 
          billDefine:this.billDefine,
          id:this.id,
          readState:1// 0 是未阅  1 是已阅读
        }
      ]
      this.$emit("updateBatch",arr);
      this.modalShow = false;
      this.init = false;
    }
  },
};
</script>
<style lang="less" scoped>
.table {
  .pageClass {
    margin: 10px;
  }
}
</style>