智能导入
This commit is contained in:
@@ -61,4 +61,7 @@ export default {
|
|||||||
ICON_ARROW_RIGHT_BLACK: require('@/static/publishBall/icon-arrow-right-black.svg'),
|
ICON_ARROW_RIGHT_BLACK: require('@/static/publishBall/icon-arrow-right-black.svg'),
|
||||||
ICON_EXAMINATION: require('@/static/userInfo/examination.svg'),
|
ICON_EXAMINATION: require('@/static/userInfo/examination.svg'),
|
||||||
ICON_ARROW_GREEN: require('@/static/userInfo/arrow-green.svg'),
|
ICON_ARROW_GREEN: require('@/static/userInfo/arrow-green.svg'),
|
||||||
|
ICON_COPY: require('@/static/publishBall/icon-copy.svg'),
|
||||||
|
ICON_UPLOAD_IMG: require('@/static/publishBall/icon-upload-img.svg'),
|
||||||
|
ICON_UPLOAD_SUCCESS: require('@/static/publishBall/icon-upload-success.svg'),
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,8 +1,11 @@
|
|||||||
import React, { useState, useEffect } from 'react'
|
import React, { useState, useEffect } from 'react'
|
||||||
import { View, Text, Textarea, Image } from '@tarojs/components'
|
import { View, Text, Textarea, Image } from '@tarojs/components'
|
||||||
import Taro from '@tarojs/taro'
|
import Taro from '@tarojs/taro'
|
||||||
import { Popup, Toast } from '@nutui/nutui-react-taro'
|
import { ConfigProvider, Loading, Popup, Toast } from '@nutui/nutui-react-taro'
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
|
import uploadFiles from '@/services/uploadFiles'
|
||||||
|
import publishService from '@/services/publishService'
|
||||||
|
import { usePublishBallActions } from '@/store/publishBallStore'
|
||||||
import images from '@/config/images'
|
import images from '@/config/images'
|
||||||
|
|
||||||
export interface AiImportPopupProps {
|
export interface AiImportPopupProps {
|
||||||
@@ -20,14 +23,21 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
}) => {
|
}) => {
|
||||||
const [text, setText] = useState('')
|
const [text, setText] = useState('')
|
||||||
const [uploadFailCount, setUploadFailCount] = useState(0)
|
const [uploadFailCount, setUploadFailCount] = useState(0)
|
||||||
|
const [loading, setLoading] = useState(false)
|
||||||
|
const [uploadLoading, setUploadLoading] = useState(false)
|
||||||
const maxFailCount = 3
|
const maxFailCount = 3
|
||||||
|
|
||||||
// 当弹窗显示时,尝试获取剪切板内容
|
// 获取 actions(在组件顶层调用 Hook)
|
||||||
useEffect(() => {
|
const { setPublishData } = usePublishBallActions()
|
||||||
if (visible) {
|
|
||||||
getClipboardData()
|
const textIdentification = async (text: string) => {
|
||||||
}
|
setLoading(true)
|
||||||
}, [visible])
|
const res = await publishService.extract_tennis_activity({text})
|
||||||
|
console.log(res)
|
||||||
|
const {data} = res
|
||||||
|
navigateToPublishBall(data)
|
||||||
|
setLoading(false)
|
||||||
|
}
|
||||||
|
|
||||||
const getClipboardData = async () => {
|
const getClipboardData = async () => {
|
||||||
try {
|
try {
|
||||||
@@ -36,9 +46,10 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
setText(res.data)
|
setText(res.data)
|
||||||
Toast.show('toast', {
|
Toast.show('toast', {
|
||||||
content: '有场读取了你的剪切板信息',
|
content: '有场读取了你的剪切板信息',
|
||||||
duration: 90,
|
duration: 2,
|
||||||
wordBreak:'break-word'
|
wordBreak:'break-word'
|
||||||
})
|
})
|
||||||
|
textIdentification(res.data)
|
||||||
// Taro.showToast({
|
// Taro.showToast({
|
||||||
// title: '已读取你的剪切板信息',
|
// title: '已读取你的剪切板信息',
|
||||||
// icon: 'success',
|
// icon: 'success',
|
||||||
@@ -48,7 +59,7 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
Taro.showToast({
|
Taro.showToast({
|
||||||
title: '剪切板为空,请手动输入',
|
title: '剪切板为空,请手动输入',
|
||||||
icon: 'none',
|
icon: 'none',
|
||||||
duration: 2000
|
duration: 2
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
@@ -56,11 +67,20 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
Taro.showToast({
|
Taro.showToast({
|
||||||
title: '读取剪切板失败,请手动输入',
|
title: '读取剪切板失败,请手动输入',
|
||||||
icon: 'error',
|
icon: 'error',
|
||||||
duration: 2000
|
duration: 2
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const navigateToPublishBall = (data: any) => {
|
||||||
|
if (Array.isArray(data) && data.length > 0) {
|
||||||
|
setPublishData(data)
|
||||||
|
Taro.navigateTo({
|
||||||
|
url: '/publish_pages/publishBall/pages/publishBall?type=ai'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const handleTextChange = (e: any) => {
|
const handleTextChange = (e: any) => {
|
||||||
setText(e.detail.value)
|
setText(e.detail.value)
|
||||||
}
|
}
|
||||||
@@ -76,12 +96,17 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
|
|
||||||
if (res.tempFiles && res.tempFiles.length > 0) {
|
if (res.tempFiles && res.tempFiles.length > 0) {
|
||||||
// 这里可以调用图片识别API
|
// 这里可以调用图片识别API
|
||||||
console.log('选择的图片:', res.tempFiles[0])
|
setUploadLoading(false)
|
||||||
// TODO: 实现图片识别逻辑
|
setLoading(true)
|
||||||
Taro.showToast({
|
const res_upload = await uploadFiles.upload_oss_img(res.tempFiles[0].tempFilePath)
|
||||||
title: '图片识别功能开发中',
|
const {ossPath} = res_upload;
|
||||||
icon: 'none'
|
if (ossPath) {
|
||||||
})
|
setUploadLoading(true)
|
||||||
|
const publishData = await publishService.extract_tennis_activity_from_image({image_url: ossPath})
|
||||||
|
const {data} = publishData
|
||||||
|
navigateToPublishBall(data)
|
||||||
|
setLoading(false)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('选择图片失败:', error)
|
console.error('选择图片失败:', error)
|
||||||
@@ -93,20 +118,6 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const handlePasteAndRecognize = () => {
|
|
||||||
if (!text.trim()) {
|
|
||||||
Taro.showToast({
|
|
||||||
title: '请输入球局信息',
|
|
||||||
icon: 'none'
|
|
||||||
})
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
if (onPasteAndRecognize) {
|
|
||||||
onPasteAndRecognize(text)
|
|
||||||
}
|
|
||||||
onClose()
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleManualPublish = () => {
|
const handleManualPublish = () => {
|
||||||
if (onManualPublish) {
|
if (onManualPublish) {
|
||||||
@@ -144,9 +155,10 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
className={styles.textArea}
|
className={styles.textArea}
|
||||||
value={text}
|
value={text}
|
||||||
onInput={handleTextChange}
|
onInput={handleTextChange}
|
||||||
placeholder="请输入球局信息..."
|
placeholder="在此「粘贴识别」或输入文本,智能拆分球局时间、费用、地点和其他信息,并帮你智能生成球局标题"
|
||||||
maxlength={100}
|
maxlength={100}
|
||||||
showConfirmBar={false}
|
showConfirmBar={false}
|
||||||
|
placeholderClass={styles.textArea_placeholder}
|
||||||
autoHeight
|
autoHeight
|
||||||
/>
|
/>
|
||||||
<View className={styles.charCount}>
|
<View className={styles.charCount}>
|
||||||
@@ -156,10 +168,12 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
|
|
||||||
{/* 图片识别按钮 */}
|
{/* 图片识别按钮 */}
|
||||||
<View className={styles.imageRecognitionContainer}>
|
<View className={styles.imageRecognitionContainer}>
|
||||||
<View className={styles.imageRecognitionButton} onClick={handleImageRecognition}>
|
<View className={`${styles.imageRecognitionButton} ${uploadLoading ? styles.uploadLoadingContainer : ''}`} onClick={handleImageRecognition}>
|
||||||
<Image src={images.ICON_UPLOAD} className={styles.cameraIcon} />
|
{
|
||||||
|
uploadLoading ? (<Image src={images.ICON_UPLOAD_SUCCESS} className={styles.cameraIcon} />) : (<Image src={images.ICON_UPLOAD_IMG} className={styles.cameraIcon} />)
|
||||||
|
}
|
||||||
<Text className={styles.imageRecognitionText}>图片识别</Text>
|
<Text className={styles.imageRecognitionText}>图片识别</Text>
|
||||||
<Text className={styles.imageRecognitionDesc}>支持订场截图/小红书笔记截图等图片</Text>
|
<Text className={styles.imageRecognitionDesc}>{uploadLoading ? '已上传 1 张图片' : '支持订场截图/小红书笔记截图等图片'}</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
@@ -170,9 +184,22 @@ const AiImportPopup: React.FC<AiImportPopupProps> = ({
|
|||||||
<Text className={styles.manualButtonText}>手动发布球局</Text>
|
<Text className={styles.manualButtonText}>手动发布球局</Text>
|
||||||
</View>
|
</View>
|
||||||
)}
|
)}
|
||||||
<View className={styles.pasteButton} onClick={handlePasteAndRecognize}>
|
<View className={styles.pasteButton} onClick={getClipboardData}>
|
||||||
<Image src={images.ICON_PLUS} className={styles.clipboardIcon} />
|
{
|
||||||
<Text className={styles.pasteButtonText}>粘贴并识别</Text>
|
loading ? (
|
||||||
|
<View className={styles.loadingContainer}>
|
||||||
|
<ConfigProvider theme={{ nutuiLoadingIconColor: '#fff', nutuiLoadingIconSize: '20px' }}>
|
||||||
|
<Loading type="circular" />
|
||||||
|
</ConfigProvider>
|
||||||
|
<Text className={styles.pasteButtonText}>识别中</Text>
|
||||||
|
</View>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<Image src={images.ICON_COPY} className={styles.clipboardIcon} />
|
||||||
|
<Text className={styles.pasteButtonText}>粘贴并识别</Text>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
|||||||
@@ -57,7 +57,7 @@
|
|||||||
|
|
||||||
.textArea {
|
.textArea {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 80px;
|
min-height: 120px;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
border: 1px solid #e5e6eb;
|
border: 1px solid #e5e6eb;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
@@ -67,9 +67,10 @@
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
resize: none;
|
resize: none;
|
||||||
|
|
||||||
&:focus {
|
.textArea_placeholder{
|
||||||
border-color: #165dff;
|
color: rgba(60, 60, 67, 0.30);
|
||||||
outline: none;
|
font-size: 14px;
|
||||||
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -90,17 +91,15 @@
|
|||||||
|
|
||||||
.imageRecognitionButton {
|
.imageRecognitionButton {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
height: 40px;
|
||||||
|
padding: 2px 16px;
|
||||||
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 8px;
|
gap: 6px;
|
||||||
padding: 12px;
|
align-self: stretch;
|
||||||
background: #f8f9fa;
|
border-radius: 999px;
|
||||||
border-radius: 8px;
|
border: 0.5px solid rgba(0, 0, 0, 0.16);
|
||||||
cursor: pointer;
|
background: #FFF;
|
||||||
transition: background-color 0.2s;
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
background: #e9ecef;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cameraIcon {
|
.cameraIcon {
|
||||||
width: 16px;
|
width: 16px;
|
||||||
@@ -115,10 +114,15 @@
|
|||||||
|
|
||||||
.imageRecognitionDesc {
|
.imageRecognitionDesc {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: #8a8a8a;
|
color: rgba(0, 0, 0, 0.35);
|
||||||
margin-left: auto;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.uploadLoadingContainer{
|
||||||
|
border-radius: 999px;
|
||||||
|
border: 0.5px solid rgba(0, 0, 0, 0.16);
|
||||||
|
background: rgba(52, 199, 89, 0.10);
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.bottomButtons {
|
.bottomButtons {
|
||||||
@@ -161,21 +165,25 @@
|
|||||||
gap: 6px;
|
gap: 6px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.2s;
|
transition: all 0.2s;
|
||||||
|
.loadingContainer{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 6px;
|
||||||
|
}
|
||||||
&:active {
|
&:active {
|
||||||
background: #333;
|
background: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
.clipboardIcon {
|
.clipboardIcon {
|
||||||
width: 16px;
|
width: 20px;
|
||||||
height: 16px;
|
height: 20px;
|
||||||
filter: invert(1);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.pasteButtonText {
|
.pasteButtonText {
|
||||||
font-size: 14px;
|
font-size: 16px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-weight: 500;
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import { View, Text, Input, ScrollView, Image } from '@tarojs/components'
|
|||||||
import Taro from '@tarojs/taro'
|
import Taro from '@tarojs/taro'
|
||||||
import { Loading } from '@nutui/nutui-react-taro'
|
import { Loading } from '@nutui/nutui-react-taro'
|
||||||
import StadiumDetail, { StadiumDetailRef } from './StadiumDetail'
|
import StadiumDetail, { StadiumDetailRef } from './StadiumDetail'
|
||||||
import { CommonPopup } from '@/components'
|
import { CommonPopup } from '../../../../components'
|
||||||
import { getLocation } from '@/utils/locationUtils'
|
import { getLocation } from '@/utils/locationUtils'
|
||||||
import PublishService from '@/services/publishService'
|
import PublishService from '@/services/publishService'
|
||||||
import images from '@/config/images'
|
import images from '@/config/images'
|
||||||
@@ -135,6 +135,12 @@ const SelectStadium: React.FC<SelectStadiumProps> = ({
|
|||||||
setSearchValue('')
|
setSearchValue('')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleDetailCancel = () => {
|
||||||
|
setShowDetail(false)
|
||||||
|
setSelectedStadium(null)
|
||||||
|
setSearchValue('')
|
||||||
|
}
|
||||||
|
|
||||||
const handleItemLocation = (stadium: Stadium) => {
|
const handleItemLocation = (stadium: Stadium) => {
|
||||||
if (stadium.latitude && stadium.longitude) {
|
if (stadium.latitude && stadium.longitude) {
|
||||||
Taro.openLocation({
|
Taro.openLocation({
|
||||||
@@ -169,7 +175,7 @@ const SelectStadium: React.FC<SelectStadiumProps> = ({
|
|||||||
cancelText="返回"
|
cancelText="返回"
|
||||||
confirmText="确认"
|
confirmText="确认"
|
||||||
className="select-stadium-popup"
|
className="select-stadium-popup"
|
||||||
onCancel={handleCancel}
|
onCancel={handleDetailCancel}
|
||||||
onConfirm={handleConfirm}
|
onConfirm={handleConfirm}
|
||||||
position="bottom"
|
position="bottom"
|
||||||
round
|
round
|
||||||
|
|||||||
@@ -0,0 +1,8 @@
|
|||||||
|
export default definePageConfig({
|
||||||
|
navigationBarTitleText: '约球规则',
|
||||||
|
navigationBarBackgroundColor: '#ffffff',
|
||||||
|
navigationBarTextStyle: 'black',
|
||||||
|
backgroundColor: '#f5f5f5',
|
||||||
|
enablePullDownRefresh: false,
|
||||||
|
disableScroll: false
|
||||||
|
})
|
||||||
245
src/publish_pages/publishBall/footballRules/index.scss
Normal file
245
src/publish_pages/publishBall/footballRules/index.scss
Normal file
@@ -0,0 +1,245 @@
|
|||||||
|
// 条款页面样式
|
||||||
|
.terms_page {
|
||||||
|
width: 100%;
|
||||||
|
height: 100vh;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
background: #FAFAFA;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 状态栏样式
|
||||||
|
.status_bar {
|
||||||
|
position: absolute;
|
||||||
|
top: 21px;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 33px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 16px;
|
||||||
|
z-index: 10;
|
||||||
|
|
||||||
|
.time {
|
||||||
|
color: #000000;
|
||||||
|
font-family: 'SF Pro';
|
||||||
|
font-weight: 590;
|
||||||
|
font-size: 17px;
|
||||||
|
line-height: 22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status_icons {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 7px;
|
||||||
|
|
||||||
|
.signal_icon,
|
||||||
|
.wifi_icon,
|
||||||
|
.battery_icon {
|
||||||
|
width: 20px;
|
||||||
|
height: 12px;
|
||||||
|
background: #000000;
|
||||||
|
border-radius: 2px;
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.signal_icon {
|
||||||
|
width: 19px;
|
||||||
|
height: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wifi_icon {
|
||||||
|
width: 17px;
|
||||||
|
height: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.battery_icon {
|
||||||
|
width: 27px;
|
||||||
|
height: 13px;
|
||||||
|
border: 1px solid rgba(0, 0, 0, 0.35);
|
||||||
|
background: #000000;
|
||||||
|
border-radius: 4px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
right: -3px;
|
||||||
|
top: 4px;
|
||||||
|
width: 1px;
|
||||||
|
height: 4px;
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
border-radius: 0 1px 1px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 导航栏样式
|
||||||
|
.navigation_bar {
|
||||||
|
position: absolute;
|
||||||
|
top: 54px;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
height: 44px;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 44px 44px 0 0;
|
||||||
|
z-index: 10;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 10px;
|
||||||
|
|
||||||
|
.nav_content {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.back_button {
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
.back_icon {
|
||||||
|
width: 8px;
|
||||||
|
height: 16px;
|
||||||
|
background: #000000;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 2px;
|
||||||
|
background: #000000;
|
||||||
|
transform: translateY(-50%) rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 2px;
|
||||||
|
background: #000000;
|
||||||
|
transform: translateY(-50%) rotate(-45deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.page_title {
|
||||||
|
font-family: 'PingFang SC';
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #000000;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_placeholder {
|
||||||
|
width: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 主要内容区域
|
||||||
|
.main_content {
|
||||||
|
position: relative;
|
||||||
|
z-index: 5;
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
// 条款标题
|
||||||
|
.terms_title {
|
||||||
|
font-family: 'PingFang SC';
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 20px;
|
||||||
|
line-height: 1.6em;
|
||||||
|
text-align: center;
|
||||||
|
color: #000000;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 条款简介
|
||||||
|
.terms_intro {
|
||||||
|
font-family: 'PingFang SC';
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.43em;
|
||||||
|
color: #000000;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// 条款详细内容
|
||||||
|
.terms_content {
|
||||||
|
font-family: 'PingFang SC';
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1.43em;
|
||||||
|
color: #000000;
|
||||||
|
margin-bottom: 40px;
|
||||||
|
white-space: pre-line;
|
||||||
|
padding: 0px 24px;
|
||||||
|
|
||||||
|
.terms_first_line,
|
||||||
|
span.terms_first_line {
|
||||||
|
font-weight: 500;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 底部按钮
|
||||||
|
.bottom_actions {
|
||||||
|
margin-bottom: 40px;
|
||||||
|
|
||||||
|
.agree_button {
|
||||||
|
width: 100%;
|
||||||
|
height: 52px;
|
||||||
|
background: #07C160;
|
||||||
|
border: none;
|
||||||
|
border-radius: 16px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 600;
|
||||||
|
font-family: 'PingFang SC';
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 底部指示器
|
||||||
|
.home_indicator {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 21px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
width: 140px;
|
||||||
|
height: 5px;
|
||||||
|
background: #000000;
|
||||||
|
border-radius: 2.5px;
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
40
src/publish_pages/publishBall/footballRules/index.tsx
Normal file
40
src/publish_pages/publishBall/footballRules/index.tsx
Normal file
@@ -0,0 +1,40 @@
|
|||||||
|
import React, { useEffect } from 'react';
|
||||||
|
import { View, ScrollView } from '@tarojs/components';
|
||||||
|
import './index.scss';
|
||||||
|
|
||||||
|
const footballRules: React.FC = () => {
|
||||||
|
// 获取页面参数
|
||||||
|
|
||||||
|
const [termsContent, setTermsContent] = React.useState('');
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setTermsContent(`<span class="terms_first_line">欢迎使用本平台(以下简称"本平台")的微信绑定服务。为保障您的权益,请您务必仔细阅读并理解以下协议内容。</span>
|
||||||
|
|
||||||
|
一、绑定服务说明
|
||||||
|
1. 本平台提供微信账号绑定服务,用户可通过微信快捷登录方式使用平台功能。
|
||||||
|
2. 绑定微信账号后,用户可使用微信登录、微信支付、微信分享等功能。
|
||||||
|
3. 本平台承诺保护用户微信账号信息安全,不会泄露给第三方。`)
|
||||||
|
}, [])
|
||||||
|
return (
|
||||||
|
<View className="terms_page">
|
||||||
|
{/* 主要内容 */}
|
||||||
|
<ScrollView className="main_content" scrollY>
|
||||||
|
{/* 条款标题 */}
|
||||||
|
<View className="terms_title">
|
||||||
|
约球规则
|
||||||
|
</View>
|
||||||
|
|
||||||
|
{/* 条款详细内容 */}
|
||||||
|
<View
|
||||||
|
className="terms_content"
|
||||||
|
dangerouslySetInnerHTML={{ __html: termsContent }}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</ScrollView>
|
||||||
|
|
||||||
|
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default footballRules;
|
||||||
@@ -11,8 +11,10 @@ import { PublishBallFormData } from '../../../types/publishBall';
|
|||||||
import PublishService from '@/services/publishService';
|
import PublishService from '@/services/publishService';
|
||||||
import { getNextHourTime, getEndTime, delay } from '@/utils';
|
import { getNextHourTime, getEndTime, delay } from '@/utils';
|
||||||
import images from '@/config/images'
|
import images from '@/config/images'
|
||||||
|
import { useUserInfo } from '@/store/userStore'
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
|
import { usePublishBallData, usePublishBallActions } from '@/store/publishBallStore'
|
||||||
|
|
||||||
const defaultFormData: PublishBallFormData = {
|
const defaultFormData: PublishBallFormData = {
|
||||||
title: '',
|
title: '',
|
||||||
@@ -43,19 +45,21 @@ const defaultFormData: PublishBallFormData = {
|
|||||||
},
|
},
|
||||||
is_substitute_supported: true,
|
is_substitute_supported: true,
|
||||||
is_wechat_contact: true,
|
is_wechat_contact: true,
|
||||||
wechat_contact: '14223332214'
|
wechat_contact: ''
|
||||||
}
|
}
|
||||||
|
|
||||||
const PublishBall: React.FC = () => {
|
const PublishBall: React.FC = () => {
|
||||||
const [activityType, setActivityType] = useState<ActivityType>('individual')
|
const [activityType, setActivityType] = useState<ActivityType>('individual')
|
||||||
const [isSubmitDisabled, setIsSubmitDisabled] = useState(false)
|
const [isSubmitDisabled, setIsSubmitDisabled] = useState(false)
|
||||||
|
const userInfo = useUserInfo();
|
||||||
|
const publishAiData = usePublishBallData()
|
||||||
|
const { clearPublishData } = usePublishBallActions()
|
||||||
|
|
||||||
// 获取页面参数并设置导航标题
|
// 获取页面参数并设置导航标题
|
||||||
const [optionsConfig, setOptionsConfig] = useState<FormFieldConfig[]>(publishBallFormSchema)
|
const [optionsConfig, setOptionsConfig] = useState<FormFieldConfig[]>(publishBallFormSchema)
|
||||||
const [formData, setFormData] = useState<PublishBallFormData[]>([
|
console.log(userInfo, 'userInfo');
|
||||||
defaultFormData
|
const [formData, setFormData] = useState<PublishBallFormData[]>([defaultFormData])
|
||||||
])
|
|
||||||
const [checked, setChecked] = useState(true)
|
const [checked, setChecked] = useState(true)
|
||||||
|
|
||||||
// 删除确认弹窗状态
|
// 删除确认弹窗状态
|
||||||
const [deleteConfirm, setDeleteConfirm] = useState<{
|
const [deleteConfirm, setDeleteConfirm] = useState<{
|
||||||
visible: boolean;
|
visible: boolean;
|
||||||
@@ -77,14 +81,6 @@ const PublishBall: React.FC = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 处理活动类型变化
|
|
||||||
const handleActivityTypeChange = (type: ActivityType) => {
|
|
||||||
if (type === 'group') {
|
|
||||||
setFormData([defaultFormData])
|
|
||||||
} else {
|
|
||||||
setFormData([defaultFormData])
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 检查相邻两组数据是否相同
|
// 检查相邻两组数据是否相同
|
||||||
const checkAdjacentDataSame = (formDataArray: PublishBallFormData[]) => {
|
const checkAdjacentDataSame = (formDataArray: PublishBallFormData[]) => {
|
||||||
@@ -165,17 +161,17 @@ const PublishBall: React.FC = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const validateFormData = (formData: PublishBallFormData, isOnSubmit: boolean = false) => {
|
const validateFormData = (formData: PublishBallFormData, isOnSubmit: boolean = false) => {
|
||||||
const { activityInfo, image_list, title, timeRange } = formData;
|
const { activityInfo, title, timeRange } = formData;
|
||||||
const { play_type, price, location_name } = activityInfo;
|
const { play_type, price, location_name } = activityInfo;
|
||||||
if (!image_list?.length) {
|
// if (!image_list?.length) {
|
||||||
if (!isOnSubmit) {
|
// if (!isOnSubmit) {
|
||||||
Taro.showToast({
|
// Taro.showToast({
|
||||||
title: `请上传活动封面`,
|
// title: `请上传活动封面`,
|
||||||
icon: 'none'
|
// icon: 'none'
|
||||||
})
|
// })
|
||||||
}
|
// }
|
||||||
return false
|
// return false
|
||||||
}
|
// }
|
||||||
if (!title) {
|
if (!title) {
|
||||||
if (!isOnSubmit) {
|
if (!isOnSubmit) {
|
||||||
Taro.showToast({
|
Taro.showToast({
|
||||||
@@ -277,8 +273,8 @@ const PublishBall: React.FC = () => {
|
|||||||
// 如果是个人球局,则跳转到详情页,并自动分享
|
// 如果是个人球局,则跳转到详情页,并自动分享
|
||||||
// 如果是畅打,则跳转第一个球局详情页,并自动分享 @刘杰
|
// 如果是畅打,则跳转第一个球局详情页,并自动分享 @刘杰
|
||||||
Taro.navigateTo({
|
Taro.navigateTo({
|
||||||
// @ts-expect-error: id
|
// @ts-expect-error: id
|
||||||
url: `/game_pages/detail/index?id=${res.data.id || 1}&from=publish&autoShare=1`
|
url: `/pages/detail/index?id=${(res as any).data?.id || 1}&from=publish&autoShare=1`
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
Taro.showToast({
|
Taro.showToast({
|
||||||
@@ -323,8 +319,8 @@ const PublishBall: React.FC = () => {
|
|||||||
// 如果是个人球局,则跳转到详情页,并自动分享
|
// 如果是个人球局,则跳转到详情页,并自动分享
|
||||||
// 如果是畅打,则跳转第一个球局详情页,并自动分享 @刘杰
|
// 如果是畅打,则跳转第一个球局详情页,并自动分享 @刘杰
|
||||||
Taro.navigateTo({
|
Taro.navigateTo({
|
||||||
// @ts-expect-error: id
|
// @ts-expect-error: id
|
||||||
url: `/game_pages/detail/index?id=${res.data?.[0].id || 1}&from=publish&autoShare=1`
|
url: `/pages/detail/index?id=${(res as any).data?.[0]?.id || 1}&from=publish&autoShare=1`
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
Taro.showToast({
|
Taro.showToast({
|
||||||
@@ -362,19 +358,48 @@ const PublishBall: React.FC = () => {
|
|||||||
}, [] as FormFieldConfig[])
|
}, [] as FormFieldConfig[])
|
||||||
setOptionsConfig(newFormSchema)
|
setOptionsConfig(newFormSchema)
|
||||||
setFormData([defaultFormData])
|
setFormData([defaultFormData])
|
||||||
}
|
|
||||||
// 根据type设置导航标题
|
|
||||||
if (type === 'group') {
|
|
||||||
Taro.setNavigationBarTitle({
|
Taro.setNavigationBarTitle({
|
||||||
title: '发布畅打活动'
|
title: '发布畅打活动'
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
Taro.setNavigationBarTitle({
|
Taro.setNavigationBarTitle({
|
||||||
title: '发布'
|
title: '发布'
|
||||||
})
|
})
|
||||||
|
const userPhone = (userInfo as any)?.phone || ''
|
||||||
|
setFormData([{...defaultFormData, wechat_contact: userPhone }])
|
||||||
|
}
|
||||||
|
} else if (type === 'ai') {
|
||||||
|
// 从 Store 注入 AI 生成的表单 JSON
|
||||||
|
const mergeWithDefault = (data: PublishBallFormData): PublishBallFormData => {
|
||||||
|
return {
|
||||||
|
...defaultFormData,
|
||||||
|
...data,
|
||||||
|
timeRange: {
|
||||||
|
...defaultFormData.timeRange,
|
||||||
|
...(data?.timeRange || {}),
|
||||||
|
},
|
||||||
|
activityInfo: {
|
||||||
|
...defaultFormData.activityInfo,
|
||||||
|
...(data?.activityInfo || {}),
|
||||||
|
},
|
||||||
|
descriptionInfo: {
|
||||||
|
...defaultFormData.descriptionInfo,
|
||||||
|
...(data?.descriptionInfo || {}),
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (publishAiData) {
|
||||||
|
if (Array.isArray(publishAiData)) {
|
||||||
|
const merged = publishAiData.map(item => mergeWithDefault(item))
|
||||||
|
setFormData(merged.length ? merged : [defaultFormData])
|
||||||
|
} else {
|
||||||
|
setFormData([mergeWithDefault(publishAiData)])
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
setFormData([defaultFormData])
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
handleActivityTypeChange(type)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const onCheckedChange = (checked: boolean) => {
|
const onCheckedChange = (checked: boolean) => {
|
||||||
@@ -394,6 +419,7 @@ const PublishBall: React.FC = () => {
|
|||||||
initFormData()
|
initFormData()
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
|
console.log(formData, 'formDataformDataformData');
|
||||||
return (
|
return (
|
||||||
<View className={styles['publish-ball']}>
|
<View className={styles['publish-ball']}>
|
||||||
{/* 活动类型切换 */}
|
{/* 活动类型切换 */}
|
||||||
@@ -471,7 +497,7 @@ const PublishBall: React.FC = () => {
|
|||||||
activityType === 'individual' && (
|
activityType === 'individual' && (
|
||||||
<Text className={styles['submit-tip']}>
|
<Text className={styles['submit-tip']}>
|
||||||
点击确定发布约球,即表示已经同意条款
|
点击确定发布约球,即表示已经同意条款
|
||||||
<Text className={styles['link']}>《约球规则》</Text>
|
<Text className={styles['link']} onClick={() => Taro.navigateTo({url: '/pages/publishBall/footballRules/index'})}>《约球规则》</Text>
|
||||||
</Text>
|
</Text>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,13 +1,13 @@
|
|||||||
import React, { useState, useEffect } from 'react'
|
import React, { useState, useEffect } from 'react'
|
||||||
import { View, Text } from '@tarojs/components'
|
import { View, Text } from '@tarojs/components'
|
||||||
import { ImageUpload, Range, TimeSelector, TextareaTag, NumberInterval, TitleTextarea, FormSwitch, UploadCover } from '@/components'
|
import { ImageUpload, Range, TimeSelector, TextareaTag, NumberInterval, TitleTextarea, FormSwitch, UploadCover } from '../../components'
|
||||||
import FormBasicInfo from './components/FormBasicInfo'
|
import FormBasicInfo from './components/FormBasicInfo'
|
||||||
import { type CoverImage } from '../../components/index.types'
|
import { type CoverImage } from '../../components/index.types'
|
||||||
import { FormFieldConfig, FieldType } from '../../config/formSchema/publishBallFormSchema'
|
import { FormFieldConfig, FieldType } from '../../config/formSchema/publishBallFormSchema'
|
||||||
import { PublishBallFormData } from '../../../types/publishBall';
|
import { PublishBallFormData } from '../../../types/publishBall';
|
||||||
import WechatSwitch from './components/WechatSwitch/WechatSwitch'
|
import WechatSwitch from './components/WechatSwitch/WechatSwitch'
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
import { useDictionaryActions } from '@/store/dictionaryStore'
|
import { useDictionaryActions } from '../../store/dictionaryStore'
|
||||||
|
|
||||||
// 组件映射器
|
// 组件映射器
|
||||||
const componentMap = {
|
const componentMap = {
|
||||||
|
|||||||
@@ -142,6 +142,18 @@ class PublishService {
|
|||||||
showToast: false,
|
showToast: false,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
async extract_tennis_activity(req: {text: string}): Promise<getPicturesRes> {
|
||||||
|
return httpService.post('/ai/extract_tennis_activity', req, {
|
||||||
|
showLoading: false,
|
||||||
|
showToast: false,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
async extract_tennis_activity_from_image(req: {image_url: string}): Promise<getPicturesRes> {
|
||||||
|
return httpService.post('/ai/extract_tennis_activity_from_image', req, {
|
||||||
|
showLoading: false,
|
||||||
|
showToast: false,
|
||||||
|
})
|
||||||
|
}
|
||||||
async getPictures(req) {
|
async getPictures(req) {
|
||||||
const { type, tag, otherReq = {} } = req
|
const { type, tag, otherReq = {} } = req
|
||||||
if (type === 'history') {
|
if (type === 'history') {
|
||||||
|
|||||||
37
src/store/publishBallStore.ts
Normal file
37
src/store/publishBallStore.ts
Normal file
@@ -0,0 +1,37 @@
|
|||||||
|
import { create } from "zustand";
|
||||||
|
import { PublishBallFormData } from "../../types/publishBall";
|
||||||
|
|
||||||
|
interface PublishBallState {
|
||||||
|
// 待注入到发布页面的表单数据(支持单场或多场)
|
||||||
|
publishData: PublishBallFormData | PublishBallFormData[] | null;
|
||||||
|
|
||||||
|
// 赋值/覆盖整份数据
|
||||||
|
setPublishData: (
|
||||||
|
data: PublishBallFormData | PublishBallFormData[] | null
|
||||||
|
) => void;
|
||||||
|
|
||||||
|
// 读取当前数据
|
||||||
|
getPublishData: () => PublishBallFormData | PublishBallFormData[] | null;
|
||||||
|
|
||||||
|
// 清空
|
||||||
|
clearPublishData: () => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const usePublishBallStore = create<PublishBallState>()((set, get) => ({
|
||||||
|
publishData: null,
|
||||||
|
setPublishData: (data) => set({ publishData: data }),
|
||||||
|
getPublishData: () => get().publishData,
|
||||||
|
clearPublishData: () => set({ publishData: null }),
|
||||||
|
}));
|
||||||
|
|
||||||
|
// 便捷 hooks
|
||||||
|
export const usePublishBallData = () =>
|
||||||
|
usePublishBallStore((state) => state.publishData);
|
||||||
|
|
||||||
|
export const usePublishBallActions = () =>
|
||||||
|
usePublishBallStore((state) => ({
|
||||||
|
setPublishData: state.setPublishData,
|
||||||
|
clearPublishData: state.clearPublishData,
|
||||||
|
}));
|
||||||
|
|
||||||
|
|
||||||
Reference in New Issue
Block a user