This commit is contained in:
weipengfei 2024-05-18 15:28:38 +08:00
parent 9836c4acc9
commit 51401e0821
11 changed files with 2320 additions and 193 deletions

View File

@ -32,4 +32,16 @@ export function apiBindGoodstLists(params: any) {
} }
// 已绑商品表列表
export function apiMerchantApplyLists(params: any) {
return request.get({ url: '/merchat/merchant/apply_lists', params })
}
// 审核
export function apiMerchantStatusUpdate(params: any) {
return request.post({ url: '/merchat/merchant/status', params })
}
// /admin?mer_id=506 // /admin?mer_id=506

View File

@ -23,4 +23,14 @@ export function apiSupplierDelete(params: any) {
// 供应商表详情 // 供应商表详情
export function apiSupplierDetail(params: any) { export function apiSupplierDetail(params: any) {
return request.get({ url: '/supplier/supplier/detail', params }) return request.get({ url: '/supplier/supplier/detail', params })
}
// 供应商申请列表
export function apiSupplierApplyLists(params: any) {
return request.get({ url: '/supplier/supplier/apply_lists', params })
}
// 供应商申请审核
export function apiSupplierStatus(params: any) {
return request.post({ url: '/supplier/supplier/status', params })
} }

View File

@ -1,35 +1,58 @@
<template> <template>
<div> <div>
<template v-for="(item, index) in getOptions" :key="index"> <template v-for="(item, index) in getOptions" :key="index">
<span>{{ index != 0 ? '、' : '' }}{{ item[config.label] }}</span> <span>{{ index != 0 ? "、" : "" }}{{ item[config.label] }}</span>
</template> </template>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const props = withDefaults( // const props = withDefaults(
defineProps<{ // defineProps<{
options: any[] // options: any[]
value: any // value: any
config: Record<string, string> // config: Record<string, string>
}>(), // }>(),
{ // {
options: () => [], // options: () => [],
config: () => ({ // config: () => ({
label: 'name', // label: 'name',
value: 'value' // value: 'value'
}) // })
} // }
) // )
const props = defineProps({
options: {
type: Object,
default: () => [],
},
value: {
type: [Object, String, Number],
default: () => 0,
},
config: {
type: Object,
default: () => {
return {
label: "name",
value: "value",
};
},
},
});
const values = computed(() => { const values = computed(() => {
if (props.value !== null && typeof props.value !== 'undefined') { if (props.value !== null && typeof props.value !== "undefined") {
return Array.isArray(props.value) ? props.value : String(props.value).split(',') return Array.isArray(props.value)
} else { ? props.value
return [] : String(props.value).split(",");
} } else {
}) return [];
}
});
const getOptions = computed(() => { const getOptions = computed(() => {
return props.options.filter((item) => values.value.includes(item[props.config.value])) return props.options.filter((item) =>
}) values.value.includes(item[props.config.value])
);
});
</script> </script>

View File

@ -0,0 +1,105 @@
<template>
<div>
<!-- <el-card class="!border-none mb-4" shadow="never">
<el-form class="mb-[-16px]" :model="queryParams" label-width="160px">
<el-row>
<el-col :span="6">
<el-form-item label="商户分类" prop="category_id">
<el-select class="w-[280px]" v-model="queryParams.category_id" clearable placeholder="请选择商户分类">
<el-option label="全部" value=""></el-option>
<el-option v-for="(item, index) in dictData.mer_category_type" :key="index"
:label="item.name" :value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="店铺类型" prop="type_id">
<el-select class="w-[280px]" v-model="queryParams.type_id" clearable placeholder="请选择店铺类型">
<el-option label="全部" value=""></el-option>
<el-option v-for="(item, index) in dictData.merchat_type" :key="index" :label="item.name"
:value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item>
<el-button type="primary" @click="resetPage">查询</el-button>
<el-button @click="resetParams">重置</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card> -->
<el-card class="!border-none" v-loading="pager.loading" shadow="never">
<el-button v-perms="['merchat.merchant/add']" type="primary" @click="showDialog = true">
<template #icon>
<icon name="el-icon-Plus" />
</template>
商品绑定
</el-button>
<div class="mt-4">
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" />
<!-- <el-table-column label="ID" prop="id" width="55" /> -->
<el-table-column label="商品图片" prop="imgs">
<template #default="{ row }">
<el-image style="width:50px;height:50px;" :src="row.goods_info.imgs" />
</template>
</el-table-column>
<el-table-column label="商品名称" prop="goods_info.name" show-overflow-tooltip />
<el-table-column label="规格型号" prop="goods_info.spec" show-overflow-tooltip />
<el-table-column label="商品分类" prop="goods_info.class_name" show-overflow-tooltip />
<el-table-column label="商品品牌" prop="goods_info.brand_name" show-overflow-tooltip />
<el-table-column label="商品单位" prop="goods_info.unit_name" show-overflow-tooltip />
<el-table-column label="购货价格" prop="goods_info.buy" show-overflow-tooltip />
<el-table-column label="销货价格" prop="goods_info.sell" show-overflow-tooltip />
<el-table-column label="零售价格" prop="goods_info.retail" show-overflow-tooltip />
<el-table-column label="标签" prop="goods_info.sys_labels_text" show-overflow-tooltip />
<el-table-column label="数量" prop="nums" width="170">
</el-table-column>
</el-table>
</div>
<div class="flex mt-4 justify-end">
<pagination v-model="pager" @change="getLists" />
</div>
</el-card>
<el-dialog v-model="showDialog" title="绑定商品" width="70%">
<goodsPop @offPop="showDialog = false, getLists()" :mer_id="mer_id"></goodsPop>
</el-dialog>
</div>
</template>
<script lang="ts" setup name="merchantLists">
import { usePaging } from '@/hooks/usePaging'
import { useDictData } from '@/hooks/useDictOptions'
import { apiBindGoodstLists } from '@/api/merchant'
import { useRoute } from 'vue-router';
const route = useRoute()
const showDialog = ref(false)
let mer_id = route.query.mer_id;
//
const queryParams = reactive({
mer_id: mer_id,
})
//
const selectData = ref<any[]>([])
//
const handleSelectionChange = (val: any[]) => {
selectData.value = val.map(({ mer_id }) => mer_id)
}
//
const { dictData } = useDictData('mer_category_type,merchat_type,show_status,off_status,financial_type')
//
const { pager, getLists, resetParams, resetPage } = usePaging({
fetchFun: apiBindGoodstLists,
params: queryParams
})
getLists()
</script>

View File

@ -0,0 +1,255 @@
<template>
<div class="edit-popup">
<popup
ref="popupRef"
:async="true"
width="60vw"
@close="handleClose"
:bottom-btn="false"
>
<el-descriptions
class="margin-top"
:title="popupTitle"
:column="3"
border
>
<el-descriptions-item label="商户头像">
<material-picker v-model="formData.mer_avatar" disabled />
</el-descriptions-item>
<el-descriptions-item label="商户名称">
{{ formData.mer_name }}
</el-descriptions-item>
<el-descriptions-item label="商户分类">
<dict-value
:options="dictData.mer_category_type"
:value="formData.category_id"
/>
</el-descriptions-item>
<el-descriptions-item label="店铺类型">
<dict-value
:options="dictData.merchat_type"
:value="formData.type_id"
/>
</el-descriptions-item>
<el-descriptions-item label="店主姓名">
<dict-value
:options="dictData.service_user"
:value="formData.type_id"
/>
</el-descriptions-item>
<el-descriptions-item label="是否支持先货后款">
<dict-value
:options="dictData.show_status"
:value="formData.credit_buy"
/>
</el-descriptions-item>
<el-descriptions-item label="结算周期(天)">
{{ formData.settle_cycle }}
</el-descriptions-item>
<el-descriptions-item label="利率">
{{ formData.interest_rate }}
</el-descriptions-item>
<el-descriptions-item label="城市">
{{ formData.city_name }}
</el-descriptions-item>
<el-descriptions-item label="区县">
{{ formData.area_name }}
</el-descriptions-item>
<el-descriptions-item label="镇街">
{{ formData.street_name }}
</el-descriptions-item>
<el-descriptions-item label="村">
{{ formData.village_name }}
</el-descriptions-item>
<el-descriptions-item label="商户地址">
{{ formData.mer_address }}
</el-descriptions-item>
<el-descriptions-item label="排序">
{{ formData.sort }}
</el-descriptions-item>
<el-descriptions-item label="商户是否禁用">
<dict-value
:options="dictData.show_status"
:value="formData.status"
/>
</el-descriptions-item>
<el-descriptions-item label="提成比例">
{{ formData.commission_rate }}
</el-descriptions-item>
<el-descriptions-item label="商户手续费单独设置">
<dict-value
:options="dictData.show_status"
:value="formData.commission_switch"
/>
</el-descriptions-item>
<el-descriptions-item label="经度">
{{ formData.long }}
</el-descriptions-item>
<el-descriptions-item label="纬度">
{{ formData.lat }}
</el-descriptions-item>
<el-descriptions-item label="店铺电话">
{{ formData.service_phone }}
</el-descriptions-item>
<el-descriptions-item label="商户余额">
{{ formData.mer_money }}
</el-descriptions-item>
<el-descriptions-item label="商户备注">
{{ formData.mark }}
</el-descriptions-item>
<el-descriptions-item label="银行卡转账信息">
{{ formData.financial_bank }}
</el-descriptions-item>
<el-descriptions-item label="微信转账信息">
{{ formData.financial_wechat }}
</el-descriptions-item>
<el-descriptions-item label="支付宝转账信息">
{{ formData.financial_alipay }}
</el-descriptions-item>
<el-descriptions-item label="默认使用类型">
<dict-value
:options="dictData.financial_type"
:value="formData.financial_type"
/>
</el-descriptions-item>
</el-descriptions>
<el-form :model="formData">
<el-form-item label="审核状态" prop="status">
<el-radio-group v-model="formData.status" class="ml-4">
<el-radio :label="1">通过</el-radio>
<el-radio :label="0">拒绝</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="审核备注" prop="mark">
<el-input v-model="formData.mark" type="textarea" />
</el-form-item>
</el-form>
<div style="width: 100%; display: flex;justify-content: flex-end;">
<el-button @click="onAudit" type="primary">确认</el-button>
</div>
</popup>
</div>
</template>
<script lang="ts" setup name="brandEdit">
import Popup from '@/components/popup/index.vue'
import { apiMerchantStatusUpdate } from "@/api/merchant"
import type { PropType } from 'vue'
defineProps({
dictData: {
type: Object as PropType<Record<string, any[]>>,
default: () => ({})
}
})
const emit = defineEmits(['success', 'close'])
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add')
//
const popupTitle = computed(() => {
return '商户详情'
})
//
const formData = reactive({
financial_type: "",
mer_id: '',
category_id: '',
type_id: '',
mer_name: '',
service_user: "",
credit_buy: '',
settle_cycle: '',
interest_rate: '',
province_id: '510000',
city_id: '',
city_name: '',
area_id: '',
area_name: '',
street_id: '',
street_name: '',
village_id: '',
village_name: '',
mer_address: '',
mer_avatar: '',
apply_id: '',
mark: '',
sort: '',
status: '',
commission_rate: '',
commission_switch: '',
long: '',
lat: '',
service_phone: '',
mer_money: '',
financial_bank: '',
financial_wechat: '',
financial_alipay: '',
})
//
const formRules = reactive<any>({
name: [{
required: true,
message: '请输入品牌名称',
trigger: ['blur']
}]
})
//
const setFormData = async (data: Record<any, any>) => {
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
formData[key] = data[key]
}
}
}
//
const onAudit = () => {
apiMerchantStatusUpdate({
mer_id: formData.mer_id,
status: formData.status,
apply_id: formData.apply_id,
service_phone: formData.service_phone,
mark: formData.mark,
}).then((res) => {
popupRef.value?.close();
});
};
//
// const handleSubmit = async () => {
// await formRef.value?.validate()
// const data = { ...formData, }
// mode.value == 'edit'
// ? await apiBrandEdit(data)
// : await apiBrandAdd(data)
// popupRef.value?.close()
// emit('success')
// }
//
const open = (type = 'add') => {
mode.value = type
popupRef.value?.open()
}
//
const handleClose = () => {
emit('close')
}
defineExpose({
open,
setFormData,
})
</script>

View File

@ -0,0 +1,425 @@
<template>
<div class="edit-popup">
<popup ref="popupRef" :title="popupTitle" :async="true" width="60vw" @confirm="handleSubmit" @close="handleClose">
<el-form ref="formRef" :model="formData" label-width="160px" :rules="formRules">
<el-row>
<el-col :span="24">
<el-form-item label="商户头像" prop="mer_avatar">
<material-picker v-model="formData.mer_avatar" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户名称" prop="mer_name">
<el-input v-model="formData.mer_name" clearable placeholder="请输入商户名称" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户分类" prop="category_id">
<el-select class="flex-1" v-model="formData.category_id" clearable placeholder="请选择商户分类">
<el-option v-for="(item, index) in dictData.mer_category_type" :key="index"
:label="item.name" :value="parseInt(item.value)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="店铺类型" prop="type_id">
<el-select class="flex-1" v-model="formData.type_id" clearable placeholder="请选择店铺类型">
<el-option v-for="(item, index) in dictData.merchat_type" :key="index" :label="item.name"
:value="parseInt(item.value)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="店主姓名" prop="service_user">
<el-input v-model="formData.service_user" clearable placeholder="请输入店主姓名" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="是否支持先货后款" prop="credit_buy">
<el-radio-group v-model="formData.credit_buy" placeholder="请选择是否支持先货后款">
<el-radio v-for="(item, index) in dictData.show_status" :key="index"
:label="parseInt(item.value)">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="结算周期(天)" prop="settle_cycle">
<el-input v-model="formData.settle_cycle" clearable placeholder="请输入结算周期" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="利率" prop="interest_rate">
<el-input v-model="formData.interest_rate" clearable placeholder="请输入利率" />
</el-form-item>
</el-col>
<!-- <el-col :span="8">
<el-form-item label="城市" prop="city_id">
<el-input v-model="formData.city_id" clearable placeholder="请输入城市" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="区县" prop="area_id">
<el-input v-model="formData.area_id" clearable placeholder="请输入区县" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="镇街" prop="street_id">
<el-input v-model="formData.street_id" clearable placeholder="请输入镇街" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="村" prop="village_id">
<el-input v-model="formData.village_id" clearable placeholder="请输入村" />
</el-form-item>
</el-col> -->
<el-col :span="8">
<el-form-item label="城市" prop="city_id">
<el-select class="flex-1" v-model="formData.city_id" clearable placeholder="请选择城市"
@change="getAreaList(formData.city_id)">
<el-option v-for="(item, index) in address.cityList" :key="index" :label="item.city_name"
:value="parseInt(item.city_code)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="区县" prop="area_id">
<el-select class="flex-1" v-model="formData.area_id" clearable placeholder="请选择城市"
@change="getTownList(formData.area_id)">
<el-option v-for="(item, index) in address.areaList" :key="index" :label="item.area_name"
:value="parseInt(item.area_code)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="镇街" prop="street_id">
<el-select class="flex-1" v-model="formData.street_id" clearable placeholder="请选择城市"
@change="getVilllageList(formData.street_id)">
<el-option v-for="(item, index) in address.townList" :key="index" :label="item.street_name"
:value="parseInt(item.street_code)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="村" prop="village_id">
<el-select class="flex-1" v-model="formData.village_id" clearable placeholder="请选择城市">
<el-option v-for="(item, index) in address.villlageList" :key="index"
:label="item.village_name" :value="(item.village_code)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户地址" prop="mer_address">
<el-input v-model="formData.mer_address" clearable placeholder="请输入商户地址" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="排序" prop="sort">
<el-input v-model="formData.sort" clearable placeholder="请输入" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户是否禁用" prop="status">
<el-radio-group v-model="formData.status" placeholder="请选择商户是否禁用">
<el-radio v-for="(item, index) in dictData.off_status" :key="index"
:label="parseInt(item.value)">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="提成比例" prop="commission_rate">
<el-input v-model="formData.commission_rate" clearable placeholder="请输入提成比例" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户手续费单独设置" prop="commission_switch">
<el-radio-group v-model="formData.commission_switch" placeholder="请选择商户手续费单独设置">
<el-radio v-for="(item, index) in dictData.off_status" :key="index"
:label="parseInt(item.value)">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="经度" prop="long">
<el-input v-model="formData.long" clearable placeholder="请输入经度" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="纬度" prop="lat">
<el-input v-model="formData.lat" clearable placeholder="请输入纬度" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="店铺电话" prop="service_phone">
<el-input v-model="formData.service_phone" clearable placeholder="请输入店铺电话" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户余额" prop="mer_money">
<el-input v-model="formData.mer_money" clearable placeholder="请输入商户余额" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户备注" prop="mark">
<el-input v-model="formData.mark" type="textarea" clearable placeholder="请输入商户备注" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="银行卡转账信息" prop="financial_bank">
<el-input v-model="formData.financial_bank" clearable placeholder="请输入银行卡转账信息" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="微信转账信息" prop="financial_wechat">
<el-input v-model="formData.financial_wechat" clearable placeholder="请输入微信转账信息" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="支付宝转账信息" prop="financial_alipay">
<el-input v-model="formData.financial_alipay" clearable placeholder="请输入支付宝转账信息" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="默认使用类型" prop="financial_type">
<el-select class="flex-1" v-model="formData.financial_type" clearable placeholder="请选择默认使用类型">
<el-option v-for="(item, index) in dictData.financial_type" :key="index" :label="item.name"
:value="parseInt(item.value)" />
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</popup>
</div>
</template>
<script lang="ts" setup name="merchantEdit">
import type { FormInstance } from 'element-plus'
import Popup from '@/components/popup/index.vue'
import { apiMerchantAdd, apiMerchantEdit, apiMerchantDetail } from '@/api/merchant'
import { apicityLists, apiAreaLists, apiStreetLists, apiVillageLists } from "@/api/address"
import type { PropType } from 'vue'
defineProps({
dictData: {
type: Object as PropType<Record<string, any[]>>,
default: () => ({})
}
})
const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add')
//
const popupTitle = computed(() => {
return mode.value == 'edit' ? '编辑商户表' : '新增商户表'
})
//
const formData = reactive({
financial_type: "",
mer_id: '',
category_id: '',
type_id: '',
mer_name: '',
service_user: "",
credit_buy: '',
settle_cycle: '',
interest_rate: '',
province_id: '510000',
city_id: '',
area_id: '',
street_id: '',
village_id: '',
mer_address: '',
mer_avatar: '',
mark: '',
sort: '',
status: '',
commission_rate: '',
commission_switch: '',
long: '',
lat: '',
service_phone: '',
mer_money: '',
financial_bank: '',
financial_wechat: '',
financial_alipay: '',
})
//
const formRules = reactive<any>({
category_id: [{
required: true,
message: '请选择商户分类',
trigger: ['blur']
}],
mer_name: [{
required: true,
message: '请输入商户名称',
trigger: ['blur']
}],
credit_buy: [{
required: true,
message: '请选择是否支持先货后款',
trigger: ['blur']
}],
settle_cycle: [{
required: true,
message: '请输入结算周期,单位天',
trigger: ['blur']
}],
interest_rate: [{
required: true,
message: '请输入利率',
trigger: ['blur']
}],
mer_address: [{
required: true,
message: '请输入商户地址',
trigger: ['blur']
}],
mark: [{
required: true,
message: '请输入商户备注',
trigger: ['blur']
}],
sort: [{
required: true,
message: '请输入',
trigger: ['blur']
}],
status: [{
required: true,
message: '请选择商户是否禁用0锁定,1正常',
trigger: ['blur']
}],
service_phone: [{
required: true,
message: '请输入店铺电话',
trigger: ['blur']
}],
mer_money: [{
required: true,
message: '请输入商户余额',
trigger: ['blur']
}]
})
//
const setFormData = async (data: Record<any, any>) => {
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
formData[key] = data[key]
}
}
await getAreaList(formData.city_id, true)
await getTownList(formData.area_id, true)
getVilllageList(formData.street_id)
}
const getDetail = async (row: Record<string, any>) => {
const data = await apiMerchantDetail({
mer_id: row.mer_id
})
setFormData(data)
}
//
const handleSubmit = async () => {
await formRef.value?.validate()
const data = { ...formData, }
mode.value == 'edit'
? await apiMerchantEdit(data)
: await apiMerchantAdd(data)
popupRef.value?.close()
emit('success')
}
//
const open = (type = 'add') => {
mode.value = type
popupRef.value?.open()
}
//
const handleClose = () => {
emit('close')
}
//
const address = reactive({
cityList: [],
areaList: [],
townList: [],
villlageList: []
})
const getCityList = async (province_code: number | String, isAsync: Boolean) => {
let res = await apicityLists({ province_code })
address.cityList = res
if (isAsync) {
return Promise.resolve({
msg: '获取成功'
});
}
}
const getAreaList = async (city_code: number | String, isAsync: Boolean) => {
let res = await apiAreaLists({ city_code })
address.areaList = res
if (isAsync) {
return Promise.resolve({
msg: '获取成功'
});
}
}
const getTownList = async (area_code: number | String, isAsync: Boolean) => {
let res = await apiStreetLists({ area_code })
address.townList = res
if (isAsync) {
return Promise.resolve({
msg: '获取成功'
});
}
}
const getVilllageList = async (street_code: number | String) => {
let res = await apiVillageLists({ street_code })
address.villlageList = res
}
//
getCityList(510000, false)
defineExpose({
open,
setFormData,
getDetail
})
</script>

View File

@ -0,0 +1,345 @@
<template>
<div>
<el-card class="!border-none mb-4" shadow="never">
<el-form class="mb-[-16px]" :model="queryParams" label-width="160px">
<el-row>
<el-col :span="6">
<el-form-item label="商户分类" prop="category_id">
<el-select
class="w-[280px]"
v-model="queryParams.category_id"
clearable
placeholder="请选择商户分类"
>
<el-option label="全部" value=""></el-option>
<el-option
v-for="(item, index) in dictData.mer_category_type"
:key="index"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="店铺类型" prop="type_id">
<el-select
class="w-[280px]"
v-model="queryParams.type_id"
clearable
placeholder="请选择店铺类型"
>
<el-option label="全部" value=""></el-option>
<el-option
v-for="(item, index) in dictData.merchat_type"
:key="index"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<!-- <el-col :span="6">
<el-form-item label="商户名称" prop="mer_name">
<el-input class="w-[280px]" v-model="queryParams.mer_name" clearable placeholder="请输入商户名称" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="是否支持先货后款" prop="credit_buy">
<el-select class="w-[280px]" v-model="queryParams.credit_buy" clearable
placeholder="请选择是否支持先货后款">
<el-option label="全部" value=""></el-option>
<el-option v-for="(item, index) in dictData.show_status" :key="index" :label="item.name"
:value="item.value" />
</el-select>
</el-form-item>
</el-col> -->
<!-- <el-col :span="6">
<el-form-item label="商户是否禁用" prop="status">
<el-select class="w-[280px]" v-model="queryParams.status" clearable placeholder="请选择商户是否禁用">
<el-option label="全部" value=""></el-option>
<el-option v-for="(item, index) in dictData.off_status" :key="index" :label="item.name"
:value="item.value" />
</el-select>
</el-form-item>
</el-col> -->
<!-- <el-col :span="6">
<el-form-item label="提成比例" prop="commission_rate">
<el-input class="w-[280px]" v-model="queryParams.commission_rate" clearable
placeholder="请输入提成比例" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="店铺电话" prop="service_phone">
<el-input class="w-[280px]" v-model="queryParams.service_phone" clearable
placeholder="请输入店铺电话" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="商户余额" prop="mer_money">
<el-input class="w-[280px]" v-model="queryParams.mer_money" clearable placeholder="请输入商户余额" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="银行卡转账信息" prop="financial_bank">
<el-input class="w-[280px]" v-model="queryParams.financial_bank" clearable
placeholder="请输入银行卡转账信息" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="微信转账信息" prop="financial_wechat">
<el-input class="w-[280px]" v-model="queryParams.financial_wechat" clearable
placeholder="请输入微信转账信息" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="支付宝转账信息" prop="financial_alipay">
<el-input class="w-[280px]" v-model="queryParams.financial_alipay" clearable
placeholder="请输入支付宝转账信息" />
</el-form-item>
</el-col> -->
<el-col :span="6">
<el-form-item>
<el-button type="primary" @click="resetPage">查询</el-button>
<el-button @click="resetParams">重置</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
<el-card class="!border-none" v-loading="pager.loading" shadow="never">
<div class="mt-4">
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
<!-- <el-table-column type="selection" width="55" /> -->
<el-table-column label="商户id" prop="mer_id" show-overflow-tooltip />
<el-table-column label="商户分类" prop="category_id">
<template #default="{ row }">
<dict-value
:options="dictData.mer_category_type"
:value="row.category_id"
/>
</template>
</el-table-column>
<el-table-column label="店铺类型" prop="type_id">
<template #default="{ row }">
<dict-value
:options="dictData.merchat_type"
:value="row.type_id"
/>
</template>
</el-table-column>
<el-table-column
label="商户名称"
prop="mer_name"
show-overflow-tooltip
width="200"
/>
<el-table-column label="用户id" prop="uid" show-overflow-tooltip />
<el-table-column
label="是否支持先货后款"
prop="credit_buy"
width="160"
>
<template #default="{ row }">
<dict-value
:options="dictData.off_status"
:value="row.credit_buy"
/>
</template>
</el-table-column>
<el-table-column
label="是否支持先货后款"
prop="credit_buy"
width="160"
>
<template #default="{ row }">
<dict-value
:options="dictData.show_status"
:value="row.credit_buy"
/>
</template>
</el-table-column>
<el-table-column
label="结算周期(天)"
prop="settle_cycle"
width="120"
show-overflow-tooltip
/>
<el-table-column
label="利率"
prop="interest_rate"
show-overflow-tooltip
/>
<el-table-column
label="城市"
prop="city_name"
show-overflow-tooltip
/>
<el-table-column
label="区县"
prop="area_name"
show-overflow-tooltip
/>
<el-table-column
label="镇街表"
prop="street_name"
show-overflow-tooltip
/>
<el-table-column
label="村"
prop="village_name"
show-overflow-tooltip
/>
<el-table-column
label="商户地址"
prop="mer_address"
show-overflow-tooltip
/>
<el-table-column
label="商户头像"
prop="mer_avatar"
show-overflow-tooltip
/>
<el-table-column label="商户备注" prop="mark" show-overflow-tooltip />
<el-table-column
label="提成比例"
prop="commission_rate"
show-overflow-tooltip
/>
<el-table-column
label="店铺电话"
prop="service_phone"
show-overflow-tooltip
/>
<el-table-column
label="商户余额"
prop="mer_money"
show-overflow-tooltip
/>
<el-table-column
label="银行卡转账信息"
prop="financial_bank"
width="140"
show-overflow-tooltip
/>
<el-table-column
label="微信转账信息"
prop="financial_wechat"
width="140"
show-overflow-tooltip
/>
<el-table-column
label="支付宝转账信息"
prop="financial_alipay"
width="160"
show-overflow-tooltip
/>
<el-table-column label="操作" width="150" fixed="right">
<template #default="{ row }">
<el-button link type="primary" @click="handleDetail(row)"> 审核 </el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="flex mt-4 justify-end">
<pagination v-model="pager" @change="getLists" />
</div>
</el-card>
<edit-popup
v-if="showEdit"
ref="editRef"
:dict-data="dictData"
@success="getLists"
@close="showEdit = false"
/>
<DetailPopup
v-if="showDetail"
ref="detailRef"
:dict-data="dictData"
@success="getLists"
@close="showDetail = false"
/>
</div>
</template>
<script lang="ts" setup name="merchantLists">
import { usePaging } from "@/hooks/usePaging";
import { useDictData } from "@/hooks/useDictOptions";
import { apiMerchantApplyLists, apiMerchantDelete, } from "@/api/merchant";
import feedback from "@/utils/feedback";
import EditPopup from "./edit.vue";
import DetailPopup from "./detail.vue";
const editRef = shallowRef<InstanceType<typeof EditPopup>>();
const detailRef = shallowRef<InstanceType<typeof EditPopup>>();
//
const showEdit = ref(false);
const showDetail = ref(false);
//
const queryParams = reactive({
category_id: "",
type_id: "",
mer_name: "",
credit_buy: "",
status: "",
commission_rate: "",
service_phone: "",
mer_money: "",
financial_bank: "",
financial_wechat: "",
financial_alipay: "",
});
//
const selectData = ref<any[]>([]);
//
const handleSelectionChange = (val: any[]) => {
selectData.value = val.map(({ mer_id }) => mer_id);
};
//
const { dictData } = useDictData(
"mer_category_type,merchat_type,show_status,off_status,financial_type"
);
//
const { pager, getLists, resetParams, resetPage } = usePaging({
fetchFun: apiMerchantApplyLists,
params: queryParams,
});
//
const handleAdd = async () => {
showEdit.value = true;
await nextTick();
editRef.value?.open("add");
};
//
const handleEdit = async (data: any) => {
showEdit.value = true;
await nextTick();
editRef.value?.open("edit");
editRef.value?.setFormData(data);
};
//
const handleDelete = async (mer_id: number | any[]) => {
await feedback.confirm("确定要删除?");
await apiMerchantDelete({ mer_id });
getLists();
};
//
const handleDetail = async (data) => {
// let res = await apiMerchantDetail({ mer_id })
showDetail.value = true;
await nextTick();
detailRef.value?.open("edit");
detailRef.value?.setFormData(data);
};
getLists();
</script>

View File

@ -1,27 +1,45 @@
<template> <template>
<div> <div>
<el-card class="!border-none mb-4" shadow="never"> <el-card class="!border-none mb-4" shadow="never">
<el-form class="mb-[-16px]" :model="queryParams" label-width="160px"> <el-form class="mb-[-16px]" :model="queryParams" label-width="160px">
<el-row> <el-row>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="商户分类" prop="category_id"> <el-form-item label="商户分类" prop="category_id">
<el-select class="w-[280px]" v-model="queryParams.category_id" clearable placeholder="请选择商户分类"> <el-select
<el-option label="全部" value=""></el-option> class="w-[280px]"
<el-option v-for="(item, index) in dictData.mer_category_type" :key="index" v-model="queryParams.category_id"
:label="item.name" :value="item.value" /> clearable
</el-select> placeholder="请选择商户分类"
</el-form-item> >
</el-col> <el-option label="全部" value=""></el-option>
<el-col :span="6"> <el-option
<el-form-item label="店铺类型" prop="type_id"> v-for="(item, index) in dictData.mer_category_type"
<el-select class="w-[280px]" v-model="queryParams.type_id" clearable placeholder="请选择店铺类型"> :key="index"
<el-option label="全部" value=""></el-option> :label="item.name"
<el-option v-for="(item, index) in dictData.merchat_type" :key="index" :label="item.name" :value="item.value"
:value="item.value" /> />
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<!-- <el-col :span="6"> <el-col :span="6">
<el-form-item label="店铺类型" prop="type_id">
<el-select
class="w-[280px]"
v-model="queryParams.type_id"
clearable
placeholder="请选择店铺类型"
>
<el-option label="全部" value=""></el-option>
<el-option
v-for="(item, index) in dictData.merchat_type"
:key="index"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<!-- <el-col :span="6">
<el-form-item label="商户名称" prop="mer_name"> <el-form-item label="商户名称" prop="mer_name">
<el-input class="w-[280px]" v-model="queryParams.mer_name" clearable placeholder="请输入商户名称" /> <el-input class="w-[280px]" v-model="queryParams.mer_name" clearable placeholder="请输入商户名称" />
</el-form-item> </el-form-item>
@ -36,7 +54,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> --> </el-col> -->
<!-- <el-col :span="6"> <!-- <el-col :span="6">
<el-form-item label="商户是否禁用" prop="status"> <el-form-item label="商户是否禁用" prop="status">
<el-select class="w-[280px]" v-model="queryParams.status" clearable placeholder="请选择商户是否禁用"> <el-select class="w-[280px]" v-model="queryParams.status" clearable placeholder="请选择商户是否禁用">
<el-option label="全部" value=""></el-option> <el-option label="全部" value=""></el-option>
@ -45,7 +63,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> --> </el-col> -->
<!-- <el-col :span="6"> <!-- <el-col :span="6">
<el-form-item label="提成比例" prop="commission_rate"> <el-form-item label="提成比例" prop="commission_rate">
<el-input class="w-[280px]" v-model="queryParams.commission_rate" clearable <el-input class="w-[280px]" v-model="queryParams.commission_rate" clearable
placeholder="请输入提成比例" /> placeholder="请输入提成比例" />
@ -80,178 +98,297 @@
placeholder="请输入支付宝转账信息" /> placeholder="请输入支付宝转账信息" />
</el-form-item> </el-form-item>
</el-col> --> </el-col> -->
<el-col :span="6"> <el-col :span="6">
<el-form-item> <el-form-item>
<el-button type="primary" @click="resetPage">查询</el-button> <el-button type="primary" @click="resetPage">查询</el-button>
<el-button @click="resetParams">重置</el-button> <el-button @click="resetParams">重置</el-button>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
</el-card> </el-card>
<el-card class="!border-none" v-loading="pager.loading" shadow="never"> <el-card class="!border-none" v-loading="pager.loading" shadow="never">
<el-button v-perms="['merchat.merchant/add']" type="primary" @click="handleAdd"> <el-button
<template #icon> v-perms="['merchat.merchant/add']"
<icon name="el-icon-Plus" /> type="primary"
</template> @click="handleAdd"
新增 >
</el-button> <template #icon>
<el-button v-perms="['merchat.merchant/delete']" :disabled="!selectData.length" <icon name="el-icon-Plus" />
@click="handleDelete(selectData)"> </template>
新增
</el-button>
<el-button
v-perms="['merchat.merchant/delete']"
:disabled="!selectData.length"
@click="handleDelete(selectData)"
>
删除
</el-button>
<div class="mt-4">
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" />
<el-table-column label="商户id" prop="mer_id" show-overflow-tooltip />
<el-table-column label="商户分类" prop="category_id">
<template #default="{ row }">
<dict-value
:options="dictData.mer_category_type"
:value="row.category_id"
/>
</template>
</el-table-column>
<el-table-column label="店铺类型" prop="type_id">
<template #default="{ row }">
<dict-value
:options="dictData.merchat_type"
:value="row.type_id"
/>
</template>
</el-table-column>
<el-table-column
label="商户名称"
prop="mer_name"
show-overflow-tooltip
width="200"
/>
<el-table-column label="用户id" prop="uid" show-overflow-tooltip />
<!-- <el-table-column
label="是否启用"
prop="status"
width="160"
>
<template #default="{ row }">
<el-switch v-model="row.status" @change="changeStatus(row)" :active-value="1" :inactive-value="0" />
</template>
</el-table-column> -->
<el-table-column
label="是否支持先货后款"
prop="credit_buy"
width="160"
>
<template #default="{ row }">
<dict-value
:options="dictData.show_status"
:value="row.credit_buy"
/>
</template>
</el-table-column>
<el-table-column
label="结算周期(天)"
prop="settle_cycle"
width="120"
show-overflow-tooltip
/>
<el-table-column
label="利率"
prop="interest_rate"
show-overflow-tooltip
/>
<el-table-column
label="城市"
prop="city_name"
show-overflow-tooltip
/>
<el-table-column
label="区县"
prop="area_name"
show-overflow-tooltip
/>
<el-table-column
label="镇街表"
prop="street_name"
show-overflow-tooltip
/>
<el-table-column
label="村"
prop="village_name"
show-overflow-tooltip
/>
<el-table-column
label="商户地址"
prop="mer_address"
show-overflow-tooltip
/>
<el-table-column
label="商户头像"
prop="mer_avatar"
show-overflow-tooltip
/>
<el-table-column label="商户备注" prop="mark" show-overflow-tooltip />
<el-table-column
label="提成比例"
prop="commission_rate"
show-overflow-tooltip
/>
<el-table-column
label="店铺电话"
prop="service_phone"
show-overflow-tooltip
/>
<el-table-column
label="商户余额"
prop="mer_money"
show-overflow-tooltip
/>
<el-table-column
label="银行卡转账信息"
prop="financial_bank"
width="140"
show-overflow-tooltip
/>
<el-table-column
label="微信转账信息"
prop="financial_wechat"
width="140"
show-overflow-tooltip
/>
<el-table-column
label="支付宝转账信息"
prop="financial_alipay"
width="160"
show-overflow-tooltip
/>
<el-table-column label="操作" width="250" fixed="right">
<template #default="{ row }">
<el-button
v-perms="['merchat.merchant/edit']"
type="primary"
link
@click="handleEdit(row)"
>
编辑
</el-button>
<el-button
v-perms="['merchat.merchant/delete']"
type="danger"
link
@click="handleDelete(row.mer_id)"
>
删除 删除
</el-button> </el-button>
<div class="mt-4"> <el-button link @click="handleDetail(row)"> 详情 </el-button>
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" />
<el-table-column label="商户id" prop="mer_id" show-overflow-tooltip />
<el-table-column label="商户分类" prop="category_id">
<template #default="{ row }">
<dict-value :options="dictData.mer_category_type" :value="row.category_id" />
</template>
</el-table-column>
<el-table-column label="店铺类型" prop="type_id">
<template #default="{ row }">
<dict-value :options="dictData.merchat_type" :value="row.type_id" />
</template>
</el-table-column>
<el-table-column label="商户名称" prop="mer_name" show-overflow-tooltip width="200" />
<el-table-column label="用户id" prop="uid" show-overflow-tooltip />
<el-table-column label="是否支持先货后款" prop="credit_buy" width="160">
<template #default="{ row }">
<dict-value :options="dictData.show_status" :value="row.credit_buy" />
</template>
</el-table-column>
<el-table-column label="结算周期(天)" prop="settle_cycle" width="120" show-overflow-tooltip />
<el-table-column label="利率" prop="interest_rate" show-overflow-tooltip />
<el-table-column label="城市" prop="city_name" show-overflow-tooltip />
<el-table-column label="区县" prop="area_name" show-overflow-tooltip />
<el-table-column label="镇街表" prop="street_name" show-overflow-tooltip />
<el-table-column label="村" prop="village_name" show-overflow-tooltip />
<el-table-column label="商户地址" prop="mer_address" show-overflow-tooltip />
<el-table-column label="商户头像" prop="mer_avatar" show-overflow-tooltip />
<el-table-column label="商户备注" prop="mark" show-overflow-tooltip />
<el-table-column label="提成比例" prop="commission_rate" show-overflow-tooltip />
<el-table-column label="店铺电话" prop="service_phone" show-overflow-tooltip />
<el-table-column label="商户余额" prop="mer_money" show-overflow-tooltip />
<el-table-column label="银行卡转账信息" prop="financial_bank" width="140" show-overflow-tooltip />
<el-table-column label="微信转账信息" prop="financial_wechat" width="140" show-overflow-tooltip />
<el-table-column label="支付宝转账信息" prop="financial_alipay" width="160" show-overflow-tooltip />
<el-table-column label="操作" width="250" fixed="right">
<template #default="{ row }">
<el-button v-perms="['merchat.merchant/edit']" type="primary" link @click="handleEdit(row)">
编辑
</el-button>
<el-button v-perms="['merchat.merchant/delete']" type="danger" link
@click="handleDelete(row.mer_id)">
删除
</el-button>
<el-button link @click="handleDetail(row)">
详情
</el-button>
<router-link :to="{ <router-link
path: 'bindGoods', :to="{
query: { path: 'bindGoods',
mer_id: row.mer_id query: {
} mer_id: row.mer_id,
}"> },
商品绑定 }"
</router-link> >
</template> <el-button link> 商品绑定 </el-button>
</el-table-column> </router-link>
</el-table> </template>
</div> </el-table-column>
<div class="flex mt-4 justify-end"> </el-table>
<pagination v-model="pager" @change="getLists" /> </div>
</div> <div class="flex mt-4 justify-end">
</el-card> <pagination v-model="pager" @change="getLists" />
<edit-popup v-if="showEdit" ref="editRef" :dict-data="dictData" @success="getLists" @close="showEdit = false" /> </div>
<DetailPopup v-if="showDetail" ref="detailRef" :dict-data="dictData" @success="getLists" </el-card>
@close="showDetail = false" /> <edit-popup
</div> v-if="showEdit"
ref="editRef"
:dict-data="dictData"
@success="getLists"
@close="showEdit = false"
/>
<DetailPopup
v-if="showDetail"
ref="detailRef"
:dict-data="dictData"
@success="getLists"
@close="showDetail = false"
/>
</div>
</template> </template>
<script lang="ts" setup name="merchantLists"> <script lang="ts" setup name="merchantLists">
import { usePaging } from '@/hooks/usePaging' import { usePaging } from "@/hooks/usePaging";
import { useDictData } from '@/hooks/useDictOptions' import { useDictData } from "@/hooks/useDictOptions";
import { apiMerchantLists, apiMerchantDelete } from '@/api/merchant' import { apiMerchantLists, apiMerchantDelete, apiMerchantStatusUpdate } from "@/api/merchant";
import feedback from '@/utils/feedback' import feedback from "@/utils/feedback";
import EditPopup from './edit.vue' import EditPopup from "./edit.vue";
import DetailPopup from './detail.vue' import DetailPopup from "./detail.vue";
const editRef = shallowRef<InstanceType<typeof EditPopup>>() const editRef = shallowRef<InstanceType<typeof EditPopup>>();
const detailRef = shallowRef<InstanceType<typeof EditPopup>>() const detailRef = shallowRef<InstanceType<typeof EditPopup>>();
// //
const showEdit = ref(false) const showEdit = ref(false);
const showDetail = ref(false) const showDetail = ref(false);
// //
const queryParams = reactive({ const queryParams = reactive({
category_id: '', category_id: "",
type_id: '', type_id: "",
mer_name: '', mer_name: "",
credit_buy: '', credit_buy: "",
status: '', status: "",
commission_rate: '', commission_rate: "",
service_phone: '', service_phone: "",
mer_money: '', mer_money: "",
financial_bank: '', financial_bank: "",
financial_wechat: '', financial_wechat: "",
financial_alipay: '' financial_alipay: "",
}) });
// //
const selectData = ref<any[]>([]) const selectData = ref<any[]>([]);
// //
const handleSelectionChange = (val: any[]) => { const handleSelectionChange = (val: any[]) => {
selectData.value = val.map(({ mer_id }) => mer_id) selectData.value = val.map(({ mer_id }) => mer_id);
} };
// //
const { dictData } = useDictData('mer_category_type,merchat_type,show_status,off_status,financial_type') const { dictData } = useDictData(
"mer_category_type,merchat_type,show_status,off_status,financial_type"
);
// //
const { pager, getLists, resetParams, resetPage } = usePaging({ const { pager, getLists, resetParams, resetPage } = usePaging({
fetchFun: apiMerchantLists, fetchFun: apiMerchantLists,
params: queryParams params: queryParams,
}) });
//
const changeStatus = (e: any)=>{
apiMerchantStatusUpdate({
mer_id: e.mer_id,
status: e.status,
})
}
// //
const handleAdd = async () => { const handleAdd = async () => {
showEdit.value = true showEdit.value = true;
await nextTick() await nextTick();
editRef.value?.open('add') editRef.value?.open("add");
} };
// //
const handleEdit = async (data: any) => { const handleEdit = async (data: any) => {
showEdit.value = true showEdit.value = true;
await nextTick() await nextTick();
editRef.value?.open('edit') editRef.value?.open("edit");
editRef.value?.setFormData(data) editRef.value?.setFormData(data);
} };
// //
const handleDelete = async (mer_id: number | any[]) => { const handleDelete = async (mer_id: number | any[]) => {
await feedback.confirm('确定要删除?') await feedback.confirm("确定要删除?");
await apiMerchantDelete({ mer_id }) await apiMerchantDelete({ mer_id });
getLists() getLists();
} };
// //
const handleDetail = async (data) => { const handleDetail = async (data) => {
// let res = await apiMerchantDetail({ mer_id }) // let res = await apiMerchantDetail({ mer_id })
showDetail.value = true showDetail.value = true;
await nextTick() await nextTick();
detailRef.value?.open('edit') detailRef.value?.open("edit");
detailRef.value?.setFormData(data) detailRef.value?.setFormData(data);
} };
getLists();
getLists()
</script> </script>

View File

@ -0,0 +1,239 @@
<template>
<div class="edit-popup">
<popup
ref="popupRef"
:async="true"
width="60vw"
@close="handleClose"
:bottom-btn="false"
>
<el-descriptions
class="margin-top"
:title="popupTitle"
:column="3"
border
>
<el-descriptions-item label="商户头像">
<material-picker v-model="formData.mer_avatar" disabled />
</el-descriptions-item>
<el-descriptions-item label="商户名称">
{{ formData.mer_name }}
</el-descriptions-item>
<el-descriptions-item label="商户分类">
<dict-value
:options="dictData.mer_category_type"
:value="formData.category_id"
/>
</el-descriptions-item>
<el-descriptions-item label="店铺类型">
<dict-value
:options="dictData.merchat_type"
:value="formData.type_id"
/>
</el-descriptions-item>
<el-descriptions-item label="结算周期(天)">
{{ formData.settle_cycle }}
</el-descriptions-item>
<el-descriptions-item label="利率">
{{ formData.interest_rate }}
</el-descriptions-item>
<el-descriptions-item label="标签">
{{ formData.sys_labels_text }}
</el-descriptions-item>
<el-descriptions-item label="城市">
{{ formData.city_name }}
</el-descriptions-item>
<el-descriptions-item label="区县">
{{ formData.area_name }}
</el-descriptions-item>
<el-descriptions-item label="镇街">
{{ formData.street_name }}
</el-descriptions-item>
<el-descriptions-item label="村">
{{ formData.village_name }}
</el-descriptions-item>
<el-descriptions-item label="商户地址">
{{ formData.mer_address }}
</el-descriptions-item>
<el-descriptions-item label="商户是否禁用">
<dict-value
:options="dictData.show_status"
:value="formData.status"
/>
</el-descriptions-item>
<el-descriptions-item label="提成比例">
{{ formData.commission_rate }}
</el-descriptions-item>
<el-descriptions-item label="商户手续费单独设置">
<dict-value
:options="dictData.show_status"
:value="formData.commission_switch"
/>
</el-descriptions-item>
<el-descriptions-item label="经度">
{{ formData.long }}
</el-descriptions-item>
<el-descriptions-item label="纬度">
{{ formData.lat }}
</el-descriptions-item>
<el-descriptions-item label="店铺电话">
{{ formData.service_phone }}
</el-descriptions-item>
<el-descriptions-item label="商户余额">
{{ formData.mer_money }}
</el-descriptions-item>
<el-descriptions-item label="银行卡转账信息">
{{ formData.financial_bank }}
</el-descriptions-item>
<el-descriptions-item label="微信转账信息">
{{ formData.financial_wechat }}
</el-descriptions-item>
<el-descriptions-item label="支付宝转账信息">
{{ formData.financial_alipay }}
</el-descriptions-item>
<el-descriptions-item label="默认使用类型">
<dict-value
:options="dictData.financial_type"
:value="formData.financial_type"
/>
</el-descriptions-item>
</el-descriptions>
<el-form :model="auditInfo">
<el-form-item label="审核状态" prop="status">
<el-radio-group v-model="auditInfo.status" class="ml-4">
<el-radio :label="1">通过</el-radio>
<el-radio :label="0">拒绝</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="审核备注" prop="mark">
<el-input v-model="auditInfo.mark" type="textarea" />
</el-form-item>
</el-form>
<div style="width: 100%; display: flex; justify-content: flex-end;">
<el-button @click="onAudit" type="primary">确认</el-button>
</div>
</popup>
</div>
</template>
<script lang="ts" setup name="brandEdit">
import Popup from "@/components/popup/index.vue";
import { apiSupplierStatus } from "@/api/supplier";
import type { PropType } from "vue";
defineProps({
dictData: {
type: Object as PropType<Record<string, any[]>>,
default: () => ({}),
},
});
const emit = defineEmits(["success", "close"]);
const popupRef = shallowRef<InstanceType<typeof Popup>>();
const mode = ref("add");
//
const popupTitle = computed(() => {
return "供应商详情";
});
//
const formData = reactive({
id: "",
category_id: "",
type_id: "",
mer_name: "",
settle_cycle: "",
interest_rate: "",
sys_labels: [],
sys_labels_text: "",
province_id: "510000",
city_id: "",
city_name: "",
area_id: "",
area_name: "",
street_id: "",
street_name: "",
village_id: "",
village_name: "",
mer_address: "",
mer_avatar: "",
apply_id: "",
mark: "",
status: "",
commission_rate: "",
commission_switch: "",
long: "",
lat: "",
service_phone: "",
mer_money: "",
financial_bank: "",
financial_wechat: "",
financial_alipay: "",
financial_type: "",
});
//
const formRules = reactive<any>({
name: [
{
required: true,
message: "请输入品牌名称",
trigger: ["blur"],
},
],
});
//
const setFormData = async (data: Record<any, any>) => {
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
formData[key] = data[key];
}
}
};
const auditInfo = reactive({
status: 1,
mark: ''
})
//
const onAudit = () => {
if(auditInfo.status == 0 && auditInfo.mark == '') return ElMessage.error('请输入拒绝原因');
apiSupplierStatus({
id: formData.id,
status: auditInfo.status,
apply_id: formData.id,
service_phone: formData.service_phone,
mark: auditInfo.mark,
}).then((res) => {
popupRef.value?.close();
});
};
//
// const handleSubmit = async () => {
// await formRef.value?.validate()
// const data = { ...formData, }
// mode.value == 'edit'
// ? await apiBrandEdit(data)
// : await apiBrandAdd(data)
// popupRef.value?.close()
// emit('success')
// }
//
const open = (type = "add") => {
mode.value = type;
popupRef.value?.open();
};
//
const handleClose = () => {
emit("close");
};
defineExpose({
open,
setFormData,
});
</script>

View File

@ -0,0 +1,414 @@
<template>
<div class="edit-popup">
<popup ref="popupRef" :title="popupTitle" :async="true" width="60vw" @confirm="handleSubmit" @close="handleClose">
<el-form ref="formRef" :model="formData" label-width="120px" :rules="formRules">
<el-row>
<el-col :span="24">
<el-form-item label="商户头像" prop="mer_avatar">
<material-picker v-model="formData.mer_avatar" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户名称" prop="mer_name">
<el-input v-model="formData.mer_name" clearable placeholder="请输入商户名称" :readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户分类" prop="category_id">
<el-select class="flex-1" v-model="formData.category_id" clearable placeholder="请选择店铺类型">
<el-option v-for="(item, index) in dictData.mer_category_type" :key="index"
:label="item.name" :value="parseInt(item.value)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="店铺类型" prop="type_id">
<el-select class="flex-1" v-model="formData.type_id" clearable placeholder="请选择店铺类型">
<el-option v-for="(item, index) in dictData.merchat_type" :key="index" :label="item.name"
:value="parseInt(item.value)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="结算周期(天)" prop="settle_cycle">
<el-input v-model="formData.settle_cycle" clearable placeholder="请输入结算周期,单位天"
:readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="利率" prop="interest_rate">
<el-input v-model="formData.interest_rate" clearable placeholder="请输入利率" :readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="城市" prop="city_id">
<el-select class="flex-1" v-model="formData.city_id" clearable placeholder="请选择城市"
@change="getAreaList(formData.city_id)">
<el-option v-for="(item, index) in address.cityList" :key="index" :label="item.city_name"
:value="parseInt(item.city_code)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="区县" prop="area_id">
<el-select class="flex-1" v-model="formData.area_id" clearable placeholder="请选择城市"
@change="getTownList(formData.area_id)">
<el-option v-for="(item, index) in address.areaList" :key="index" :label="item.area_name"
:value="parseInt(item.area_code)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="镇街" prop="street_id">
<el-select class="flex-1" v-model="formData.street_id" clearable placeholder="请选择城市"
@change="getVilllageList(formData.street_id)">
<el-option v-for="(item, index) in address.townList" :key="index" :label="item.street_name"
:value="parseInt(item.street_code)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="村" prop="village_id">
<el-select class="flex-1" v-model="formData.village_id" clearable placeholder="请选择城市">
<el-option v-for="(item, index) in address.villlageList" :key="index"
:label="item.village_name" :value="(item.village_code)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户地址" prop="mer_address">
<el-input v-model="formData.mer_address" clearable placeholder="请输入商户地址" :readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户是否禁用" prop="status">
<el-radio-group v-model="formData.status" placeholder="请选择商户是否禁用" :disabled="false">
<el-radio v-for="(item, index) in dictData.show_status" :key="index"
:label="parseInt(item.value)">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="提成比例" prop="commission_rate">
<el-input v-model="formData.commission_rate" type="number" clearable placeholder="请输入提成比例"
:readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户手续费单独设置" prop="commission_switch" label-width="180px">
<el-radio-group v-model="formData.commission_switch" placeholder="请选择商户手续费单独设置"
:disabled="false">
<el-radio v-for="(item, index) in dictData.show_status" :key="index"
:label="parseInt(item.value)">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="经度" prop="long">
<el-input v-model="formData.long" clearable placeholder="请输入经度" :readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="纬度" prop="lat">
<el-input v-model="formData.lat" clearable placeholder="请输入纬度" :readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="店铺电话" prop="service_phone">
<el-input v-model="formData.service_phone" clearable placeholder="请输入店铺电话" :readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户余额" prop="mer_money">
<el-input v-model="formData.mer_money" clearable placeholder="请输入商户余额" :readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="商户备注" prop="mark">
<el-input v-model="formData.mark" clearable placeholder="请输入商户备注" type="textarea"
:readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="银行卡转账信息" prop="financial_bank">
<el-input v-model="formData.financial_bank" clearable placeholder="请输入银行卡转账信息"
:readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="微信转账信息" prop="financial_wechat">
<el-input v-model="formData.financial_wechat" clearable placeholder="请输入微信转账信息"
:readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="支付宝转账信息" prop="financial_alipay">
<el-input v-model="formData.financial_alipay" clearable placeholder="请输入支付宝转账信息"
:readonly="false" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="默认使用类型" prop="financial_type">
<el-select class="flex-1" v-model="formData.financial_type" clearable placeholder="请选择默认使用类型">
<el-option v-for="(item, index) in dictData.financial_type" :key="index" :label="item.name"
:value="parseInt(item.value)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="标签" prop="sys_labels">
<el-tag class="mr-2" v-for="(item, index) in formData.sys_labels_arr" @close="delTags(index)"
:key="index" closable>
{{ item.name }}
</el-tag>
<el-button type="primary" @click="showDialog = true">添加标签</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-dialog v-model="showDialog" title="选择标签" width="70%">
<dialogTable multipleChoice :config="goods_label" @customEvent="customEvent">
</dialogTable>
</el-dialog>
</popup>
</div>
</template>
<script lang="ts" setup name="supplierEdit">
import type { FormInstance } from 'element-plus'
import Popup from '@/components/popup/index.vue'
import { apiSupplierAdd, apiSupplierEdit, apiSupplierDetail } from '@/api/supplier'
import { apicityLists, apiAreaLists, apiStreetLists, apiVillageLists } from "@/api/address"
import { goods_label } from "@/components/dialogTable/dialogTableConfig"
import type { PropType } from 'vue'
defineProps({
dictData: {
type: Object as PropType<Record<string, any[]>>,
default: () => ({})
}
})
const emit = defineEmits(['success', 'close'])
const formRef = shallowRef<FormInstance>()
const popupRef = shallowRef<InstanceType<typeof Popup>>()
const mode = ref('add')
const showDialog = ref(false)
//
const popupTitle = computed(() => {
return mode.value == 'edit' ? '编辑供应商表' : '新增供应商表'
})
//
const formData = reactive({
id: '',
category_id: '',
type_id: '',
mer_name: '',
settle_cycle: '',
interest_rate: '',
sys_labels: [],
sys_labels_text: '',
province_id: '510000',
city_id: '',
area_id: '',
street_id: '',
village_id: '',
mer_address: '',
mer_avatar: '',
mark: '',
status: '',
commission_rate: '',
commission_switch: '',
long: '',
lat: '',
service_phone: '',
mer_money: '',
financial_bank: '',
financial_wechat: '',
financial_alipay: '',
financial_type: '',
sys_labels_arr: []
})
const customEvent = (e) => {
e.forEach(item => {
formData.sys_labels_arr.push(item)
});
formData.sys_labels_arr = Array.from(new Set(formData.sys_labels_arr.map(obj => JSON.stringify(obj)))).map(str => JSON.parse(str));
showDialog.value = false
}
//
const formRules = reactive<any>({
category_id: [{
required: true,
message: '请输入商户分类 id',
trigger: ['blur']
}],
mer_name: [{
required: true,
message: '请输入商户名称',
trigger: ['blur']
}],
settle_cycle: [{
required: true,
message: '请输入结算周期,单位天',
trigger: ['blur']
}],
interest_rate: [{
required: true,
message: '请输入利率',
trigger: ['blur']
}],
mer_address: [{
required: true,
message: '请输入商户地址',
trigger: ['blur']
}],
mark: [{
required: true,
message: '请输入商户备注',
trigger: ['blur']
}],
status: [{
required: true,
message: '请选择商户是否禁用0锁定,1正常',
trigger: ['blur']
}],
service_phone: [{
required: true,
message: '请输入店铺电话',
trigger: ['blur']
}],
mer_money: [{
required: true,
message: '请输入商户余额',
trigger: ['blur']
}]
})
//
const delTags = (index: number) => {
formData.sys_labels_arr.splice(index, 1)
}
//
const setFormData = async (data: Record<any, any>) => {
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
formData[key] = data[key]
}
}
await getAreaList(formData.city_id, true)
await getTownList(formData.area_id, true)
getVilllageList(formData.street_id)
if (data.financial_type == 0) {
formData.financial_type = ''
}
}
const getDetail = async (row: Record<string, any>) => {
const data = await apiSupplierDetail({
id: row.id
})
setFormData(data)
}
//
const handleSubmit = async () => {
await formRef.value?.validate()
const data = { ...formData, }
data.sys_labels = data.sys_labels_arr.map(item => {
return item.id
}).join(',')
mode.value == 'edit'
? await apiSupplierEdit(data)
: await apiSupplierAdd(data)
popupRef.value?.close()
emit('success')
}
//
const open = (type = 'add') => {
mode.value = type
popupRef.value?.open()
}
//
const handleClose = () => {
emit('close')
}
// 510000
//
const address = reactive({
cityList: [],
areaList: [],
townList: [],
villlageList: []
})
const getCityList = async (province_code: number | String, isAsync: Boolean) => {
if (!province_code) return;
let res = await apicityLists({ province_code })
address.cityList = res
if (isAsync) {
return Promise.resolve({
msg: '获取成功'
});
}
}
const getAreaList = async (city_code: number | String, isAsync: Boolean) => {
if (!city_code) return;
let res = await apiAreaLists({ city_code })
address.areaList = res
if (isAsync) {
return Promise.resolve({
msg: '获取成功'
});
}
}
const getTownList = async (area_code: number | String, isAsync: Boolean) => {
if (!area_code) return;
let res = await apiStreetLists({ area_code })
address.townList = res
if (isAsync) {
return Promise.resolve({
msg: '获取成功'
});
}
}
const getVilllageList = async (street_code: number | String) => {
if (!street_code) return;
let res = await apiVillageLists({ street_code })
address.villlageList = res
}
//
getCityList(510000, false)
defineExpose({
open,
setFormData,
getDetail
})
</script>

View File

@ -0,0 +1,162 @@
<template>
<div>
<el-card class="!border-none mb-4" shadow="never">
<el-form class="mb-[-16px]" :model="queryParams" label-width="120px">
<el-row>
<el-col :span="6">
<el-form-item label="商户分类" prop="category_id">
<el-select v-model="queryParams.category_id" clearable placeholder="请选择店铺类型">
<el-option v-for="(item, index) in dictData.mer_category_type" :key="index"
:label="item.name" :value="parseInt(item.value)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="店铺类型" prop="type_id">
<el-select v-model="queryParams.type_id" clearable placeholder="请选择店铺类型">
<el-option v-for="(item, index) in dictData.merchat_type" :key="index" :label="item.name"
:value="parseInt(item.value)" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="商户名称" prop="mer_name">
<el-input v-model="queryParams.mer_name" clearable placeholder="请输入商户名称" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item>
<el-button type="primary" @click="resetPage">查询</el-button>
<el-button @click="resetParams">重置</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
<el-card class="!border-none" v-loading="pager.loading" shadow="never">
<div class="mt-4">
<el-table :data="pager.lists" @selection-change="handleSelectionChange">
<!-- <el-table-column type="selection" width="55" /> -->
<el-table-column label="商户分类" prop="category_id" show-overflow-tooltip>
<template #default="{ row }">
<dict-value :options="dictData.mer_category_type" :value="row.category_id" />
</template>
</el-table-column>
<el-table-column label="店铺类型" prop="type_id" show-overflow-tooltip>
<template #default="{ row }">
<dict-value :options="dictData.merchat_type" :value="row.type_id" />
</template>
</el-table-column>
<el-table-column label="商户名称" prop="mer_name" show-overflow-tooltip />
<el-table-column label="结算周期(天)" prop="settle_cycle" show-overflow-tooltip />
<el-table-column label="利率" prop="interest_rate" show-overflow-tooltip />
<el-table-column label="标签" prop="sys_labels_text" show-overflow-tooltip />
<el-table-column label="商户地址" prop="mer_address" show-overflow-tooltip />
<el-table-column label="商户是否禁用" prop="status">
<template #default="{ row }">
<dict-value :options="dictData.show_status" :value="row.status" />
</template>
</el-table-column>
<el-table-column label="提成比例" prop="commission_rate" show-overflow-tooltip />
<el-table-column label="商户手续费单独设置" width="200" prop="commission_switch">
<template #default="{ row }">
<!-- <dict-value :options="dictData.show_status" :value="row.commission_switch" /> -->
{{ row.commission_switch ? "开启" : "关闭" }}
</template>
</el-table-column>
<el-table-column label="商户余额" prop="mer_money" show-overflow-tooltip />
<el-table-column label="操作" width="170" fixed="right">
<template #default="{ row }">
<el-button link type="primary" @click="handleDetail(row.pid)">
审核
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="flex mt-4 justify-end">
<pagination v-model="pager" @change="getLists" />
</div>
</el-card>
<edit-popup v-if="showEdit" ref="editRef" :dict-data="dictData" @success="getLists" @close="showEdit = false" />
<DetailPopup v-if="showDetail" ref="detailRef" :dict-data="dictData" @success="getLists"
@close="showDetail = false" />
</div>
</template>
<script lang="ts" setup name="supplierLists">
import { usePaging } from '@/hooks/usePaging'
import { useDictData } from '@/hooks/useDictOptions'
import { apiSupplierApplyLists, apiSupplierDelete, apiSupplierDetail } from '@/api/supplier'
import { timeFormat } from '@/utils/util'
import feedback from '@/utils/feedback'
import EditPopup from './edit.vue'
import DetailPopup from './detail.vue'
const editRef = shallowRef<InstanceType<typeof EditPopup>>()
const detailRef = shallowRef<InstanceType<typeof EditPopup>>()
//
const showEdit = ref(false)
const showDetail = ref(false)
//
const queryParams = reactive({
category_id: '',
type_id: '',
mer_name: '',
})
//
const selectData = ref<any[]>([])
//
const handleSelectionChange = (val: any[]) => {
selectData.value = val.map(({ id }) => id)
}
//
const { dictData } = useDictData('show_status,mer_category_type,merchat_type,financial_type')
//
const { pager, getLists, resetParams, resetPage } = usePaging({
fetchFun: apiSupplierApplyLists,
params: queryParams
})
//
const handleAdd = async () => {
showEdit.value = true
await nextTick()
editRef.value?.open('add')
}
//
const handleEdit = async (data: any) => {
showEdit.value = true
await nextTick()
editRef.value?.open('edit')
editRef.value?.setFormData(data)
}
//
const handleDelete = async (id: number | any[]) => {
await feedback.confirm('确定要删除?')
await apiSupplierDelete({ id })
getLists()
}
//
const handleDetail = async (id: any) => {
let res = await apiSupplierDetail({ id })
showDetail.value = true
await nextTick()
detailRef.value?.open('edit')
detailRef.value?.setFormData(res)
}
getLists()
</script>