This commit is contained in:
parent
9836c4acc9
commit
51401e0821
|
@ -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
|
|
@ -24,3 +24,13 @@ export function apiSupplierDelete(params: any) {
|
|||
export function apiSupplierDetail(params: any) {
|
||||
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 })
|
||||
}
|
|
@ -1,35 +1,58 @@
|
|||
<template>
|
||||
<div>
|
||||
<template v-for="(item, index) in getOptions" :key="index">
|
||||
<span>{{ index != 0 ? '、' : '' }}{{ item[config.label] }}</span>
|
||||
<span>{{ index != 0 ? "、" : "" }}{{ item[config.label] }}</span>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
options: any[]
|
||||
value: any
|
||||
config: Record<string, string>
|
||||
}>(),
|
||||
{
|
||||
options: () => [],
|
||||
config: () => ({
|
||||
label: 'name',
|
||||
value: 'value'
|
||||
})
|
||||
}
|
||||
)
|
||||
// const props = withDefaults(
|
||||
// defineProps<{
|
||||
// options: any[]
|
||||
// value: any
|
||||
// config: Record<string, string>
|
||||
// }>(),
|
||||
// {
|
||||
// options: () => [],
|
||||
// config: () => ({
|
||||
// label: 'name',
|
||||
// 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(() => {
|
||||
if (props.value !== null && typeof props.value !== 'undefined') {
|
||||
return Array.isArray(props.value) ? props.value : String(props.value).split(',')
|
||||
if (props.value !== null && typeof props.value !== "undefined") {
|
||||
return Array.isArray(props.value)
|
||||
? props.value
|
||||
: String(props.value).split(",");
|
||||
} else {
|
||||
return []
|
||||
return [];
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
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>
|
||||
|
|
|
@ -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>
|
||||
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -5,19 +5,37 @@
|
|||
<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-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-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-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-option
|
||||
v-for="(item, index) in dictData.merchat_type"
|
||||
:key="index"
|
||||
:label="item.name"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
@ -90,14 +108,21 @@
|
|||
</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="handleAdd">
|
||||
<el-button
|
||||
v-perms="['merchat.merchant/add']"
|
||||
type="primary"
|
||||
@click="handleAdd"
|
||||
>
|
||||
<template #icon>
|
||||
<icon name="el-icon-Plus" />
|
||||
</template>
|
||||
新增
|
||||
</el-button>
|
||||
<el-button v-perms="['merchat.merchant/delete']" :disabled="!selectData.length"
|
||||
@click="handleDelete(selectData)">
|
||||
<el-button
|
||||
v-perms="['merchat.merchant/delete']"
|
||||
:disabled="!selectData.length"
|
||||
@click="handleDelete(selectData)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
<div class="mt-4">
|
||||
|
@ -106,56 +131,152 @@
|
|||
<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" />
|
||||
<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" />
|
||||
<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="商户名称"
|
||||
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">
|
||||
<!-- <el-table-column
|
||||
label="是否启用"
|
||||
prop="status"
|
||||
width="160"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<dict-value :options="dictData.show_status" :value="row.credit_buy" />
|
||||
<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="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="提成比例"
|
||||
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
|
||||
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
|
||||
v-perms="['merchat.merchant/delete']"
|
||||
type="danger"
|
||||
link
|
||||
@click="handleDelete(row.mer_id)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
<el-button link @click="handleDetail(row)">
|
||||
详情
|
||||
</el-button>
|
||||
<el-button link @click="handleDetail(row)"> 详情 </el-button>
|
||||
|
||||
<router-link :to="{
|
||||
<router-link
|
||||
:to="{
|
||||
path: 'bindGoods',
|
||||
query: {
|
||||
mer_id: row.mer_id
|
||||
}
|
||||
}">
|
||||
商品绑定
|
||||
mer_id: row.mer_id,
|
||||
},
|
||||
}"
|
||||
>
|
||||
<el-button link> 商品绑定 </el-button>
|
||||
</router-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
@ -165,93 +286,109 @@
|
|||
<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" />
|
||||
<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 { apiMerchantLists, apiMerchantDelete } from '@/api/merchant'
|
||||
import feedback from '@/utils/feedback'
|
||||
import EditPopup from './edit.vue'
|
||||
import DetailPopup from './detail.vue'
|
||||
import { usePaging } from "@/hooks/usePaging";
|
||||
import { useDictData } from "@/hooks/useDictOptions";
|
||||
import { apiMerchantLists, apiMerchantDelete, apiMerchantStatusUpdate } 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 editRef = shallowRef<InstanceType<typeof EditPopup>>();
|
||||
const detailRef = shallowRef<InstanceType<typeof EditPopup>>();
|
||||
// 是否显示编辑框
|
||||
const showEdit = ref(false)
|
||||
const showDetail = ref(false)
|
||||
|
||||
|
||||
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: ''
|
||||
})
|
||||
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 selectData = ref<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({
|
||||
fetchFun: apiMerchantLists,
|
||||
params: queryParams
|
||||
})
|
||||
params: queryParams,
|
||||
});
|
||||
|
||||
// 改变状态
|
||||
const changeStatus = (e: any)=>{
|
||||
apiMerchantStatusUpdate({
|
||||
mer_id: e.mer_id,
|
||||
status: e.status,
|
||||
})
|
||||
}
|
||||
|
||||
// 添加
|
||||
const handleAdd = async () => {
|
||||
showEdit.value = true
|
||||
await nextTick()
|
||||
editRef.value?.open('add')
|
||||
}
|
||||
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)
|
||||
}
|
||||
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()
|
||||
}
|
||||
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)
|
||||
}
|
||||
showDetail.value = true;
|
||||
await nextTick();
|
||||
detailRef.value?.open("edit");
|
||||
detailRef.value?.setFormData(data);
|
||||
};
|
||||
|
||||
|
||||
|
||||
getLists()
|
||||
getLists();
|
||||
</script>
|
||||
|
||||
|
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
||||
|
Loading…
Reference in New Issue