Blame view

ant-design-vue-jeecg/src/views/jeecg/modules/SplitPanelModal.vue 1.49 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<template>
  <a-modal
    title="分屏"
    :width="modalWidth"
    :visible="visible"
    :bodyStyle="bodyStyle"
    style="top: 0px;"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">

    <split-pane :min-percent='20' :default-percent='50' split="vertical">
      <template slot="paneL">
        <split-panel-a></split-panel-a>
      </template>
      <template slot="paneR">
        <split-panel-b></split-panel-b>
      </template>
    </split-pane>

  </a-modal>
</template>

<script>
  import splitPane from 'vue-splitpane'
  import SplitPanelA from './SplitPanelA'
  import SplitPanelB from './SplitPanelB'
  export default {
    name: "SplitPanelModal",
    components:{
      splitPane,
      SplitPanelA,
      SplitPanelB
    },
    data () {
      return {
        visible: false,
        bodyStyle:{
          padding: "0",
40
41
42
          //update-begin---author:wangshuai ---date:20220104  for:[JTC-411]火狐 分屏 图片大时,与按钮重叠,样式不好------------
          height:(window.innerHeight-140)+"px"
          //update-begin---author:wangshuai ---date:20220104  for:[JTC-411]火狐 分屏 图片大时,与按钮重叠,样式不好------------
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
        },
        modalWidth:800,
      }
    },
    created () {
      this.modalWidth = window.innerWidth-0;
    },
    methods: {
      show () {
        this.visible = true;
      },
      handleOk(){

      },
      handleCancel () {
        this.visible = false;
      },
    }
  }
</script>

<style scoped>
</style>