<template>
  <div :class="$style.wrapHeight">
    <div :class="$style.rowHeight">
      <sd-favorites-tree
        ref="tree"
        :type="1"
        :class="$style.lefttree"
        @treeSelectd="treeSelectd"
      ></sd-favorites-tree>
      <div :class="$style.rightcard">
        <a-card>
          <sd-data-table-ex
            ref="favoritiesTable"
            form-id="oaBookmarkContent"
            page-id="comp/bookmark/oaBookmarkContent"
            data-url="api/framework/v1/page/myBusinessList-with-trustor"
            :columns="columns"
            show-selection
            :actions="actions"
            :search-fields="['title']"
            :filter-expressions="expressions"
            @recordSaved="onRecordSaved"
            @recordsDeleted="onRecordsDeleted"
          >
            <template slot="fldSubject" slot-scope="text, record">
              <a @click="rowClick(record)">
                {{ text }}
              </a>
              <a-tooltip>
                <template slot="title">{{ record.groupPath }}</template>
                <a-tag v-if="record.srcTrustId" color="blue">
                  兼
                </a-tag>
              </a-tooltip>
            </template>
          </sd-data-table-ex>
        </a-card>
      </div>
    </div>
  </div>
</template>

<script>
import TableColumnTypes from '@/common/services/table-column-types'
import TableActionTypes from '@/common/services/table-action-types'
import openAsTrustId from '@/common/services/open-as-trust-id'
import components from './_import-components/sd-my-favorites-import'
import FavoritesService from './favorites-service.js'
const columns = [
  {
    title: '序号',
    customRender: (text, record, index) => `${index + 1}`,
    width: '80px',
  },
  {
    title: '所属类别',
    dataIndex: 'businessTypeName',
  },
  {
    title: '标题',
    dataIndex: 'title',
    scopedSlots: { customRender: 'fldSubject' },
  },
  {
    title: '是否置顶',
    dataIndex: 'topping',
    sdRender: TableColumnTypes.ex.switch,
    defaultSortOrder: 'desc',
  },
  {
    title: '收藏时间',
    dataIndex: 'creationTime',
    sdRender: TableColumnTypes.dateTime,
    sorter: true,
    defaultSortOrder: 'desc',
  },
  {
    title: '创建时间',
    dataIndex: 'docCreateTime',
    sdRender: TableColumnTypes.dateTime,
    sorter: true,
    sdHidden: true, // 隐藏此列
  },
  {
    title: 'pageID',
    dataIndex: 'pageId',
    sdHidden: true, // 隐藏此列
  },
  {
    title: 'url',
    dataIndex: 'url',
    sdHidden: true, // 隐藏此列
  },
  {
    title: '流程实例ID',
    dataIndex: 'instId',
    sdHidden: true, // 隐藏此列
  },
  {
    title: '业务类型ID',
    dataIndex: 'businessTypeId',
    sdHidden: true, // 隐藏此列
  },
]
export default {
  name: 'SdMyFavorites',
  metaInfo: {
    title: '我的收藏',
  },
  components,
  data() {
    return {
      columns,
      modelTreeData: [], // 弹窗下拉框树
      replacefields: {
        // 转换弹出框中选择树的默认字段
        title: 'text',
        key: 'id',
        value: 'id',
      },
      expandedKeys: [], // 当前展开的节点
      treeData: [], // 左侧收藏夹树
      actions: [
        {
          label: '取消收藏',
          id: 'cancelFavorites',
          type: TableActionTypes.batch, // 批处理按钮，选中文档时才能点击
          permission: 'oaBookmarkContent-delete', // data-table 的权限，需要写完整的
          callback: (keys, record) => {
            this.cancelFavorites(keys, record)
          },
        },
      ],
      selectdParentId: null,
      nodeID: null,
      expressions: [],
    }
  },
  mounted() {},
  methods: {
    // 树选择节点后获取列表数据
    treeSelectd(id, flag) {
      if (id.length < 1) return
      this.selectdParentId = parseInt(id)
      if (flag) {
        this.nodeID = parseInt(id)
      }
      const filter = []
      if (this.selectdParentId !== this.nodeID) {
        filter.push({
          dataType: 'long',
          name: 'folderId',
          op: 'eq',
          longValue: this.selectdParentId,
        })
      }
      this.expressions = filter
    },
    // 取消收藏
    cancelFavorites(keys, record) {
      const ids = []
      record.map((item) => {
        ids.push(item.id)
      })
      const params = {
        formId: 'oaBookmarkContent',
        ids: ids.join(','),
      }
      FavoritesService.deletedMyFavorites(params).then((res) => {
        if (res) {
          this.refresh(record.id)
        }
      })
      setTimeout(() => {
        this.$refs.tree.refresh(this.selectdParentId)
      }, 500)
    },
    // 刷新
    refresh(id) {
      this.$refs.favoritiesTable.$refs.dataTable.clearSelection()
      this.$refs.favoritiesTable.$refs.dataTable.refresh()
      this.$emit('recordSaved', id)
    },
    // 双击打开详情
    rowClick(record) {
      const url = record.instId ? `/sd-webflow/done-pages/${record.instId}` : record.url
      openAsTrustId(url, record.srcTrustId)
    },
    // 保存成功后刷新树
    onRecordSaved() {
      this.$refs.tree.refresh(this.selectdParentId)
    },
    // 删除成功后刷新树
    onRecordsDeleted() {
      this.$refs.tree.refresh(this.selectdParentId)
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.wrap-height {
  height: 100%;
  .row-height {
    display: flex;
    flex: auto;
    height: 100%;
    .lefttree {
      .spin {
        width: 100%;
        line-height: 30;
      }
    }
    .rightcard {
      flex: 1;
      width: calc(100% - 20%);
      height: 100%;
    }
  }
}
</style>
