商户二级信息表单

src/views/wallet/mch-manage/form.vue

@@ -31,6 +31,42 @@
 					</el-form-item>
 				</el-col>
 
+				<el-col v-if="form.merchantType == '2'" :span="24" class="mb20">
+					<el-form-item label="商户分店" prop="merchantBranch">
+						<el-radio-group v-model="form.merchantBranch" @change="(value:number) => form.merchantBranch = value">
+							<el-radio :label="1">总店</el-radio>
+							<el-radio :label="2">分店</el-radio>
+						</el-radio-group>
+					</el-form-item>
+				</el-col>
+
+				<el-col v-if="form.merchantType == '2' && form.merchantBranch == 2" :span="24" class="mb20">
+					<el-form-item label="合作状态" prop="cooperationStatus">
+						<el-switch v-model="form.cooperationStatus" />
+					</el-form-item>
+				</el-col>
+
+				<el-col v-if="form.merchantType == '2' && form.merchantBranch == 2" :span="24" class="mb20">
+					<el-form-item label="总店" prop="parentId">
+						<el-tree-select
+							v-model="form.parentId"
+							:data="merchantTree"
+							:props="{ value: 'id', label: 'name', children: 'children', disabled: 'isLock' }"
+							check-strictly
+							class="w100"
+							clearable
+							filterable
+							placeholder="请选择主店"
+						/>
+					</el-form-item>
+				</el-col>
+
+				<el-col v-if="form.merchantType == '2' && form.merchantBranch == 2" :span="12" class="mb20">
+					<el-form-item label="优惠价格" prop="discountsPrice">
+						<el-input-number v-model="form.discountsPrice" :min="0" :max="1000" :precision="0" />
+					</el-form-item>
+				</el-col>
+
 				<el-col :span="24" class="mb20">
 					<el-form-item label="商户logo" prop="logoPic">
 						<upload-img v-model:imageUrl="form.logoPic" />
@@ -116,13 +152,15 @@
 <script setup lang="ts" name="MerchantInfoDialog">
 import { useDict } from "/@/hooks/dict"
 import { useMessage } from "/@/hooks/message"
-import { getObj, addObj, putObj } from "/@/api/wallet/mch-manage"
+import { pageJoin, getObj, addObj, putObj } from "/@/api/wallet/mch-manage"
+
 const emit = defineEmits(["refresh"])
 
 // 定义变量内容
 const dataFormRef = ref()
 const visible = ref(false)
 const loading = ref(false)
+const merchantTree = ref<any[]>([])
 
 // 定义字典
 const { merchant_type } = useDict("merchant_type")
@@ -142,6 +180,10 @@ const form = reactive({
 	businessTime: "",
 	addressDes: "",
 	sort: 0,
+	merchantBranch: 1,
+	cooperationStatus: "0",
+	parentId: "",
+	discountsPrice: null,
 })
 const jobTime = reactive<{
 	[key: string]: string[]
@@ -163,6 +205,9 @@ const dataRules = ref({
 	merchantType: [{ required: true, message: "请选择商户类型", trigger: "blur" }],
 	sort: [{ required: true, message: "请输入排序", trigger: "blur" }],
 	// jobTime: [{ required: true, message: "请选择营业时间", trigger: "blur" }],
+	cooperationStatus:
+		form.merchantType == "2" && form.merchantBranch == 2 ? [{ required: true, message: "请选择合作状态", trigger: "blur" }] : [],
+	parentId: form.merchantType == "2" && form.merchantBranch == 2 ? [{ required: true, message: "请选择主店", trigger: "blur" }] : [],
 })
 
 // 打开弹窗
@@ -181,10 +226,36 @@ const openDialog = async (id: string) => {
 		form.id = id
 		await getmerchantInfoData(id)
 	}
+
+	await getMerchantTreeData()
 }
 
+// 获取商户树数据
+const getMerchantTreeData = async () => {
+	const res = await pageJoin({ current: 1, size: 9999 })
+	if (res.code == 0) {
+		merchantTree.value = res.data.records
+	} else {
+		merchantTree.value = []
+	}
+}
+
+watch(
+	() => form.merchantType,
+	(newVal) => {
+		if (newVal != "2") {
+			form.merchantBranch = 1
+			form.cooperationStatus = "0"
+			form.parentId = ""
+		}
+	},
+)
+
 // 提交
 const onSubmit = async () => {
+	console.log(form)
+	return
+
 	const valid = await dataFormRef.value.validate().catch(() => {})
 	if (!valid) return false
 	const _pa = {

src/views/wallet/mch-manage/index.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="layout-padding">
 		<div class="layout-padding-auto layout-padding-view">
-			<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList">
+			<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList" row-key="id" lazy>
 				<el-row>
 					<el-form-item style="width: 300px" label="商户名" prop="name">
 						<el-input v-model="state.queryForm.name" placeholder="商户名" />