Merge branch 'master' of https://gitea.zianxin.com/zax/biz-pc-cloud-zax

# Conflicts:
#	pnpm-lock.yaml

package.json

@@ -22,6 +22,10 @@
 		"@element-plus/icons-vue": "^2.0.10",
 		"@map-component/vue-tmap": "^1.0.1",
 		"@popperjs/core": "2.11.8",
+		"@vue-flow/background": "^1.3.2",
+		"@vue-flow/controls": "^1.1.3",
+		"@vue-flow/core": "^1.48.2",
+		"@vue-flow/minimap": "^1.5.4",
 		"@vueuse/core": "^10.4.1",
 		"@vxe-ui/plugin-render-element": "^4.0.10",
 		"@wangeditor/editor": "5.1.23",
@@ -121,4 +125,4 @@
 		"type": "git",
 		"url": "https://gitee.com/log4j/pig"
 	}
-}
+}

src/api/admin/sysUserRelation.ts

@@ -0,0 +1,110 @@
+import request from "/@/utils/request"
+
+export interface RelationGraphNode {
+	nodeId: string
+	parentNodeId?: string
+	root: boolean
+	repeated: boolean
+	userId: string
+	username?: string
+	name?: string
+	nickname?: string
+	displayName: string
+	avatar?: string
+	gender?: number
+	userCount?: number
+	relationCount?: number
+	relationId?: string
+	subjectUserId?: string
+	objectUserId?: string
+	relationTypeId?: string
+	relationCode?: string
+	relationName?: string
+	category?: string
+	directedFlag?: string
+	relationDirection?: "subject-to-object" | "object-to-subject"
+	userRoleName?: string
+	parentRoleName?: string
+	relationDescription?: string
+	effectiveTime?: string
+	expireTime?: string
+	remark?: string
+	children?: RelationGraphNode[]
+}
+
+export interface RelationCreateUserForm {
+	subjectUserId?: string
+	objectUserId?: string
+	relationTypeId: string
+	effectiveTime?: string
+	expireTime?: string
+	remark?: string
+	username: string
+	password: string
+	phone?: string
+	name: string
+	nickname?: string
+	email?: string
+	avatar?: string
+	deptId?: string
+	role?: string[]
+	post?: string[]
+	gender?: number
+	staffingType?: string
+	lockFlag?: string
+	identityTypes: string[]
+	studentInfo?: {
+		studentNo: string
+		schoolName: string
+		className: string
+		extJson: string
+	}
+}
+
+export interface RelationCreateForm {
+	subjectUserId: string
+	objectUserId: string
+	relationTypeId: string
+	effectiveTime?: string
+	expireTime?: string
+	remark?: string
+}
+
+export interface RelationUpdateForm extends RelationCreateForm {
+	relationId: string
+}
+
+// 关系图谱
+export function getRelationGraph(userId?: string) {
+	return request({
+		url: "/admin/sysUserRelation/graph/" + userId,
+		method: "get",
+	})
+}
+
+// 创建用户并建立关系
+export function createRelationUser(data: RelationCreateUserForm) {
+	return request({
+		url: "/admin/sysUserRelation/create-user",
+		method: "post",
+		data,
+	})
+}
+
+// 为两个已有用户建立关系
+export function createRelation(data: RelationCreateForm) {
+	return request({
+		url: "/admin/sysUserRelation/create",
+		method: "post",
+		data,
+	})
+}
+
+// 修改已有用户关系
+export function updateRelation(data: RelationUpdateForm) {
+	return request({
+		url: "/admin/sysUserRelation/update",
+		method: "put",
+		data,
+	})
+}

src/api/admin/sysUserRelationType.ts

@@ -0,0 +1,48 @@
+import request from "/@/utils/request"
+
+export function selectList(query?: Object) {
+	return request({
+		url: "/admin/sysUserRelationType/select",
+		method: "get",
+		params: query,
+	})
+}
+
+export function fetchList(query?: Object) {
+	return request({
+		url: "/admin/sysUserRelationType/page",
+		method: "get",
+		params: query,
+	})
+}
+
+export function addObj(obj?: Object) {
+	return request({
+		url: "/admin/sysUserRelationType",
+		method: "post",
+		data: obj,
+	})
+}
+
+export function getObj(id?: string) {
+	return request({
+		url: "/admin/sysUserRelationType/" + id,
+		method: "get",
+	})
+}
+
+export function delObjs(ids?: Object) {
+	return request({
+		url: "/admin/sysUserRelationType",
+		method: "delete",
+		data: ids,
+	})
+}
+
+export function putObj(obj?: Object) {
+	return request({
+		url: "/admin/sysUserRelationType",
+		method: "put",
+		data: obj,
+	})
+}

src/api/hard/hard-appt-cycle-rule.ts

@@ -0,0 +1,42 @@
+import request from "/@/utils/request"
+
+const baseUrl = "/hard/hard-appt-cycle-rule"
+
+export function fetchList(query?: Object) {
+	return request({
+		url: `${baseUrl}/page`,
+		method: "get",
+		params: query,
+	})
+}
+
+export function getObj(id: string) {
+	return request({
+		url: `${baseUrl}/${id}`,
+		method: "get",
+	})
+}
+
+export function addObj(data: Object) {
+	return request({
+		url: baseUrl,
+		method: "post",
+		data,
+	})
+}
+
+export function putObj(data: Object) {
+	return request({
+		url: baseUrl,
+		method: "put",
+		data,
+	})
+}
+
+export function delObjs(ids: Array<string | number>) {
+	return request({
+		url: baseUrl,
+		method: "delete",
+		data: ids,
+	})
+}

src/components/Select/SelectUser.vue

@@ -1,8 +1,24 @@
 <template>
-	<el-select style="width: 100%" v-model="state.selectId" :placeholder="props.placeholder" clearable
-		remote-show-suffix filterable remote :remote-method="remoteSearch" :loading="state.loading"
-		@visible-change="(e: boolean) => e && getOptions()" @change="change">
-		<el-option v-for="v in state.options" :key="v.userId" :label="`${v.name}-${v.phone}`" :value="v.userId">
+	<el-select
+		style="width: 100%"
+		v-model="state.selectId"
+		:placeholder="props.placeholder"
+		clearable
+		remote-show-suffix
+		filterable
+		remote
+		:remote-method="remoteSearch"
+		:loading="state.loading"
+		@visible-change="(e: boolean) => e && getOptions()"
+		@change="change"
+	>
+		<el-option
+			v-for="v in state.options"
+			:key="v.userId"
+			:label="`${v.name}-${v.phone}`"
+			:value="v.userId"
+			:disabled="isExcluded(v.userId)"
+		>
 			<div class="flex items-center">
 				<div class="color-primary">{{ v.name }}</div>
 				<div class="pl5 color-success">{{ v.phone }}</div>
@@ -20,9 +36,11 @@ const selectId = defineModel()
 
 export type Props = {
 	placeholder?: string
+	excludeUserIds?: Array<string | number>
 }
 const props = withDefaults(defineProps<Props>(), {
 	placeholder: "输入姓名、手机号",
+	excludeUserIds: () => [],
 })
 
 const queryForm = reactive<any>({
@@ -68,13 +86,12 @@ function remoteSearch(params: string) {
 	}
 }
 
-function clear() {
-	state.selectId = null
-	getOptions()
-}
-
 function change(v: any) {
 	const targetUser = state.options.find((i: any) => i.userId == v)
 	emit("change", targetUser)
 }
+
+function isExcluded(userId: string | number) {
+	return props.excludeUserIds.some((id) => String(id) === String(userId))
+}
 </script>

src/components/Select/SelectUserRelationType.vue

@@ -0,0 +1,252 @@
+<template>
+	<el-select v-model="selectId" style="width: 100%" :placeholder="props.placeholder" :clearable="props.clearable"
+		:disabled="props.disabled" :multiple="isMultiple" :loading="state.loading" :remote-method="remoteSearch"
+		filterable remote remote-show-suffix @clear="clear" @visible-change="handleVisibleChange">
+		<el-option v-for="item in displayOptions" :key="item.relationTypeId" :label="formatRelationType(item)"
+			:value="item.relationTypeId">
+			<div class="flex items-center">
+				<div class="color-primary">{{ item.relationName }}</div>
+				<el-tag v-if="item.subjectRoleName || item.objectRoleName" class="ml5" size="small">
+					{{ formatRelationRoles(item) }}
+				</el-tag>
+			</div>
+		</el-option>
+	</el-select>
+</template>
+
+<script setup lang="ts" name="select-user-relation-type">
+import { reactive } from "vue"
+import * as relationTypeApi from "/@/api/admin/sysUserRelationType"
+
+type RelationTypeId = string | number
+
+interface RelationTypeOption {
+	relationTypeId: RelationTypeId
+	relationName: string
+	subjectRoleName?: string
+	objectRoleName?: string
+}
+
+const selectId = defineModel<RelationTypeId | RelationTypeId[] | null>()
+
+const props = withDefaults(
+	defineProps<{
+		placeholder?: string
+		apiParams?: Record<string, any>
+		autoFirst?: boolean
+		clearable?: boolean
+		disabled?: boolean
+		multiple?: boolean
+	}>(),
+	{
+		placeholder: "请选择关系类型",
+		apiParams: () => ({}),
+		autoFirst: false,
+		clearable: true,
+		disabled: false,
+		multiple: false,
+	},
+)
+
+const queryForm = reactive({
+	relationName: "",
+	current: 1,
+	size: 20,
+})
+
+const state = reactive<{
+	loading: boolean
+	options: RelationTypeOption[]
+	selectedOptions: RelationTypeOption[]
+}>({
+	loading: false,
+	options: [],
+	selectedOptions: [],
+})
+
+let requestSeq = 0
+let selectedRequestSeq = 0
+let lastRequestKey = ""
+let inflightKey = ""
+let inflightPromise: Promise<void> | null = null
+let refreshScheduled = false
+let loadingCount = 0
+
+const displayOptions = computed(() => mergeOptions(state.selectedOptions, state.options))
+const isMultiple = computed(() => props.multiple || Array.isArray(selectId.value))
+
+function stableStringify(value: any): string {
+	if (value == null) return ""
+	if (typeof value !== "object") return String(value)
+	if (Array.isArray(value)) return `[${value.map(stableStringify).join(",")}]`
+	const keys = Object.keys(value).sort()
+	return `{${keys.map((key) => `${key}:${stableStringify(value[key])}`).join(",")}}`
+}
+
+function buildRequestKey() {
+	return [queryForm.relationName, queryForm.current, queryForm.size, stableStringify(props.apiParams)].join("|")
+}
+
+function getIdKey(id: RelationTypeId) {
+	return String(id)
+}
+
+function getSelectedIds(): RelationTypeId[] {
+	const value = selectId.value
+	const ids = Array.isArray(value) ? value : [value]
+	return ids.filter((id): id is RelationTypeId => id != null && id !== "")
+}
+
+function normalizeOption(item: RelationTypeOption): RelationTypeOption {
+	const selectedId = getSelectedIds().find((id) => getIdKey(id) === getIdKey(item.relationTypeId))
+	return selectedId === undefined ? item : { ...item, relationTypeId: selectedId }
+}
+
+function mergeOptions(...groups: RelationTypeOption[][]) {
+	const optionMap = new Map<string, RelationTypeOption>()
+	groups.flat().forEach((item) => {
+		if (item?.relationTypeId == null) return
+		const normalizedItem = normalizeOption(item)
+		optionMap.set(getIdKey(normalizedItem.relationTypeId), normalizedItem)
+	})
+	return Array.from(optionMap.values())
+}
+
+function syncSelectedOptions(candidates: RelationTypeOption[] = []) {
+	const optionMap = new Map<string, RelationTypeOption>()
+		;[...state.options, ...state.selectedOptions, ...candidates].forEach((item) => {
+			if (item?.relationTypeId != null) optionMap.set(getIdKey(item.relationTypeId), item)
+		})
+	state.selectedOptions = getSelectedIds()
+		.map((id) => {
+			const item = optionMap.get(getIdKey(id))
+			return item ? { ...item, relationTypeId: id } : null
+		})
+		.filter((item): item is RelationTypeOption => item !== null)
+}
+
+function startLoading() {
+	loadingCount += 1
+	state.loading = true
+}
+
+function stopLoading() {
+	loadingCount = Math.max(loadingCount - 1, 0)
+	state.loading = loadingCount > 0
+}
+
+async function getOptions(force = false) {
+	const requestKey = buildRequestKey()
+	if (!force) {
+		if (inflightPromise && inflightKey === requestKey) return inflightPromise
+		if (lastRequestKey === requestKey) return
+	}
+
+	const seq = ++requestSeq
+	startLoading()
+	inflightKey = requestKey
+	inflightPromise = relationTypeApi
+		.selectList({
+			...queryForm,
+			...props.apiParams,
+		})
+		.then(({ data }) => {
+			if (seq !== requestSeq) return
+			state.options = (data?.records ?? []).map(normalizeOption)
+			syncSelectedOptions()
+			lastRequestKey = requestKey
+			selectFirstOption()
+		})
+		.finally(() => {
+			if (seq === requestSeq) {
+				inflightPromise = null
+				inflightKey = ""
+			}
+			stopLoading()
+		})
+
+	return inflightPromise
+}
+
+async function loadSelectedOptions() {
+	const seq = ++selectedRequestSeq
+	const selectedIds = getSelectedIds()
+	if (!selectedIds.length) {
+		state.selectedOptions = []
+		return
+	}
+
+	syncSelectedOptions()
+	const knownIds = new Set(mergeOptions(state.selectedOptions, state.options).map((item) => getIdKey(item.relationTypeId)))
+	const missingIds = selectedIds.filter((id) => !knownIds.has(getIdKey(id)))
+	if (!missingIds.length) return
+
+	startLoading()
+	try {
+		const options = await Promise.all(
+			missingIds.map(async (id) => {
+				try {
+					const { data } = await relationTypeApi.selectList({ relationTypeId: id, current: 1, size: 1 })
+					const item = data?.records?.[0] as RelationTypeOption | undefined
+					return item ? { ...item, relationTypeId: id } : null
+				} catch {
+					return null
+				}
+			}),
+		)
+		if (seq !== selectedRequestSeq) return
+		syncSelectedOptions(options.filter((item): item is RelationTypeOption => item !== null))
+	} finally {
+		stopLoading()
+	}
+}
+
+function selectFirstOption() {
+	if (!props.autoFirst || !state.options.length) return
+
+	const selectedIds = Array.isArray(selectId.value) ? selectId.value : [selectId.value]
+	const hasEmptySelection = isMultiple.value ? selectedIds.length === 0 : selectId.value == null || selectId.value === ""
+	if (!hasEmptySelection) return
+
+	selectId.value = isMultiple.value ? [state.options[0].relationTypeId] : state.options[0].relationTypeId
+}
+
+function remoteSearch(keyword: string) {
+	if (keyword === queryForm.relationName) return
+	queryForm.relationName = keyword
+	getOptions()
+}
+
+function clear() {
+	selectId.value = isMultiple.value ? [] : null
+	queryForm.relationName = ""
+	getOptions(true)
+}
+
+function handleVisibleChange(visible: boolean) {
+	if (visible) getOptions()
+}
+
+function formatRelationRoles(item: RelationTypeOption) {
+	return [item.subjectRoleName, item.objectRoleName].filter(Boolean).join(" / ")
+}
+
+function formatRelationType(item: RelationTypeOption) {
+	const roles = formatRelationRoles(item)
+	return roles ? `${item.relationName}（${roles}）` : item.relationName
+}
+
+function scheduleRefreshOptions() {
+	if (refreshScheduled) return
+	refreshScheduled = true
+	Promise.resolve().then(() => {
+		refreshScheduled = false
+		lastRequestKey = ""
+		state.options = []
+		if (props.autoFirst) getOptions()
+	})
+}
+
+watch(() => stableStringify(props.apiParams), scheduleRefreshOptions, { flush: "post", immediate: true })
+watch(selectId, loadSelectedOptions, { deep: true, immediate: true })
+</script>

src/components/Select/UserRelationTypeDisplay.vue

@@ -0,0 +1,121 @@
+<template>
+	<span class="user-relation-type-display">
+		<template v-if="options.length">
+			<el-tag
+				v-for="item in options"
+				:key="item.relationTypeId"
+				:type="props.tagType"
+				:size="props.size"
+				disable-transitions
+			>
+				{{ formatRelationType(item) }}
+			</el-tag>
+		</template>
+		<span v-else-if="loading" class="color-info">加载中...</span>
+		<span v-else class="color-info">{{ props.emptyText }}</span>
+	</span>
+</template>
+
+<script setup lang="ts" name="user-relation-type-display">
+import { ref, watch } from "vue"
+import * as relationTypeApi from "/@/api/admin/sysUserRelationType"
+
+type RelationTypeId = string | number
+type TagType = "" | "success" | "warning" | "info" | "danger"
+type TagSize = "large" | "default" | "small"
+
+interface RelationTypeOption {
+	relationTypeId: RelationTypeId
+	relationName: string
+	subjectRoleName?: string
+	objectRoleName?: string
+}
+
+const props = withDefaults(
+	defineProps<{
+		value?: RelationTypeId | RelationTypeId[] | null
+		apiParams?: Record<string, any>
+		emptyText?: string
+		showRoles?: boolean
+		tagType?: TagType
+		size?: TagSize
+	}>(),
+	{
+		value: null,
+		apiParams: () => ({}),
+		emptyText: "-",
+		showRoles: true,
+		tagType: "",
+		size: "small",
+	},
+)
+
+const loading = ref(false)
+const options = ref<RelationTypeOption[]>([])
+const optionCache = new Map<string, RelationTypeOption>()
+let requestSeq = 0
+
+function getRelationTypeIds() {
+	const values = Array.isArray(props.value) ? props.value : [props.value]
+	const ids = values.filter((id): id is RelationTypeId => id != null && id !== "")
+	return Array.from(new Map(ids.map((id) => [String(id), id])).values())
+}
+
+async function loadOptions() {
+	const seq = ++requestSeq
+	const ids = getRelationTypeIds()
+	if (!ids.length) {
+		options.value = []
+		loading.value = false
+		return
+	}
+
+	options.value = ids.map((id) => optionCache.get(String(id))).filter((item): item is RelationTypeOption => !!item)
+	const missingIds = ids.filter((id) => !optionCache.has(String(id)))
+	if (!missingIds.length) return
+
+	loading.value = true
+	try {
+		const results = await Promise.all(
+			missingIds.map(async (id) => {
+				try {
+					const { data } = await relationTypeApi.selectList({
+						...props.apiParams,
+						current: 1,
+						size: 1,
+						relationTypeId: id,
+					})
+					const item = data?.records?.[0] as RelationTypeOption | undefined
+					return item ? { ...item, relationTypeId: id } : null
+				} catch {
+					return null
+				}
+			}),
+		)
+		if (seq !== requestSeq) return
+		results.forEach((item) => {
+			if (item) optionCache.set(String(item.relationTypeId), item)
+		})
+		options.value = ids.map((id) => optionCache.get(String(id))).filter((item): item is RelationTypeOption => !!item)
+	} finally {
+		if (seq === requestSeq) loading.value = false
+	}
+}
+
+function formatRelationType(item: RelationTypeOption) {
+	if (!props.showRoles) return item.relationName
+	const roles = [item.subjectRoleName, item.objectRoleName].filter(Boolean).join(" / ")
+	return roles ? `${item.relationName}（${roles}）` : item.relationName
+}
+
+watch([() => props.value, () => props.apiParams], loadOptions, { deep: true, immediate: true })
+</script>
+
+<style scoped>
+.user-relation-type-display {
+	display: inline-flex;
+	flex-wrap: wrap;
+	align-items: center;
+	gap: 6px;
+}
+</style>

src/components/index.ts

@@ -40,6 +40,8 @@ import SelectCanteenSupplier from "/@/components/Select/SelectCanteenSupplier.vu
 import SelectWalletInvoice from "/@/components/Select/SelectWalletInvoice.vue"
 import SelectNotice from "/@/components/Select/SelectNotice.vue"
 import SelectAct from "/@/components/Select/SelectAct.vue"
+import SelectUserRelationType from "/@/components/Select/SelectUserRelationType.vue"
+import UserRelationTypeDisplay from "/@/components/Select/UserRelationTypeDisplay.vue"
 // 地图组件
 import MapSelect from "/@/components/map/map-select.vue"
 
@@ -102,6 +104,8 @@ export default {
 		app.component("SelectWalletInvoice", SelectWalletInvoice)
 		app.component("SelectNotice", SelectNotice)
 		app.component("SelectAct", SelectAct)
+		app.component("SelectUserRelationType", SelectUserRelationType)
+		app.component("UserRelationTypeDisplay", UserRelationTypeDisplay)
 
 		app.component("MapSelect", MapSelect)
 

src/router/route.ts

@@ -57,6 +57,15 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
 			isHide: true,
 		},
 	},
+	{
+		path: "/admin/system/user/relation-tree",
+		name: "router.userRelationTree",
+		component: () => import("/@/views/admin/system/user/relation-tree.vue"),
+		meta: {
+			isHide: true,
+			isKeepAlive: false,
+		},
+	},
 ]
 
 /**

src/views/admin/system/relation-type/form.vue

@@ -0,0 +1,179 @@
+<template>
+	<el-dialog v-model="visible" :title="form.relationTypeId ? '编辑' : '新增'" width="720px" :close-on-click-modal="false"
+		draggable>
+		<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="110px" v-loading="loading">
+			<el-row :gutter="24">
+				<el-col :span="12" class="mb20">
+					<el-form-item label="关系类型" prop="relationCode">
+						<dict-select v-model="form.relationCode" dict-code="sys_user_relation_type"
+							placeholder="请选择关系类型" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="关系名称" prop="relationName">
+						<el-input v-model="form.relationName" disabled placeholder="选择关系类型后自动带出" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="主语称呼" prop="subjectRoleName">
+						<el-input v-model="form.subjectRoleName" maxlength="50" placeholder="请输入主语一方称呼" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="对象称呼" prop="objectRoleName">
+						<el-input v-model="form.objectRoleName" maxlength="50" placeholder="请输入对象一方称呼" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="关系分类" prop="category">
+						<dict-select v-model="form.category" dict-code="sys_user_relation_category"
+							placeholder="请选择关系分类" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="是否有方向" prop="directedFlag">
+						<dict-select v-model="form.directedFlag" dict-code="yes_no_type" placeholder="请选择是否有方向" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="排序" prop="sortOrder">
+						<el-input-number v-model="form.sortOrder" :min="0" :max="9999" controls-position="right"
+							style="width: 100%" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="状态" prop="status">
+						<el-radio-group v-model="form.status">
+							<el-radio v-for="item in relationStatusOptions" :key="item.value" :label="item.value"
+								border>
+								{{ item.label }}
+							</el-radio>
+						</el-radio-group>
+					</el-form-item>
+				</el-col>
+				<el-col :span="24" class="mb20">
+					<el-form-item label="备注" prop="remark">
+						<el-input v-model="form.remark" type="textarea" maxlength="200" show-word-limit :rows="3"
+							placeholder="请输入备注" />
+					</el-form-item>
+				</el-col>
+			</el-row>
+		</el-form>
+		<template #footer>
+			<span class="dialog-footer">
+				<el-button @click="visible = false">取消</el-button>
+				<el-button type="primary" :disabled="loading" @click="onSubmit">确认</el-button>
+			</span>
+		</template>
+	</el-dialog>
+</template>
+
+<script setup lang="ts" name="SysUserRelationTypeDialog">
+import { useDict } from "/@/hooks/dict"
+import { useMessage } from "/@/hooks/message"
+import * as sysUserRelationTypeApi from "/@/api/admin/sysUserRelationType"
+import { rule } from "/@/utils/validate"
+
+const emit = defineEmits(["refresh"])
+
+const { sys_user_relation_type } = useDict("sys_user_relation_type")
+
+const relationStatusOptions = [
+	{ label: "正常", value: "0" },
+	{ label: "停用", value: "1" },
+]
+
+const dataFormRef = ref()
+const visible = ref(false)
+const loading = ref(false)
+
+const form = reactive({
+	relationTypeId: "",
+	relationCode: "",
+	relationName: "",
+	subjectRoleName: "",
+	objectRoleName: "",
+	category: "",
+	directedFlag: "0",
+	sortOrder: 0,
+	status: "0",
+	remark: "",
+})
+
+const dataRules = {
+	relationCode: [{ required: true, message: "请选择关系类型", trigger: "change" }],
+	subjectRoleName: [
+		{ validator: rule.overLength, trigger: "blur" },
+		{ required: true, message: "请输入主语一方称呼", trigger: "blur" },
+	],
+	objectRoleName: [
+		{ validator: rule.overLength, trigger: "blur" },
+		{ required: true, message: "请输入对象一方称呼", trigger: "blur" },
+	],
+	category: [{ required: true, message: "请选择关系分类", trigger: "change" }],
+	directedFlag: [{ required: true, message: "请选择是否有方向", trigger: "change" }],
+	sortOrder: [{ required: true, message: "请输入排序", trigger: "change" }],
+	status: [{ required: true, message: "请选择状态", trigger: "change" }],
+	remark: [{ validator: rule.overLength, trigger: "blur" }],
+}
+
+const syncRelationName = () => {
+	const relationType = sys_user_relation_type.value?.find((item: any) => item.value === form.relationCode)
+	if (relationType) form.relationName = relationType.label
+}
+
+watch([() => form.relationCode, sys_user_relation_type], syncRelationName, { deep: true })
+
+const openDialog = (id?: string) => {
+	visible.value = true
+	Object.assign(form, {
+		relationTypeId: "",
+		relationCode: "",
+		relationName: "",
+		subjectRoleName: "",
+		objectRoleName: "",
+		category: "",
+		directedFlag: "0",
+		sortOrder: 0,
+		status: "0",
+		remark: "",
+	})
+
+	nextTick(() => dataFormRef.value?.clearValidate())
+
+	if (id) getSysUserRelationTypeData(id)
+}
+
+const onSubmit = async () => {
+	const valid = await dataFormRef.value?.validate().catch(() => false)
+	if (!valid) return
+
+	syncRelationName()
+	try {
+		loading.value = true
+		form.relationTypeId ? await sysUserRelationTypeApi.putObj(form) : await sysUserRelationTypeApi.addObj(form)
+		useMessage().success(form.relationTypeId ? "修改成功" : "添加成功")
+		visible.value = false
+		emit("refresh")
+	} catch (err: any) {
+		useMessage().error(err.msg)
+	} finally {
+		loading.value = false
+	}
+}
+
+const getSysUserRelationTypeData = async (id: string) => {
+	try {
+		loading.value = true
+		const { data } = await sysUserRelationTypeApi.getObj(id)
+		Object.assign(form, data)
+		syncRelationName()
+	} finally {
+		loading.value = false
+	}
+}
+
+defineExpose({
+	openDialog,
+})
+</script>

src/views/admin/system/relation-type/index.vue

@@ -0,0 +1,148 @@
+<template>
+	<div class="layout-padding">
+		<div class="layout-padding-auto layout-padding-view">
+			<el-row>
+				<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList">
+					<el-form-item style="width: 250px" label="关系类型" prop="relationName">
+						<el-input v-model="state.queryForm.relationName" placeholder="请输入关系类型" clearable />
+					</el-form-item>
+					<el-form-item style="width: 250px" label="关系分类" prop="category">
+						<dict-select v-model="state.queryForm.category" dict-code="sys_user_relation_category" />
+					</el-form-item>
+					<el-form-item>
+						<el-button icon="Search" type="primary" @click="getDataList">
+							{{ $t("common.queryBtn") }}
+						</el-button>
+						<el-button icon="Refresh" @click="resetQuery">
+							{{ $t("common.resetBtn") }}
+						</el-button>
+					</el-form-item>
+				</el-form>
+			</el-row>
+			<el-row>
+				<div class="mb8" style="width: 100%">
+					<el-button class="ml10" icon="folder-add" type="primary" v-auth="'dzc_sysUserRelationType_add'"
+						@click="formDialogRef.openDialog()">
+						新 增
+					</el-button>
+					<el-button plain :disabled="multiple" icon="Delete" type="primary"
+						v-auth="'dzc_sysUserRelationType_del'" @click="handleDelete(selectObjs)">
+						删除
+					</el-button>
+					<right-toolbar class="ml10 mr20" style="float: right" :search="false" @queryTable="getDataList" />
+				</div>
+			</el-row>
+			<el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
+				:header-cell-style="tableStyle.headerCellStyle" @selection-change="selectionChangeHandle"
+				@sort-change="sortChangeHandle">
+				<el-table-column type="selection" width="40" align="center" />
+				<el-table-column type="index" label="#" width="60" />
+				<el-table-column prop="relationCode" label="关系编码" min-width="180" show-overflow-tooltip />
+				<el-table-column prop="relationName" label="关系类型" min-width="120">
+					<template #default="{ row }">
+						<dict-tag :options="sys_user_relation_type" :value="row.relationCode" />
+					</template>
+				</el-table-column>
+				<el-table-column prop="subjectRoleName" label="主语称呼" min-width="120" show-overflow-tooltip />
+				<el-table-column prop="objectRoleName" label="对象称呼" min-width="120" show-overflow-tooltip />
+				<el-table-column prop="category" label="关系分类" min-width="110">
+					<template #default="{ row }">
+						<dict-tag :options="sys_user_relation_category" :value="row.category" />
+					</template>
+				</el-table-column>
+				<el-table-column prop="directedFlag" label="是否有方向" width="110" align="center">
+					<template #default="{ row }">
+						<dict-tag :options="yes_no_type" :value="row.directedFlag" />
+					</template>
+				</el-table-column>
+				<el-table-column prop="sortOrder" label="排序" width="90" align="center" sortable="custom" />
+				<el-table-column prop="status" label="状态" width="90" align="center">
+					<template #default="{ row }">
+						<dict-tag :options="relationStatusOptions" :value="row.status" />
+					</template>
+				</el-table-column>
+				<el-table-column prop="remark" label="备注" min-width="160" show-overflow-tooltip />
+				<el-table-column prop="createTime" label="创建时间" width="180" />
+				<el-table-column label="操作" fixed="right" width="150">
+					<template #default="{ row }">
+						<el-button icon="edit-pen" text type="primary" v-auth="'dzc_sysUserRelationType_edit'"
+							@click="formDialogRef.openDialog(row.relationTypeId)">
+							编辑
+						</el-button>
+						<el-button icon="delete" text type="primary" v-auth="'dzc_sysUserRelationType_del'"
+							@click="handleDelete([row.relationTypeId])">
+							删除
+						</el-button>
+					</template>
+				</el-table-column>
+			</el-table>
+			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
+				v-bind="state.pagination" />
+		</div>
+
+		<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+	</div>
+</template>
+
+<script setup lang="ts" name="systemSysUserRelationType">
+import { BasicTableProps, useTable } from "/@/hooks/table"
+import * as sysUserRelationTypeApi from "/@/api/admin/sysUserRelationType"
+import { useMessage, useMessageBox } from "/@/hooks/message"
+import { useDict } from "/@/hooks/dict"
+
+const FormDialog = defineAsyncComponent(() => import("./form.vue"))
+
+const { sys_user_relation_category, sys_user_relation_type, yes_no_type } = useDict(
+	"sys_user_relation_category",
+	"sys_user_relation_type",
+	"yes_no_type",
+)
+
+// 搜索变量
+const queryRef = ref()
+const relationStatusOptions = [
+	{ label: "正常", value: "0", elTagType: "success" },
+	{ label: "停用", value: "1", elTagType: "danger" },
+]
+
+const formDialogRef = ref()
+const selectObjs = ref<string[]>([])
+const multiple = ref(true)
+
+const state: BasicTableProps = reactive<BasicTableProps>({
+	queryForm: {},
+	pageList: sysUserRelationTypeApi.fetchList,
+})
+
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, tableStyle } = useTable(state)
+
+const selectionChangeHandle = (rows: { relationTypeId: string }[]) => {
+	selectObjs.value = rows.map(({ relationTypeId }) => relationTypeId)
+	multiple.value = !rows.length
+}
+
+// 清空搜索条件
+const resetQuery = () => {
+	// 清空搜索条件
+	queryRef.value?.resetFields()
+	// 清空多选
+	selectObjs.value = []
+	getDataList()
+}
+
+const handleDelete = async (ids: string[]) => {
+	try {
+		await useMessageBox().confirm("此操作将永久删除")
+	} catch {
+		return
+	}
+
+	try {
+		await sysUserRelationTypeApi.delObjs(ids)
+		useMessage().success("删除成功")
+		getDataList()
+	} catch (err: any) {
+		useMessage().error(err.msg)
+	}
+}
+</script>

src/views/admin/system/user/components/user-info-form.ts

@@ -0,0 +1,70 @@
+export const DEFAULT_USER_IDENTITY = "DEFAULT"
+export const STUDENT_USER_IDENTITY = "STUDENT"
+
+export interface UserStudentInfo {
+	studentNo: string
+	schoolName: string
+	className: string
+	extJson: string
+}
+
+export interface UserInfoFormModel {
+	userId: string
+	username: string
+	password?: string
+	salt: string
+	wxOpenid: string
+	qqOpenid: string
+	lockFlag: string
+	phone?: string
+	deptId: string
+	roleList: any[]
+	postList: any[]
+	nickname: string
+	name: string
+	email: string
+	avatar?: string
+	gender: number
+	staffingType: string
+	identityTypes: string[]
+	studentInfo: UserStudentInfo
+	post: Array<string | number>
+	role: Array<string | number>
+}
+
+export const createEmptyStudentInfo = (): UserStudentInfo => ({
+	studentNo: "",
+	schoolName: "",
+	className: "",
+	extJson: "",
+})
+
+export const createEmptyUserInfo = (deptId = ""): UserInfoFormModel => ({
+	userId: "",
+	username: "",
+	password: "",
+	salt: "",
+	wxOpenid: "",
+	qqOpenid: "",
+	lockFlag: "0",
+	phone: "",
+	deptId,
+	roleList: [],
+	postList: [],
+	nickname: "",
+	name: "",
+	email: "",
+	avatar: "",
+	gender: 0,
+	staffingType: "2",
+	identityTypes: [DEFAULT_USER_IDENTITY],
+	studentInfo: createEmptyStudentInfo(),
+	post: [],
+	role: [],
+})
+
+export const getUserIdentityPayload = (model: UserInfoFormModel) => ({
+	identityTypes: [...model.identityTypes],
+	phone: model.identityTypes.includes(DEFAULT_USER_IDENTITY) ? model.phone : undefined,
+	studentInfo: model.identityTypes.includes(STUDENT_USER_IDENTITY) ? { ...model.studentInfo } : undefined,
+})

src/views/admin/system/user/components/user-info-form.vue

@@ -0,0 +1,312 @@
+<template>
+	<el-form ref="formRef" :model="model" :rules="formRules" label-width="90px" v-loading="loading || optionsLoading">
+		<el-row :gutter="20">
+			<el-col :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.username')" prop="username">
+					<el-input v-model.trim="model.username" :disabled="isEdit && !auth('user_sysUser_editUsername')"
+						placeholder="请输入用户名" />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.password')" prop="password">
+					<el-input v-model="model.password" clearable show-password placeholder="请输入密码" type="password" />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.name')" prop="name">
+					<el-input v-model="model.name" clearable placeholder="请输入姓名" />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12" class="mb20">
+				<el-form-item label="性别" prop="gender">
+					<el-radio-group v-model="model.gender">
+						<el-radio :label="0">未知</el-radio>
+						<el-radio :label="1">男</el-radio>
+						<el-radio :label="2">女</el-radio>
+					</el-radio-group>
+				</el-form-item>
+			</el-col>
+			<el-col v-if="!isDeptAdmin" :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.role')" prop="role">
+					<el-select v-model="model.role" clearable multiple placeholder="请选择角色" class="w100">
+						<el-option v-for="item in roleData" :key="item.roleId" :label="item.roleName"
+							:value="item.roleId" />
+					</el-select>
+				</el-form-item>
+			</el-col>
+			<el-col v-if="!isDeptAdmin" :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.post')" prop="post">
+					<el-select v-model="model.post" clearable multiple placeholder="请选择岗位" class="w100">
+						<el-option v-for="item in postData" :key="item.postId" :label="item.postName"
+							:value="item.postId" />
+					</el-select>
+				</el-form-item>
+			</el-col>
+			<el-col v-if="!isEdit" :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.dept')" prop="deptId">
+					<el-tree-select v-model="model.deptId" :data="deptData"
+						:props="{ value: 'id', label: 'name', children: 'children', disabled: 'isLock' }" filterable
+						check-strictly class="w100" clearable placeholder="请选择所属部门">
+						<template #default="{ node, data }">
+							<el-tooltip v-if="data.isLock" effect="dark" content="无数据权限" placement="right">
+								<span>
+									{{ node.label }}
+									<SvgIcon name="ele-Lock" />
+								</span>
+							</el-tooltip>
+						</template>
+					</el-tree-select>
+				</el-form-item>
+			</el-col>
+			<el-col :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.email')" prop="email">
+					<el-input v-model="model.email" clearable placeholder="请输入邮箱" />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.nickname')" prop="nickname">
+					<el-input v-model="model.nickname" clearable placeholder="请输入昵称" />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12" class="mb20">
+				<el-form-item label="编制" prop="staffingType">
+					<dict-select v-model="model.staffingType"
+						:disabled="isEdit && !auth('user_sysUser_editStaffingType')" dict-code="user_staffing_type" />
+				</el-form-item>
+			</el-col>
+			<el-col :span="12" class="mb20">
+				<el-form-item :label="$t('sysuser.lockFlag')" prop="lockFlag">
+					<el-radio-group v-model="model.lockFlag">
+						<el-radio v-for="(item, index) in lock_flag" :key="index" :label="item.value" border>
+							{{ item.label }}
+						</el-radio>
+					</el-radio-group>
+				</el-form-item>
+			</el-col>
+			<el-col :span="24" class="mb20">
+				<el-divider>身份信息</el-divider>
+			</el-col>
+			<el-col :span="24" class="mb20">
+				<div class="identity-block">
+					<div class="identity-block__title">身份选择</div>
+					<el-row :gutter="20">
+						<el-col :span="12" class="mb20">
+							<el-form-item label="用户身份" prop="identityTypes">
+								<dict-select v-model="model.identityTypes" dict-code="user_identity_type" multiple
+									placeholder="请选择用户身份" />
+							</el-form-item>
+						</el-col>
+					</el-row>
+				</div>
+			</el-col>
+			<el-col v-if="hasDefaultIdentity" :span="24" class="mb20">
+				<div class="identity-block">
+					<div class="identity-block__title">默认身份</div>
+					<el-row :gutter="20">
+						<el-col :span="12" class="mb20">
+							<el-form-item label="手机号" prop="phone" required>
+								<el-input v-model="model.phone" clearable placeholder="请输入手机号" />
+								<div class="identity-field-tip">该手机号与默认身份绑定</div>
+							</el-form-item>
+						</el-col>
+					</el-row>
+				</div>
+			</el-col>
+			<template v-if="hasStudentIdentity">
+				<el-col :span="24" class="mb20">
+					<div class="identity-block">
+						<div class="identity-block__title">学生身份</div>
+						<el-row :gutter="20">
+							<el-col :span="12" class="mb20">
+								<el-form-item label="学号" prop="studentInfo.studentNo">
+									<el-input v-model.trim="model.studentInfo.studentNo" clearable
+										placeholder="请输入学号" />
+								</el-form-item>
+							</el-col>
+							<el-col :span="12" class="mb20">
+								<el-form-item label="学校名称" prop="studentInfo.schoolName">
+									<el-input v-model.trim="model.studentInfo.schoolName" clearable
+										placeholder="请输入学校名称" />
+								</el-form-item>
+							</el-col>
+							<el-col :span="12" class="mb20">
+								<el-form-item label="班级名称" prop="studentInfo.className">
+									<el-input v-model.trim="model.studentInfo.className" clearable
+										placeholder="请输入班级名称" />
+								</el-form-item>
+							</el-col>
+						</el-row>
+					</div>
+				</el-col>
+			</template>
+		</el-row>
+	</el-form>
+</template>
+
+<script setup lang="ts" name="UserInfoForm">
+import type { FormInstance, FormRules } from "element-plus"
+import { validatePhone, validateUsername } from "/@/api/admin/user"
+import { deptTree } from "/@/api/admin/dept"
+import { list as roleList } from "/@/api/admin/role"
+import { list as postList } from "/@/api/admin/post"
+import { useDict } from "/@/hooks/dict"
+import { useMessage } from "/@/hooks/message"
+import { useUserInfo } from "/@/stores/userInfo"
+import { auth } from "/@/utils/authFunction"
+import { rule } from "/@/utils/validate"
+import { DEFAULT_USER_IDENTITY, STUDENT_USER_IDENTITY, type UserInfoFormModel } from "./user-info-form"
+
+const props = withDefaults(
+	defineProps<{
+		model: UserInfoFormModel
+		defaultDeptId?: string
+		loading?: boolean
+	}>(),
+	{
+		defaultDeptId: "",
+		loading: false,
+	},
+)
+
+const {
+	userInfos: { roleCodes },
+} = useUserInfo()
+// @ts-ignore
+const { lock_flag } = useDict("lock_flag")
+
+const formRef = ref<FormInstance>()
+const optionsLoading = ref(false)
+const deptData = ref<any[]>([])
+const roleData = ref<any[]>([])
+const postData = ref<any[]>([])
+const model = computed(() => props.model)
+const isEdit = computed(() => Boolean(model.value.userId))
+const isDeptAdmin = computed(() => roleCodes.includes("DEPT_ADMIN"))
+const hasDefaultIdentity = computed(() => model.value.identityTypes.includes(DEFAULT_USER_IDENTITY))
+const hasStudentIdentity = computed(() => model.value.identityTypes.includes(STUDENT_USER_IDENTITY))
+
+const validateIdentityPhone = (_currentRule: any, value: string, callback: (error?: Error) => void) => {
+	if (!hasDefaultIdentity.value) {
+		callback()
+		return
+	}
+	if (!value) {
+		callback(new Error("手机号不能为空"))
+		return
+	}
+	rule.validatePhone(_currentRule, value, callback)
+}
+
+const validatePhoneUnique = (currentRule: any, value: string, callback: (error?: Error) => void) => {
+	if (!hasDefaultIdentity.value || !value) {
+		callback()
+		return
+	}
+	validatePhone(currentRule, value, callback, isEdit.value)
+}
+
+const formRules: FormRules = {
+	username: [
+		{ required: true, message: "用户名不能为空", trigger: "blur" },
+		{ min: 5, max: 60, message: "用户名称长度必须介于5-60个字符之间", trigger: "blur" },
+		{ pattern: /^[^\u4e00-\u9fa5]+$/, message: "用户名称不能包含中文", trigger: "blur" },
+		{
+			validator: (currentRule: any, value: any, callback: any) => {
+				validateUsername(currentRule, value, callback, isEdit.value)
+			},
+			trigger: "blur",
+		},
+	],
+	password: [
+		{ required: true, message: "密码不能为空", trigger: "blur" },
+		{ min: 6, max: 20, message: "用户密码长度必须介于6-20个字符之间", trigger: "blur" },
+	],
+	name: [
+		{ validator: rule.overLength, trigger: "blur" },
+		{ required: true, message: "姓名不能为空", trigger: "blur" },
+		{ validator: rule.validatorPersonName, trigger: "blur" },
+	],
+	deptId: [{ required: true, message: "部门不能为空", trigger: "change" }],
+	role: isDeptAdmin.value ? [] : [{ required: true, message: "角色不能为空", trigger: "change" }],
+	phone: [
+		{ validator: validateIdentityPhone, trigger: "blur" },
+		{ validator: validatePhoneUnique, trigger: "blur" },
+	],
+	email: [{ validator: rule.overLength, trigger: "blur" }],
+	lockFlag: [{ required: true, message: "状态不能为空", trigger: "change" }],
+	identityTypes: [{ required: true, type: "array", min: 1, message: "用户身份不能为空", trigger: "change" }],
+	"studentInfo.studentNo": [
+		{ required: true, message: "学号不能为空", trigger: "blur" },
+		{ validator: rule.overLength, trigger: "blur" },
+	],
+}
+
+watch(
+	() => [...model.value.identityTypes],
+	() => {
+		nextTick(() => {
+			formRef.value?.clearValidate([
+				"phone",
+				"studentInfo.studentNo",
+				"studentInfo.schoolName",
+				"studentInfo.className",
+				"studentInfo.extJson",
+			])
+		})
+	},
+)
+
+const prepare = async () => {
+	optionsLoading.value = true
+	try {
+		const requests: Promise<any>[] = [roleList(), postList()]
+		if (!isEdit.value) requests.push(deptTree())
+		const [roleRes, postRes, deptRes] = await Promise.all(requests)
+		roleData.value = roleRes.data || []
+		postData.value = postRes.data || []
+		if (deptRes) deptData.value = deptRes.data || []
+
+		if (!isEdit.value) {
+			if (!model.value.deptId) model.value.deptId = props.defaultDeptId
+			if (!isDeptAdmin.value && !model.value.role.length && roleData.value.length) {
+				model.value.role = [roleData.value[0].roleId]
+			}
+			if (!isDeptAdmin.value && !model.value.post.length && postData.value.length) {
+				model.value.post = [postData.value[0].postId]
+			}
+		}
+	} catch (error: any) {
+		useMessage().error(error?.msg || "加载用户表单选项失败")
+	} finally {
+		optionsLoading.value = false
+	}
+}
+
+const validate = async () => Boolean(await formRef.value?.validate().catch(() => false))
+const clearValidate = () => formRef.value?.clearValidate()
+
+defineExpose({ prepare, validate, clearValidate })
+</script>
+
+<style scoped lang="scss">
+.identity-block {
+	padding: 14px 16px 0;
+	border: 1px solid var(--el-border-color-lighter);
+	border-radius: 4px;
+	background-color: var(--el-fill-color-lighter);
+}
+
+.identity-block__title {
+	margin-bottom: 14px;
+	font-size: 14px;
+	font-weight: 600;
+	color: var(--el-text-color-primary);
+}
+
+.identity-field-tip {
+	margin-top: 4px;
+	font-size: 13px;
+	line-height: 1.4;
+	color: var(--el-text-color-secondary);
+}
+</style>

src/views/admin/system/user/form.vue

@@ -1,106 +1,16 @@
 <template>
 	<div class="system-user-dialog-container">
-		<el-dialog :close-on-click-modal="false" :title="dataForm.userId ? $t('common.editBtn') : $t('common.addBtn')"
-			draggable v-model="visible">
-			<el-form :model="dataForm" :rules="dataRules" label-width="90px" ref="dataFormRef" v-loading="loading">
-				<el-row :gutter="20">
-					<el-col :span="12" class="mb20">
-						<el-form-item :label="$t('sysuser.username')" prop="username">
-							<el-input :disabled="dataForm.userId !== '' && !auth('user_sysUser_editUsername')"
-								placeholder="请输入用户名" v-model.trim="dataForm.username" />
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" class="mb20">
-						<el-form-item :label="$t('sysuser.password')" prop="password">
-							<el-input clearable placeholder="请输入密码" type="password"
-								v-model="dataForm.password"></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" class="mb20">
-						<el-form-item :label="$t('sysuser.name')" prop="name">
-							<el-input clearable placeholder="请输入姓名" v-model="dataForm.name"></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" class="mb20">
-						<el-form-item :label="$t('sysuser.phone')" prop="phone">
-							<el-input clearable placeholder="请输入手机号" v-model="dataForm.phone"></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" class="mb20">
-						<el-form-item label="性别" prop="gender">
-							<el-radio-group v-model="dataForm.gender">
-								<el-radio :label="0">未知</el-radio>
-								<el-radio :label="1">男</el-radio>
-								<el-radio :label="2">女</el-radio>
-							</el-radio-group>
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" v-if="!roleCodes.includes('DEPT_ADMIN')" class="mb20">
-						<el-form-item :label="$t('sysuser.role')" prop="role">
-							<el-select clearable multiple placeholder="请选择角色" v-model="dataForm.role">
-								<el-option :key="item.roleId" :label="item.roleName" :value="item.roleId"
-									v-for="item in roleData" />
-							</el-select>
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" v-if="!roleCodes.includes('DEPT_ADMIN')" class="mb20">
-						<el-form-item :label="$t('sysuser.post')" prop="post">
-							<el-select clearable multiple placeholder="请选择岗位" v-model="dataForm.post">
-								<el-option :key="item.postId" :label="item.postName" :value="item.postId"
-									v-for="item in postData" />
-							</el-select>
-						</el-form-item>
-					</el-col>
-					<el-col v-if="!dataForm.userId" :span="12" class="mb20">
-						<el-form-item :label="$t('sysuser.dept')" prop="deptId">
-							<el-tree-select :data="deptData"
-								:props="{ value: 'id', label: 'name', children: 'children', disabled: 'isLock' }"
-								filterable check-strictly class="w100" clearable placeholder="请选择所属部门"
-								v-model="dataForm.deptId">
-								<template #default="{ node, data }">
-									<el-tooltip v-if="data.isLock" effect="dark" content="无数据权限" placement="right">
-										<span>
-											{{ node.label }}
-											<SvgIcon name="ele-Lock" />
-										</span>
-									</el-tooltip>
-								</template>
-							</el-tree-select>
-						</el-form-item>
-					</el-col>
-
-					<el-col :span="12" class="mb20">
-						<el-form-item :label="$t('sysuser.email')" prop="email">
-							<el-input clearable placeholder="请输入邮箱" v-model="dataForm.email"></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" class="mb20">
-						<el-form-item :label="$t('sysuser.nickname')" prop="nickname">
-							<el-input clearable placeholder="请输入昵称" v-model="dataForm.nickname"></el-input>
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" class="mb20">
-						<el-form-item label="编制" prop="staffingType">
-							<dict-select :disabled="!auth('user_sysUser_editStaffingType')"
-								v-model="dataForm.staffingType" dict-code="user_staffing_type" />
-						</el-form-item>
-					</el-col>
-					<el-col :span="12" class="mb20">
-						<el-form-item :label="$t('sysuser.lockFlag')" prop="lockFlag">
-							<el-radio-group v-model="dataForm.lockFlag">
-								<el-radio :key="index" :label="item.value" border v-for="(item, index) in lock_flag">
-									{{ item.label }}
-								</el-radio>
-							</el-radio-group>
-						</el-form-item>
-					</el-col>
-				</el-row>
-			</el-form>
+		<el-dialog
+			v-model="visible"
+			:close-on-click-modal="false"
+			:title="dataForm.userId ? $t('common.editBtn') : $t('common.addBtn')"
+			draggable
+		>
+			<user-info-form ref="userInfoFormRef" :model="dataForm" :default-dept-id="props.deptId" :loading="loading" />
 			<template #footer>
 				<span class="dialog-footer">
 					<el-button @click="visible = false">{{ $t("common.cancelButtonText") }}</el-button>
-					<el-button @click="onSubmit" type="primary" :disabled="loading">{{ $t("common.confirmButtonText")
-					}}</el-button>
+					<el-button type="primary" :disabled="loading" @click="onSubmit">{{ $t("common.confirmButtonText") }}</el-button>
 				</span>
 			</template>
 		</el-dialog>
@@ -108,35 +18,11 @@
 </template>
 
 <script lang="ts" name="systemUserDialog" setup>
-import { addObj, getObj, putObj, validatePhone, validateUsername } from "/@/api/admin/user"
-import { list as roleList } from "/@/api/admin/role"
-import { list as postList } from "/@/api/admin/post"
-import { deptTree } from "/@/api/admin/dept"
-import { useDict } from "/@/hooks/dict"
-import { useI18n } from "vue-i18n"
+import { addObj, getObj, putObj } from "/@/api/admin/user"
 import { useMessage } from "/@/hooks/message"
-import { rule } from "/@/utils/validate"
-import { useUserInfo } from "/@/stores/userInfo"
-import { auth } from "/@/utils/authFunction"
-
-const { t } = useI18n()
-
-const {
-	userInfos: { roleCodes },
-} = useUserInfo()
-
-// 定义刷新表格emit
-const emit = defineEmits(["refresh"])
-// @ts-ignore
-const { lock_flag } = useDict("lock_flag")
-
-// 定义变量内容
-const dataFormRef = ref()
-const visible = ref(false)
-const deptData = ref<any[]>([])
-const roleData = ref<any[]>([])
-const postData = ref<any[]>([])
-const loading = ref(false)
+import { useI18n } from "vue-i18n"
+import UserInfoForm from "./components/user-info-form.vue"
+import { createEmptyStudentInfo, createEmptyUserInfo, getUserIdentityPayload } from "./components/user-info-form"
 
 const props = defineProps({
 	deptId: {
@@ -145,193 +31,69 @@ const props = defineProps({
 	},
 })
 
-const dataForm = reactive({
-	userId: "",
-	username: "",
-	password: "" as String | undefined,
-	salt: "",
-	wxOpenid: "",
-	qqOpenid: "",
-	lockFlag: "0",
-	phone: "" as String | undefined,
-	deptId: "",
-	roleList: [],
-	postList: [],
-	nickname: "",
-	name: "",
-	email: "",
-	/** 0 未知 / 1 男 / 2 女 */
-	gender: 0 as number,
-	staffingType: "2",
-	post: [] as string[],
-	role: [] as string[],
-})
+const emit = defineEmits(["refresh"])
+const { t } = useI18n()
+const userInfoFormRef = ref<InstanceType<typeof UserInfoForm>>()
+const visible = ref(false)
+const loading = ref(false)
+const dataForm = reactive(createEmptyUserInfo())
 
-const dataRules = ref({
-	// 用户名校验，不能为空 、长度 5-20、不能和已有数据重复
-	username: [
-		{ required: true, message: "用户名不能为空", trigger: "blur" },
-		{ min: 5, max: 60, message: "用户名称长度必须介于5-20个字符之间", trigger: "blur" },
-		{ pattern: /^[^\u4e00-\u9fa5]+$/, message: "用户名称不能包含中文", trigger: "blur" },
-		{
-			validator: (rule: any, value: any, callback: any) => {
-				validateUsername(rule, value, callback, dataForm.userId !== "")
-			},
-			trigger: "blur",
-		},
-	],
-	password: [
-		{ required: true, message: "密码不能为空", trigger: "blur" },
-		{
-			min: 6,
-			max: 20,
-			message: "用户密码长度必须介于 5 和 20 之间",
-			trigger: "blur",
-		},
-	],
-	// 姓名校验：中文，或英文（单词间可空格）
-	name: [
-		{ validator: rule.overLength, trigger: "blur" },
-		{ required: true, message: "姓名不能为空", trigger: "blur" },
-		{ validator: rule.validatorPersonName, trigger: "blur" },
-	],
-	deptId: [{ required: true, message: "部门不能为空", trigger: "blur" }],
-	role: roleCodes.includes("DEPT_ADMIN") ? [] : [{ required: true, message: "角色不能为空", trigger: "blur" }],
-	// post: [{ required: true, message: '岗位不能为空', trigger: 'blur' }],
-	// 手机号校验，不能为空、新增的时不能重复校验
-	phone: [
-		{ required: true, message: "手机号不能为空", trigger: "blur" },
-		{ validator: rule.validatePhone, trigger: "blur" },
-		{
-			validator: (rule: any, value: any, callback: any) => {
-				validatePhone(rule, value, callback, dataForm.userId !== "")
-			},
-			trigger: "blur",
-		},
-	],
-	email: [{ validator: rule.overLength, trigger: "blur" }],
-	lockFlag: [{ required: true, message: "状态不能为空", trigger: "blur" }],
-})
-
-// 打开弹窗
-const openDialog = async (id: string) => {
+const openDialog = async (id?: string) => {
 	visible.value = true
-	dataForm.userId = ""
+	Object.assign(dataForm, createEmptyUserInfo(props.deptId))
 
-	// 重置表单数据
-	nextTick(() => {
-		dataFormRef.value?.resetFields()
-		if (!id) {
-			dataForm.gender = 0
-		}
-	})
-
-	// 修改获取用户信息
 	if (id) {
 		dataForm.userId = id
 		await getUserData(id)
 		dataForm.password = "******"
 	}
 
-	// 新增时加载部门树数据，修改时不加载
-	!id ? getDeptData() : ""
-	getPostData()
-	getRoleData()
+	await nextTick()
+	await userInfoFormRef.value?.prepare()
+	userInfoFormRef.value?.clearValidate()
 }
 
-// 提交
 const onSubmit = async () => {
-	const valid = await dataFormRef.value.validate().catch(() => { })
-	if (!valid) return false
+	if (!(await userInfoFormRef.value?.validate())) return
 
 	try {
 		const { userId, phone, password } = dataForm
-
+		const payload = { ...dataForm, ...getUserIdentityPayload(dataForm) }
+		loading.value = true
 		if (userId) {
-			// 清除占位符，避免提交错误的数据
-			if (phone?.includes("*")) dataForm.phone = undefined
-			if (password?.includes("******")) dataForm.password = undefined
-
-			loading.value = true
-			await putObj(dataForm)
+			if (phone?.includes("*")) payload.phone = undefined
+			if (password?.includes("******")) payload.password = undefined
+			await putObj(payload)
 			useMessage().success(t("common.editSuccessText"))
-			visible.value = false // 关闭弹窗
-			emit("refresh")
 		} else {
-			loading.value = true
-			await addObj(dataForm)
+			await addObj(payload)
 			useMessage().success(t("common.addSuccessText"))
-			visible.value = false // 关闭弹窗
-			emit("refresh")
 		}
+		visible.value = false
+		emit("refresh")
 	} catch (error: any) {
-		useMessage().error(error.msg)
+		useMessage().error(error?.msg || "保存失败")
 	} finally {
 		loading.value = false
 	}
 }
 
-/**
- * 从服务器获取用户数据
- *
- * @async
- * @param {string} id - 用户 ID
- * @return {Promise} - 包含用户数据的 Promise 对象
- */
 const getUserData = async (id: string) => {
 	try {
 		loading.value = true
 		const { data } = await getObj(id)
 		Object.assign(dataForm, data)
+		dataForm.identityTypes = Array.isArray(data.identityTypes) && data.identityTypes.length ? data.identityTypes : ["DEFAULT"]
+		dataForm.studentInfo = { ...createEmptyStudentInfo(), ...(data.studentInfo || {}) }
 		dataForm.gender = data.gender != null && data.gender !== "" ? Number(data.gender) : 0
-		if (data.roleList) {
-			dataForm.role = data.roleList.map((item: any) => item.roleId)
-		}
-		if (data.postList) {
-			dataForm.post = data.postList.map((item: any) => item.postId)
-		}
-	} catch (err: any) {
-		useMessage().error(err.msg)
+		dataForm.role = data.roleList?.map((item: any) => item.roleId) || []
+		dataForm.post = data.postList?.map((item: any) => item.postId) || []
+	} catch (error: any) {
+		useMessage().error(error?.msg || "获取用户信息失败")
 	} finally {
 		loading.value = false
 	}
 }
 
-// 初始化部门数据
-const getDeptData = () => {
-	// 获取部门数据
-	deptTree().then((res) => {
-		deptData.value = res.data
-		// 默认选择在树中选中的部门
-		if (!dataForm.userId) {
-			dataForm.deptId = props.deptId
-		}
-	})
-}
-
-// 岗位数据
-const getPostData = () => {
-	postList().then((res) => {
-		postData.value = res.data
-		// 默认选择第一个
-		if (!roleCodes.includes("DEPT_ADMIN") && !dataForm.userId) {
-			dataForm.post = [res.data[0].postId]
-		}
-	})
-}
-// 角色数据
-const getRoleData = () => {
-	roleList().then((res) => {
-		roleData.value = res.data
-		// 默认选择第一个
-		if (!roleCodes.includes("DEPT_ADMIN") && !dataForm.userId) {
-			dataForm.role = [res.data[0].roleId]
-		}
-	})
-}
-
-// 暴露变量
-defineExpose({
-	openDialog,
-})
+defineExpose({ openDialog })
 </script>

src/views/admin/system/user/index.vue

@@ -127,35 +127,42 @@
 									<popover-input v-if="row.processStatus == '2'" v-model="inputPassword"
 										@confirm="changePassword(row)">
 										<template #default>
-											<el-button style="margin: 0 !important;" v-auth="'sys_user_edit'"
-												icon="RefreshLeft" text type="primary" class="mr-4">密码</el-button>
+											<el-button size="small" style="margin: 0 !important;"
+												v-auth="'sys_user_edit'" icon="RefreshLeft" text type="primary"
+												class="mr-4">密码</el-button>
 										</template>
 									</popover-input>
 									<!-- 修改信息 -->
 									<el-button style="margin: 0 !important;" v-if="row.processStatus == '2'"
-										v-auth="'sys_user_edit'" icon="edit-pen" text type="primary"
+										v-auth="'sys_user_edit'" icon="edit-pen" text type="primary" size="small"
 										@click="userDialogRef.openDialog(row.userId)">
 										修改
 									</el-button>
 									<!-- 修改信息 -->
 									<el-button style="margin: 0 !important;" v-if="row.processStatus == '2'"
-										icon="SetUp" text type="primary" @click="tagTableRef.openDialog(row.userId)">
+										icon="SetUp" text type="primary" size="small"
+										@click="tagTableRef.openDialog(row.userId)">
 										用户标签
 									</el-button>
 									<!-- 人脸管理 -->
 									<el-button style="margin: 0 !important;" v-if="row.processStatus == '2'"
-										v-auth="'userFace_sysUserFace_view'" icon="User" text type="primary"
-										@click="faceManageRef.openDialog(row.userId)">
+										v-auth="'userFace_sysUserFace_view'" icon="User" size="small" text
+										type="primary" @click="faceManageRef.openDialog(row.userId)">
 										人脸管理
 									</el-button>
 									<el-button style="margin: 0 !important;" v-if="row.processStatus == 1"
 										type="primary" size="small" link icon="VideoPlay" @click="deal(row)">
 										开始处理
 									</el-button>
+									<el-button style="margin: 0 !important;" type="primary" size="small" link
+										v-if="row.processStatus == '2'" icon="SuitcaseLine"
+										@click="toRelationTree(row)">
+										关系图谱
+									</el-button>
 									<!-- 删除用户 -->
 									<el-tooltip content="admin 不允许被删除" :disabled="row.userId !== '1'" placement="top">
 										<span style="margin-left: 12px">
-											<el-button style="margin: 0 !important;" icon="delete"
+											<el-button style="margin: 0 !important;" icon="delete" size="small"
 												v-auth="'sys_user_del'" :disabled="row.username === 'admin'" text
 												type="primary" @click="handleDelete([row.userId])">
 												删除
@@ -202,6 +209,7 @@ const BatchDeal = defineAsyncComponent(() => import("./batchDeal.vue"))
 const TagTable = defineAsyncComponent(() => import("./tag-table.vue"))
 
 const { t } = useI18n()
+const { push } = useRouter()
 
 const userDialogRef = ref()
 const faceManageRef = ref()
@@ -278,6 +286,16 @@ const doBatchDeal = () => {
 	batchDealRef.value.openDialog(processIds)
 }
 
+// 关系图谱
+const toRelationTree = (row: any) => {
+	push({
+		path: "/admin/system/user/relation-tree",
+		query: {
+			userId: row.userId,
+		},
+	})
+}
+
 // 审批提交事件
 const taskSubmitEvent = () => {
 	getDataList()

src/views/admin/system/user/relation-create-user.vue

@@ -0,0 +1,362 @@
+<template>
+	<el-dialog v-model="visible" title="新增用户关系" width="920px" :close-on-click-modal="false" destroy-on-close>
+		<div class="relation-target">
+			<div class="target-avatar">{{ getInitial(targetUser?.displayName) }}</div>
+			<div>
+				<div class="target-title">当前用户：{{ targetUser?.displayName }}</div>
+				<div class="target-subtitle">可选择当前用户与新建或已有用户之间的关系方向</div>
+			</div>
+		</div>
+
+		<el-form ref="relationFormRef" v-loading="relationOptionsLoading" :model="relationForm" :rules="relationRules"
+			label-width="100px">
+			<el-divider content-position="center">关系信息</el-divider>
+			<el-row :gutter="20">
+				<el-col :span="12" class="mb20">
+					<el-form-item label="关系类型" prop="relationTypeId">
+						<el-select v-model="relationForm.relationTypeId" filterable placeholder="请选择关系类型" class="w100">
+							<el-option v-for="item in relationTypeOptions" :key="item.relationTypeId"
+								:label="formatRelationType(item)" :value="item.relationTypeId" />
+						</el-select>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="关系方向">
+						<el-radio-group v-model="relationDirection" class="direction-radio-group">
+							<el-radio-button label="other-to-target">关联用户 → 当前用户</el-radio-button>
+							<el-radio-button label="target-to-other">当前用户 → 关联用户</el-radio-button>
+						</el-radio-group>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="生效时间" prop="effectiveTime">
+						<el-date-picker v-model="relationForm.effectiveTime" type="datetime"
+							value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择生效时间" class="w100" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="失效时间" prop="expireTime">
+						<el-date-picker v-model="relationForm.expireTime" type="datetime"
+							value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择失效时间" class="w100" />
+					</el-form-item>
+				</el-col>
+				<el-col :span="24" class="mb20">
+					<el-form-item label="关系备注" prop="remark">
+						<el-input type="textarea" v-model.trim="relationForm.remark" maxlength="500" show-word-limit
+							placeholder="请输入关系备注" />
+					</el-form-item>
+				</el-col>
+			</el-row>
+			<el-alert type="info" :closable="false" class="direction-alert" show-icon>
+				<template #title>{{ relationDirectionDescription }}</template>
+			</el-alert>
+		</el-form>
+
+		<el-divider content-position="center">用户信息</el-divider>
+		<el-tabs v-model="createMode" class="user-mode-tabs" @tab-change="handleModeChange">
+			<el-tab-pane label="创建用户" name="new">
+				<user-info-form ref="userInfoFormRef" :model="newUserForm" :loading="submitting" />
+			</el-tab-pane>
+			<el-tab-pane label="选择已有用户" name="existing">
+				<el-form ref="existingUserFormRef" :model="existingUserForm" :rules="existingUserRules"
+					label-width="100px">
+					<el-form-item label="关联用户" prop="userId">
+						<select-user v-model="existingUserForm.userId"
+							:exclude-user-ids="targetUser ? [targetUser.userId] : []" placeholder="输入姓名或手机号选择用户"
+							@change="selectedExistingUser = $event" />
+					</el-form-item>
+				</el-form>
+			</el-tab-pane>
+		</el-tabs>
+
+		<template #footer>
+			<el-button @click="visible = false">取消</el-button>
+			<el-button type="primary" :loading="submitting" @click="submit">
+				{{ createMode === "new" ? "新增用户并建立关系" : "建立关系" }}
+			</el-button>
+		</template>
+	</el-dialog>
+</template>
+
+<script setup lang="ts" name="RelationCreateUser">
+import dayjs from "dayjs"
+import type { FormInstance, FormRules } from "element-plus"
+import {
+	createRelation,
+	createRelationUser,
+	type RelationCreateForm,
+	type RelationCreateUserForm,
+	type RelationGraphNode,
+} from "/@/api/admin/sysUserRelation"
+import { fetchList as fetchRelationTypes } from "/@/api/admin/sysUserRelationType"
+import { useMessage } from "/@/hooks/message"
+import UserInfoForm from "./components/user-info-form.vue"
+import { createEmptyUserInfo, getUserIdentityPayload } from "./components/user-info-form"
+
+interface RelationTypeOption {
+	relationTypeId: string
+	relationName: string
+	subjectRoleName?: string
+	objectRoleName?: string
+	status: string
+}
+
+type CreateMode = "new" | "existing"
+type RelationDirection = "other-to-target" | "target-to-other"
+
+const emit = defineEmits<{
+	(e: "success", userId: string): void
+}>()
+
+const visible = ref(false)
+const submitting = ref(false)
+const relationOptionsLoading = ref(false)
+const relationOptionsLoaded = ref(false)
+const relationFormRef = ref<FormInstance>()
+const existingUserFormRef = ref<FormInstance>()
+const userInfoFormRef = ref<InstanceType<typeof UserInfoForm>>()
+const targetUser = ref<RelationGraphNode>()
+const selectedExistingUser = ref<any>()
+const relationTypeOptions = ref<RelationTypeOption[]>([])
+const createMode = ref<CreateMode>("new")
+const relationDirection = ref<RelationDirection>("other-to-target")
+
+const createInitialRelationForm = (): RelationCreateForm => ({
+	subjectUserId: "",
+	objectUserId: "",
+	relationTypeId: "",
+	effectiveTime: dayjs().format("YYYY-MM-DD HH:mm:ss"),
+	expireTime: "",
+	remark: "",
+})
+
+const relationForm = reactive<RelationCreateForm>(createInitialRelationForm())
+const newUserForm = reactive(createEmptyUserInfo())
+const existingUserForm = reactive({ userId: "" })
+
+const selectedRelationType = computed(() =>
+	relationTypeOptions.value.find((item) => item.relationTypeId === relationForm.relationTypeId)
+)
+
+const associatedUserName = computed(() => {
+	if (createMode.value === "new") return newUserForm.name?.trim() || "新建用户"
+	return selectedExistingUser.value?.name || selectedExistingUser.value?.username || "所选用户"
+})
+
+const relationDirectionDescription = computed(() => {
+	const targetName = targetUser.value?.displayName || "当前用户"
+	const relationType = selectedRelationType.value
+	if (relationDirection.value === "other-to-target") {
+		const roles = formatDirectionRoles(relationType?.subjectRoleName, relationType?.objectRoleName)
+		return `将建立“${associatedUserName.value} → ${targetName}”的关系${roles}`
+	}
+	const roles = formatDirectionRoles(relationType?.subjectRoleName, relationType?.objectRoleName)
+	return `将建立“${targetName} → ${associatedUserName.value}”的关系${roles}`
+})
+
+const validateExpireTime = (_rule: any, value: string, callback: (error?: Error) => void) => {
+	if (value && relationForm.effectiveTime && value < relationForm.effectiveTime) {
+		callback(new Error("失效时间不能早于生效时间"))
+		return
+	}
+	callback()
+}
+
+const relationRules: FormRules = {
+	relationTypeId: [{ required: true, message: "请选择关系类型", trigger: "change" }],
+	expireTime: [{ validator: validateExpireTime, trigger: "change" }],
+}
+
+const existingUserRules: FormRules = {
+	userId: [{ required: true, message: "请选择已有用户", trigger: "change" }],
+}
+
+const loadRelationTypes = async () => {
+	if (relationOptionsLoaded.value) return
+	relationOptionsLoading.value = true
+	try {
+		const relationRes: any = await fetchRelationTypes({ current: 1, size: 1000 })
+		relationTypeOptions.value = (relationRes.data?.records || []).filter((item: RelationTypeOption) => item.status === "0")
+		relationOptionsLoaded.value = true
+	} catch (error: any) {
+		useMessage().error(error?.msg || "加载关系类型失败")
+	} finally {
+		relationOptionsLoading.value = false
+	}
+}
+
+const openDialog = async (target: RelationGraphNode) => {
+	targetUser.value = target
+	createMode.value = "new"
+	relationDirection.value = "other-to-target"
+	selectedExistingUser.value = undefined
+	Object.assign(relationForm, createInitialRelationForm(), { objectUserId: target.userId })
+	Object.assign(newUserForm, createEmptyUserInfo())
+	existingUserForm.userId = ""
+	visible.value = true
+	await nextTick()
+	relationFormRef.value?.clearValidate()
+	await Promise.all([loadRelationTypes(), userInfoFormRef.value?.prepare()])
+	userInfoFormRef.value?.clearValidate()
+	if (!relationForm.relationTypeId && relationTypeOptions.value.length === 1) {
+		relationForm.relationTypeId = relationTypeOptions.value[0].relationTypeId
+	}
+}
+
+const handleModeChange = async (mode: string | number | boolean) => {
+	createMode.value = mode as CreateMode
+	existingUserForm.userId = ""
+	selectedExistingUser.value = undefined
+	await nextTick()
+	existingUserFormRef.value?.clearValidate()
+	if (createMode.value === "new") {
+		await userInfoFormRef.value?.prepare()
+		userInfoFormRef.value?.clearValidate()
+	}
+}
+
+const submit = async () => {
+	const relationValid = await relationFormRef.value?.validate().catch(() => false)
+	if (!relationValid) return
+	if (createMode.value === "new" && !(await userInfoFormRef.value?.validate())) return
+	if (createMode.value === "existing" && !(await existingUserFormRef.value?.validate().catch(() => false))) return
+
+	submitting.value = true
+	try {
+		const targetUserId = String(targetUser.value?.userId || "")
+		let associatedUserId = existingUserForm.userId
+		if (createMode.value === "new") {
+			const identityPayload = getUserIdentityPayload(newUserForm)
+			const payload: RelationCreateUserForm = {
+				relationTypeId: relationForm.relationTypeId,
+				effectiveTime: relationForm.effectiveTime,
+				expireTime: relationForm.expireTime,
+				remark: relationForm.remark,
+				username: newUserForm.username,
+				password: newUserForm.password || "",
+				phone: identityPayload.phone,
+				name: newUserForm.name,
+				nickname: newUserForm.nickname,
+				email: newUserForm.email,
+				avatar: newUserForm.avatar,
+				deptId: newUserForm.deptId,
+				role: newUserForm.role.map(String),
+				post: newUserForm.post.map(String),
+				gender: newUserForm.gender,
+				staffingType: newUserForm.staffingType,
+				lockFlag: newUserForm.lockFlag,
+				identityTypes: identityPayload.identityTypes,
+				studentInfo: identityPayload.studentInfo,
+			}
+			if (relationDirection.value === "other-to-target") {
+				payload.objectUserId = targetUserId
+			} else {
+				payload.subjectUserId = targetUserId
+			}
+			const { data } = await createRelationUser(payload)
+			associatedUserId = String(data)
+			useMessage().success("用户及关系创建成功")
+		} else {
+			const payload: RelationCreateForm = {
+				...relationForm,
+				subjectUserId: relationDirection.value === "other-to-target" ? associatedUserId : targetUserId,
+				objectUserId: relationDirection.value === "other-to-target" ? targetUserId : associatedUserId,
+			}
+			await createRelation(payload)
+			useMessage().success("用户关系创建成功")
+		}
+		visible.value = false
+		emit("success", associatedUserId)
+	} catch (error: any) {
+		useMessage().error(error?.msg || "创建失败")
+	} finally {
+		submitting.value = false
+	}
+}
+
+const formatRelationType = (item: RelationTypeOption) => {
+	const roles = [item.subjectRoleName, item.objectRoleName].filter(Boolean).join(" / ")
+	return roles ? `${item.relationName}（${roles}）` : item.relationName
+}
+
+const formatDirectionRoles = (subjectRoleName?: string, objectRoleName?: string) => {
+	if (!subjectRoleName && !objectRoleName) return ""
+	return `（主语：${subjectRoleName || "-"}，对象：${objectRoleName || "-"}）`
+}
+
+const getInitial = (name?: string) => name?.trim().slice(0, 1) || "用"
+
+defineExpose({ openDialog })
+</script>
+
+<style scoped lang="scss">
+.relation-target {
+	display: flex;
+	align-items: center;
+	gap: 12px;
+	padding: 14px 16px;
+	margin-bottom: 14px;
+	background: var(--el-color-primary-light-9);
+	border: 1px solid var(--el-color-primary-light-7);
+	border-radius: 10px;
+}
+
+.target-avatar {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	width: 42px;
+	height: 42px;
+	color: #fff;
+	font-size: 18px;
+	font-weight: 600;
+	background: var(--el-color-primary);
+	border-radius: 50%;
+}
+
+.target-title {
+	font-weight: 600;
+	color: var(--el-text-color-primary);
+}
+
+.target-subtitle {
+	margin-top: 4px;
+	font-size: 12px;
+	color: var(--el-text-color-secondary);
+}
+
+:deep(.el-divider__text) {
+	font-weight: 600;
+}
+
+.user-mode-tabs {
+	margin-top: -6px;
+}
+
+.user-mode-tabs :deep(.el-tabs__header) {
+	margin-bottom: 18px;
+}
+
+.user-mode-tabs :deep(.el-tabs__nav-wrap::after) {
+	height: 1px;
+}
+
+.direction-radio-group {
+	display: flex;
+	width: 100%;
+}
+
+.direction-radio-group :deep(.el-radio-button) {
+	flex: 1;
+}
+
+.direction-radio-group :deep(.el-radio-button__inner) {
+	width: 100%;
+	padding-right: 8px;
+	padding-left: 8px;
+}
+
+.direction-alert {
+	margin: -6px 0 16px;
+}
+</style>

src/views/admin/system/user/relation-edit-form.vue

@@ -0,0 +1,350 @@
+<template>
+	<el-dialog v-model="visible" title="修改用户关系" width="760px" :close-on-click-modal="false" destroy-on-close>
+		<div class="relation-summary">
+			<div class="summary-user">
+				<div class="summary-avatar">{{ getInitial(subjectUserName) }}</div>
+				<div>
+					<div class="summary-name">{{ subjectUserName }}</div>
+					<div class="summary-role">关系主语</div>
+				</div>
+			</div>
+			<el-icon class="summary-arrow">
+				<Right />
+			</el-icon>
+			<div class="summary-user">
+				<div class="summary-avatar is-object">{{ getInitial(objectUserName) }}</div>
+				<div>
+					<div class="summary-name">{{ objectUserName }}</div>
+					<div class="summary-role">关系对象</div>
+				</div>
+			</div>
+		</div>
+
+		<el-form ref="formRef" v-loading="relationOptionsLoading" :model="form" :rules="rules" label-width="100px">
+			<el-divider content-position="center">绑定用户</el-divider>
+			<el-row :gutter="20">
+				<el-col :span="11" class="mb20">
+					<el-form-item label="关系主语" prop="subjectUserId">
+						<select-user
+							v-model="form.subjectUserId"
+							:exclude-user-ids="form.objectUserId ? [form.objectUserId] : []"
+							placeholder="请选择关系主语用户"
+							@change="selectedSubjectUser = $event"
+						/>
+					</el-form-item>
+				</el-col>
+				<el-col :span="2" class="swap-column">
+					<el-tooltip content="交换关系双方" placement="top">
+						<el-button circle icon="Switch" @click="swapUsers" />
+					</el-tooltip>
+				</el-col>
+				<el-col :span="11" class="mb20">
+					<el-form-item label="关系对象" prop="objectUserId">
+						<select-user
+							v-model="form.objectUserId"
+							:exclude-user-ids="form.subjectUserId ? [form.subjectUserId] : []"
+							placeholder="请选择关系对象用户"
+							@change="selectedObjectUser = $event"
+						/>
+					</el-form-item>
+				</el-col>
+			</el-row>
+
+			<el-divider content-position="center">关系信息</el-divider>
+			<el-row :gutter="20">
+				<el-col :span="12" class="mb20">
+					<el-form-item label="关系类型" prop="relationTypeId">
+						<el-select v-model="form.relationTypeId" filterable placeholder="请选择关系类型" class="w100">
+							<el-option
+								v-for="item in relationTypeOptions"
+								:key="item.relationTypeId"
+								:label="formatRelationType(item)"
+								:value="item.relationTypeId"
+							/>
+						</el-select>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="生效时间" prop="effectiveTime">
+						<el-date-picker
+							v-model="form.effectiveTime"
+							type="datetime"
+							value-format="YYYY-MM-DD HH:mm:ss"
+							placeholder="请选择生效时间"
+							class="w100"
+						/>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="失效时间" prop="expireTime">
+						<el-date-picker
+							v-model="form.expireTime"
+							type="datetime"
+							value-format="YYYY-MM-DD HH:mm:ss"
+							placeholder="请选择失效时间"
+							class="w100"
+						/>
+					</el-form-item>
+				</el-col>
+				<el-col :span="24" class="mb20">
+					<el-form-item label="关系备注" prop="remark">
+						<el-input v-model.trim="form.remark" type="textarea" :rows="3" maxlength="500" show-word-limit placeholder="请输入关系备注" />
+					</el-form-item>
+				</el-col>
+			</el-row>
+
+			<el-alert type="info" :closable="false" show-icon>
+				<template #title>{{ relationDescription }}</template>
+			</el-alert>
+		</el-form>
+
+		<template #footer>
+			<el-button @click="visible = false">取消</el-button>
+			<el-button type="primary" :loading="submitting" @click="submit">保存修改</el-button>
+		</template>
+	</el-dialog>
+</template>
+
+<script setup lang="ts" name="RelationEditForm">
+import type { FormInstance, FormRules } from "element-plus"
+import { type RelationGraphNode, type RelationUpdateForm, updateRelation } from "/@/api/admin/sysUserRelation"
+import { fetchList as fetchRelationTypes } from "/@/api/admin/sysUserRelationType"
+import { useMessage } from "/@/hooks/message"
+
+interface RelationTypeOption {
+	relationTypeId: string
+	relationName: string
+	subjectRoleName?: string
+	objectRoleName?: string
+	directedFlag?: string
+	status: string
+}
+
+interface RelationUserNames {
+	subjectUserName?: string
+	objectUserName?: string
+}
+
+const emit = defineEmits<{
+	(e: "success"): void
+}>()
+
+const visible = ref(false)
+const submitting = ref(false)
+const relationOptionsLoading = ref(false)
+const relationOptionsLoaded = ref(false)
+const formRef = ref<FormInstance>()
+const relationTypeOptions = ref<RelationTypeOption[]>([])
+const selectedSubjectUser = ref<any>()
+const selectedObjectUser = ref<any>()
+const initialUserNames = reactive<Required<RelationUserNames>>({
+	subjectUserName: "关系主语",
+	objectUserName: "关系对象",
+})
+
+const createInitialForm = (): RelationUpdateForm => ({
+	relationId: "",
+	subjectUserId: "",
+	objectUserId: "",
+	relationTypeId: "",
+	effectiveTime: "",
+	expireTime: "",
+	remark: "",
+})
+
+const form = reactive<RelationUpdateForm>(createInitialForm())
+
+const selectedRelationType = computed(() =>
+	relationTypeOptions.value.find((item) => String(item.relationTypeId) === String(form.relationTypeId)),
+)
+
+const subjectUserName = computed(() => getSelectedUserName(selectedSubjectUser.value, initialUserNames.subjectUserName, form.subjectUserId))
+
+const objectUserName = computed(() => getSelectedUserName(selectedObjectUser.value, initialUserNames.objectUserName, form.objectUserId))
+
+const relationDescription = computed(() => {
+	const relationType = selectedRelationType.value
+	const roles = formatDirectionRoles(relationType?.subjectRoleName, relationType?.objectRoleName)
+	const connector = relationType?.directedFlag === "1" ? " → " : " ↔ "
+	return `将把关系调整为“${subjectUserName.value}${connector}${objectUserName.value}”${roles}`
+})
+
+const validateDifferentUsers = (_rule: any, _value: string, callback: (error?: Error) => void) => {
+	if (form.subjectUserId && form.objectUserId && String(form.subjectUserId) === String(form.objectUserId)) {
+		callback(new Error("关系双方不能是同一个用户"))
+		return
+	}
+	callback()
+}
+
+const validateExpireTime = (_rule: any, value: string, callback: (error?: Error) => void) => {
+	if (value && form.effectiveTime && value < form.effectiveTime) {
+		callback(new Error("失效时间不能早于生效时间"))
+		return
+	}
+	callback()
+}
+
+const rules: FormRules = {
+	subjectUserId: [
+		{ required: true, message: "请选择关系主语用户", trigger: "change" },
+		{ validator: validateDifferentUsers, trigger: "change" },
+	],
+	objectUserId: [
+		{ required: true, message: "请选择关系对象用户", trigger: "change" },
+		{ validator: validateDifferentUsers, trigger: "change" },
+	],
+	relationTypeId: [{ required: true, message: "请选择关系类型", trigger: "change" }],
+	expireTime: [{ validator: validateExpireTime, trigger: "change" }],
+}
+
+const loadRelationTypes = async () => {
+	if (relationOptionsLoaded.value) return
+	relationOptionsLoading.value = true
+	try {
+		const { data }: any = await fetchRelationTypes({ current: 1, size: 1000 })
+		relationTypeOptions.value = (data?.records || []).filter((item: RelationTypeOption) => item.status === "0")
+		relationOptionsLoaded.value = true
+	} catch (error: any) {
+		useMessage().error(error?.msg || "加载关系类型失败")
+	} finally {
+		relationOptionsLoading.value = false
+	}
+}
+
+const openDialog = async (relation: RelationGraphNode, names: RelationUserNames = {}) => {
+	if (!relation.relationId || !relation.subjectUserId || !relation.objectUserId) {
+		useMessage().warning("当前节点没有可修改的关系")
+		return
+	}
+
+	Object.assign(form, createInitialForm(), {
+		relationId: String(relation.relationId),
+		subjectUserId: String(relation.subjectUserId),
+		objectUserId: String(relation.objectUserId),
+		relationTypeId: String(relation.relationTypeId || ""),
+		effectiveTime: relation.effectiveTime || "",
+		expireTime: relation.expireTime || "",
+		remark: relation.remark || "",
+	})
+	initialUserNames.subjectUserName = names.subjectUserName || String(relation.subjectUserId)
+	initialUserNames.objectUserName = names.objectUserName || String(relation.objectUserId)
+	selectedSubjectUser.value = undefined
+	selectedObjectUser.value = undefined
+	visible.value = true
+	await nextTick()
+	formRef.value?.clearValidate()
+	await loadRelationTypes()
+}
+
+const swapUsers = () => {
+	const subjectUserId = form.subjectUserId
+	const subjectUser = selectedSubjectUser.value
+	const subjectName = initialUserNames.subjectUserName
+	form.subjectUserId = form.objectUserId
+	form.objectUserId = subjectUserId
+	selectedSubjectUser.value = selectedObjectUser.value
+	selectedObjectUser.value = subjectUser
+	initialUserNames.subjectUserName = initialUserNames.objectUserName
+	initialUserNames.objectUserName = subjectName
+	nextTick(() => formRef.value?.validateField(["subjectUserId", "objectUserId"]).catch(() => undefined))
+}
+
+const submit = async () => {
+	const valid = await formRef.value?.validate().catch(() => false)
+	if (!valid) return
+
+	submitting.value = true
+	try {
+		await updateRelation({ ...form })
+		useMessage().success("用户关系修改成功")
+		visible.value = false
+		emit("success")
+	} catch (error: any) {
+		useMessage().error(error?.msg || "修改用户关系失败")
+	} finally {
+		submitting.value = false
+	}
+}
+
+const formatRelationType = (item: RelationTypeOption) => {
+	const roles = [item.subjectRoleName, item.objectRoleName].filter(Boolean).join(" / ")
+	return roles ? `${item.relationName}（${roles}）` : item.relationName
+}
+
+const formatDirectionRoles = (subjectRoleName?: string, objectRoleName?: string) => {
+	if (!subjectRoleName && !objectRoleName) return ""
+	return `（主语：${subjectRoleName || "-"}，对象：${objectRoleName || "-"}）`
+}
+
+const getSelectedUserName = (user: any, fallback: string, userId: string) => {
+	if (!userId) return "未选择用户"
+	return user?.name || user?.nickname || user?.username || fallback || userId
+}
+
+const getInitial = (name?: string) => name?.trim().slice(0, 1) || "用"
+
+defineExpose({ openDialog })
+</script>
+
+<style scoped lang="scss">
+.relation-summary {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	gap: 24px;
+	padding: 16px;
+	margin-bottom: 12px;
+	background: var(--el-color-primary-light-9);
+	border: 1px solid var(--el-color-primary-light-7);
+	border-radius: 12px;
+}
+
+.summary-user {
+	display: flex;
+	align-items: center;
+	gap: 10px;
+	min-width: 180px;
+}
+
+.summary-avatar {
+	display: flex;
+	flex: none;
+	align-items: center;
+	justify-content: center;
+	width: 42px;
+	height: 42px;
+	color: #fff;
+	font-size: 17px;
+	font-weight: 600;
+	background: var(--el-color-primary);
+	border-radius: 50%;
+}
+
+.summary-avatar.is-object {
+	background: #7c3aed;
+}
+
+.summary-name {
+	font-weight: 600;
+	color: var(--el-text-color-primary);
+}
+
+.summary-role {
+	margin-top: 3px;
+	font-size: 12px;
+	color: var(--el-text-color-secondary);
+}
+
+.summary-arrow {
+	color: var(--el-color-primary);
+	font-size: 22px;
+}
+
+.swap-column {
+	display: flex;
+	align-items: flex-start;
+	justify-content: center;
+	padding-top: 1px;
+}
+</style>

src/views/hard/components/hard-door-log.vue

@@ -135,6 +135,7 @@
 <script setup lang="ts" name="hard-door-log">
 import * as hardFlowManager from "/@/api/hard/hard-door-flow"
 import { useMessage } from "/@/hooks/message"
+import { auth, auths, authAll } from '/@/utils/authFunction';
 
 type Props = {
 	orderId?: string
@@ -170,6 +171,10 @@ watch(
 
 const getFlow = async () => {
 	if (!props.orderId) return
+	// 判断是否有"dzc_hardDoorFlow_view"权限
+	if (!auth("dzc_hardDoorFlow_view")) {
+		return
+	}
 	loading.value = true
 	try {
 		const _pa = { orderId: props.orderId }

src/views/hard/hard-after-sale/order-refund.vue

@@ -134,7 +134,7 @@
 					<preview-image :src="globalData.afterSaleData.applyPicUrls" />
 				</el-descriptions-item>
 			</el-descriptions>
-			<hard-door-log :orderId="globalData.detail.id" />
+			<hard-door-log v-auth="'dzc_hardDoorFlow_view'" :orderId="globalData.detail.id" />
 		</div>
 
 		<refund-reject-form ref="refundRejectRef" @refresh="getDetail" />

src/views/hard/hard-appt/constants.ts

@@ -0,0 +1,43 @@
+export const RESERVE_MODE = {
+	TIME_WINDOW: "TIME_WINDOW",
+	WEEKLY_CYCLE: "WEEKLY_CYCLE",
+} as const
+
+export const RESERVE_MODE_OPTIONS = [
+	{ label: "动态时间窗", value: RESERVE_MODE.TIME_WINDOW },
+	{ label: "按周集中预约", value: RESERVE_MODE.WEEKLY_CYCLE },
+]
+
+export const WEEKDAY_OPTIONS = [
+	{ label: "周一", value: 1 },
+	{ label: "周二", value: 2 },
+	{ label: "周三", value: 3 },
+	{ label: "周四", value: 4 },
+	{ label: "周五", value: 5 },
+	{ label: "周六", value: 6 },
+	{ label: "周日", value: 7 },
+]
+
+export function normalizeReserveMode(value?: string) {
+	return value === RESERVE_MODE.WEEKLY_CYCLE ? RESERVE_MODE.WEEKLY_CYCLE : RESERVE_MODE.TIME_WINDOW
+}
+
+export function reserveModeLabel(value?: string) {
+	return normalizeReserveMode(value) === RESERVE_MODE.WEEKLY_CYCLE ? "按周集中预约" : "动态时间窗"
+}
+
+export function weekdayLabel(value?: number | string) {
+	return WEEKDAY_OPTIONS.find((item) => item.value === Number(value))?.label ?? "-"
+}
+
+export function formatTime(value?: string) {
+	return value ? value.slice(0, 5) : "-"
+}
+
+export function formatCycleWindow(rule: any) {
+	return `${weekdayLabel(rule?.openWeekday)} ${formatTime(rule?.openTime)} 至 ${weekdayLabel(rule?.closeWeekday)} ${formatTime(rule?.closeTime)}`
+}
+
+export function formatCycleTarget(rule: any) {
+	return `截止后第 ${rule?.targetStartOffsetDays ?? "-"} 天起，连续 ${rule?.targetDayCount ?? "-"} 天`
+}

src/views/hard/hard-appt/cycle-rule-form.vue

@@ -0,0 +1,319 @@
+<template>
+	<el-dialog v-model="visible" :title="form.id ? '编辑周期预约规则' : '新增周期预约规则'" width="860px" :close-on-click-modal="false"
+		top="5vh" draggable>
+		<el-scrollbar max-height="72vh">
+			<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="112px" v-loading="loading"
+				class="pr-4">
+				<el-row :gutter="20">
+					<el-col :span="12">
+						<el-form-item label="商户" prop="mchId">
+							<select-mch v-model="form.mchId" deptMch :disabled="Boolean(fixedMchId)"
+								:apiParams="{ types: '1', parentDeptId: currentDeptId }"
+								@update:model-value="handleMerchantChange" />
+						</el-form-item>
+					</el-col>
+					<el-col :span="12">
+						<el-form-item label="规则名称" prop="ruleName">
+							<el-input v-model="form.ruleName" maxlength="64" placeholder="请输入规则名称" />
+						</el-form-item>
+					</el-col>
+				</el-row>
+
+				<el-divider content-position="left">开放窗口</el-divider>
+				<el-row :gutter="20">
+					<el-col :span="12">
+						<el-form-item label="开放时间" prop="openTime">
+							<div class="flex w-full gap-2">
+								<el-select v-model="form.openWeekday" class="w-28" placeholder="星期">
+									<el-option v-for="item in WEEKDAY_OPTIONS" :key="item.value" :label="item.label"
+										:value="item.value" />
+								</el-select>
+								<el-time-picker v-model="form.openTime" class="flex-1" value-format="HH:mm"
+									format="HH:mm" placeholder="开放时刻" />
+							</div>
+						</el-form-item>
+					</el-col>
+					<el-col :span="12">
+						<el-form-item label="截止时间" prop="closeTime">
+							<div class="flex w-full gap-2">
+								<el-select v-model="form.closeWeekday" class="w-28" placeholder="星期">
+									<el-option v-for="item in WEEKDAY_OPTIONS" :key="item.value" :label="item.label"
+										:value="item.value" />
+								</el-select>
+								<el-time-picker v-model="form.closeTime" class="flex-1" value-format="HH:mm"
+									format="HH:mm" placeholder="截止时刻" />
+							</div>
+						</el-form-item>
+					</el-col>
+				</el-row>
+
+				<el-divider content-position="left">目标用餐日</el-divider>
+				<el-row :gutter="20">
+					<el-col :span="12">
+						<el-form-item label="起始日" prop="targetStartOffsetDays">
+							<div class="flex items-center gap-2">
+								<span class="whitespace-nowrap text-sm text-gray-500">截止后第</span>
+								<el-input-number v-model="form.targetStartOffsetDays" :min="1" :max="31"
+									controls-position="right" />
+								<span class="whitespace-nowrap text-sm text-gray-500">天</span>
+							</div>
+						</el-form-item>
+					</el-col>
+					<el-col :span="12">
+						<el-form-item label="连续天数" prop="targetDayCount">
+							<el-input-number v-model="form.targetDayCount" :min="1" :max="31" controls-position="right"
+								@change="syncDayConfigs" />
+						</el-form-item>
+					</el-col>
+				</el-row>
+				<el-alert v-if="batchPreview" :closable="false" type="info" show-icon class="mb-4"
+					:title="batchPreview" />
+
+				<div class="mb-3 flex items-center justify-between">
+					<span class="text-sm font-medium text-gray-700">逐日餐段</span>
+					<div class="flex gap-2">
+						<el-button icon="DocumentCopy" @click="copyFirstDay">复制首日</el-button>
+						<el-button icon="Delete" @click="clearAllDays">清空</el-button>
+					</div>
+				</div>
+				<el-table :data="form.dayConfigs" border row-key="targetDayOffset" max-height="360">
+					<el-table-column type="index" label="#" width="52" align="center" />
+					<el-table-column label="目标日期" width="245">
+						<template #default="{ row }">
+							<div class="flex flex-col leading-5">
+								<span>截止后第 {{ Number(form.targetStartOffsetDays) + row.targetDayOffset }} 天</span>
+								<span class="text-xs text-gray-500">{{ previewDate(row.targetDayOffset) }}</span>
+							</div>
+						</template>
+					</el-table-column>
+					<el-table-column label="可预约餐段" min-width="430">
+						<template #default="{ row }">
+							<el-select v-model="row.hourTypes" multiple filterable collapse-tags collapse-tags-tooltip
+								class="w-full" placeholder="选择该日可预约餐段">
+								<el-option v-for="item in daily_menu" :key="item.value" :label="item.label"
+									:value="item.value" />
+							</el-select>
+						</template>
+					</el-table-column>
+				</el-table>
+
+				<el-divider content-position="left">其他设置</el-divider>
+				<el-row :gutter="20">
+					<el-col :span="12">
+						<el-form-item label="是否启用" prop="status">
+							<el-radio-group v-model="form.status">
+								<el-radio v-for="item in yes_no_type" :key="item.value" :label="item.value" border>
+									{{ item.label }}
+								</el-radio>
+							</el-radio-group>
+						</el-form-item>
+					</el-col>
+					<el-col :span="12">
+						<el-form-item label="排序" prop="sort">
+							<el-input-number v-model="form.sort" :min="0" :max="9999" controls-position="right" />
+						</el-form-item>
+					</el-col>
+					<el-col :span="24">
+						<el-form-item label="备注" prop="remark">
+							<el-input v-model="form.remark" type="textarea" :autosize="{ minRows: 3, maxRows: 6 }"
+								maxlength="256" show-word-limit placeholder="请输入备注" />
+						</el-form-item>
+					</el-col>
+				</el-row>
+			</el-form>
+		</el-scrollbar>
+		<template #footer>
+			<el-button @click="visible = false">取消</el-button>
+			<el-button type="primary" :loading="loading" @click="onSubmit">确认</el-button>
+		</template>
+	</el-dialog>
+</template>
+
+<script setup lang="ts" name="HardApptCycleRuleForm">
+import dayjs from "dayjs"
+import { useDict } from "/@/hooks/dict"
+import { useMessage } from "/@/hooks/message"
+import * as cycleRuleApi from "/@/api/hard/hard-appt-cycle-rule"
+import { WEEKDAY_OPTIONS, weekdayLabel } from "./constants"
+
+interface DayConfig {
+	targetDayOffset: number
+	hourTypes: string[]
+}
+
+const emit = defineEmits(["refresh"])
+const { yes_no_type, daily_menu } = useDict("yes_no_type", "daily_menu")
+const visible = ref(false)
+const loading = ref(false)
+const dataFormRef = ref()
+const fixedMchId = ref<string | number | null>(null)
+const currentDeptId = ref<string | number | null>(null)
+
+const createDefaultForm = () => ({
+	id: "",
+	ruleName: "",
+	mchId: "" as string | number,
+	openWeekday: 5,
+	openTime: "17:00",
+	closeWeekday: 7,
+	closeTime: "22:00",
+	targetStartOffsetDays: 2,
+	targetDayCount: 7,
+	status: "1",
+	sort: 0,
+	remark: "",
+	dayConfigs: [] as DayConfig[],
+})
+
+const form = reactive(createDefaultForm())
+
+const validateCloseTime = (_rule: any, _value: string, callback: (error?: Error) => void) => {
+	if (!form.closeWeekday || !form.closeTime) return callback(new Error("截止时间不能为空"))
+	if (Number(form.openWeekday) === Number(form.closeWeekday) && form.closeTime <= form.openTime) {
+		return callback(new Error("同一天的截止时间必须晚于开放时间"))
+	}
+	callback()
+}
+
+const dataRules = {
+	mchId: [{ required: true, message: "商户不能为空", trigger: "change" }],
+	ruleName: [{ required: true, message: "规则名称不能为空", trigger: "blur" }],
+	openTime: [{ required: true, message: "开放时间不能为空", trigger: "change" }],
+	closeTime: [{ validator: validateCloseTime, trigger: "change" }],
+	targetStartOffsetDays: [{ required: true, message: "起始日不能为空", trigger: "change" }],
+	targetDayCount: [{ required: true, message: "连续天数不能为空", trigger: "change" }],
+	status: [{ required: true, message: "状态不能为空", trigger: "change" }],
+}
+
+const normalizeTime = (value?: string) => (value ? value.slice(0, 5) : "")
+
+const syncDayConfigs = () => {
+	const count = Math.max(1, Math.min(31, Number(form.targetDayCount) || 1))
+	const existing = new Map(form.dayConfigs.map((item) => [item.targetDayOffset, item]))
+	form.dayConfigs = Array.from({ length: count }, (_, targetDayOffset) =>
+		existing.get(targetDayOffset) ?? { targetDayOffset, hourTypes: [] },
+	)
+}
+
+const handleMerchantChange = () => {
+	form.dayConfigs.forEach((item) => (item.hourTypes = []))
+}
+
+const copyFirstDay = () => {
+	const first = form.dayConfigs[0]?.hourTypes ?? []
+	form.dayConfigs.forEach((item) => (item.hourTypes = [...first]))
+}
+
+const clearAllDays = () => {
+	form.dayConfigs.forEach((item) => (item.hourTypes = []))
+}
+
+function atTime(date: dayjs.Dayjs, value: string) {
+	const [hour, minute] = normalizeTime(value).split(":").map(Number)
+	return date.hour(hour || 0).minute(minute || 0).second(0).millisecond(0)
+}
+
+function windowForMonday(monday: dayjs.Dayjs) {
+	const open = atTime(monday.add(Number(form.openWeekday) - 1, "day"), form.openTime)
+	const closeDayOffset = Number(form.closeWeekday) - 1 + (Number(form.closeWeekday) < Number(form.openWeekday) ? 7 : 0)
+	const close = atTime(monday.add(closeDayOffset, "day"), form.closeTime)
+	return { open, close }
+}
+
+const previewBatch = computed(() => {
+	if (!form.openWeekday || !form.closeWeekday || !form.openTime || !form.closeTime) return null
+	const now = dayjs()
+	const isoWeekday = now.day() || 7
+	const monday = now.startOf("day").subtract(isoWeekday - 1, "day")
+	const previous = windowForMonday(monday.subtract(1, "week"))
+	const current = windowForMonday(monday)
+	const contains = (window: any) => now.valueOf() >= window.open.valueOf() && now.valueOf() <= window.close.valueOf()
+	if (contains(previous)) return previous
+	if (contains(current) || now.isBefore(current.open)) return current
+	return windowForMonday(monday.add(1, "week"))
+})
+
+const targetPreviewStart = computed(() =>
+	previewBatch.value?.close.startOf("day").add(Number(form.targetStartOffsetDays) || 1, "day"),
+)
+
+const batchPreview = computed(() => {
+	const batch = previewBatch.value
+	const targetStart = targetPreviewStart.value
+	if (!batch || !targetStart) return ""
+	const targetEnd = targetStart.add(Math.max(1, Number(form.targetDayCount) || 1) - 1, "day")
+	return `${batch.open.format("M月D日")} ${weekdayLabel(batch.open.day() || 7)} ${batch.open.format("HH:mm")} 至 ${batch.close.format("M月D日")} ${weekdayLabel(batch.close.day() || 7)} ${batch.close.format("HH:mm")} 开放；可预约 ${targetStart.format("M月D日")} 至 ${targetEnd.format("M月D日")}`
+})
+
+const previewDate = (targetDayOffset: number) => {
+	const date = targetPreviewStart.value?.add(targetDayOffset, "day")
+	return date ? `${date.format("YYYY-MM-DD")} ${weekdayLabel(date.day() || 7)}` : "-"
+}
+
+const openDialog = async (id?: string | number | null, mchId?: string | number | null,
+	deptId?: string | number | null) => {
+	visible.value = true
+	fixedMchId.value = mchId ?? null
+	currentDeptId.value = deptId ?? null
+	Object.assign(form, createDefaultForm(), { mchId: mchId ?? "" })
+	syncDayConfigs()
+	nextTick(() => dataFormRef.value?.clearValidate())
+
+	try {
+		loading.value = true
+		if (id) {
+			const { data } = await cycleRuleApi.getObj(String(id))
+			Object.assign(form, createDefaultForm(), data, {
+				openTime: normalizeTime(data.openTime),
+				closeTime: normalizeTime(data.closeTime),
+				dayConfigs: [],
+			})
+			fixedMchId.value = mchId ?? data.mchId ?? null
+			syncDayConfigs()
+			const grouped = new Map<number, string[]>()
+			for (const item of data.itemList ?? []) {
+				const values = grouped.get(Number(item.targetDayOffset)) ?? []
+				values.push(String(item.hourType))
+				grouped.set(Number(item.targetDayOffset), values)
+			}
+			form.dayConfigs.forEach((item) => (item.hourTypes = grouped.get(item.targetDayOffset) ?? []))
+		}
+	} catch (error: any) {
+		useMessage().error(error?.msg || "获取周期规则失败")
+	} finally {
+		loading.value = false
+	}
+}
+
+const onSubmit = async () => {
+	const valid = await dataFormRef.value?.validate().catch(() => false)
+	if (!valid) return
+	const itemList = form.dayConfigs.flatMap((day) =>
+		day.hourTypes.map((hourType) => ({ targetDayOffset: day.targetDayOffset, hourType })),
+	)
+	if (!itemList.length) {
+		useMessage().warning("至少需要配置一个目标日餐段")
+		return
+	}
+	try {
+		loading.value = true
+		const payload = {
+			...form,
+			openTime: `${normalizeTime(form.openTime)}:00`,
+			closeTime: `${normalizeTime(form.closeTime)}:00`,
+			itemList,
+			dayConfigs: undefined,
+		}
+		form.id ? await cycleRuleApi.putObj(payload) : await cycleRuleApi.addObj(payload)
+		useMessage().success(form.id ? "修改成功" : "添加成功")
+		visible.value = false
+		emit("refresh")
+	} catch (error: any) {
+		useMessage().error(error?.msg || "保存周期规则失败")
+	} finally {
+		loading.value = false
+	}
+}
+
+defineExpose({ openDialog })
+</script>

src/views/hard/hard-appt/cycle-rule-list.vue

@@ -0,0 +1,123 @@
+<template>
+	<div class="min-w-0">
+		<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList">
+			<el-form-item v-if="!props.mchId" label="商户" prop="mchId">
+				<select-mch v-model="state.queryForm.mchId" deptMch :apiParams="{ types: '1' }" />
+			</el-form-item>
+			<el-form-item label="规则名称" prop="ruleName">
+				<el-input v-model="state.queryForm.ruleName" clearable placeholder="请输入规则名称" />
+			</el-form-item>
+			<el-form-item>
+				<el-button icon="Search" type="primary" @click="getDataList">查询</el-button>
+				<el-button icon="Refresh" @click="resetQuery">重置</el-button>
+			</el-form-item>
+		</el-form>
+
+		<div class="mb-3 flex w-full items-center">
+			<el-button icon="FolderAdd" type="primary" @click="formRef.openDialog(null, props.mchId, props.deptId)"
+				v-auth="'hard_hardAppt_add'">新增</el-button>
+			<el-button icon="Delete" plain type="primary" :disabled="!selectedIds.length"
+				@click="handleDelete(selectedIds)" v-auth="'hard_hardAppt_del'">删除</el-button>
+			<right-toolbar class="ml-auto" @queryTable="getDataList" />
+		</div>
+
+		<el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
+			:header-cell-style="tableStyle.headerCellStyle" @selection-change="handleSelectionChange">
+			<el-table-column type="selection" width="42" align="center" />
+			<el-table-column type="index" label="#" width="48" />
+			<el-table-column v-if="!props.mchId" prop="merchantName" label="商户" min-width="150"
+				show-overflow-tooltip />
+			<el-table-column prop="ruleName" label="规则名称" min-width="150" show-overflow-tooltip />
+			<el-table-column label="开放窗口" min-width="220">
+				<template #default="{ row }">{{ formatCycleWindow(row) }}</template>
+			</el-table-column>
+			<el-table-column label="目标用餐日" min-width="190">
+				<template #default="{ row }">{{ formatCycleTarget(row) }}</template>
+			</el-table-column>
+			<el-table-column label="配置餐段" width="110" align="center">
+				<template #default="{ row }">{{ row.apptCount ?? 0 }} 个</template>
+			</el-table-column>
+			<el-table-column prop="status" label="状态" width="90" align="center">
+				<template #default="{ row }"><dict-tag :options="yes_no_type" :value="row.status" /></template>
+			</el-table-column>
+			<el-table-column prop="remark" label="备注" min-width="140" show-overflow-tooltip />
+			<el-table-column label="操作" width="150" fixed="right">
+				<template #default="{ row }">
+					<el-button icon="EditPen" text type="primary" v-auth="'hard_hardAppt_edit'"
+						@click="formRef.openDialog(row.id, props.mchId, props.deptId)">编辑</el-button>
+					<el-button icon="Delete" text type="primary" v-auth="'hard_hardAppt_del'"
+						@click="handleDelete([row.id])">删除</el-button>
+				</template>
+			</el-table-column>
+		</el-table>
+		<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+
+		<cycle-rule-form ref="formRef" @refresh="getDataList(false)" />
+	</div>
+</template>
+
+<script setup lang="ts" name="HardApptCycleRuleList">
+import { BasicTableProps, useTable } from "/@/hooks/table"
+import { useDict } from "/@/hooks/dict"
+import { useMessage, useMessageBox } from "/@/hooks/message"
+import * as cycleRuleApi from "/@/api/hard/hard-appt-cycle-rule"
+import { formatCycleTarget, formatCycleWindow } from "./constants"
+
+const props = defineProps<{
+	mchId?: string | number | null
+	deptId?: string | number | null
+}>()
+
+const CycleRuleForm = defineAsyncComponent(() => import("./cycle-rule-form.vue"))
+const { yes_no_type } = useDict("yes_no_type")
+const queryRef = ref()
+const formRef = ref()
+const selectedIds = ref<Array<string | number>>([])
+
+const state: BasicTableProps = reactive<BasicTableProps>({
+	queryForm: {
+		ruleName: "",
+		mchId: props.mchId ?? undefined,
+	},
+	pageList: cycleRuleApi.fetchList,
+})
+
+const { getDataList, currentChangeHandle, sizeChangeHandle, tableStyle } = useTable(state)
+
+watch(
+	() => props.mchId,
+	(value, oldValue) => {
+		state.queryForm.mchId = value ?? undefined
+		if (value !== oldValue) getDataList()
+	},
+)
+
+const resetQuery = () => {
+	queryRef.value?.resetFields()
+	state.queryForm.mchId = props.mchId ?? undefined
+	selectedIds.value = []
+	getDataList()
+}
+
+const handleSelectionChange = (rows: any[]) => {
+	selectedIds.value = rows.map((row) => row.id)
+}
+
+const handleDelete = async (ids: Array<string | number>) => {
+	try {
+		await useMessageBox().confirm("此操作将删除周期预约规则")
+	} catch {
+		return
+	}
+	try {
+		await cycleRuleApi.delObjs(ids)
+		selectedIds.value = []
+		getDataList()
+		useMessage().success("删除成功")
+	} catch (error: any) {
+		useMessage().error(error?.msg || "删除失败")
+	}
+}
+
+defineExpose({ refresh: getDataList })
+</script>

src/views/hard/hard-appt/form.vue

@@ -20,30 +20,37 @@
 					</el-form-item>
 				</el-col>
 				<el-col :span="24" class="mb20">
-					<el-form-item label="开始时间" prop="startTime">
-						<div class="flex gap-2 w-full">
-							<dict-select style="width: 100px" v-model="form.startTimeType"
-								dict-code="hard_appt_time_type" />
-							<el-time-picker v-model="form.startTime" class="flex-1" value-format="HH:mm" format="HH:mm"
-								:disabled="!form.startTimeType" placeholder="开始时间" />
-						</div>
-					</el-form-item>
-				</el-col>
-				<el-col :span="24" class="mb20">
-					<el-form-item label="结束时间" prop="endTime">
-						<div class="flex gap-2 w-full">
-							<dict-select style="width: 100px" v-model="form.endTimeType"
-								dict-code="hard_appt_time_type" />
-							<el-time-picker v-model="form.endTime" class="flex-1" value-format="HH:mm" format="HH:mm"
-								:disabled="!form.endTimeType" placeholder="结束时间" />
-						</div>
-					</el-form-item>
-				</el-col>
-				<el-col :span="24" class="mb20">
-					<el-form-item label="可预约时间" prop="reserveTimeList">
-						<dict-select multiple v-model="form.reserveTimeList" dict-code="hard_appt_reserve_date_type" />
+					<el-form-item label="预约模式">
+						<el-tag type="info">动态时间窗</el-tag>
 					</el-form-item>
 				</el-col>
+				<template v-if="form.reserveMode === RESERVE_MODE.TIME_WINDOW">
+					<el-col :span="24" class="mb20">
+						<el-form-item label="开始时间" prop="startTime">
+							<div class="flex gap-2 w-full">
+								<dict-select style="width: 100px" v-model="form.startTimeType"
+									dict-code="hard_appt_time_type" />
+								<el-time-picker v-model="form.startTime" class="flex-1" value-format="HH:mm" format="HH:mm"
+									:disabled="!form.startTimeType" placeholder="开始时间" />
+							</div>
+						</el-form-item>
+					</el-col>
+					<el-col :span="24" class="mb20">
+						<el-form-item label="结束时间" prop="endTime">
+							<div class="flex gap-2 w-full">
+								<dict-select style="width: 100px" v-model="form.endTimeType"
+									dict-code="hard_appt_time_type" />
+								<el-time-picker v-model="form.endTime" class="flex-1" value-format="HH:mm" format="HH:mm"
+									:disabled="!form.endTimeType" placeholder="结束时间" />
+							</div>
+						</el-form-item>
+					</el-col>
+					<el-col :span="24" class="mb20">
+						<el-form-item label="可预约时间" prop="reserveTimeList">
+							<dict-select multiple v-model="form.reserveTimeList" dict-code="hard_appt_reserve_date_type" />
+						</el-form-item>
+					</el-col>
+				</template>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="是否启用" prop="status">
 						<el-radio-group v-model="form.status">
@@ -74,6 +81,7 @@
 import { useDict } from "/@/hooks/dict"
 import { useMessage } from "/@/hooks/message"
 import * as hardApptApi from "/@/api/hard/hard-appt"
+import { RESERVE_MODE } from "./constants"
 const emit = defineEmits(["refresh"])
 
 // 定义变量内容
@@ -85,24 +93,23 @@ const { yes_no_type } = useDict("yes_no_type")
 // 提交表单数据
 const currentDeptId = ref()
 
-const defaultForm = {
+const createDefaultForm = () => ({
 	id: "",
-	mchId: '',
+	mchId: "",
 	title: "",
 	hourType: "",
+	reserveMode: RESERVE_MODE.TIME_WINDOW as string,
 	startTimeType: "2",
 	endTimeType: "2",
 	startTime: "",
 	endTime: "",
 	status: "1",
 	remark: "",
-	reserveTimeList: ['2'],
-}
-
-const form = reactive({
-	...defaultForm
+	reserveTimeList: ["2"],
 })
 
+const form = reactive(createDefaultForm())
+
 function toHHmm(value?: string) {
 	const raw = (value ?? "").trim()
 	if (!raw) return ""
@@ -132,47 +139,57 @@ function toHHmmss(value?: string) {
 }
 
 function toTotalMinutes(type: any, time: any) {
-	const offset = Number(type)
-	const base = Number.isFinite(offset) ? offset * 24 * 60 : 0
+	const dayOffset: Record<string, number> = { "1": -1, "2": 0, "3": 1, "4": 2 }
+	const base = (dayOffset[String(type)] ?? 0) * 24 * 60
 	const hhmm = toHHmm(time)
 	if (!hhmm) return base
 	const [h, m] = hhmm.split(":").map((v) => Number(v))
 	return base + h * 60 + m
 }
 
+const requiredForTimeWindow = (message: string) =>
+	(_rule: any, value: any, callback: (error?: Error) => void) => {
+		if (form.reserveMode !== RESERVE_MODE.TIME_WINDOW || (Array.isArray(value) ? value.length : value)) {
+			return callback()
+		}
+		callback(new Error(message))
+	}
+
+const validateStartTime = (_rule: any, _value: string, callback: (error?: Error) => void) => {
+	if (form.reserveMode !== RESERVE_MODE.TIME_WINDOW) return callback()
+	if (!form.startTimeType) return callback(new Error("开始时间类型不能为空"))
+	if (!form.startTime) return callback(new Error("开始时间不能为空"))
+	callback()
+}
+
+const validateEndTime = (_rule: any, _value: string, callback: (error?: Error) => void) => {
+	if (form.reserveMode !== RESERVE_MODE.TIME_WINDOW) return callback()
+	if (!form.endTimeType) return callback(new Error("结束时间类型不能为空"))
+	if (!form.endTime) return callback(new Error("结束时间不能为空"))
+	if (toTotalMinutes(form.startTimeType, form.startTime) >= toTotalMinutes(form.endTimeType, form.endTime)) {
+		return callback(new Error("结束时间必须大于开始时间"))
+	}
+	callback()
+}
+
 // 定义校验规则
-const dataRules = ref({
+const dataRules = {
 	mchId: [{ required: true, message: "商户不能为空", trigger: "change" }],
 	title: [{ required: true, message: "标题不能为空", trigger: "blur" }],
 	hourType: [{ required: true, message: "类型不能为空", trigger: "blur" }],
-	startApptTimeType: [{ required: true, message: "开始时间类型不能为空", trigger: "change" }],
-	startTime: [{ required: true, message: "开始时间不能为空", trigger: "change" }],
-	endApptTimeType: [{ required: true, message: "结束时间类型不能为空", trigger: "change" }],
-	reserveTimeList: [{ required: true, message: "可预约时间不能为空", trigger: "change" }],
-	endTime: [
-		{ required: true, message: "结束时间不能为空", trigger: "change" },
-		{
-			validator: (_rule: any, _value: string, callback: (error?: Error) => void) => {
-				if (!form.startTime || !form.endTime) return callback()
-				if (toTotalMinutes(form.startTimeType, form.startTime) >= toTotalMinutes(form.endTimeType, form.endTime)) {
-					return callback(new Error("结束时间必须大于开始时间"))
-				}
-				callback()
-			},
-			trigger: "change",
-		},
-	],
+	startTime: [{ validator: validateStartTime, trigger: "change" }],
+	reserveTimeList: [{ validator: requiredForTimeWindow("可预约时间不能为空"), trigger: "change" }],
+	endTime: [{ validator: validateEndTime, trigger: "change" }],
 	status: [{ required: true, message: "是否启用不能为空", trigger: "change" }],
-})
+}
 
 // 打开弹窗
-const openDialog = (id: string, deptId: string) => {
+const openDialog = (id?: string | null, deptId?: string | number) => {
 	visible.value = true
 	currentDeptId.value = deptId
-	form.id = ""
-	// 重置表单数据
+	Object.assign(form, createDefaultForm())
 	nextTick(() => {
-		dataFormRef.value?.resetFields()
+		dataFormRef.value?.clearValidate()
 	})
 	// 获取hardAppt信息
 	if (id) {
@@ -189,8 +206,9 @@ const onSubmit = async () => {
 		loading.value = true
 		const _pa = {
 			...form,
-			startTime: toHHmmss(form.startTime),
-			endTime: toHHmmss(form.endTime),
+			startTime: form.reserveMode === RESERVE_MODE.TIME_WINDOW ? toHHmmss(form.startTime) : undefined,
+			endTime: form.reserveMode === RESERVE_MODE.TIME_WINDOW ? toHHmmss(form.endTime) : undefined,
+			reserveTimeList: form.reserveMode === RESERVE_MODE.TIME_WINDOW ? form.reserveTimeList : [],
 		}
 		form.id ? await hardApptApi.putObj(_pa) : await hardApptApi.addObj(_pa)
 		useMessage().success(form.id ? "修改成功" : "添加成功")
@@ -209,11 +227,10 @@ const gethardApptData = async (id: string) => {
 	loading.value = true
 	try {
 		const { data } = await hardApptApi.getObj(id)
-		Object.assign(form, data, {
+		Object.assign(form, createDefaultForm(), data, {
+			reserveMode: RESERVE_MODE.TIME_WINDOW,
 			startTime: toHHmm(data.startTime),
 			endTime: toHHmm(data.endTime),
-			startApptTimeType: form.startTimeType,
-			endApptTimeType: form.endTimeType,
 		})
 	} catch (error) {
 		console.error(error)

src/views/hard/hard-appt/index.vue

@@ -1,6 +1,8 @@
 <template>
 	<div class="layout-padding">
 		<div class="layout-padding-auto layout-padding-view">
+			<el-tabs v-model="activeTab">
+				<el-tab-pane label="餐段规则" name="segments">
 			<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList">
 				<el-row>
 					<el-form-item style="width: 300px" label="标题" prop="title">
@@ -39,11 +41,24 @@
 						<dict-tag :options="daily_menu" :value="row.hourType" />
 					</template>
 				</el-table-column>
+				<el-table-column label="预约模式" width="130">
+					<template #default="{ row }">
+						<el-tag :type="normalizeReserveMode(row.reserveMode) === RESERVE_MODE.WEEKLY_CYCLE ? 'warning' : 'info'"
+							effect="plain">
+							{{ reserveModeLabel(row.reserveMode) }}
+						</el-tag>
+					</template>
+				</el-table-column>
 				<el-table-column label="预约时间">
 					<template #default="{ row }">
-						<span> {{ row.startTime }}</span>
-						<span>-</span>
-						<span> {{ row.endTime }}</span>
+						<span v-if="normalizeReserveMode(row.reserveMode) === RESERVE_MODE.WEEKLY_CYCLE">
+							由周期预约规则配置
+						</span>
+						<template v-else>
+							<span>{{ row.startTime }}</span>
+							<span> - </span>
+							<span>{{ row.endTime }}</span>
+						</template>
 					</template>
 				</el-table-column>
 				<el-table-column prop="status" label="状态">
@@ -63,6 +78,11 @@
 			</el-table>
 			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
 				v-bind="state.pagination" />
+				</el-tab-pane>
+				<el-tab-pane label="周期预约规则" name="cycles" lazy>
+					<cycle-rule-list />
+				</el-tab-pane>
+			</el-tabs>
 		</div>
 
 		<!-- 编辑、新增  -->
@@ -75,13 +95,20 @@ import { BasicTableProps, useTable } from "/@/hooks/table"
 import * as hardApptApi from "/@/api/hard/hard-appt"
 import { useMessage, useMessageBox } from "/@/hooks/message"
 import { useDict } from "/@/hooks/dict"
+import {
+	RESERVE_MODE,
+	normalizeReserveMode,
+	reserveModeLabel,
+} from "./constants"
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import("./form.vue"))
+const CycleRuleList = defineAsyncComponent(() => import("./cycle-rule-list.vue"))
 // 定义查询字典
 const { yes_no_type, daily_menu } = useDict("yes_no_type", "daily_menu")
 // 定义变量内容
 const formDialogRef = ref()
+const activeTab = ref("segments")
 // 搜索变量
 const queryRef = ref()
 const showSearch = ref(true)

src/views/integrated/meeting/booking/form.vue

@@ -1,90 +1,68 @@
 <template>
-    <el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible"
-      :close-on-click-modal="false" draggable>
-      <el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
-       <el-row :gutter="24">
-    <el-col :span="12" class="mb20">
-      <el-form-item label="会议主题" prop="title">
-        <el-input v-model="form.title" placeholder="请输入会议主题"/>
-      </el-form-item>
-      </el-col>
+  <el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
+    <el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
+      <el-row :gutter="24">
+        <el-col :span="12" class="mb20">
+          <el-form-item label="会议主题" prop="title">
+            <el-input v-model="form.title" placeholder="请输入会议主题" />
+          </el-form-item>
+        </el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="会议室" prop="roomId">
-        <el-select v-model="form.roomId" placeholder="请选择会议室" style="width: 100%;">
-          <el-option v-for="room in roomList" :key="room.id" :label="room.name" :value="room.id" />
-        </el-select>
-      </el-form-item>
-      </el-col>
+        <el-col :span="12" class="mb20">
+          <el-form-item label="会议室" prop="roomId">
+            <el-select v-model="form.roomId" placeholder="请选择会议室" style="width: 100%;">
+              <el-option v-for="room in roomList" :key="room.id" :label="room.name" :value="room.id" />
+            </el-select>
+          </el-form-item>
+        </el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="会议说明" prop="description">
-        <el-input v-model="form.description" placeholder="请输入会议说明"/>
-      </el-form-item>
-      </el-col>
+        <el-col :span="12" class="mb20">
+          <el-form-item label="会议说明" prop="description">
+            <el-input v-model="form.description" placeholder="请输入会议说明" />
+          </el-form-item>
+        </el-col>
 
-<!--    <el-col :span="12" class="mb20">-->
-<!--      <el-form-item label="申请人id" prop="applicantId">-->
-<!--        <el-input v-model="form.applicantId" placeholder="请选择申请人"/>-->
-<!--      </el-form-item>-->
-<!--      </el-col>-->
+        <!--    <el-col :span="12" class="mb20">-->
+        <!--      <el-form-item label="申请人id" prop="applicantId">-->
+        <!--        <el-input v-model="form.applicantId" placeholder="请选择申请人"/>-->
+        <!--      </el-form-item>-->
+        <!--      </el-col>-->
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="会议负责人" prop="assigneeId">
-        <el-input v-model="form.assigneeName" placeholder="请输入会议负责人"/>
-      </el-form-item>
-      </el-col>
+        <el-col :span="12" class="mb20">
+          <el-form-item label="会议负责人" prop="assigneeId">
+            <el-input v-model="form.assigneeName" placeholder="请输入会议负责人" />
+          </el-form-item>
+        </el-col>
 
-    <!-- 会议日期+开始/结束时间同一行 -->
-    <el-row :gutter="24" class="mb20">
-      <el-col :span="8">
-        <el-form-item label="会议日期" prop="bookingDate">
-          <el-date-picker
-            v-model="form.bookingDate"
-            type="date"
-            value-format="YYYY-MM-DD"
-            placeholder="请选择会议日期"
-            style="width: 100%;"
-            :readonly="true"
-            :disabled="true"
-          />
-        </el-form-item>
-      </el-col>
-      <el-col :span="8">
-        <el-form-item label="开始时间" prop="startTime">
-          <el-time-select
-            v-model="form.startTime"
-            :picker-options="{
-              start: '08:00',
-              end: '18:00',
-              step: '00:30'
-            }"
-            placeholder="请选择开始时间"
-            style="width: 100%;"
-            :readonly="true"
-            :disabled="true"
-          />
-        </el-form-item>
-      </el-col>
-      <el-col :span="8">
-        <el-form-item label="结束时间" prop="endTime">
-          <el-time-select
-            v-model="form.endTime"
-            :picker-options="{
-              start: '08:00',
-              end: '18:00',
-              step: '00:30'
-            }"
-            placeholder="请选择结束时间"
-            style="width: 100%;"
-            :readonly="true"
-            :disabled="true"
-          />
-        </el-form-item>
-      </el-col>
-    </el-row>
+        <!-- 会议日期+开始/结束时间同一行 -->
+        <el-row :gutter="24" class="mb20">
+          <el-col :span="8">
+            <el-form-item label="会议日期" prop="bookingDate">
+              <el-date-picker v-model="form.bookingDate" type="date" value-format="YYYY-MM-DD" placeholder="请选择会议日期"
+                style="width: 100%;" :readonly="true" :disabled="true" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="开始时间" prop="startTime">
+              <el-time-select v-model="form.startTime" :picker-options="{
+                start: '08:00',
+                end: '18:00',
+                step: '00:30'
+              }" placeholder="请选择开始时间" style="width: 100%;" :readonly="true" :disabled="true" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item label="结束时间" prop="endTime">
+              <el-time-select v-model="form.endTime" :picker-options="{
+                start: '08:00',
+                end: '18:00',
+                step: '00:30'
+              }" placeholder="请选择结束时间" style="width: 100%;" :readonly="true" :disabled="true" />
+            </el-form-item>
+          </el-col>
+        </el-row>
 
-			</el-row>
+      </el-row>
       <!-- 新增：会议时间段预约列表，带日期tab -->
       <div v-if="form.roomId" style="margin: 20px 0;">
         <div style="font-weight: bold; margin-bottom: 8px;">可预约时间段</div>
@@ -103,10 +81,8 @@
                   <template v-else>
                     <el-button
                       :type="selectedSlots.includes(slot.startTime + '-' + slot.endTime) ? 'success' : 'primary'"
-                      :plain="!selectedSlots.includes(slot.startTime + '-' + slot.endTime)"
-                      size="small"
-                      @click="toggleSlot(slot)"
-                    >
+                      :plain="!selectedSlots.includes(slot.startTime + '-' + slot.endTime)" size="small"
+                      @click="toggleSlot(slot)">
                       {{ selectedSlots.includes(slot.startTime + '-' + slot.endTime) ? '已选中' : '可预约' }}
                     </el-button>
                   </template>
@@ -120,14 +96,14 @@
         </el-tabs>
       </div>
       <div v-else style="margin: 20px 0; color: #f56c6c;">请先选择会议室</div>
-      </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>
+    </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="MeetingBookingDialog">
@@ -148,34 +124,34 @@ const visible = ref(false)
 const loading = ref(false)
 const timeSlots = ref<any[]>([])
 const activeDate = ref(dayjs().format('YYYY-MM-DD'))
-const dateTabs = ref<{label: string, value: string}[]>([])
-const roomList = ref<{id: string, name: string}[]>([])
+const dateTabs = ref<{ label: string, value: string }[]>([])
+const roomList = ref<{ id: string, name: string }[]>([])
 const selectedSlots = ref<string[]>([])
 
 // 定义字典
 
 // 提交表单数据
 const form = reactive({
-		id:'',
-	  title: '',
-	  roomId: '',
-	  description: '',
-	  meetingStatus: '',
-	  deptId: '',
-	  applicantId: '',
-	  assigneeName: '',
-	  startTime: '',
-	  endTime: '',
-  bookingDate:''
+  id: '',
+  title: '',
+  roomId: '',
+  description: '',
+  meetingStatus: '',
+  deptId: '',
+  applicantId: '',
+  assigneeName: '',
+  startTime: '',
+  endTime: '',
+  bookingDate: ''
 });
 
 // 定义校验规则
 const dataRules = ref({
-        title: [{required: true, message: '会议主题不能为空', trigger: 'blur'}],
-        roomId: [{required: true, message: '会议室id不能为空', trigger: 'blur'}],
-        bookingDate: [{required: true, message: '会议日期不能为空', trigger: 'change'}],
-        startTime: [{required: true, message: '开始时间不能为空', trigger: 'change'}],
-        endTime: [{required: true, message: '结束时间不能为空', trigger: 'change'}],
+  title: [{ required: true, message: '会议主题不能为空', trigger: 'blur' }],
+  roomId: [{ required: true, message: '会议室id不能为空', trigger: 'blur' }],
+  bookingDate: [{ required: true, message: '会议日期不能为空', trigger: 'change' }],
+  startTime: [{ required: true, message: '开始时间不能为空', trigger: 'change' }],
+  endTime: [{ required: true, message: '结束时间不能为空', trigger: 'change' }],
 })
 
 // 打开弹窗
@@ -194,18 +170,18 @@ const openDialog = async (id: string) => {
 
 // 提交
 const onSubmit = async () => {
-	const valid = await dataFormRef.value.validate().catch(() => {});
-	if (!valid) return false;
+  const valid = await dataFormRef.value.validate().catch(() => { });
+  if (!valid) return false;
 
-	try {
+  try {
     loading.value = true;
-		form.id ? await putObj(form) : await addObj(form);
-		useMessage().success(form.id ? '修改成功' : '添加成功');
-		visible.value = false;
-		emit('refresh');
-	} catch (err: any) {
-		useMessage().error(err.msg);
-	} finally {
+    form.id ? await putObj(form) : await addObj(form);
+    useMessage().success(form.id ? '修改成功' : '添加成功');
+    visible.value = false;
+    emit('refresh');
+  } catch (err: any) {
+    useMessage().error(err.msg);
+  } finally {
     loading.value = false;
   }
 };

src/views/mch/mch-manage/components/table-reservation-conf-form.vue

@@ -8,6 +8,11 @@
                             inactive-text="否" />
                     </el-form-item>
                 </el-col>
+                <el-col :span="24" class="mb20">
+                    <el-form-item label="代订餐用户关系" prop="userRelationTypeIdList">
+                        <select-user-relation-type v-model="form.userRelationTypeIdList" multiple />
+                    </el-form-item>
+                </el-col>
             </el-row>
         </el-form>
         <template #footer>
@@ -37,6 +42,7 @@ const form = reactive({
     id: "",
     tableReservationConf: createDefaultTableReservationConf(),
     singleProductOnlyInCart: false,
+    userRelationTypeIdList: [],
 })
 
 // 打开弹框并回填当前定餐配置
@@ -71,6 +77,7 @@ const onSubmit = async () => {
                 ...createDefaultTableReservationConf(),
                 ...(data?.tableReservationConf || {}),
                 singleProductOnlyInCart: form.singleProductOnlyInCart,
+                userRelationTypeIdList: form.userRelationTypeIdList,
             }
         }
         const updateResult = await mchManageApi.putObj(payload)
@@ -101,6 +108,7 @@ const getTableReservationConfData = async (mchId: string) => {
         }
         form.tableReservationConf = tableReservationConf
         form.singleProductOnlyInCart = tableReservationConf.singleProductOnlyInCart
+        form.userRelationTypeIdList = tableReservationConf.userRelationTypeIdList || []
     } catch (error: any) {
         useMessage().error(error?.msg || error?.message || "获取定餐配置失败")
     } finally {

src/views/mch/mch-manage/components/take-out-setting.vue

@@ -104,9 +104,18 @@
                             {{ state.tableReservationConf.singleProductOnlyInCart ? "是" : "否" }}
                         </span>
                     </div>
+                    <div class="take-info-item">
+                        <span class="take-info-item__label">代订餐用户关系</span>
+                        <span class="take-info-item__value">
+                            <user-relation-type-display :value="state.tableReservationConf.userRelationTypeIdList"
+                                :show-roles="false" />
+                        </span>
+                    </div>
                 </div>
             </div>
             <div class="take-card__placeholder" style="margin-top: 16px;">
+                <el-tabs v-model="apptActiveTab">
+                    <el-tab-pane label="餐段规则" name="segments">
                 <el-row>
                     <div class="mb8" style="width: 100%">
                         <el-button icon="folder-add" type="primary" class="ml10"
@@ -131,9 +140,21 @@
                             <dict-tag :options="daily_menu" :value="row.hourType" />
                         </template>
                     </el-table-column>
+                    <el-table-column label="预约模式" width="130">
+                        <template #default="{ row }">
+                            <el-tag
+                                :type="normalizeReserveMode(row.reserveMode) === RESERVE_MODE.WEEKLY_CYCLE ? 'warning' : 'info'"
+                                effect="plain">
+                                {{ reserveModeLabel(row.reserveMode) }}
+                            </el-tag>
+                        </template>
+                    </el-table-column>
                     <el-table-column label="可预约时间" width="300">
                         <template #default="{ row }">
-                            <div class="flex flex-wrap">
+                            <span v-if="normalizeReserveMode(row.reserveMode) === RESERVE_MODE.WEEKLY_CYCLE">
+                                由周期预约规则配置
+                            </span>
+                            <div v-else class="flex flex-wrap">
                                 <dict-tag style="margin-right: 5px" v-for="value in row.reserveTimeList" :key="value"
                                     :options="hard_appt_reserve_date_type" :value="value" />
                             </div>
@@ -141,7 +162,10 @@
                     </el-table-column>
                     <el-table-column label="时间段" width="300">
                         <template #default="{ row }">
-                            <div class="take-time-range">
+                            <span v-if="normalizeReserveMode(row.reserveMode) === RESERVE_MODE.WEEKLY_CYCLE">
+                                由周期预约规则配置
+                            </span>
+                            <div v-else class="take-time-range">
                                 <div class="take-time-range__item">
                                     <dict-tag :options="hard_appt_time_type" :value="row.startTimeType" />
                                     <span class="take-time-range__time">{{ row.startTime }}</span>
@@ -173,6 +197,11 @@
                         </template>
                     </el-table-column>
                 </el-table>
+                    </el-tab-pane>
+                    <el-tab-pane label="周期预约规则" name="cycles" lazy>
+                        <cycle-rule-list :mch-id="state.mchId" :dept-id="state.mchDetail.deptId" />
+                    </el-tab-pane>
+                </el-tabs>
             </div>
         </div>
 
@@ -214,9 +243,15 @@ import { useDict } from "/@/hooks/dict"
 import { useMessage, useMessageBox } from "/@/hooks/message"
 import { BasicTableProps, useTable } from "/@/hooks/table"
 import * as hardApptApi from "/@/api/hard/hard-appt"
+import {
+    RESERVE_MODE,
+    normalizeReserveMode,
+    reserveModeLabel,
+} from "../../../hard/hard-appt/constants"
 
 const TakeOutForm = defineAsyncComponent(() => import("./take-out-form.vue"));
 const HardApptForm = defineAsyncComponent(() => import("../../../hard/hard-appt/form.vue"));
+const CycleRuleList = defineAsyncComponent(() => import("../../../hard/hard-appt/cycle-rule-list.vue"));
 const TableReservationConfForm = defineAsyncComponent(() => import("./table-reservation-conf-form.vue"));
 
 import * as mchManageApi from "/@/api/wallet/mch-manage";
@@ -244,6 +279,7 @@ const createDefaultTableReservationConf = () => ({
 })
 
 const takeOutFormRef = ref()
+const apptActiveTab = ref("segments")
 const state = reactive<any>({
     mchId: null,
     switchLoadingKey: "",