xyc
2024-03-22 dab8585784975f653459a5753497db109bb784bc
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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<!--/**-->
<!--* Created By hui on 2019/7/19-->
<!--*/-->
<!--<template>-->
  <!--<div class="Drawer">-->
    <!--<div class="drawerContent"-->
         <!--:style="drawerStyle">-->
      <!--<header>-->
        <!--<span>{{title}}</span>-->
        <!--<span @click="cancle"><i class="el-icon-close"></i></span>-->
      <!--</header>-->
      <!--<section>-->
        <!--<slot></slot>-->
      <!--</section>-->
      <!--<footer>-->
        <!--<el-button type="primary" @click="onSubmit">新建</el-button>-->
        <!--<el-button @click="cancle">取消</el-button>-->
      <!--</footer>-->
    <!--</div>-->
    <!--<div v-show="show" class="dir" @click="cancle"></div>-->
  <!--</div>-->
<!--</template>-->
 
<!--<script>-->
  <!--export default {-->
    <!--name: `Drawer`,-->
    <!--props: {-->
      <!--width: {-->
        <!--type: String,-->
        <!--default: `300px`-->
      <!--},-->
      <!--left: {-->
        <!--type: String,-->
        <!--default: `auto`-->
      <!--},-->
      <!--right: {-->
        <!--type: String,-->
        <!--default: `auto`-->
      <!--},-->
      <!--title: {-->
        <!--type: String,-->
        <!--default: `提示`-->
      <!--},-->
      <!--show: {-->
        <!--type: Boolean,-->
        <!--default: false-->
      <!--}-->
    <!--},-->
    <!--data() {-->
      <!--return {-->
        <!--drawerStyle: null-->
      <!--}-->
    <!--},-->
    <!--created() {-->
      <!--if (this.show) {-->
        <!--this.drawerStyle = {-->
          <!--width: this.width,-->
          <!--left: this.left,-->
          <!--right: this.right-->
        <!--}-->
      <!--} else {-->
        <!--this.drawerStyle = {-->
          <!--width: this.width,-->
          <!--left: this.left === `auto` ? `auto` : `${-parseInt(this.width)}px`,-->
          <!--right: this.right === `auto` ? `auto` : `${-parseInt(this.width)}px`-->
        <!--}-->
      <!--}-->
    <!--},-->
    <!--methods: {-->
      <!--onSubmit() {-->
        <!--this.$emit(`onSubmit`)-->
      <!--},-->
      <!--cancle() {-->
        <!--this.$parent.drawerInfo.show = false-->
      <!--}-->
    <!--},-->
    <!--watch: {-->
      <!--show() {-->
        <!--console.log(this.show)-->
        <!--if (this.show) {-->
          <!--this.drawerStyle = {-->
            <!--width: this.width,-->
            <!--left: this.left,-->
            <!--right: this.right-->
          <!--}-->
        <!--} else {-->
          <!--this.drawerStyle = {-->
            <!--width: this.width,-->
            <!--left: this.left === `auto` ? `auto` : `${-parseInt(this.width)}px`,-->
            <!--right: this.right === `auto` ? `auto` : `${-parseInt(this.width)}px`-->
          <!--}-->
        <!--}-->
      <!--}-->
    <!--}-->
  <!--}-->
<!--</script>-->
 
<!--<style lang="less" scoped>-->
  <!--.Drawer {-->
    <!--.drawerContent {-->
      <!--position: fixed;-->
      <!--top: 0;-->
      <!--bottom: 0;-->
      <!--z-index: @z2;-->
      <!--background: @white;-->
      <!--transition: all 0.3s;-->
      <!--&gt; header {-->
        <!--height: 40px;-->
        <!--line-height: 40px;-->
        <!--padding: 0 20px;-->
        <!--border-bottom: 1px solid @borderColor;-->
        <!--display: flex;-->
        <!--justify-content: space-between;-->
        <!--align-items: center;-->
        <!--color: @title;-->
        <!--&gt; span {-->
          <!--&:last-child {-->
            <!--font-size: 20px;-->
            <!--cursor: pointer;-->
          <!--}-->
        <!--}-->
      <!--}-->
      <!--&gt; section {-->
        <!--min-height: 400px;-->
        <!--padding: 20px;-->
      <!--}-->
      <!--&gt; footer {-->
        <!--display: flex;-->
        <!--justify-content: center;-->
        <!--align-items: center;-->
        <!--&gt; .el-button {-->
          <!--margin: 0 20px;-->
        <!--}-->
 
      <!--}-->
    <!--}-->
    <!--&gt; .dir {-->
      <!--cursor: pointer;-->
      <!--position: fixed;-->
      <!--top: 5px;-->
      <!--bottom: 5px;-->
      <!--left: 5px;-->
      <!--right: 5px;-->
      <!--background: rgba(0, 0, 0, 0.1);-->
      <!--z-index: @z1;-->
    <!--}-->
  <!--}-->
<!--</style>-->