选择履约模板 添加新增入口

src/common/components/drawer/index.vue

@@ -1,26 +1,25 @@
 <template>
-    <a-drawer
-        :placement="placement"
-        :closable="false"
-        :visible="visible"
-        :destroyOnClose="true"
-        class="bottomListed"
-        height="405px"
-    >
-        <!-- 摘牌是top  挂牌是bottom 期货交易是tradeDialog -->
-        <div class="collapse" @click="cancel">
-            <DoubleRightOutlined />
-        </div>
-        <div class="collapseCont">
-            <div class="title">{{ title }}</div>
-            <div class="content highContent">
-                <!-- <Listed></Listed> -->
-                <!-- <Delisting></Delisting> -->
-                <slot></slot>
-                <!-- <Trade></Trade> -->
-            </div>
-        </div>
-    </a-drawer>
+  <a-drawer :placement="placement"
+            :closable="false"
+            :visible="visible"
+            :destroyOnClose="true"
+            class="bottomListed"
+            height="405px">
+    <!-- 摘牌是top  挂牌是bottom 期货交易是tradeDialog -->
+    <div class="collapse"
+         @click="cancel">
+      <DoubleRightOutlined />
+    </div>
+    <div class="collapseCont">
+      <div class="title">{{ title }}</div>
+      <div class="content highContent">
+        <!-- <Listed></Listed> -->
+        <!-- <Delisting></Delisting> -->
+        <slot></slot>
+        <!-- <Trade></Trade> -->
+      </div>
+    </div>
+  </a-drawer>
 </template>
 
 <script lang="ts">

src/views/market/spot_trade/warehouse_receipt_trade/warehouse_receipt_trade_blocs/components/post-buying/permancePlanTmp.vue

@@ -5,6 +5,8 @@
           :visible="visible"
           @cancel="cancel"
           class="top486">
+    <span class="add-permance"
+          @click="open">新增</span>
     <a-spin :spinning="loading">
       <div>
         <div class="rulesCont"
@@ -27,6 +29,9 @@
       </div>
     </a-spin>
   </Drawer>
+  <Add v-if="show"
+       @cancel="close"
+       @update="close" />
 </template>
 
 <script lang="ts">
@@ -42,13 +47,17 @@ import { message } from 'ant-design-vue';
 import { getUsrId } from '@/services/bus/user';
 import { queryResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
 import { queryTableList } from '@/common/setup/table';
+import Add from './addPermance.vue';
+import { hanldeOpenAndCloseComponent } from './setup';
 
 export default defineComponent({
     emits: ['cancel', 'update'],
     name: 'queryQueryPermancePlanTmp',
-    components: { Des, Drawer, PlusOutlined, MinusOutlined, SearchOutlined },
+    components: { Des, Drawer, Add },
     setup(props, context) {
         const { visible, cancel } = _closeModal(context);
+        // 新增模板
+        const { show, close, open } = hanldeOpenAndCloseComponent();
 
         const param: QueryPermancePlanTmpReq = {
             userid: getUsrId(),
@@ -62,28 +71,18 @@ export default defineComponent({
             cancel,
             visible,
             tableList,
+            show,
+            close,
+            open,
         };
     },
 });
 </script>
 
 <style lang="less" scoped>
-.listed {
-    padding: 18px 20px 0;
-    .formBar {
-        height: calc(100% - 120px);
-        padding: 0 20px 0 13px;
-        margin-top: 16px;
-        background: #08131f;
-        border: 1px solid #10202f;
-        .item {
-            width: 100%;
-            height: 50px;
-            line-height: 50px;
-            border-bottom: 1px solid #10202f;
-            font-size: 16px;
-            color: #ffffff;
-        }
-    }
+.add-permance {
+    position: absolute;
+    top: 10px;
+    right: 20px;
 }
 </style>