MatchMessagesTime AI 办赛比赛时间设置调整组件

# MatchMessagesTime AI 办赛比赛时间设置调整组件

用于 AI 办赛场景下的比赛时间选择和调整，支持日期时间选择器弹窗。

# 引入

import PressMatchMessagesTime from "press-next/press-match-messages-time/press-match-messages-time";

# 代码演示

# 基础用法

<template>
  <PressMatchMessagesTime
    :content="{ time: '2024-12-25 14:30' }"
    @time-click="handleTimeClick"
  />
</template>

<script setup lang="ts">
const handleTimeClick = (event: { time: string }) => {
  console.log("选择的时间:", event.time);
};
</script>

# API

# Props

参数	说明	类型	默认值
content	时间内容	ContentProps	-

# ContentProps

参数	说明	类型	默认值
time	时间文本	string	-

# Events

事件名	说明	参数
time-click	点击时间选择	event: { time: string }

# 主题定制

组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 ConfigProvider 组件。

# 样式变量

名称	默认值	描述
--pmm-time-spacing-sm	.16rem	小间距
--pmm-time-spacing-md	.24rem	中等间距
--pmm-time-spacing-lg	.32rem	大间距
--pmm-time-selector-height	.8rem	选择器高度
--pmm-time-icon-size	.32rem	图标尺寸
--pmm-time-selector-bg	#ffffff	选择器背景色
--pmm-time-selector-border	rgba(211, 212, 252, 0.48)	选择器边框色
--pmm-time-time-color	#212124	时间文字颜色
--pmm-time-icon-color	rgba(#212124, .75)	图标颜色
--pmm-time-font-size-md	.28rem	中等字体
--pmm-time-radius-md	.12rem	中等圆角

← MatchMessagesText CreateGame →