<template>
  <ele-page flex-table>
    <book-search @search="reload"></book-search>

    <common-table
      ref="pageRef"
      :pageConfig="pageConfig"
      :columns="columns"
      :tools="false"
      @sort-change="handleSortChange"
    >
      <template #toolbar>
        <el-radio-group @change="handleStatusChange" v-model="bookTag">
          <el-radio-button label="全部" value="-1" />
          <el-radio-button label="教材库" value="1" />
          <el-radio-button label="社科库" value="2" />
        </el-radio-group>
      </template>

      <template #cover="{ row }">
        <el-image
          style="width: 90px; height: 120px; border-radius: 4px"
          fit="cover"
          :src="row.cover"
        />
      </template>
      <template #baseInfo="{ row }">
        <book-info
          :row="row"
          @edit="handleUpdateBook"
          :showFormat="false"
          :showTag="false"
        ></book-info>
      </template>
      <template #stock="{ row }">
        <book-stock :row="row"></book-stock>
      </template>

      <template #action="{ row }">
        <el-button
          type="primary"
          link
          v-permission="'recycle:bookTypes:modifyType'"
          @click="handleModifyType(row)"
        >
          [修改类型]
        </el-button>
      </template>
    </common-table>

    <books-edit ref="editRef"></books-edit>
  </ele-page>
</template>

<script setup>
  import { ref, reactive, getCurrentInstance } from 'vue';
  import CommonTable from '@/components/CommonPage/CommonTable.vue';
  import booksEdit from '@/views/data/books/components/books-edit.vue';
  import bookSearch from '@/views/recycle/components/book-search.vue';
  import bookInfo from '@/views/recycle/components/book-info.vue';
  import bookStock from '@/views/recycle/components/book-stock.vue';
  const { proxy } = getCurrentInstance();
  defineOptions({ name: 'recycleBooklist' });

  const bookTag = ref('-1');
  function handleStatusChange(value) {
    pageRef.value.reload({ bookTag: value });
  }

  /** 表格列配置 */
  const columns = ref([
    {
      type: 'selection',
      columnKey: 'selection',
      width: 50,
      align: 'center',
      fixed: 'left'
    },
    {
      label: '图片',
      prop: 'cover',
      width: 120,
      slot: 'cover'
    },
    {
      label: '信息',
      prop: 'baseInfo',
      width: 500,
      slot: 'baseInfo'
    },
    {
      label: '回收折扣',
      minWidth: 100,
      prop: 'recycleDiscount',
      sortable: true,
      columnKey: '4'
    },
    {
      label: '回收价格',
      prop: 'recyclePrice',
      sortable: true,
      columnKey: '5',
      minWidth: 100
    },
    {
      label: '最大回收量',
      minWidth: 120,
      prop: 'recycleMax',
      sortable: true,
      columnKey: '6'
    },
    {
      label: '总回收数量',
      minWidth: 120,
      prop: 'recycleTotalNum',
      sortable: true,
      columnKey: '2'
    },
    {
      label: '当前剩余回收量',
      minWidth: 140,
      prop: 'restRecycleNum',
      sortable: true,
      columnKey: '7'
    },
    {
      label: '所属类型',
      prop: 'bookTagName',
      width: 120,
      formatter: (row) =>
        row.bookTag == 2 ? '社科库' : row.bookTag == 1 ? '教材库' : '--'
    },
    {
      label: '售价',
      prop: 'salePrice',
      width: 120,
      formatter: (row) => row.salePrice || 0
    },
    {
      label: '销量',
      prop: 'salesNum',
      sortable: true,
      columnKey: '8'
    },
    {
      columnKey: 'action',
      label: '操作',
      width: 150,
      slot: 'action',
      fixed: 'right'
    }
  ]);

  /** 页面组件实例 */
  const pageRef = ref(null);

  const pageConfig = reactive({
    pageUrl: '/book/bookRecycleInfo/pageList',
    exportUrl: '',
    fileName: '回收书单管理',
    cacheKey: 'recycleBooklistTable',
    rowKey: 'isbn',
    params: {
      bookTag: bookTag.value
    }
  });

  function handleSortChange({ column, order }) {
    // 1 扫描次数 2总回收量 3最后一次扫描时间
    reload({
      orderType: column.columnKey,
      orderWay: order === 'ascending' ? 'asc' : 'desc'
    });
  }

  //刷新表格
  function reload(where) {
    pageRef.value?.reload(where);
  }

  //编辑
  const editRef = ref(null);
  function handleUpdateBook(row) {
    let params = {
      id: row.bookId
    };
    editRef.value?.handleOpen(params);
  }

  /**
   * 类型操作（社科库/教材库）
   * @param {Number} type - 类型：1社科库，2教材库
   */
  function handleModifyType(row) {
    const isbnList = [row.isbn];
    const url =
      row.bookTag == 1
        ? '/book/bookRecycleInfo/changeBookTag2'
        : '/book/bookRecycleInfo/changeBookTag1';
    const title = row.bookTag == 1 ? '确认加社科库？' : '确认加教材库？';

    pageRef.value?.messageBoxConfirm({
      message: title,
      fetch: () => proxy.$http.post(url, { isbnList })
    });
  }
</script>
