<script setup lang="ts">
import { ref, reactive } from "vue";
import contentConfig from "./config/content.config";
import searchConfig from "./config/search.config";
import { usePageSearch, usePageModal, type PageHooks, type PageEvents } from "/@/hooks/page";
import { httpStatus } from "/@/api/serviceParam/purchaseCategory";
import { useRenderIcon } from "/@/components/ReIcon/src/hooks";
import { usePermission } from "/@/hooks/core/usePermission";
import { useTask } from "/@/hooks/core";

const PageName = "saleCategory";
const { hasPermissionWithCode } = usePermission(PageName)
const instance = ref<any>(null);

const hooks: PageHooks = { pageSearchHook: () => usePageSearch(undefined, undefined, searchConfig) };
const statableTask = useTask({ success: () => instance.value.onSearch() })

/** 设置可用状态  */ 
const handleCanuseChange = (row, status = 1) => {
  statableTask.run(httpStatus({ tax_ids: [row.id], companyNo: row.companyNo, status, type: 'out' }))
}
</script>

<template>
  <PageAuth :pageName="PageName">
    <PageContainer
      :hooks="hooks"
      :content-config="contentConfig"
      :search-config="searchConfig"
      :get-content-ref="ref => (instance = ref)"
    >
      <template #content_action="row">
        <div class="flex">
          <div class="w-[34px]">
            <ElTooltip v-if="(row.output == 0 || row.output == 2)" content="设置为可用">
              <ElButton
                :icon="useRenderIcon('checkbox-circle-line')"
                @click="handleCanuseChange(row)"
                type="primary"
                size="small"
                link
              />
            </ElTooltip>
          </div>

          <div class="w-[34px]">
            <ElTooltip v-if="(row.output == 0 || row.output == 1)" content="设置为不可用">
              <ElButton
                :icon="useRenderIcon('close-circle-line')"
                @click="handleCanuseChange(row, 2)"
                type="primary"
                size="small"
                link
              />
            </ElTooltip>
          </div>
        </div>
      </template>
    </PageCOntainer>
  </PageAuth>
</template>
