feat:钱包规则

src/views/mch/components/mch-rule-desc.vue

@@ -0,0 +1,34 @@
+<template>
+	<div class="size-full">
+		<div class="size-full flex justify-start">
+			<span class="color-primary">{{ detail.sourceMchName ? detail.sourceMchName : "???" }}</span>
+			<span>到</span>
+			<span class="color-primary">{{ detail.targetMchName ? detail.targetMchName : "???" }}</span>
+			<span>消费超过</span>
+			<span class="color-success">{{ detail.basePrice ? displayPrice(detail.basePrice) : "???" }}</span>
+			<span>额外支付</span>
+			<span class="color-danger">{{ detail.multiple ? detail.multiple : "???" }}%</span>
+		</div>
+		<div class="size-full flex justify-start" v-if="detail.rulePriceType == 20">
+			<span class="color-primary">{{ detail.sourceMchName ? detail.sourceMchName : "???" }}</span>
+			<span>每餐消费超过</span>
+			<span class="color-success">{{ detail.basePrice ? displayPrice(detail.basePrice) : "???" }}</span>
+			<span>额外支付</span>
+			<span class="color-danger">{{ detail.multiple ? detail.multiple : "???" }}%</span>
+		</div>
+	</div>
+</template>
+
+<script setup lang="ts" name="mchRuleDesc">
+import { displayPrice } from "/@/utils/formatMoney"
+
+export type Props = {
+	detail: any
+}
+
+const props = withDefaults(defineProps<Props>(), {
+	detail: {},
+})
+
+const { detail } = toRefs(props)
+</script>

src/views/mch/mch-manage/mch-rule-config-form.vue

@@ -19,13 +19,7 @@
 				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-alert title="提示" type="info" :closable="false">
-						<span class="color-primary">{{ form.sourceMchName ? form.sourceMchName : "???" }}</span>
-						<span>到</span>
-						<span class="color-primary">{{ form.targetMchName ? form.targetMchName : "???" }}</span>
-						<span>消费,超过</span>
-						<span class="color-success">{{ form.basePrice ? displayPrice(form.basePrice) : "???" }}</span>
-						<span>额外支付</span>
-						<span class="color-danger">{{ form.multiple ? form.multiple : "???" }}%</span>
+						<mch-rule-desc :detail="form" />
 					</el-alert>
 				</el-col>
 			</el-row>
@@ -42,7 +36,8 @@
 <script setup lang="ts" name="WalletRuleMchConfigFormDialog">
 import { useMessage } from "/@/hooks/message"
 import * as walletRuleMchConfigApi from "/@/api/wallet/mch-rule-join"
-import { displayPrice } from "/@/utils/formatMoney"
+
+const mchRuleDesc = defineAsyncComponent(() => import("../components/mch-rule-desc.vue"))
 
 const emit = defineEmits(["refresh"])
 

src/views/mch/mch-manage/mch-rule-config.vue

@@ -40,13 +40,7 @@
 			</el-table-column>
 			<el-table-column min-width="200" label="描述">
 				<template #default="{ row }">
-					<span class="color-primary">{{ row.sourceMchName ? row.sourceMchName : "???" }}</span>
-					<span>到</span>
-					<span class="color-primary">{{ row.targetMchName ? row.targetMchName : "???" }}</span>
-					<span>消费,超过</span>
-					<span class="color-success">{{ row.basePrice ? displayPrice(row.basePrice) : "???" }}</span>
-					<span>额外支付</span>
-					<span class="color-danger">{{ row.multiple ? row.multiple : "???" }}%</span>
+					<mch-rule-desc :detail="row" />
 				</template>
 			</el-table-column>
 			<el-table-column label="操作" width="150" fixed="right">
@@ -77,6 +71,7 @@ import { useMessage, useMessageBox } from "/@/hooks/message"
 import { useDict } from "/@/hooks/dict"
 import { displayPrice } from "/@/utils/formatMoney"
 
+const mchRuleDesc = defineAsyncComponent(() => import("../components/mch-rule-desc.vue"))
 const WalletRuleMchConfigFormDialog = defineAsyncComponent(() => import("./mch-rule-config-form.vue"))
 
 export type Props = {

src/views/mch/rule-price-config/form.vue

@@ -7,16 +7,14 @@
 						<dict-select v-model="form.rulePriceType" dict-code="wallet_rule_price_type" />
 					</el-form-item>
 				</el-col>
-
 				<el-col :span="24" class="mb20">
 					<el-form-item label="基础金额" prop="basePrice">
-						<el-input-number v-model="form.basePrice" placeholder="请输入基础金额" />
+						<el-input-number :min="1" :max="200" v-model="form.basePrice" placeholder="请输入基础金额" />
 					</el-form-item>
 				</el-col>
-
 				<el-col :span="24" class="mb20">
 					<el-form-item label="额外的百分比" prop="multiple">
-						<el-input-number v-model="form.multiple" placeholder="额外的百分比" />
+						<el-input-number :min="1" :max="200" v-model="form.multiple" placeholder="" />
 					</el-form-item>
 				</el-col>
 			</el-row>

src/views/wallet/components/wallet-rule-desc.vue

@@ -0,0 +1,30 @@
+<template>
+	<div class="size-full flex justify-start">
+		<div class="size-full text-start">
+			<span class="color-primary">{{ detail.sourceName ? detail.sourceName : "???" }}</span>
+			<span>转到</span>
+			<span class="color-primary">{{ detail.targetName ? detail.targetName : "???" }}</span>
+			<span>百分比为</span>
+			<span class="color-danger">{{ detail.balanceMultiple ? detail.balanceMultiple : "???" }}%</span>
+			<span>,如100元从</span>
+			<span class="color-primary">{{ detail.sourceName ? detail.sourceName : "???" }}</span>
+			<span>转到</span>
+			<span class="color-primary">{{ detail.targetName ? detail.targetName : "???" }}</span>
+			<span>为{{ (100 * detail.balanceMultiple) / 100 }}元</span>
+		</div>
+	</div>
+</template>
+
+<script setup lang="ts" name="mchRuleDesc">
+import { displayPrice } from "/@/utils/formatMoney"
+
+export type Props = {
+	detail: any
+}
+
+const props = withDefaults(defineProps<Props>(), {
+	detail: {},
+})
+
+const { detail } = toRefs(props)
+</script>

src/views/wallet/wallet-type/components/wallet-rule-form-dialog.vue

@@ -0,0 +1,123 @@
+<template>
+	<el-dialog :title="form.id ? '编辑' : '新增'" width="30%" v-model="visible" append-to-body :close-on-click-modal="false" draggable>
+		<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="120px" v-loading="loading">
+			<el-row :gutter="24">
+				<el-col :span="24" class="mb20">
+					<el-form-item label="源钱包类型" prop="sourceWalletTypeId">
+						<select-wallet-type v-model="form.sourceWalletTypeId" disabled />
+					</el-form-item>
+				</el-col>
+				<el-col :span="24" class="mb20">
+					<el-form-item label="目标钱包类型" prop="targetWalletTypeId">
+						<select-wallet-type v-model="form.targetWalletTypeId" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="24" class="mb20">
+					<el-form-item label="钱包转换百分比" prop="balanceMultiple">
+						<el-input-number :min="1" :max="200" v-model="form.balanceMultiple" placeholder="" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="24" class="mb20">
+					<el-alert title="提示" type="info" :closable="false">
+						<wallet-rule-desc :detail="form" />
+					</el-alert>
+				</el-col>
+			</el-row>
+		</el-form>
+		<template #footer>
+			<span class="dialog-footer">
+				<el-button @click="visible = false">取消</el-button>
+				<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
+			</span>
+		</template>
+	</el-dialog>
+</template>
+
+<script setup lang="ts" name="WalletRuleFormDialog">
+import { useMessage } from "/@/hooks/message"
+import * as walletRuleJoinApi from "/@/api/wallet/wallet-rule-join"
+
+const WalletRuleDesc = defineAsyncComponent(() => import("../../components/wallet-rule-desc.vue"))
+
+const emit = defineEmits(["refresh"])
+
+// 定义变量内容
+const dataFormRef = ref()
+const visible = ref(false)
+const loading = ref(false)
+// 定义字典
+
+// 提交表单数据
+const defaultForm = {
+	id: "",
+	sourceWalletTypeId: "",
+	targetWalletTypeId: "",
+	balanceMultiple: 100,
+	status: 0,
+}
+const form = reactive({
+	...defaultForm,
+})
+
+// 定义校验规则
+const dataRules = ref({
+	sourceWalletTypeId: [{ required: true, message: "请选择源钱包类型", trigger: "blur" }],
+	targetWalletTypeId: [{ required: true, message: "请选择目标钱包类型", trigger: "blur" }],
+	balanceMultiple: [{ required: true, message: "请输入钱包转换百分比", trigger: "blur" }],
+})
+
+// 打开弹窗
+const openDialog = (id: string, sourceWalletTypeId: string) => {
+	visible.value = true
+	form.id = ""
+	form.sourceWalletTypeId = sourceWalletTypeId
+	// 重置表单数据
+	nextTick(() => {
+		dataFormRef.value?.resetFields()
+	})
+	// 获取walletRuleJoin信息
+	if (id) {
+		form.id = id
+		getwalletRuleJoinData(id)
+	}
+}
+
+// 提交
+const onSubmit = async () => {
+	const valid = await dataFormRef.value.validate().catch(() => {})
+	if (!valid) return false
+
+	try {
+		loading.value = true
+		const { data } = form.id ? await walletRuleJoinApi.putObj(form) : await walletRuleJoinApi.addObj(form)
+		useMessage().success(form.id ? "修改成功" : "添加成功")
+		// visible.value = false
+		// 更新
+		await getwalletRuleJoinData(data)
+		emit("refresh")
+	} catch (err: any) {
+		useMessage().error(err.msg)
+	} finally {
+		loading.value = false
+	}
+}
+
+// 初始化表单数据
+const getwalletRuleJoinData = async (id: string) => {
+	// 获取数据
+	loading.value = true
+	try {
+		const { data } = await walletRuleJoinApi.getJoinDetail(id)
+		Object.assign(form, data)
+	} catch (err) {
+		console.error(err)
+	} finally {
+		loading.value = false
+	}
+}
+
+// 暴露变量
+defineExpose({
+	openDialog,
+})
+</script>

src/views/wallet/wallet-type/components/wallet-rule-table-dialog.vue

@@ -0,0 +1,156 @@
+<template>
+	<el-dialog title="钱包规则" width="70%" v-model="visible" append-to-body :close-on-click-modal="false" draggable>
+		<el-row>
+			<div class="mb8" style="width: 100%">
+				<el-button icon="folder-add" type="primary" class="ml10" @click="doAdd" v-auth="'dzc_walletRuleMchConfig_add'"> 新 增 </el-button>
+			</div>
+		</el-row>
+		<el-table
+			:data="state.dataList"
+			v-loading="state.loading"
+			border
+			:cell-style="tableStyle.cellStyle"
+			:header-cell-style="tableStyle.headerCellStyle"
+			@selection-change="selectionChangHandle"
+			@sort-change="sortChangeHandle"
+		>
+			<el-table-column type="selection" width="40" align="center" />
+			<el-table-column type="index" label="#" width="80" />
+			<el-table-column min-width="120" label="源钱包类型">
+				<template #default="{ row }">
+					<div class="flex items-center justify-center">
+						<div class="color-primary">{{ row.sourceName }}</div>
+						<div class="flex items-center just ml5">
+							<dict-tag :options="wallet_type" :value="row.sourceUniqueCode" />
+						</div>
+					</div>
+				</template>
+			</el-table-column>
+			<el-table-column min-width="120" label="目前钱包类型">
+				<template #default="{ row }">
+					<div class="flex items-center justify-center">
+						<div class="color-primary">{{ row.targetName }}</div>
+						<div class="flex items-center just ml5">
+							<dict-tag :options="wallet_type" :value="row.targetUniqueCode" />
+						</div>
+					</div>
+				</template>
+			</el-table-column>
+			<el-table-column prop="rulePriceConfigId" min-width="80" label="转换百分比">
+				<template #default="{ row }">
+					<span class="color-success">{{ row.balanceMultiple }}%</span>
+				</template>
+			</el-table-column>
+			<el-table-column prop="status" min-width="80" label="是否启用">
+				<template #default="{ row }">
+					<el-switch active-value="1" inactive-value="0" v-model="row.status" @change="statusChange(row)" />
+				</template>
+			</el-table-column>
+			<el-table-column min-width="300" label="描述">
+				<template #default="{ row }">
+					<wallet-rule-desc :detail="row" />
+				</template>
+			</el-table-column>
+			<el-table-column label="操作" width="150" fixed="right">
+				<template #default="{ row }">
+					<el-button
+						icon="edit-pen"
+						text
+						type="primary"
+						v-auth="'dzc_walletRuleMchConfig_edit'"
+						@click="WalletRuleFormDialogRef.openDialog(row.id, state.queryForm.sourceWalletTypeId)"
+						>编辑</el-button
+					>
+					<el-button icon="delete" text type="primary" v-auth="'dzc_walletRuleMchConfig_del'" @click="handleDelete([row.id])"
+						>删除</el-button
+					>
+				</template>
+			</el-table-column>
+		</el-table>
+		<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+		<wallet-rule-form-dialog ref="WalletRuleFormDialogRef" @refresh="getDataList(false)" />
+	</el-dialog>
+</template>
+
+<script setup lang="ts" name="walletRuleTableDialog">
+import * as walletRuleJoinApi from "/@/api/wallet/wallet-rule-join"
+import { BasicTableProps, useTable } from "/@/hooks/table"
+import { useMessage, useMessageBox } from "/@/hooks/message"
+import { useDict } from "/@/hooks/dict"
+
+const WalletRuleFormDialog = defineAsyncComponent(() => import("./wallet-rule-form-dialog.vue"))
+const WalletRuleDesc = defineAsyncComponent(() => import("../../components/wallet-rule-desc.vue"))
+
+// 定义查询字典
+const { wallet_type } = useDict("wallet_type")
+
+// 定义变量内容
+const WalletRuleFormDialogRef = ref()
+const visible = ref(false)
+
+// 多选变量
+const selectObjs = ref([]) as any
+const multiple = ref(true)
+
+const state: BasicTableProps = reactive<BasicTableProps>({
+	createdIsNeed: false,
+	queryForm: {},
+	pageList: walletRuleJoinApi.pageJoin,
+})
+
+//  table hook
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state)
+
+// 多选事件
+const selectionChangHandle = (objs: { id: string }[]) => {
+	selectObjs.value = objs.map(({ id }) => id)
+	multiple.value = !objs.length
+}
+
+// 新增
+const doAdd = () => {
+	WalletRuleFormDialogRef.value.openDialog(null, state.queryForm.sourceWalletTypeId)
+}
+
+// 是否启用
+const statusChange = async (row: any) => {
+	try {
+		await walletRuleJoinApi.putObj(row)
+		getDataList()
+		useMessage().success("操作成功")
+	} catch (e) {
+		useMessage().error("操作错误")
+	}
+}
+
+// 删除操作
+const handleDelete = async (ids: string[]) => {
+	try {
+		await useMessageBox().confirm("此操作将永久删除")
+	} catch {
+		return
+	}
+	try {
+		await walletRuleJoinApi.delObjs(ids)
+		getDataList()
+		useMessage().success("删除成功")
+	} catch (err: any) {
+		useMessage().error(err.msg)
+	}
+}
+
+// 打开弹窗
+const openDialog = (id: string) => {
+	if (!id) {
+		useMessage().success("钱包不存在")
+		return
+	}
+	state.queryForm.sourceWalletTypeId = id
+	getDataList()
+	visible.value = true
+}
+
+defineExpose({
+	openDialog,
+})
+</script>

src/views/wallet/wallet-type/index.vue

@@ -49,14 +49,21 @@
 						<dict-tag :options="wallet_type" :value="row.uniqueCode" />
 					</template>
 				</el-table-column>
-				<el-table-column v-auths="['wallet_walletType_edit', 'wallet_walletType_del']" label="操作" width="150">
-					<template #default="scope">
-						<el-button icon="edit-pen" text type="primary" v-auth="'wallet_walletType_edit'" @click="formDialogRef.openDialog(scope.row.id)"
-							>编辑</el-button
-						>
-						<el-button icon="delete" text type="primary" v-auth="'wallet_walletType_del'" @click="handleDelete([scope.row.id])"
-							>删除</el-button
+				<el-table-column v-auths="['wallet_walletType_edit', 'wallet_walletType_del']" label="操作" width="250">
+					<template #default="{ row }">
+						<el-button
+							icon="InfoFilled"
+							text
+							type="primary"
+							v-auth="'wallet_walletManage_edit'"
+							@click="WalletRuleTableDialogRef.openDialog(row.id)"
 						>
+							钱包规则
+						</el-button>
+						<el-button icon="edit-pen" text type="primary" v-auth="'wallet_walletType_edit'" @click="formDialogRef.openDialog(row.id)">
+							编辑
+						</el-button>
+						<el-button icon="delete" text type="primary" v-auth="'wallet_walletType_del'" @click="handleDelete([row.id])"> 删除 </el-button>
 					</template>
 				</el-table-column>
 			</el-table>
@@ -65,6 +72,7 @@
 
 		<!-- 编辑、新增  -->
 		<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+		<WalletRuleTableDialog ref="WalletRuleTableDialogRef" />
 	</div>
 </template>
 
@@ -76,10 +84,12 @@ import { useDict } from "/@/hooks/dict"
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import("./form.vue"))
+const WalletRuleTableDialog = defineAsyncComponent(() => import("./components/wallet-rule-table-dialog.vue"))
 // 定义查询字典
 const { wallet_type } = useDict("wallet_type")
 // 定义变量内容
 const formDialogRef = ref()
+const WalletRuleTableDialogRef = ref()
 // 搜索变量
 const queryRef = ref()
 const showSearch = ref(true)