1404/11/04- first
This commit is contained in:
@@ -0,0 +1,425 @@
|
||||
<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 #action="{ column, record }">
|
||||
<div class="md:hidden">
|
||||
<a-popover title="" placement="right" @cancel="">
|
||||
<template #content>
|
||||
<div class="flex flex-col gap-3">
|
||||
<a-tooltip :key="record.is_archive" placement="bottom" class="cursor-pointer">
|
||||
<template #title>
|
||||
<span>{{
|
||||
record.is_archive ? 'بیرون بردن از بایگانی' : 'بایگانی کردن'
|
||||
}}</span>
|
||||
</template>
|
||||
<a-popconfirm
|
||||
title="آیا مشتری را بایگانی می کنید؟"
|
||||
ok-text="تایید"
|
||||
cancel-text="رد"
|
||||
placement="topLeft"
|
||||
@confirm="archiveFunction(record.id)"
|
||||
@cancel=""
|
||||
>
|
||||
<!-- <template #icon><question-circle-outlined style="color: red" /></template>-->
|
||||
<Icon
|
||||
class="cursor-pointer"
|
||||
icon="vuesax-linear:archive-tick"
|
||||
color="#e3bf00"
|
||||
/>
|
||||
</a-popconfirm>
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
:key="record.active"
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="changeCustomerActivationFunction(record.id)"
|
||||
>
|
||||
<template #title>
|
||||
<span>
|
||||
{{ record.active ? 'غیرفعال کردن حساب کاربری' : 'فعال کردن حساب کاربری' }}
|
||||
</span>
|
||||
</template>
|
||||
<Icon
|
||||
:icon="
|
||||
record.active ? 'vuesax-linear:user-tick' : 'vuesax-linear:user-remove'
|
||||
"
|
||||
:color="record.active ? '#54AD06' : '#ad0627'"
|
||||
/>
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="emits('chargeMoney', record)"
|
||||
>
|
||||
<template #title>
|
||||
<span>شارژ کیف پول ریالی</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:wallet-add" color="#9333ea" />
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="emits('chargeGold', record)"
|
||||
>
|
||||
<template #title>
|
||||
<span>شارژ کیف پول طلایی</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:wallet-money" color="#ea580c" />
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="emits('info', record)"
|
||||
>
|
||||
<template #title>
|
||||
<span>مشخصات</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:stickynote" color="#10913A" />
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="emits('edit', record)"
|
||||
>
|
||||
<template #title>
|
||||
<span>ویرایش</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:edit" color="#4572E9" />
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
:key="record.trade_active"
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="changeCustomerOrderActivationFunction(record.id)"
|
||||
>
|
||||
<template #title>
|
||||
<span>
|
||||
{{
|
||||
record.trade_active ? 'غیر مجاز کردن سفارش دهی' : 'مجاز کردن سفارش دهی'
|
||||
}}
|
||||
</span>
|
||||
</template>
|
||||
<Icon
|
||||
:icon="
|
||||
record.trade_active === 1
|
||||
? 'vuesax-linear:box-tick'
|
||||
: 'vuesax-linear:box-remove'
|
||||
"
|
||||
:color="record.trade_active === 1 ? '#54AD06' : '#ad0627'"
|
||||
/>
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
v-if="!record.is_legal"
|
||||
:key="record.trade_active"
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="openConfirmUser(record)"
|
||||
>
|
||||
<template #title>
|
||||
<span>تایید کاربر</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:user-search" color="#0d9488" />
|
||||
</a-tooltip>
|
||||
</div>
|
||||
</template>
|
||||
<!-- <template #icon><question-circle-outlined style="color: red" /></template>-->
|
||||
<Icon class="cursor-pointer" icon="vuesax-linear:setting" color="#000" />
|
||||
</a-popover>
|
||||
</div>
|
||||
<div class="gap-2 hidden md:flex justify-center">
|
||||
<a-tooltip :key="record.is_archive" placement="bottom" class="cursor-pointer">
|
||||
<template #title>
|
||||
<span>{{ record.is_archive ? 'بیرون بردن از بایگانی' : 'بایگانی کردن' }}</span>
|
||||
</template>
|
||||
<a-popconfirm
|
||||
title="آیا مشتری را بایگانی می کنید؟"
|
||||
ok-text="تایید"
|
||||
cancel-text="رد"
|
||||
placement="topLeft"
|
||||
@confirm="archiveFunction(record.id)"
|
||||
@cancel=""
|
||||
>
|
||||
<!-- <template #icon><question-circle-outlined style="color: red" /></template>-->
|
||||
<Icon class="cursor-pointer" icon="vuesax-linear:archive-tick" color="#e3bf00" />
|
||||
</a-popconfirm>
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
:key="record.active"
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="changeCustomerActivationFunction(record.id)"
|
||||
>
|
||||
<template #title>
|
||||
<span>{{
|
||||
record.active ? 'غیرفعال کردن حساب کاربری' : 'فعال کردن حساب کاربری'
|
||||
}}</span>
|
||||
</template>
|
||||
<Icon
|
||||
:icon="record.active ? 'vuesax-linear:user-tick' : 'vuesax-linear:user-remove'"
|
||||
:color="record.active ? '#54AD06' : '#ad0627'"
|
||||
/>
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="emits('chargeMoney', record)"
|
||||
>
|
||||
<template #title>
|
||||
<span>شارژ کیف پول ریالی</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:wallet-add" color="#9333ea" />
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="emits('chargeGold', record)"
|
||||
>
|
||||
<template #title>
|
||||
<span>شارژ کیف پول طلایی</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:wallet-money" color="#ea580c" />
|
||||
</a-tooltip>
|
||||
<a-tooltip placement="bottom" class="cursor-pointer" @click="emits('info', record)">
|
||||
<template #title>
|
||||
<span>مشخصات</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:stickynote" color="#10913A" />
|
||||
</a-tooltip>
|
||||
<a-tooltip placement="bottom" class="cursor-pointer" @click="emits('edit', record)">
|
||||
<template #title>
|
||||
<span>ویرایش</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:edit" color="#4572E9" />
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
:key="record.trade_active"
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="changeCustomerOrderActivationFunction(record.id)"
|
||||
>
|
||||
<template #title>
|
||||
<span>{{
|
||||
record.trade_active ? 'غیر مجاز کردن سفارش دهی' : 'مجاز کردن سفارش دهی'
|
||||
}}</span>
|
||||
</template>
|
||||
<Icon
|
||||
:icon="
|
||||
record.trade_active === 1 ? 'vuesax-linear:box-tick' : 'vuesax-linear:box-remove'
|
||||
"
|
||||
:color="record.trade_active === 1 ? '#54AD06' : '#ad0627'"
|
||||
/>
|
||||
</a-tooltip>
|
||||
<a-tooltip
|
||||
v-if="!record.is_legal"
|
||||
:key="record.trade_active"
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="openConfirmUser(record)"
|
||||
>
|
||||
<template #title>
|
||||
<span>تایید کاربر</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:user-search" color="#0d9488" />
|
||||
</a-tooltip>
|
||||
<!-- <a-tooltip
|
||||
placement="bottom"
|
||||
class="cursor-pointer"
|
||||
@click="emits('delete', record.id)"
|
||||
>
|
||||
<template #title>
|
||||
<span>حذف</span>
|
||||
</template>
|
||||
<Icon icon="vuesax-linear:trash" color="#EB3535" />
|
||||
</a-tooltip>-->
|
||||
</div>
|
||||
</template>
|
||||
</BaseTable>
|
||||
<BasicModal
|
||||
v-model:visible="confirmVisible"
|
||||
width="50vw"
|
||||
title="تایید مشتری"
|
||||
@ok="confirmUserFunction"
|
||||
ok-text="تایید"
|
||||
:loading="loading"
|
||||
@close="confirmVisible = false"
|
||||
>
|
||||
<div class="mt-[-10px] mb-10 font-bold">آیا از اطلاعات وارد شده اطمینان دارید؟</div>
|
||||
<div class="grid grid-cols-4 gap-2">
|
||||
<BasicInfoItem title="نام و نام خانوادگی" :value="confirmInfo?.name" />
|
||||
<BasicInfoItem title="شماره همراه" :value="confirmInfo?.mobile" />
|
||||
<BasicInfoItem
|
||||
title="تاریخ تولد"
|
||||
:value="confirmInfo?.birth_date ? toJalaliNoTime(confirmInfo?.birth_date) : '_'"
|
||||
/>
|
||||
<BasicInfoItem title="شماره تلفن" :value="confirmInfo?.phone_number ?? '_'" />
|
||||
<BasicInfoItem title="نام استان" :value="confirmInfo?.province" />
|
||||
<BasicInfoItem title="نام شهر" :value="confirmInfo?.city" />
|
||||
<BasicInfoItem title="شماره ملی" :value="confirmInfo?.n_code" />
|
||||
</div>
|
||||
</BasicModal>
|
||||
</BasicShowContext>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="tsx" setup>
|
||||
import type { TableInput } from '@core/type/baseTable'
|
||||
import useBaseTable from '@core/components/BaseTable/hooks/useBaseTable'
|
||||
import Icon from '@core/components/BaseIcon/src/Icon.vue'
|
||||
import {
|
||||
changeCustomerActivation,
|
||||
changeCustomerArchive,
|
||||
changeCustomerOrderActivation,
|
||||
confirmUser,
|
||||
getCustomerTable
|
||||
} from '@/api/customer'
|
||||
import { cols } from '@/pages/menuPages/customers/base/hooks/customerColumns'
|
||||
import { useUserStore } from '@/store/userStore'
|
||||
import { usePrefix } from '@core/composable/usePrefix'
|
||||
import { message } from 'ant-design-vue'
|
||||
import { inputRules } from '@/utils/inputRules'
|
||||
import type { User } from '@/model/user'
|
||||
import { toJalaliNoTime } from '@core/utils/useDataTime'
|
||||
import type { Customer } from '@/model/customer'
|
||||
import { onMounted } from 'vue'
|
||||
|
||||
const [submit, reload] = useBaseTable()
|
||||
/*const select = (val) => {
|
||||
val.sts === 1 ? return ['1'] : ['2']
|
||||
}*/
|
||||
//emits
|
||||
const emits = defineEmits(['delete', 'edit', 'add', 'info', 'chargeMoney', 'chargeGold'])
|
||||
|
||||
const { prefixCls } = usePrefix('pophoverstatus')
|
||||
|
||||
//permission
|
||||
function checkPermission(temp: string) {
|
||||
const store = useUserStore()
|
||||
return store.canAccess(temp)
|
||||
}
|
||||
|
||||
//define table
|
||||
const table = ref(null)
|
||||
|
||||
const confirmVisible = ref<boolean>(false)
|
||||
const confirmInfo = ref<Customer>()
|
||||
|
||||
const tblProps = ref<any>({
|
||||
columns: cols,
|
||||
api: (params: TableInput) => {
|
||||
return getCustomerTable(params)
|
||||
}
|
||||
//bordered: true
|
||||
})
|
||||
const refPop = ref()
|
||||
|
||||
// function edit(recordId){
|
||||
// emits('edit', recordId);
|
||||
// console.log( recordId);
|
||||
// console.log( visibleAction.value[parseInt(recordId)]);
|
||||
// visibleAction.value[recordId]=false
|
||||
// console.log('ddddd')
|
||||
// }
|
||||
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
|
||||
}
|
||||
}
|
||||
|
||||
function openConfirmUser(user: Customer) {
|
||||
confirmInfo.value = user
|
||||
confirmVisible.value = true
|
||||
}
|
||||
|
||||
async function archiveFunction(id: number) {
|
||||
try {
|
||||
loading.value = true
|
||||
await changeCustomerArchive(id)
|
||||
reload()
|
||||
message.success('مشتری با موفقیت بایگانی شد.')
|
||||
} catch (e) {
|
||||
console.error(e)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
async function confirmUserFunction() {
|
||||
try {
|
||||
loading.value = true
|
||||
await confirmUser(confirmInfo.value?.id)
|
||||
reload()
|
||||
confirmVisible.value = false
|
||||
} catch (e) {
|
||||
console.log(e)
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
async function changeCustomerOrderActivationFunction(id: number) {
|
||||
try {
|
||||
loading.value = true
|
||||
await changeCustomerOrderActivation(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
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
@prefix: ~'@{prefixCls}-pophoverstatus';
|
||||
.ant-popover,
|
||||
.ant-tooltip {
|
||||
z-index: 10 !important;
|
||||
}
|
||||
|
||||
.@{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>
|
||||
Reference in New Issue
Block a user