boursecu_admin/src/pages/menuPages/withdraw/components/table.vue

<template>
  <div>
    <BasicShowContext title="لیست برداشت و واریز">
      <BaseTable v-bind="tblProps" @register="submit" ref="tbl">
        <template #extraHeader>
          <!--          <BaseButton type="primary" size="small" class="flex" @click="emits('add')">
            <div>افزودن مشتری عمده</div>
            <BaseIcon icon="vuesax-linear:user-add" Size="16px" />
          </BaseButton>-->
        </template>
        <template #tracked="{ column, record }">
          <div v-if="record.tracked_number">{{ record.tracked_number }}</div>
          <div v-else>
            <BaseButton @click="emits('withdraw', record.id)">تایید برداشت</BaseButton>
          </div>
        </template>
        <template #action="{ column, record }">
          <div class="gap-2 flex justify-center">
            <div class="flex gap-2" v-if="record.sts <= 70 && record.sts >= 50">
              <a-tooltip class="cursor-pointer">
                <template #title><span>دریافت فاکتور</span></template>
                <Icon
                    icon="vuesax-linear:document-download"
                    color="#1D4ED8"
                    @click="$router.push({ name: 'factor', params: { id: record.id } })"
                />
              </a-tooltip>
              <a-tooltip class="cursor-pointer">
                <template #title><span>وضعیت</span></template>
                <ADropdown :trigger="['click']">
                  <Icon icon="vuesax-linear:status-up" color="#CA8A04" @click="test(record)" />
                  <template #overlay>
                    <a-menu class="flex flex-col">
                      <a-menu-item
                          v-for="(item, index) in statusList"
                          :key="index"
                          class="border-none px-2 py-1 rounded m-1"
                          :style="{ color: item[1].color }"
                          @click="changeStatusHandler(item)"
                      >
                        <div class="flex items-center">
                          <BaseIcon :icon="item[1].icon" size="18" />
                          <span class="font-normal pr-1">{{ item[1].title }}</span>
                        </div>
                      </a-menu-item>
                    </a-menu>
                  </template>
                </ADropdown>
              </a-tooltip>
            </div>
<!--            <div v-if="record.sts == 53">-->
            <a-tooltip class="cursor-pointer">
              <template #title><span>تعیین وزن</span></template>
              <Icon
                  icon="vuesax-linear:3d-cube-scan"
                  color="#1D4ED8"
                  @click="emits('weight', record)"
              />
            </a-tooltip>
<!--            </div>-->
          </div>
        </template>
      </BaseTable>
    </BasicShowContext>
  </div>
</template>

<script lang="tsx" setup>
import type { TableInput } from '@core/type/baseTable'
import useBaseTable from '@core/components/BaseTableOld/hooks/useBaseTable'
import Icon from '@core/components/BaseIcon/src/Icon.vue'
import { changeCustomerActivation, getCustomerTable } from '@/api/customer'
import { cols } from '../hooks/withdrawColumns'
import { useUserStore } from '@/store/userStore'
import { usePrefix } from '@core/composable/usePrefix'
import { message } from 'ant-design-vue'
import { getOrderTable } from '@/api/order'
import {getWithdrawTable, updateSts} from '@/api/wallet'

const [submit, reload] = useBaseTable()
/*const select = (val) => {
  val.sts === 1 ? return ['1'] : ['2']
}*/
//emits
const emits = defineEmits(['delete', 'edit', 'add', 'withdraw', 'weight'])

const { prefixCls } = usePrefix('pophoverstatus')

//permission
function checkPermission(temp: string) {
  const store = useUserStore()
  return store.canAccess(temp)
}

//define table
const table = ref(null)

const tblProps = ref<any>({
  columns: cols,
  api: (params: TableInput) => {
    return getWithdrawTable(params)
  }
  //bordered: true
})
const loading = ref<boolean>(false)

async function changeCustomerActivationFunction(id: number) {
  try {
    loading.value = true
    await changeCustomerActivation(id)
    reload()
    message.success('تغییر وضعیت با موفقیت انجام شد')
  } catch (e) {
    console.error(e)
  } finally {
    loading.value = false
  }
}

const fetch = () => {
  // console.log('sss')
  reload()
}
// const spinTable = (val: boolean) => {
//   // console.log('sss')
//   table?.value?.loading.value = val
// }
defineExpose({
  fetch
  // spinTable
})

import { status } from '@/pages/menuPages/withdraw/information/hooks/status'
import {toNumber} from "lodash";
const withdrawId = ref(null)
const sts = ref()
const statusList = computed(() => {
  return Object.entries(status).filter((item) => toNumber(item[0]) !== sts.value)
})
const test = (record: any) => {
  sts.value = record.sts
  withdrawId.value = record.id
}
const changeStatusHandler = async (status: any) => {
  try {
    await changeStatus(withdrawId.value as number, status)
    reload()
  } catch (e: any) {
    console.log(e)
  }
}
const changeStatus = async (id: number, status: any) => {
  try {
    await updateSts(id, { sts: status[0] })
    message.success(`وضعیت ثبت شد `)
  } catch (e) {
    console.log(e)
    message.error('خطا در ثبت اطلاعات')
  }
}
</script>

<style lang="less">
@prefix: ~'@{prefixCls}-pophoverstatus';

.@{prefix} {
  .ant-menu-rtl.ant-menu-inline,
  .ant-menu-rtl.ant-menu-vertical {
    border-left: none;
  }

  .ant-menu-item-only-child {
    border-radius: @border-radius-base;
  }

  //bor
  /*  .ant-input-group-addon:first-child {
  !*    border: #d9d9d9 1px solid;
  border-radius: 0 6px 6px 0;*!
}*/
}
</style>