Commit fc705e60 authored by GuanHua's avatar GuanHua

fix: app自营商城装修bug修复

parent e729b4e5
......@@ -60,10 +60,10 @@
"@ctrl/tinycolor": "^3.4.0",
"@formily/antd": "^1.3.3",
"@formily/antd-components": "^1.3.3",
"@lingxi-disign/core": "^1.0.6",
"@lingxi-disign/react": "^1.0.7",
"@lingxi-disign/react-web": "^1.0.2",
"@lingxi-disign/ui": "^1.0.6",
"@lingxi-disign/core": "^1.7.3",
"@lingxi-disign/react": "^1.7.6",
"@lingxi-disign/react-web": "^1.7.2",
"@lingxi-disign/ui": "^1.7.2",
"@turf/turf": "^6.4.0",
"@types/crypto-js": "^4.0.1",
"@types/js-cookie": "^2.2.6",
......
......@@ -34,7 +34,8 @@ const Environment_MAPS = {
const Property_MAPS = {
1: 'B端商城',
2: 'C端商城',
3: '自营商城',
3: 'B端自营商城',
4: 'C端自营商城',
}
const Title_MAPS = {
......@@ -71,13 +72,19 @@ const MixDrawer: React.FC<MixDrawerProps> = (props: MixDrawerProps) => {
let _fetch;
switch (type) {
case 1:
if (layoutType !== 'own') {
_params.type = 1;
_params.environment = 4;
_params.property = property;
_fetch = PublicApi.getManageShopListAdorn;
} else {
_fetch = PublicApi.getManageWebShopWebFindAppSelfShopByCurrMember;
}
if (keyWord) {
_params.name = keyWord
}
_fetch = PublicApi.getManageShopListAdorn;
break;
case 3:
if (keyWord) {
......@@ -110,7 +117,11 @@ const MixDrawer: React.FC<MixDrawerProps> = (props: MixDrawerProps) => {
_params.shopId = shopId
_params.idNotInList = selectId
}
if (layoutType !== 'own') {
_fetch = PublicApi.getManageContentInformationListAdorn;
} else {
_fetch = PublicApi.getManageMemberInformationListAdorn
}
break;
// 品牌
case 6:
......
......@@ -77,6 +77,7 @@
&-record {
&-shop {
width: 100%;
height: 56px;
border: 1px solid #EDEEEF;
display: flex;
......@@ -102,6 +103,7 @@
}
&-integral {
width: 100%;
height: 56px;
border: 1px solid #EDEEEF;
display: flex;
......@@ -140,6 +142,7 @@
}
&-activity {
width: 100%;
height: 56px;
border: 1px solid #EDEEEF;
display: flex;
......@@ -185,6 +188,7 @@
}
&-commodity {
&-box {
margin-bottom: 16px;
......@@ -196,6 +200,7 @@
}
&-detail {
width: 100%;
height: 80px;
border: 1px solid #F7F8FA;
display: flex;
......@@ -239,6 +244,7 @@
}
&-activityList {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
......
import React, { useMemo, useState, useEffect } from 'react';
import { Input, Select, Row, Col, Button, Tooltip } from 'antd';
import { DeleteOutlined } from '@ant-design/icons';
import React, { useMemo, useState, useEffect, useContext } from 'react';
import { Button, Spin, Tooltip } from 'antd';
import { PlusCircleOutlined } from '@ant-design/icons';
import NiceForm from '@/components/NiceForm';
import { changeProps } from '@lingxi-disign/core';
import { context } from '../../../common/context';
import { LAYOUT_TYPE } from '@/constants'
import { PublicApi } from '@/services/api';
import UploadImage from '@/components/UploadImage';
import FormilyUpload from '@/components/UploadFiles/FormilyUploadFiles';
import { useAsyncInitSelect } from '@/formSchema/effects/useAsyncInitSelect'
import StatusTag from '@/components/StatusTag'
import { priceFormat } from '@/utils/numberFomat';
import { bannerSchema } from './schema'
import MixDrawer from '@/pages/editor/components/drawer/mixDrawer';
import ActivityDrawer from '@/pages/editor/components/drawer/activityDrawer';
import CommodityDrawer from '@/pages/editor/components/drawer/commodityDrawer';
import uploadImgIcon from '@/assets/icons/upload_img_icon.svg'
import { FormEffectHooks } from '@formily/antd'
import ActivityImage from '@/assets/couponIcons/ActivityImage.svg';
import { getAuth } from '@/utils/auth'
......@@ -78,6 +79,8 @@ const RedirectTypeList_Channel = [
},
]
const { onFieldInputChange$ } = FormEffectHooks;
const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) => {
const { name, img, id, type, property = 2, selectedKey, layoutType } = props;
const [mixVisible, setMixVisible] = useState<boolean>(false);
......@@ -85,6 +88,16 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
const [commodityVisible, setCommodityVisible] = useState<boolean>(false);
const [record, setRecord] = useState<any>();
const { memberId, memberRoleId } = getAuth() || {}
const [formValue, setFormVale] = useState<any>();
const fixtureContext = useContext(context);
useEffect(() => {
setFormVale({
name,
type,
img: img ? [{ url: img }] : undefined,
})
}, [selectedKey])
const _fetch: any = useMemo(() => {
switch (type) {
......@@ -154,7 +167,8 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
return []
}, [layoutType])
const _recordDetail = useMemo(() => {
const recordDetail = () => {
return useMemo(() => {
if (record) {
if (type === 1) {
return (
......@@ -236,7 +250,9 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
)
}
}
}, [type, record, property])
return null
}, [type, record])
}
const _showChoose = useMemo(() => {
if (!type || type === 4) {
......@@ -253,18 +269,6 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
});
}
const _onChangeType = (value: any) => {
changeProps({
props: Object.assign({ ...props }, { type: value, id: '', isnull: _isNull([name, img, value]) })
});
}
const _onChangeImg = (url: any) => {
changeProps({
props: Object.assign({ ...props }, { img: url, isnull: _isNull([name, url, type]) })
});
}
const _onMixClose = () => {
setMixVisible(false);
}
......@@ -278,7 +282,8 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
}
const _onChoose = () => {
switch (type) {
const chooseType = fixtureContext?.formActions.getFieldValue('type')
switch (chooseType) {
case 1:
setCommodityVisible(true);
break;
......@@ -293,11 +298,9 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
}
const _onChooseConfirm = (record) => {
const chooseType = fixtureContext?.formActions.getFieldValue('type')
setRecord(record);
changeProps({
props: Object.assign({ ...props }, { id: record.id, isnull: _isNull([name, img, type]) })
});
switch (type) {
switch (chooseType) {
case 1:
_onCommodityClose();
break;
......@@ -312,9 +315,77 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
}
}
const renderUploadChild = (value) => {
const target = value[0];
return (
<div className={styles.image}>
<div className={styles.image_body}>
<div className={styles.uploadImage}>上传图片</div>
<div className={styles.imageIcon}>
<Spin spinning={target?.status === 'uploading'}>
{
target?.url ? <img src={target?.url} style={{width: '100%', height: '96px'}} /> : <PlusCircleOutlined />
}
</Spin>
</div>
</div>
</div>
);
};
// 会员弹框筛选select值
const fetchSelectOptions = async () => {
return {
type: layoutType === LAYOUT_TYPE.shop ? RedirectTypeList : RedirectTypeList_Channel,
}
}
const handleSumit = (values) => {
const newProps: any = {
...values,
img: values?.img ? values.img[0].url : '',
id: record ? record?.id : undefined,
empty: false
}
changeProps({
title: values.name,
props: Object.assign({ ...props }, newProps)
});
}
const SelectBtn = <Button style={{ marginTop: 32 }} block onClick={() => _onChoose()}>选择</Button>
const formProps = {
// onSubmit: handleSubmit,
expressionScope: {
renderUploadChild,
SelectBtn,
},
actions: fixtureContext?.formActions,
components: { FormilyUpload, recordDetail },
};
return (
<div className={styles['banner']}>
<div className={styles['banner-box']}>
<NiceForm
value={formValue}
{...formProps}
onSubmit={handleSumit}
schema={bannerSchema}
effects={($, actions) => {
useAsyncInitSelect(['type'], fetchSelectOptions)
onFieldInputChange$('type').subscribe(fieldState => {
const { value } = fieldState;
if (value !== type) {
fixtureContext?.formActions.setFieldValue('id', undefined)
setRecord(undefined)
}
});
}}
/>
{/* <div className={styles['banner-box']}>
<div className={styles['banner-box-label']}>名称</div>
<Input key={`${selectedKey}-name`} defaultValue={name} onBlur={_onChangeName} />
</div>
......@@ -366,13 +437,13 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
</Col>}
</Row>
{_recordDetail}
</div>
</div> */}
<MixDrawer
selectId={id}
layoutType={layoutType}
onClose={_onMixClose}
property={property}
type={type}
type={fixtureContext?.formActions.getFieldValue('type')}
onConfirm={_onChooseConfirm}
visible={mixVisible}
filterParam={{
......
import { ISchema } from "@formily/antd";
export const bannerSchema: ISchema = {
type: 'Object',
properties: {
layout: {
type: 'object',
"x-component": 'mega-layout',
"x-component-props": {
labelAlign: "top"
},
properties: {
name: {
type: 'string',
title: '名称',
'x-rules': [
{
required: true,
message: '请输入名称',
},
],
},
img: {
type: 'string',
title: '图标',
'x-rules': [
{
required: true,
message: '请上传图标',
},
],
"x-component": 'FormilyUpload',
"x-component-props": {
renderUploadChild: '{{renderUploadChild}}',
showFiles: false,
customizeItemRender: null,
children: null,
maxCount: 1,
},
},
typeWrap: {
type: 'object',
"x-component": 'flex-layout',
"x-component-props": {
rowStyle: {
justifyContent: 'flex-start',
alignItems: 'flex-start',
},
},
properties: {
type: {
type: 'string',
title: '导航链接',
enum: [],
'x-linkages': [
{
type: 'value:visible',
target: 'recordDetail',
condition: "{{$value !== 4}}"
},
],
'x-rules': [
{
required: true,
message: '请选择导航链接',
},
],
'x-component-props': {
style: {
width: 320,
marginRight: 12
}
}
},
sumbit: {
'x-component': 'Children',
'x-component-props': {
children: '{{SelectBtn}}',
},
'x-mega-props': {
span: 1,
},
},
}
},
recordDetail: {
'x-component': 'recordDetail',
},
}
}
}
};
......@@ -135,7 +135,7 @@ const BottomNavigationClient: React.FC<BottomNavigationClientProps> = (props: Bo
<div className={styles['bottomNavigationClient']}>
<div className={styles['bottomNavigationClient-box']}>
<div className={styles['bottomNavigationClient-box-label']}>名称</div>
<Input key={`${selectedKey}-name`} disabled={type === 1} defaultValue={name} onBlur={_onChangeName} />
<Input key={`${selectedKey}-name`} maxLength={4} disabled={type === 1} defaultValue={name} onBlur={_onChangeName} />
</div>
<div className={styles['bottomNavigationClient-box']}>
<div className={styles['bottomNavigationClient-box-label']}>链接</div>
......
......@@ -323,8 +323,10 @@ const CardNavItem: React.FC<CardNavItemProps> = (props: CardNavItemProps) => {
}
if (values.channel && values.type === 3) {
newProps.id = values.channel
} else if (values.type === 2 || values.type === 5) {
} else if (values.type === 2) {
newProps.id = record ? record?.id : undefined
} else if (values.type === 5) {
newProps.id = record ? record?.shopId : undefined
}
changeProps({
......
......@@ -39,7 +39,7 @@ const SuggestProductCommodity: React.FC<SuggestProductCommodityProps> = (props:
const { memberId, memberRoleId } = getAuth() || {}
useEffect(() => {
if (id && id != record[0]?.id) {
if (id && id != record.id) {
const _params: any = {
shopId,
idInList: id,
......@@ -56,13 +56,18 @@ const SuggestProductCommodity: React.FC<SuggestProductCommodityProps> = (props:
case LAYOUT_TYPE.shop:
getFn = PublicApi.getMarketingAdornGoodsListAdorn
break
case LAYOUT_TYPE.own:
_params.memberId = memberId
_params.memberRoleId = memberRoleId
getFn = PublicApi.getMarketingAdornGoodsListAdorn
break
default:
break;
}
getFn && getFn(_params).then((res) => {
if (res.code === 1000) {
setRecord(res.data.data);
setRecord(res.data.data[0]);
}
}).catch(err => console.log(err))
} else if (!id) {
......@@ -145,19 +150,19 @@ const SuggestProductCommodity: React.FC<SuggestProductCommodityProps> = (props:
}
}
const _record = record[0];
// const _record = record[0];
return (
<div className={styles['suggestProductCommodity']}>
{id && record ? (
<>
<div className={styles['suggestProductCommodity-detail']}>
<img src={_record?.mainPic} />
<img src={record?.mainPic} />
<div className={styles['suggestProductCommodity-detail-right']}>
<Tooltip title={_record?.name}>
<div className={styles['suggestProductCommodity-detail-right-title']}>{_record?.name}</div>
<Tooltip title={record?.name}>
<div className={styles['suggestProductCommodity-detail-right-title']}>{record?.name}</div>
</Tooltip>
<div className={styles['suggestProductCommodity-detail-right-price']}>{_record?.min ? `¥ ${priceFormat(_record?.min)}` : ''}</div>
<div className={styles['suggestProductCommodity-detail-right-price']}>{record?.min ? `¥ ${priceFormat(record?.min)}` : ''}</div>
</div>
<div className={styles['suggestProductCommodity-detail-cover']} onClick={() => { setCommodityVisible(true) }}>
<div className={styles['suggestProductCommodity-detail-cover-bottom']}>
......@@ -167,7 +172,7 @@ const SuggestProductCommodity: React.FC<SuggestProductCommodityProps> = (props:
</div>
<div className={styles['suggestProductCommodity-box']}>
<div className={styles['suggestProductCommodity-box-label']}>商品活动</div>
{_record?.activityList?.map((item, index) => {
{record?.activityList?.map((item, index) => {
return (
<div className={styles['suggestProductCommodity-activityList']} key={index} onClick={() => { _handleToDetailPage(item.id, item.belongType) }}>
<img src={ActivityImage} />
......@@ -187,6 +192,7 @@ const SuggestProductCommodity: React.FC<SuggestProductCommodityProps> = (props:
ref={saveEditInputRef}
key={index}
size="small"
maxLength={16}
className={styles['tag-input']}
defaultValue={editInputValue}
onChange={_handleEditInputChange}
......
......@@ -102,21 +102,6 @@ const OwnMallTempleteEdit: React.FC<ShopPreviewPropsType> = props => {
}, []);
/**
* 获取渠道信息
*/
const fetchChannelInfo = (): Promise<any> => {
return new Promise(resolve => {
PublicApi.getTemplateWebMemberChannelWebFindCurrMemberChannel().then(
res => {
if (res.code === 1000) {
resolve(res.data);
}
},
);
});
};
/**
* 获取app装修信息
*/
const getAppConfig = (): Promise<any> => {
......@@ -172,10 +157,8 @@ const OwnMallTempleteEdit: React.FC<ShopPreviewPropsType> = props => {
const param: any = {
current: 1,
pageSize: 1,
sortType: 2,
recommendLabel: [2, 3],
};
const res = await PublicApi.getManageContentInformationPage(param);
const res = await PublicApi.getManageMemberInformationListAdorn(param);
message.destroy()
if (res.code === 1000 && res.data.data) {
return res.data.data[0].title;
......@@ -986,7 +969,7 @@ const OwnMallTempleteEdit: React.FC<ShopPreviewPropsType> = props => {
memberRoleId,
};
const _detailsData = await PublicApi.getMarketingAdornChannelGoodsListAdorn(
const _detailsData = await PublicApi.getMarketingAdornGoodsListAdorn(
param,
);
_detailsData.data.data?.forEach((child, childIndex) => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment