diff --git a/public/instance/instance_default_image.png b/public/instance/instance_default_image.png
new file mode 100644
index 0000000..b0fe800
Binary files /dev/null and b/public/instance/instance_default_image.png differ
diff --git a/public/instance/instance_hint_icon.png b/public/instance/instance_hint_icon.png
new file mode 100644
index 0000000..11aaad4
Binary files /dev/null and b/public/instance/instance_hint_icon.png differ
diff --git a/public/instance/instance_list_item_info_content.png b/public/instance/instance_list_item_info_content.png
new file mode 100644
index 0000000..75fa4e1
Binary files /dev/null and b/public/instance/instance_list_item_info_content.png differ
diff --git a/public/instance/instance_show_more_icon.png b/public/instance/instance_show_more_icon.png
new file mode 100644
index 0000000..797be19
Binary files /dev/null and b/public/instance/instance_show_more_icon.png differ
diff --git a/public/instance/instance_upload_image.png b/public/instance/instance_upload_image.png
new file mode 100644
index 0000000..a7dceb6
Binary files /dev/null and b/public/instance/instance_upload_image.png differ
diff --git a/src/views/demo/resourcemanagement/aiinstance/AddInstanceModal.vue b/src/views/demo/resourcemanagement/aiinstance/AddInstanceModal.vue
new file mode 100644
index 0000000..a7a9229
--- /dev/null
+++ b/src/views/demo/resourcemanagement/aiinstance/AddInstanceModal.vue
@@ -0,0 +1,905 @@
+<template>
+  <div class="title-div">
+    <div class="title-span-div">
+      <div class="title-icon"></div>
+      <div class="title-span">创建算法实例</div>
+    </div>
+    <div class="close-button" @click="emits('changeAddModal',false)"></div>
+  </div>
+  <div class="interval"></div>
+  <div class="modal-content">
+    <div class="content-steps-div">
+      <a-steps class="content-steps" :current="instanceSteps" label-placement="vertical" :items="items" />
+    </div>
+    <div class="step0-info-div" v-if="instanceSteps == 0">
+      <div class="left-content">
+        <div class="item-title">实例名称</div>
+        <a-input style="margin-bottom: 12px;" class="item-input" v-model:value="instanceName" placeholder="请输入的字段不得超过20字" />
+        <div class="item-title">设置封面</div>
+        <div class="instance-image-item-div">
+          <div class="default-image-div">
+            <div class="default-image"></div>
+            <div class="default-title-div">默认</div>
+          </div>
+          <div class="select-image-div" @click="changeSelectImageModal(true)">
+            <div class="select-image-icon"></div>
+            <div style="margin-top: 9px;" class="select-image-span">支持JPG、PNG格式</div>
+            <div class="select-image-span">推荐尺寸300*200</div>
+            <div class="select-title-div">本地上传</div>
+          </div>
+        </div>
+        <div class="item-title">显示文案</div>
+        <a-input style="margin-bottom: 17px;" class="item-input" v-model:value="instanceDescription" placeholder="请输入的字段不得超过20字" />
+      </div>
+      <div class="right-content">
+        <div class="item-title">实例描述</div>
+        <a-input style="margin-bottom: 12px;" class="item-input" v-model:value="instanceDescription" placeholder="请输入的字段不得超过200字" />
+        <div class="item-title">显示颜色</div>
+        <div class="select-item-color-div">
+          <div :style="`background: ${item.value}`" class="color-item" v-for="item in colorOptions"></div>
+        </div>
+        <div class="item-title">关联事件</div>
+        <a-select
+          class="item-select"
+          v-model:value="selectEvents"
+          :options="selectEventsOptions"
+        />
+      </div>
+    </div>
+    <div class="step1-info-div" v-if="instanceSteps == 1">
+      <div class="item-title">AI算法</div>
+      <a-select
+        style="margin-bottom: 6px;"
+        class="item-select item-multiple-select"
+        mode="multiple"
+        v-model:value="selectAlgorithm"
+        :options="selectAlgorithmOptions"
+      />
+      <div style="display: flex;justify-content: space-between;align-items: center;" class="item-title">
+        识别标签
+        <div class="tag-list-button">
+          <div class="select-all-button">全选</div>
+          <div class="clear-button">清空</div>
+        </div>
+      </div>
+      <div class="tag-show-list-div">
+        <div class="list-title">
+          <div>算法</div>
+          <div>名称</div>
+          <div>枚举值</div>
+          <div>颜色</div>
+          <div>置信度</div>
+        </div>
+        <div class="tag-list-content">
+          <div class="list-item" v-for="value in 10">
+            <a-checkbox class="item-checkbox"></a-checkbox>
+            <div style="width: 72px;margin-right: 60px;" class="item-span">高速排水沟水沟水沟</div>
+            <div style="width: 72px;margin-right: 60px;" class="item-span">高速排水沟水沟水沟</div>
+            <div style="width: 72px;margin-right: 64px;" class="item-span">0</div>
+            <div class="item-color"></div>
+            <div class="item-believe">0.75</div>
+          </div>
+        </div>
+      </div>
+      <div class="item-title">画面识别区域</div>
+      <div class="identify-setting">
+        <div class="identify-setting-item" style="margin-right: 207px;">
+          <div class="item-label">水平方向</div>
+          <div class="item-value">
+             <a-input class="identify-setting-input" />
+             <div class="identify-setting-input-icon">%</div>
+          </div>
+        </div>
+        <div class="identify-setting-item">
+          <div class="item-label">垂直方向</div>
+          <div class="item-value">
+             <a-input class="identify-setting-input" />
+             <div class="identify-setting-input-icon">%</div>
+          </div>
+        </div>
+      </div>
+      <div class="item-title">
+        空间约束
+        <a-switch v-model:checked="spaceConstraints" style="margin-left: 21px;" />
+      </div>
+      <div class="space-constraints-setting">
+        <div class="setting-hint">
+          开启后，识别对象需要在制定区域内才生效，该区域需要在算法实例开启时设置。可用于非法人员闯入，疑似非法盗采等场景。
+        </div>
+        <div class="setting-content" v-if="spaceConstraints">
+          <div class="setting-item">
+            <div class="item-label">外扩距离</div>
+            <div class="item-value">
+              <a-input class="setting-input" />
+              <div class="setting-input-icon">米</div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="item-title">
+        时间约束
+        <a-switch v-model:checked="timeConstraints" style="margin-left: 21px;" />
+      </div>
+      <div class="time-constraints-setting">
+        <div class="setting-hint">开启后，仅在设置时间内开启AI识别。</div>
+        <div class="setting-content">
+          <div class="time-constraints-setting-item">
+            <div class="time-constraints-item-label">有效时段</div>
+            <div style="margin-right: 16px;" class="time-constraints-item-value">
+              <a-time-picker :bordered="false" placeholder="开始时间"/>
+            </div>
+            <div style="margin-right: 13px;display: flex;align-items: center;">-</div>
+            <div class="time-constraints-item-value">
+              <a-time-picker :bordered="false" placeholder="结束时间"/>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="step2-info-div" v-if="instanceSteps == 2">
+      <div class="step2-title">飞行速度</div>
+      <div class="step2-setting-div">
+        <div class="step2-hint">取值范围：1m/s-20m/s,飞行速度过快会导致画面模糊，无法识别到对象。</div>
+        <div class="step2-setting-content">
+          <div class="step2-input-div step2-first-input">
+            <a-input class="step2-input"/>
+            <div class="step2-input-icon">m/s</div>
+          </div>
+          <div class="step2-input-interval">-</div>
+          <div class="step2-input-div">
+            <a-input class="step2-input"/>
+            <div class="step2-input-icon">m/s</div>
+          </div>
+        </div>
+      </div>
+      <div class="step2-title">云台俯仰角</div>
+      <div class="step2-setting-div">
+        <div class="step2-hint">取值范围：0～-90°，俯仰角决定对象在画面中的角度。</div>
+        <div class="step2-setting-content">
+          <div class="step2-input-div step2-first-input">
+            <a-input class="step2-input"/>
+            <div class="step2-input-icon">°</div>
+          </div>
+          <div class="step2-input-interval">-</div>
+          <div class="step2-input-div">
+            <a-input class="step2-input"/>
+            <div class="step2-input-icon">°</div>
+          </div>
+        </div>
+      </div>
+      <div class="step2-title">识别对象画面占比</div>
+      <div class="step2-setting-div">
+        <div class="step2-hint">识别对象画面占比比例直接影响识别的准确率，实际需要
+结合航高、变焦倍率保证识别对象在画面中的占比。</div>
+        <div class="step2-setting-content">
+          <div class="step2-input-div step2-first-input">
+            <a-input class="step2-input"/>
+            <div class="step2-input-icon">%</div>
+          </div>
+          <div class="step2-input-interval">-</div>
+          <div class="step2-input-div">
+            <a-input class="step2-input"/>
+            <div class="step2-input-icon">%</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="interval"></div>
+  <div class="footer-div">
+    <a-button class="cancel-button" @click="emits('changeAddModal',false)">取消</a-button>
+    <a-button v-if="instanceSteps != 0" style="margin-right: 14px;" type="primary" class="next-button" @click="last">上一步</a-button>
+    <a-button v-if="instanceSteps != 2" type="primary" class="next-button" @click="next">下一步</a-button>
+    <a-button v-if="instanceSteps == 2" type="primary" class="next-button" @click="submit">确定</a-button>
+  </div>
+  <a-modal v-model:open="selectImageModal" title="选择封面" width="1000px" :footer="null" :destroyOnClose="true">
+    <SelectImageModal @changeSelectImageModal="changeSelectImageModal"/>
+  </a-modal>
+</template>
+
+<script setup lang="ts">
+import { ref, h, defineEmits, defineProps } from "vue"
+import SelectImageModal from "@/views/demo/resourcemanagement/ailist/SelectImageModal.vue";
+const emits = defineEmits(['changeAddModal'])
+const instanceSteps = ref(0)
+const instanceName = ref('')
+const instanceDescription = ref('')
+const selectEvents = ref('')
+const selectAlgorithm = ref()
+const spaceConstraints = ref(false)
+const timeConstraints = ref(false)
+const selectImageModal = ref(false)
+const selectEventsOptions = ref([
+  { label: 'aaa', value: 'aaa' }
+])
+const selectAlgorithmOptions = ref([
+  { label: 'bbb', value: 'bbb' },
+  { label: 'ccc', value: 'ccc' }
+])
+const items = ref([
+  { title: '基础信息', },
+  { title: '配置算法', },
+  { title: '航飞要求', },
+]);
+const colorOptions = ref([
+  { value: '#1951E0' },
+  { value: '#EB8588' },
+  { value: '#E9A7FA' },
+  { value: '#20B0DC' },
+  { value: '#ADE1FB' },
+  { value: '#98E5B4' },
+  { value: '#3ECE40' },
+  { value: '#DFE546' },
+  { value: '#FEA352' },
+  { value: '#E82FB7' },
+  { value: '#E96755' },
+  { value: '#085758' },
+  { value: '#0099A0' },
+  { value: '#BEEDD8' },
+  { value: '#FEEF30' },
+  { value: '#82D4E5' },
+  { value: '#8B87BF' },
+  { value: '#D9ADBB' },
+  { value: '#EAB869' },
+  { value: '#CED58E' },
+  { value: '#8DADB6' },
+])
+const next = () => {
+  instanceSteps.value ++
+}
+const last = () => {
+  instanceSteps.value --
+}
+const submit = () => {
+
+}
+const changeSelectImageModal = (type: boolean) => {
+  selectImageModal.value = type
+}
+
+</script>
+
+<style lang="scss" scoped>
+.title-div{
+  width: 100%;
+  height: 64px;
+  padding-top: 15px;
+  padding-left: 26px;
+  padding-right: 35px;
+  padding-bottom: 14px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  .title-span-div{
+    display: flex;
+    align-items: center;
+    .title-icon{
+      width: 3px;
+      height: 18px;
+      background: #0B60BD;
+      box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+      margin-right: 9px;
+    }
+    .title-span{
+      font-family: PingFangSC-Medium;
+      font-weight: 500;
+      font-size: 20px;
+      color: #11131B;
+      line-height: 33px;
+      text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+    }
+  }
+  .close-button{
+    width: 18px;
+    height: 18px;
+    background-image: url('/public/ailist/add_algorithm_close_button.png');
+    cursor: pointer;
+  }
+}
+.interval{
+  width: 100%;
+  height: 1px;
+  box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+  border: 1px solid #DBDBDB;
+  opacity: 0.66;
+}
+.modal-content{
+  padding-top: 33px;
+  // padding-left: 50px;
+  // padding-right: 50px;
+  .item-title{
+    font-family: PingFangSC-Medium;
+    font-weight: 500;
+    font-size: 16px;
+    color: #222738;
+    line-height: 33px;
+    text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+    margin-bottom: 9px;
+    .tag-list-button{
+      display: flex;
+      .select-all-button{
+        width: 66px;
+        height: 26px;
+        background: #0D68CB;
+        box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(28,29,34,0.06);
+        border: 1px solid #0D68CB;
+        font-family: PingFangSC-Regular;
+        font-weight: 400;
+        font-size: 12px;
+        color: #FFFFFF;
+        text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: 13px;
+        user-select: none;
+        cursor: pointer;
+        margin-right: 14px;
+      }
+      .clear-button{
+        width: 66px;
+        height: 26px;
+        background: #FFFFFF;
+        box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(28,29,34,0.06);
+        border: 1px solid #0D68CB;
+        font-family: PingFangSC-Regular;
+        font-weight: 400;
+        font-size: 12px;
+        color: #0D68CB;
+        // line-height: 33px;
+        text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-radius: 13px;
+        user-select: none;
+        cursor: pointer;
+      }
+    }
+  }
+  .item-input{
+    height: 40px;
+    box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+    border-radius: 2px;
+    border: 1px solid #CCCCCC;
+  }
+  .item-select{
+    width: 100%;
+    :deep(.ant-select-selector){
+      width: 100%;
+      height: 40px;
+      box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+      border-radius: 2px;
+      border: 1px solid #CCCCCC;
+    }
+    :deep(.ant-select-selection-item){
+      line-height: 38px;
+    }
+  }
+  .item-multiple-select{
+    :deep(.ant-select-selection-item){
+      line-height: 24px;
+    }
+  }
+  .content-steps-div{
+    padding: 0px 28px;
+    margin-bottom: 31px;
+    .content-steps{
+      :deep(.ant-steps-item-icon){
+        width: 28px;
+        height: 28px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-bottom: 13px;
+      }
+      :deep(.ant-steps-icon){
+        font-family: PingFangSC-Medium;
+        font-weight: 500;
+        font-size: 17px;
+        color: #FFFFFF;
+        line-height: 24px;
+        text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+      }
+      :deep(.ant-steps-item-title){
+        font-family: PingFangSC-Regular;
+        font-weight: 400;
+        font-size: 13px;
+        color: #191919;
+        line-height: 18px;
+        text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+      }
+      :deep(.ant-steps-item-active){
+        .ant-steps-item-title{
+          color: #0D68CB;
+        }
+      }
+    }
+  }
+  .step0-info-div{
+    padding-left: 28px;
+    display: flex;
+    .left-content{
+      width: 366px;
+      margin-right: 39px;
+      .instance-image-item-div{
+        display: flex;
+        width: 100%;
+        height: 155px;
+        margin-bottom: 12px;
+        .default-image-div{
+          position: relative;
+          width: 173px;
+          height: 155px;
+          background: #F5F5F5;
+          box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+          border: 2px dashed rgba(28,29,34,0.08);
+          margin-right: 19px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          .default-image{
+            width: 116px;
+            height: 116px;
+            background-image: url('/public/instance/instance_default_image.png');
+          }
+          .default-title-div{
+            position: absolute;
+            bottom: 0px;
+            left: 0px;
+            width: 100%;
+            height: 40px;
+            background: rgb(0, 0, 0, 0.75);
+            box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(28,29,34,0.06);
+            border-radius: 0px 0px 2px 2px;
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 14px;
+            color: #FFFFFF;
+            line-height: 33px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          }
+        }
+        .select-image-div{
+          position: relative;
+          width: 173px;
+          height: 155px;
+          background: #F5F5F5;
+          box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+          border: 2px dashed rgba(28,29,34,0.08);
+          padding-top: 26px;
+          cursor: pointer;
+          .select-image-icon{
+            width: 36px;
+            height: 36px;
+            background-image: url('/public/instance/instance_upload_image.png');
+            // margin-bottom: 9px;
+            margin: auto;
+          }
+          .select-image-span{
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 12px;
+            color: #000000;
+            line-height: 17px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+            text-align: center;
+          }
+          .select-title-div{
+            position: absolute;
+            bottom: 0px;
+            left: 0px;
+            width: 100%;
+            height: 40px;
+            background: rgb(0, 0, 0, 0.75);
+            box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(28,29,34,0.06);
+            border-radius: 0px 0px 2px 2px;
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 14px;
+            color: #FFFFFF;
+            line-height: 33px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          }
+        }
+      }
+    }
+    .right-content{
+      width: 366px;
+      .select-item-color-div{
+        height: 79px;
+        background: #F5F5F5;
+        box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+        border-radius: 2px;
+        padding: 15px 25px 14px 20px;
+        display: flex;
+        flex-wrap: wrap;
+        gap: 10px;
+        margin-bottom: 18px;
+        .color-item{
+          width: 20px;
+          height: 20px;
+          background: #1951E0;
+          box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(0,0,0,0.06);
+          // border: 1px solid #FFFFFF;
+          border-radius: 50%;
+        }
+      }
+    }
+  }
+  .step1-info-div{
+    padding-left: 90px;
+    padding-right: 88px;
+    .tag-show-list-div{
+      height: 139px;
+      box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+      border-radius: 2px;
+      border: 1px solid #CCCCCC;
+      margin-bottom: 6px;
+      .list-title{
+        height: 41px;
+        background: #F5F5F5;
+        // box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+        // border-radius: 2px;
+        font-family: PingFangSC-Medium;
+        font-weight: 500;
+        font-size: 12px;
+        color: #222738;
+        line-height: 33px;
+        text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+        padding-left: 41px;
+        padding-right: 67px;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        border-bottom: 1px solid rgb(219, 219, 219);
+      }
+      .tag-list-content{
+        height: calc(100% - 41px);
+        overflow: auto;
+        scrollbar-width: none;
+        ::-webkit-scrollbar{
+          width: 0;
+          height: 0;
+        }
+        .list-item{
+          height: 40px;
+          display: flex;
+          align-items: center;
+          border-bottom: 1px solid rgb(219, 219, 219);
+          padding-left: 12px;
+          .item-checkbox{
+            margin-right: 12px;
+          }
+          .item-span{
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 12px;
+            color: rgba(0,0,0,0.9);
+            line-height: 20px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+          }
+          .item-color{
+            width: 26px;
+            height: 26px;
+            background: #1951E0;
+            box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+            border-radius: 5px;
+            margin-right: 67px;
+          }
+          .item-believe{
+            width: 106px;
+            height: 27px;
+            background: #F5F5F5;
+            box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), inset 0px 1px 3px 0px rgba(0,0,0,0.17);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-family: PingFangSC-Medium;
+            font-weight: 500;
+            font-size: 12px;
+            color: #1C1D22;
+            line-height: 17px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+          }
+        }
+      }
+    }
+    .identify-setting{
+      height: 50px;
+      background: #F5F5F5;
+      box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+      border-radius: 2px;
+      padding-left: 40px;
+      display: flex;
+      align-items: center;
+      margin-bottom: 6px;
+      .identify-setting-item{
+        display: flex;
+        .item-label{
+          font-family: PingFangSC-Regular;
+          font-weight: 400;
+          font-size: 12px;
+          color: #222738;
+          line-height: 33px;
+          text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+          margin-right: 13px;
+        }
+        .item-value{
+          width: 123px;
+          height: 34px;
+          background: #FFFFFF;
+          box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(28,29,34,0.06);
+          border-radius: 2px 0px 0px 2px;
+          display: flex;
+          .identify-setting-input{
+            width: calc(100% - 24px);
+            height: 100%;
+            border: 0PX;
+            box-shadow: none;
+            font-family: Bebas;
+            font-size: 12px;
+            color: #222738;
+            line-height: 33px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+          }
+          .identify-setting-input-icon{
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 12px;
+            color: #222738;
+            line-height: 33px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+          }
+        }
+      }
+    }
+    .space-constraints-setting{
+      height: 83px;
+      background: #F5F5F5;
+      box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+      border-radius: 2px;
+      padding-left: 12px;
+      padding-right: 12px;
+      // padding-top: 14px;
+      display: flex;
+      align-items: center;
+      margin-bottom: 6px;
+      .setting-hint{
+        flex: 1;
+        height: 56px;
+        background: #EEF5FC;
+        box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(0,0,0,0.06);
+        border-radius: 2px;
+        padding: 8px 10px;
+        font-family: PingFangSC-Regular;
+        font-weight: 400;
+        font-size: 12px;
+        color: #0D68CB;
+        line-height: 20px;
+        text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+      }
+      .setting-content{
+        width: 250px;
+        height: 34px;
+        padding-left: 50px;
+        .setting-item{
+          display: flex;
+          .item-label{
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 12px;
+            color: #222738;
+            line-height: 33px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+            margin-right: 13px;
+          }
+          .item-value{
+            width: 123px;
+            height: 34px;
+            background: #FFFFFF;
+            box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(28,29,34,0.06);
+            border-radius: 2px 0px 0px 2px;
+            display: flex;
+            .setting-input{
+              width: calc(100% - 24px);
+              height: 100%;
+              border: 0PX;
+              box-shadow: none;
+              font-family: Bebas;
+              font-size: 12px;
+              color: #222738;
+              line-height: 33px;
+              text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+            }
+            .setting-input-icon{
+              font-family: PingFangSC-Regular;
+              font-weight: 400;
+              font-size: 12px;
+              color: #222738;
+              line-height: 33px;
+              text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+            }
+          }
+        }
+      }
+    }
+    .time-constraints-setting{
+      height: 83px;
+      background: #F5F5F5;
+      box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+      border-radius: 2px;
+      display: flex;
+      align-items: center;
+      padding-left: 13px;
+      padding-right: 38px;
+      margin-bottom: 25px;
+      .setting-hint{
+        width: 241px;
+        height: 56px;
+        background: #EEF5FC;
+        box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(0,0,0,0.06);
+        border-radius: 2px;
+        padding-top: 8px;
+        padding-left: 13px;
+        font-family: PingFangSC-Regular;
+        font-weight: 400;
+        font-size: 12px;
+        color: #0D68CB;
+        line-height: 20px;
+        text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+        margin-right: 39px;
+      }
+      .setting-content{
+        height: 34px;
+        .time-constraints-setting-item{
+          display: flex;
+          .time-constraints-item-label{
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 12px;
+            color: #222738;
+            line-height: 33px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+            margin-right: 13px;
+          }
+          .time-constraints-item-value{
+            width: 123px;
+            height: 34px;
+            background: #FFFFFF;
+            box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(28,29,34,0.06);
+            border-radius: 2px 0px 0px 2px;
+            display: flex;
+            
+          }
+        }
+      }
+    }
+  }
+  .step2-info-div{
+    padding: 0px 89px;
+    margin-bottom: 58px;
+    .step2-title{
+      font-family: PingFangSC-Medium;
+      font-weight: 500;
+      font-size: 16px;
+      color: #222738;
+      line-height: 33px;
+      // text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+      text-align: left;
+      margin-bottom: 10px;
+    }
+    .step2-setting-div{
+      height: 83px;
+      background: #F5F5F5;
+      padding-left: 13px;
+      // box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+      border-radius: 2px;
+      display: flex;
+      align-items: center;
+      margin-bottom: 6px;
+      .step2-hint{
+        width: 325px;
+        height: 56px;
+        background: #EEF5FC;
+        box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(0,0,0,0.06);
+        border-radius: 2px;
+        padding-left: 13px;
+        padding-right: 6px;
+        padding-top: 8px;
+        font-family: PingFangSC-Regular;
+        font-weight: 400;
+        font-size: 12px;
+        color: #0D68CB;
+        line-height: 20px;
+        text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+        margin-right: 36px;
+      }
+      .step2-setting-content{
+        height: 34px;
+        display: flex;
+        .step2-input-div{
+          display: flex;
+          width: 123px;
+          height: 34px;
+          background: #FFFFFF;
+          box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15), 0px 8px 6px 0px rgba(28,29,34,0.06);
+          border-radius: 2px 0px 0px 2px;
+          .step2-input{
+            border: 0px;
+            box-shadow: none;
+            height: 100%;
+            width: calc(100% - 33px);
+            font-family: Bebas;
+            font-size: 14px;
+            color: #222738;
+            line-height: 33px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+          }
+          .step2-input-icon{
+            width: 23px;
+            text-align: right;
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 12px;
+            color: #222738;
+            line-height: 33px;
+            text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+          }
+        }
+        .step2-first-input{
+          margin-right: 11px;
+        }
+        .step2-input-interval{
+          margin-right: 11px;
+          display: flex;
+          align-items: center;
+        }
+      }
+    }
+  }
+}
+.footer-div{
+  height: 86px;
+  display: flex;
+  align-items: center;
+  justify-content: end;
+  padding-right: 27px;
+  .cancel-button{
+    width: 101px;
+    height: 40px;
+    box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+    border-radius: 4px;
+    border: 1px solid #979797;
+    font-family: PingFangSC-Medium;
+    font-weight: 500;
+    font-size: 16px;
+    color: #222738;
+    line-height: 33px;
+    text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+    margin-right: 14px;
+  }
+  .next-button{
+    width: 146px;
+    height: 40px;
+    background: #0D68CB;
+    box-shadow: 0px 10px 30px 0px rgba(0,0,6,0.15);
+    border-radius: 4px;
+    font-family: PingFangSC-Medium;
+    font-weight: 500;
+    font-size: 16px;
+    color: #FFFFFF;
+    line-height: 33px;
+    text-shadow: 0px 10px 30px rgba(0,0,6,0.15);
+  }
+}
+</style>
diff --git a/src/views/demo/resourcemanagement/aiinstance/ShowInfoDrawer.vue b/src/views/demo/resourcemanagement/aiinstance/ShowInfoDrawer.vue
new file mode 100644
index 0000000..36715c9
--- /dev/null
+++ b/src/views/demo/resourcemanagement/aiinstance/ShowInfoDrawer.vue
@@ -0,0 +1,212 @@
+<template>
+  <div class="drawer-title">
+    <div class="title-content">
+      <div class="title-icon"></div>
+      <div class="title-span">算法实例详情</div>
+    </div>
+    <div class="title-tools-div">
+      <EditOutlined  style="font-size: 19px;margin-right: 19px;"/>
+      <div class="button-interval"></div>
+      <CloseOutlined style="font-size: 19px;"/>
+    </div>
+  </div>
+  <div class="drawer-content">
+    <img class="content-image" src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"/>
+    <div class="content-item-name">
+      <div class="item-name-label">实例名称</div>
+      <div class="item-name-value">公路-隔离栏破损识别</div>
+    </div>
+    <div class="content-item-description">
+      <div class="item-description-label">描述</div>
+      <div class="item-description-value">暂无描述</div>
+    </div>
+    <div class="content-interval"></div>
+    <div class="content-item">
+      <div class="item-label">显示内容</div>
+      <div class="item-value">破损隔离栏</div>
+    </div>
+    <div class="content-item">
+      <div class="item-label">关联事件</div>
+      <div class="item-value">-</div>
+    </div>
+    <div class="content-item">
+      <div class="item-label">AI算法</div>
+      <div class="item-value">高速隔离栏破损检测算法</div>
+    </div>
+    <div class="content-interval"></div>
+    <div class="content-item">
+      <div class="item-label" style="margin-right: 0px;width: 101px;">画面识别区域</div>
+      <div class="item-value" style="padding-left: 22px;">水平方向：100%  垂直方向：100%</div>
+    </div>
+    <div class="content-item">
+      <div class="item-label">空间约束</div>
+      <div class="item-value">关闭</div>
+    </div>
+    <div class="content-item">
+      <div class="item-label">时间约束</div>
+      <div class="item-value">关闭</div>
+    </div>
+    <div class="content-item">
+      <div class="item-label">航飞要求</div>
+      <div class="item-value">
+        <div>飞行速度：3m/s~15m/s</div>
+        <div>云台俯仰角：-30°～-90°</div>
+        <div>对象画面对比：5%～10%</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {} from "vue"
+import { EditOutlined, CloseOutlined } from '@ant-design/icons-vue'
+</script>
+
+<style lang="scss" scoped>
+.drawer-title{
+  width: 100%;
+  height: 63px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-left: 29px;
+  padding-right: 30px;
+  border-bottom: 1px solid #E7E7E7;
+  .title-content{
+    display: flex;
+    height: 34px;
+    align-items: center;
+    .title-icon{
+      width: 3px;
+      height: 18px;
+      background: #0B60BD;
+      margin-right: 9px;
+    }
+    .title-span{
+      font-family: PingFangSC-Medium;
+      font-weight: 500;
+      font-size: 20px;
+      color: #11131B;
+      line-height: 33px;
+    }
+  }
+  .title-tools-div{
+    display: flex;
+    height: 19px;
+    align-items: center;
+    .button-interval{
+      width: 1px;
+      height: 18px;
+      background: #E7E7E7;
+      margin-right: 16px;
+    }
+  }
+}
+.drawer-content{
+  padding: 30px;
+  .content-image{
+    width: 300px;
+    height: 200px;
+    margin-bottom: 32px;
+  }
+  .content-item-name{
+    display: flex;
+    margin-bottom: 18px;
+    .item-name-label{
+      width: 68px;
+      height: 26px;
+      background: #0B60BD;
+      font-family: PingFangSC-Regular;
+      font-weight: 400;
+      font-size: 14px;
+      color: #FFFFFF;
+      line-height: 20px;
+      margin-right: 21px;
+      display: flex;
+      align-items: center;
+      padding-left: 7px;
+    }
+    .item-name-value{
+      width: 294px;
+      height: 27px;
+      background: rgba(216, 216, 216, 0.34);
+      padding-left: 28px;
+      font-family: PingFangSC-Medium;
+      font-weight: 500;
+      font-size: 14px;
+      color: #1C1D22;
+      line-height: 20px;
+      display: flex;
+      align-items: center;
+    }
+  }
+  .content-item-description{
+    display: flex;
+    // margin-bottom: 18px;
+    .item-description-label{
+      width: 68px;
+      height: 26px;
+      font-family: PingFangSC-Regular;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8D8E90;
+      line-height: 20px;
+      margin-right: 21px;
+      display: flex;
+      align-items: center;
+      padding-left: 7px;
+    }
+    .item-description-value{
+      width: 294px;
+      height: 27px;
+      // background: rgba(216, 216, 216, 0.34);
+      padding-left: 28px;
+      font-family: PingFangSC-Medium;
+      font-weight: 500;
+      font-size: 14px;
+      color: #1C1D22;
+      line-height: 20px;
+      display: flex;
+      align-items: center;
+    }
+  }
+  .content-item{
+    display: flex;
+    margin-bottom: 18px;
+    .item-label{
+      width: 68px;
+      height: 26px;
+      font-family: PingFangSC-Regular;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8D8E90;
+      background: #f0f0f0;
+      line-height: 20px;
+      margin-right: 21px;
+      display: flex;
+      align-items: center;
+      padding-left: 7px;
+    }
+    .item-value{
+      width: 294px;
+      height: 27px;
+      // background: rgba(216, 216, 216, 0.34);
+      padding-left: 28px;
+      font-family: PingFangSC-Medium;
+      font-weight: 500;
+      font-size: 14px;
+      color: #1C1D22;
+      line-height: 27px;
+      // display: flex;
+      // align-items: center;
+    }
+  }
+  .content-interval{
+    width: 100;
+    height: 1px;
+    background: #E7E7E7;
+    margin-bottom: 30px;
+    margin-top: 30px;
+  }
+}
+</style>
diff --git a/src/views/demo/resourcemanagement/aiinstance/index.vue b/src/views/demo/resourcemanagement/aiinstance/index.vue
new file mode 100644
index 0000000..1cd5625
--- /dev/null
+++ b/src/views/demo/resourcemanagement/aiinstance/index.vue
@@ -0,0 +1,393 @@
+<template>
+  <div class="page-out">
+    <div class="title">
+      <div class="search-div">
+        <a-input class="search-input" v-model:value="instanceName" placeholder="搜索实例名称…">
+          <template #prefix>
+            <div class="search-input-icon"></div>
+          </template>
+        </a-input>
+        <a-select
+          placeholder="请选择算法"
+          class="select-algorithm"
+          v-model:value="instanceAlgorithm"
+          :options="algorithmOptions"
+        />
+        <a-button class="search-button" type="primary">查询</a-button>
+      </div>
+      <a-button class="add-instance" type="primary" :icon="h(PlusOutlined)" @click="changeAddModal(true)">新建算法实例</a-button>
+    </div>
+    <div class="show-list-div">
+      <div class="show-list">
+        <div class="item-list" v-for="value in 10">
+          <div class="image-div">
+            <img class="image-item" src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png">
+            <div class="image-icon">盖板缺失</div>
+          </div>
+          <div class="show-info-div">
+            <div class="info-title-div">
+              <div class="info-icon"></div>
+              <div class="info-title-inner">
+                <div class="info-title">公路-排水沟盖板确实是识别</div>
+                <div style="display: flex;justify-content: space-between;">
+                  <div class="info-subtitle">暂无描述</div>
+                  <a-popover overlayClassName="instance-show-more-info-popover" trigger="click" placement="topRight">
+                    <template #content>
+                      <div class="show-more-content">
+                        <div class="content-raw">
+                          <div class="content-label">关联事件</div>
+                          <div class="content-value">
+                            <div>-</div>
+                            <div>-</div>
+                            <div>-</div>
+                          </div>
+                        </div>
+                        <div class="content-raw">
+                          <div class="content-label">关联算法</div>
+                          <div class="content-value">
+                            <div>#高速排水沟盖板缺失检测算法</div>
+                            <div>#高速排水沟盖板缺失检测算法</div>
+                            <div>#高速排水沟盖板缺失检测算法</div>
+                          </div>
+                        </div>
+                      </div>
+                    </template>
+                    <div class="show-more-info">
+                      <div class="show-more-span">展开更多</div>
+                      <div class="show-more-icon"></div>
+                    </div>
+                  </a-popover>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="item-footer">
+            <a-button class="item-del">删除</a-button>
+            <a-button class="item-show" type="primary" @click="showInfoDrawer = true">查看</a-button>
+          </div>
+        </div>
+      </div>
+      <div class="pagination-div">
+        <a-pagination
+          size="small"
+          :total="50"
+          show-size-changer
+          show-quick-jumper
+          :show-total="total => `共 ${total} 条数据`"
+        />
+      </div>
+    </div>
+    <a-modal width="853px" v-model:open="addInstanceModal" :footer="false" :closable="false" :destroyOnClose="true" :maskClosable="false" :keyboard="false">
+      <AddInstanceModal @changeAddModal="changeAddModal"/>
+    </a-modal>
+    <a-drawer
+    width="442px"
+      :closable="false"
+      v-model:open="showInfoDrawer"
+      placement="right"
+      rootClassName="instance-show-info-drawer"
+    >
+      <ShowInfoDrawer />
+    </a-drawer>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, h,  } from "vue"
+import { PlusOutlined, } from '@ant-design/icons-vue';
+import AddInstanceModal from "./AddInstanceModal.vue";
+import ShowInfoDrawer from "./ShowInfoDrawer.vue";
+const instanceName = ref('')
+const instanceAlgorithm = ref()
+const addInstanceModal = ref(false)
+const showInfoDrawer = ref(false)
+const algorithmOptions = ref([
+  { label: 'aaa', value: 'aaa' },
+])
+const changeAddModal = (type: boolean) => {
+  addInstanceModal.value = type
+}
+</script>
+
+<style lang="scss" scoped>
+.page-out{
+  padding: 16px 30px 53px 17px;
+  width: 100%;
+  height: 100%;
+  .title{
+    height: 58px;
+    background: #fff;
+    padding-left: 28px;
+    padding-right: 36px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 17px;
+    .search-div{
+      display: flex;
+      align-items: center;
+      font-family: PingFangSC-Regular;
+      font-weight: 400;
+      font-size: 16px;
+      line-height: 28px;
+      .search-input{
+        width: 232px;
+        height: 36px;
+        background: #FFFFFF;
+        border-radius: 4px;
+        border: 1px solid #30384F;
+        margin-right: 13px;
+        .search-input-icon{
+          width: 18px;
+          height: 18px;
+          background-image: url('/public/ailist/search_input_icon.png');
+        }
+      }
+      .select-algorithm{
+        margin-right: 13px;
+        :deep(.ant-select-selector){
+          width: 191px;
+          height: 36px;
+          background: #FFFFFF;
+          border-radius: 4px;
+          border: 1px solid #30384F;
+        }
+        :deep(.ant-select-selection-placeholder){
+          line-height: 34px;
+        }
+      }
+      .search-button{
+        width: 80px;
+        height: 36px;
+        background: #0B60BD;
+        border-radius: 4px;
+        font-family: PingFangSC-Medium;
+        font-weight: 500;
+        font-size: 16px;
+        color: #FFFFFF;
+        line-height: 22px;
+      }
+    }
+    .add-instance{
+      width: 148px;
+      height: 36px;
+      background: #0B60BD;
+      border-radius: 4px;
+      font-family: PingFangSC-Medium;
+      font-weight: 500;
+      font-size: 16px;
+      color: #FFFFFF;
+      line-height: 22px;
+    }
+  }
+  .show-list-div{
+    width: 100%;
+    height: calc(100% - 60px);
+    background: #fff;
+    padding: 26px 26px 0px 26px;
+
+    .show-list{
+      display: flex;
+      flex-wrap: wrap;
+      gap: 20px;
+      margin-bottom: 55px;
+      .item-list{
+        width: 300px;
+        height: 291px;
+        background: #FFFFFF;
+        box-shadow: 5px 18px 32px 0px rgba(28,29,34,0.1);
+        border-radius: 10px;
+        .image-div{
+          position: relative;
+          width: 300px;
+          height: 200px;
+          border-top-left-radius: 8px;
+          border-top-right-radius: 8px;
+          margin-bottom: 10px;
+          .image-item{
+            width: 300px;
+            height: 200px;
+            border-top-left-radius: 8px;
+            border-top-right-radius: 8px;
+          }
+          .image-icon{
+            position: absolute;
+            top: 0px;
+            left: 0px;
+            width: 46px;
+            height: 16px;
+            background: linear-gradient( 320deg, #6C90F5 0%, #3A57E8 100%);
+            border-radius: 8px 0px 8px 0px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 9px;
+            color: #FFFFFF;
+            line-height: 12px;
+          }
+        }
+        .show-info-div{
+          padding-left: 9px;
+          padding-right: 12px;
+          .info-title-div{
+            height: 40px;
+            display: flex;
+            align-items: center;
+            margin-bottom: 4px;
+            .info-icon{
+              width: 3px;
+              height: 34px;
+              background: #0B60BD;
+              margin-right: 5px;
+            }
+            .info-title-inner{
+              width: 100%;
+              .info-title{
+                font-family: PingFangSC-Medium;
+                font-weight: 500;
+                font-size: 14px;
+                color: #1C1D22;
+                line-height: 20px;
+                margin-bottom: 5px;
+              }
+              .info-subtitle{
+                font-family: PingFangSC-Regular;
+                font-weight: 400;
+                font-size: 11px;
+                color: rgba(28,29,34,0.5);
+                line-height: 15px;
+              }
+              
+              .show-more-info{
+                display: flex;
+                align-items: center;
+                user-select: none;
+                cursor: pointer;
+                .show-more-span{
+                  font-family: PingFangSC-Regular;
+                  font-weight: 400;
+                  font-size: 11px;
+                  color: #1C1D22;
+                  line-height: 15px;
+                  margin-right: 6px;
+                }
+                .show-more-icon{
+                  width: 12px;
+                  height: 8px;
+                  background-image: url('/public/instance/instance_show_more_icon.png');
+                }
+              }
+            }
+          }
+          .info-content-div{
+            width: 100%;
+            height: 66px;
+            background-image: url('/public/instance/instance_list_item_info_content.png');
+            padding-top: 8px;
+            padding-left: 12px;
+            margin-bottom: 13px;
+            .content-raw{
+              display: flex;
+              .content-label{
+                font-family: PingFangSC-Regular;
+                font-weight: 400;
+                font-size: 12px;
+                color: #1C1D22;
+                line-height: 17px;
+                margin-right: 11px;
+              }
+              .content-value{
+                font-family: PingFangSC-Medium;
+                font-weight: 500;
+                font-size: 12px;
+                color: #1C1D22;
+                line-height: 17px;
+              }
+            }
+          }
+        }
+        .item-footer{
+          width: 100%;
+          height: 23px;
+          display: flex;
+          align-items: center;
+          justify-content: end;
+          padding-right: 12px;
+          .item-del{
+            width: 54px;
+            height: 23px;
+            border-radius: 2px;
+            border: 1px solid #F2F2F2;
+            margin-right: 7px;
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 11px;
+            color: #E3150E;
+            line-height: 15px;
+          }
+          .item-show{
+            width: 54px;
+            height: 23px;
+            background: #0B60BD;
+            border-radius: 2px;
+            border: 1px solid #0B60BD;
+            font-family: PingFangSC-Regular;
+            font-weight: 400;
+            font-size: 11px;
+            color: #FFFFFF;
+            line-height: 15px;
+          }
+        }
+      }
+    }
+    .pagination-div{
+      padding-right: 32px;
+      // width: 100%;
+      height: 69px;
+      display: flex;
+      align-items: center;
+      justify-content: end;
+      border-top: 1px solid rgba(28,29,34,0.08);
+      margin-left: -26px;
+      margin-right: -26px;
+      padding-right: 45px;
+    }
+  }
+}
+
+</style>
+<style lang="scss">
+.instance-show-more-info-popover{
+  .ant-popover-inner{
+    background-color: rgba(5, 5, 5, 0.56);
+  }
+  .show-more-content{
+    width: 232px;
+    .content-raw{
+      display: flex;
+      .content-label{
+        font-family: PingFangSC-Regular;
+        font-weight: 400;
+        font-size: 12px;
+        color: #FFFFFF;
+        line-height: 17px;
+        margin-right: 11px;
+      }
+      .content-value{
+        font-family: PingFangSC-Medium;
+        font-weight: 500;
+        font-size: 12px;
+        color: #FFFFFF;
+        line-height: 17px;
+      }
+    }
+  }
+}
+.instance-show-info-drawer{
+  .ant-drawer-body{
+    padding: 0px;
+  }
+}
+</style>
\ No newline at end of file