<template>
  <div>
    <sd-favorites-tree
      ref="tree"
      :type="1"
      :hideleftbtn="true"
      @treeSelectd="treeSelectd"
    ></sd-favorites-tree>

    <!-- 新建收藏夹弹窗框 -->
    <sd-detail-modal
      ref="createFavoritesModal"
      :record-id="docId"
      page-id="comp/bookmark/kmBookmarkFolder"
      :modal-props="{ width: 450 }"
      @saved="fwSaved"
    >
      <template v-slot="{ model, fields }">
        <sd-create-modal
          :model="model"
          :fields="fields"
          @modalTreeSelectd="modalTreeSelectd"
        ></sd-create-modal>
      </template>
    </sd-detail-modal>
  </div>
</template>

<script>
import { Modal } from 'ant-design-vue'
import sdCreateModal from '../person-center/km-create-modal'
import sdFavoritesTree from '../person-center/km-favorites-tree'
import components from './_import-components/km-knowledage-collectmodal-import'

export default {
  name: 'KmKnowledageCollectmodal',
  metaInfo: {
    title: '收藏弹框',
  },
  components: {
    ...components,
    'sd-favorites-tree': sdFavoritesTree,
    'sd-create-modal': sdCreateModal,
  },
  props: {
    showCreatedMoldal: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      docId: null,
      modelSelectedKey: null,
    }
  },
  watch: {
    showCreatedMoldal: function(newValue) {
      this.docId = undefined
      this.$refs.createFavoritesModal.show()
    },
  },
  mounted() {},
  methods: {
    // 选择收藏夹
    treeSelectd(id) {
      if (id.length < 1) return
      this.modelSelectedKey = parseInt(id)
      this.$emit('selectKey', this.modelSelectedKey)
    },

    // 新建收藏夹保存
    fwSaved() {
      Modal.confirm({
        title: '新建收藏夹',
        content: '已保存',
      })
      this.$refs.tree.refresh(1)
    },
    modalTreeSelectd(id) {
      this.modelSelectedKey = id
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.spin {
  width: 100%;
  line-height: 30;
}
</style>
