Skip to content

J
jinfa-platform
Commit 5b42d131 authored by GuanHua's avatar GuanHua
Browse files
Options

fix: 修改收藏管理页面

parent a57bc860
Show whitespace changes
Inline Side-by-side
Showing with 244 additions and 89 deletions
src/components/ShopCredit/index.less 0 → 100644
View file @ 5b42d131
.shopCredit {
position: relative;
.shopCreditIcon {
position: absolute;
bottom: 0;
left: 0;
width: 18px;
height: 16px;
}
.pointWrap {
background-color: #FFE6C8;
border-radius: 1px;
height: 16px;
line-height: 16px;
font-size: 12px;
color: #773100;
padding-right: 4px;
padding-left: 12px;
margin-left: 9px;
}
}
.yearbox {
height: 16px;
display: flex;
align-items: center;
border-radius: 1px;
border: 1px solid #6A8DDA;
padding: 0 4px;
font-size: 12px;
color: #6A8DDA;
}
src/components/ShopCredit/index.tsx 0 → 100644
View file @ 5b42d131
import React from 'react'
import creditIcon from './credit.png'
import styles from './index.less'
interface ShopCreditType {
creditPoint: number,
}
const ShopCredit: React.FC<ShopCreditType> = (props) => {
const { creditPoint } = props
return (
<div className={styles.shopCredit}>
<img className={styles.shopCreditIcon} src={creditIcon} />
<div className={styles.pointWrap}>
<span>{creditPoint}</span>
</div>
</div>
)
}
export default ShopCredit
src/components/ShopCredit/year.tsx 0 → 100644
View file @ 5b42d131
import React from 'react'
import styles from './index.less'
interface YearBoxProps {
year: number;
style?: React.CSSProperties
}
const YearBox: React.FC<YearBoxProps> = (props) => {
const { year, style } = props
return (
<div className={styles.yearbox} style={style ? style : {} }>
<span>入驻{year}年</span>
</div>
)
}
export default YearBox
src/components/StarRate/index.less 0 → 100644
View file @ 5b42d131
.star_rate {
background-color: #F4F5F7;
border-radius: 8px;
height: 16px;
display: flex;
width: 89px;
line-height: 16px;
align-items: center;
justify-content: center;
.star_rate_value {
color: #303133;
font-size: 12px;
line-height: 12px;
}
.star {
font-size: 12px;
line-height: 12px;
margin-left: 4px;
color: #FCA110 !important;
:global {
.ant-rate-star {
&:not(:last-child) {
margin-right: 1px;
}
}
}
}
}
src/components/StarRate/index.tsx 0 → 100644
View file @ 5b42d131
import React from 'react'
import { Rate } from 'antd'
import styles from './index.less'
interface StarRatePropsType {
value: number,
showValue?: boolean
}
const StarRate: React.FC<StarRatePropsType> = (props) => {
const { value, showValue } = props
return (
<label className={styles.star_rate}>
{
showValue && <span className={styles.star_rate_value}>{value}</span>
}
<Rate className={styles.star} count={5} disabled defaultValue={value} />
</label>
)
}
StarRate.defaultProps = {
showValue: true
}
export default StarRate
src/constants/index.ts
View file @ 5b42d131
......@@ -16,6 +16,33 @@ export const REQUEST_HEADER = 'http://'
*/
export const TOP_DOMAIN = process.env.NODE_ENV !== 'development' ? getTopDomainByHost(GlobalConfig.global.siteInfo.siteUrl) : 'lingxidev.com'
/**
* 平台首页域名
*/
export const PLATFORM_DOMAIN = `${REQUEST_HEADER}www.${TOP_DOMAIN}`
/**
* 行情资讯域名
*/
export const INFO_CENTER_URL = `${REQUEST_HEADER}info.${TOP_DOMAIN}`
/**
* 企业采购域名
*/
export const SRM_CENTER_URL = `${REQUEST_HEADER}srm.${TOP_DOMAIN}`
/**
* 物流服务域名
*/
export const LOGISTICS_CENTER_URL = `${REQUEST_HEADER}logistics.${TOP_DOMAIN}`
/**
* 加工服务域名
*/
export const MANUFACTURE_CENTER_URL = `${REQUEST_HEADER}manufacture.${TOP_DOMAIN}`
export const MALL_TYPE = {
1: '企业商城',
2: '积分商城',
......
src/pages/systemSetting/collection/commodity.tsx
View file @ 5b42d131
......@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
import cx from 'classnames'
import { Button, Pagination, message, Modal } from 'antd'
import { StarFilled } from '@ant-design/icons'
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import credit_icon from '@/assets/imgs/credit_icon.png'
import styles from './index.less'
import { PublicApi } from '@/services/api'
......@@ -148,7 +149,7 @@ const Commodity: React.FC = () => {
}
return (
<>
<PageHeaderWrapper>
<div className={styles.commodity_list}>
{
list && list.map((item, index) => (
......@@ -183,7 +184,7 @@ const Commodity: React.FC = () => {
<div className={cx(styles.commodity_list_item_item)}>
<span className={styles.date}>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
</div>
<div className={cx(styles.commodity_list_item_item)}>
<div className={cx(styles.commodity_list_item_item, styles.float_right)}>
<div className={styles.collection_state_wrap}>
<div className={cx(styles.collection_state)} onClick={() => handleCancelCollect(item)}>
<StarFilled />
......@@ -197,13 +198,13 @@ const Commodity: React.FC = () => {
}
</div>
{
totalCount > 0 && (
totalCount > pageSize && (
<div className={styles.pagination_wrap}>
<Pagination showSizeChanger={false} current={current} total={totalCount} pageSize={pageSize} onChange={handleChange} />
</div>
)
}
</>
</PageHeaderWrapper>
)
}
......
src/pages/systemSetting/collection/index.less
View file @ 5b42d131
......@@ -26,7 +26,10 @@
&_item {
position: relative;
display: flex;
margin-bottom: 16px;
margin-bottom: 8px;
border-radius: 8px;
background-color: #ffffff;
padding: 16px;
&_item {
flex: 1;
......@@ -34,6 +37,10 @@
justify-content: center;
flex-direction: column;
&.float_right {
align-items: flex-end;
}
&.morehalf {
flex: 1.5;
}
......@@ -45,13 +52,13 @@
&_logo {
border-radius: 4px;
overflow: hidden;
width: 72px;
height: 72px;
margin-right: 16px;
width: 40px;
height: 40px;
margin-right: 12px;
&>img {
width: 72px;
height: 72px;
width: 40px;
height: 40px;
}
}
......@@ -68,7 +75,7 @@
&_about {
display: flex;
margin-top: 10px;
margin-top: 8px;
&_item {
// flex: 1;
......@@ -116,43 +123,33 @@
font-size: 12px;
}
.collection_state {
font-size: 12px;
color: #00B37A;
cursor: pointer;
&>label {
margin-left: 4px;
cursor: pointer;
}
}
.rate_wrap {
font-size: 12px;
:global {
.ant-rate {
display: flex;
font-size: 12px;
}
}
}
}
.level_icon {
width: 54px;
height: 16px;
margin-bottom: 4px;
display: block;
background-size: 100% 100%;
background-repeat: no-repeat;
.collection_state {
height: 32px;
display: flex;
justify-content: center;
align-items: center;
width: 92px;
background-color: #DAF3EE;
font-size: 12px;
color: #00A98F;
cursor: pointer;
&.level3 {
background-image: url(/static/imgs/level2@2x.png);
}
}
}
&>label {
margin-left: 4px;
cursor: pointer;
}
}
.commodity_list {
&_item {
position: relative;
......@@ -165,6 +162,10 @@
justify-content: center;
flex-direction: column;
&.float_right {
align-items: flex-end;
}
.commodity_shopname {
color: #909399;
font-size: 12px;
......@@ -306,16 +307,6 @@
}
}
.collection_state {
font-size: 12px;
color: #00B37A;
cursor: pointer;
&>label {
margin-left: 4px;
cursor: pointer;
}
}
.rate_wrap {
font-size: 12px;
......@@ -347,7 +338,10 @@
&_item {
position: relative;
display: flex;
margin-bottom: 16px;
margin-bottom: 8px;
border-radius: 8px;
background-color: #ffffff;
padding: 16px;
&_item {
flex: 1;
......@@ -355,8 +349,12 @@
justify-content: center;
flex-direction: column;
&.float_right {
align-items: flex-end;
}
&.morehalf {
flex: 4;
flex: 2;
}
.information_header_info {
......@@ -366,13 +364,13 @@
&_logo {
border-radius: 4px;
overflow: hidden;
width: 108px;
height: 72px;
margin-right: 16px;
width: 60px;
height: 40px;
margin-right: 12px;
&>img {
width: 108px;
height: 72px;
width: 60px;
height: 40px;
}
}
......@@ -430,18 +428,6 @@
color: #909399;
font-size: 12px;
}
.collection_state {
font-size: 12px;
color: #00B37A;
cursor: pointer;
&>label {
margin-left: 4px;
cursor: pointer;
}
}
}
}
}
src/pages/systemSetting/collection/information.tsx
View file @ 5b42d131
import React, { useEffect, useState } from 'react'
import cx from 'classnames'
import { Pagination, message, Modal } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { StarFilled, EyeOutlined, ClockCircleOutlined } from '@ant-design/icons'
import { PublicApi } from '@/services/api'
import { numFormat } from '@/utils/numberFomat'
......@@ -82,7 +83,7 @@ const Information: React.FC = () => {
}
return (
<>
<PageHeaderWrapper>
<div className={styles.information_list}>
{
list && list.map((item, index) => (
......@@ -113,7 +114,7 @@ const Information: React.FC = () => {
<div className={cx(styles.information_list_item_item)}>
<span className={styles.date}>{moment(item.collectTime).format("YYYY-MM-DD HH:mm")}</span>
</div>
<div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
<div className={cx(styles.information_list_item_item, styles.float_right)} onClick={() => handleCancelCollect(item)}>
<div className={cx(styles.collection_state)}>
<StarFilled />
<label>收藏</label>
......@@ -131,7 +132,7 @@ const Information: React.FC = () => {
</div>
)
}
</>
</PageHeaderWrapper>
)
}
......
src/pages/systemSetting/collection/logistics.tsx
View file @ 5b42d131
import React, { useEffect, useState } from 'react'
import cx from 'classnames'
import { Pagination, message, Modal } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { StarFilled } from '@ant-design/icons'
import { PublicApi } from '@/services/api'
import { LOGISTICS_CENTER_URL } from '@/constants'
......@@ -82,7 +83,7 @@ const Logistics: React.FC = () => {
}
return (
<>
<PageHeaderWrapper>
<div className={styles.information_list}>
{
list && list.map((item, index) => (
......@@ -102,7 +103,7 @@ const Logistics: React.FC = () => {
<div className={cx(styles.information_list_item_item)}>
<span className={styles.date}>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
</div>
<div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
<div className={cx(styles.information_list_item_item, styles.float_right)} onClick={() => handleCancelCollect(item)}>
<div className={cx(styles.collection_state)}>
<StarFilled />
<label>收藏</label>
......@@ -120,7 +121,7 @@ const Logistics: React.FC = () => {
</div>
)
}
</>
</PageHeaderWrapper>
)
}
......
src/pages/systemSetting/collection/process.tsx
View file @ 5b42d131
......@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
import cx from 'classnames'
import { Pagination, message, Modal } from 'antd'
import { StarFilled } from '@ant-design/icons'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import { PublicApi } from '@/services/api'
import { MANUFACTURE_CENTER_URL } from '@/constants'
import moment from 'moment'
......@@ -82,7 +83,7 @@ const Process: React.FC = () => {
}
return (
<>
<PageHeaderWrapper>
<div className={styles.information_list}>
{
list && list.map((item, index) => (
......@@ -102,7 +103,7 @@ const Process: React.FC = () => {
<div className={cx(styles.information_list_item_item)}>
<span className={styles.date}>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
</div>
<div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
<div className={cx(styles.information_list_item_item, styles.float_right)} onClick={() => handleCancelCollect(item)}>
<div className={cx(styles.collection_state)}>
<StarFilled />
<label>收藏</label>
......@@ -120,7 +121,7 @@ const Process: React.FC = () => {
</div>
)
}
</>
</PageHeaderWrapper>
)
}
......
src/pages/systemSetting/collection/purchase.tsx
View file @ 5b42d131
......@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react'
import cx from 'classnames'
import { Pagination, message, Modal } from 'antd'
import { StarFilled } from '@ant-design/icons'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import { PublicApi } from '@/services/api'
import { SRM_CENTER_URL } from '@/constants'
import moment from 'moment'
......@@ -82,7 +83,7 @@ const Purchase: React.FC = () => {
}
return (
<>
<PageHeaderWrapper>
<div className={styles.information_list}>
{
list && list.map((item, index) => (
......@@ -102,7 +103,7 @@ const Purchase: React.FC = () => {
<div className={cx(styles.information_list_item_item)}>
<span className={styles.date}>{moment(item.createTime).format("YYYY-MM-DD HH:mm")}</span>
</div>
<div className={cx(styles.information_list_item_item)} onClick={() => handleCancelCollect(item)}>
<div className={cx(styles.information_list_item_item, styles.float_right)} onClick={() => handleCancelCollect(item)}>
<div className={cx(styles.collection_state)}>
<StarFilled />
<label>收藏</label>
......@@ -120,7 +121,7 @@ const Purchase: React.FC = () => {
</div>
)
}
</>
</PageHeaderWrapper>
)
}
......
src/pages/systemSetting/collection/shops.tsx
View file @ 5b42d131
......@@ -2,8 +2,9 @@ import React, { useEffect, useState } from 'react'
import cx from 'classnames'
import { Rate, Pagination, Modal, message } from 'antd'
import { StarFilled } from '@ant-design/icons'
import shop_icon from '@/assets/imgs/shop_icon.png'
import credit_icon from '@/assets/imgs/credit_icon.png'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import ShopCredit from '@/components/ShopCredit'
import StarRate from '@/components/StarRate'
import { PublicApi } from '@/services/api'
import moment from 'moment'
import styles from './index.less'
......@@ -83,12 +84,12 @@ const Shops: React.FC = () => {
}
return (
<>
<PageHeaderWrapper>
<div className={styles.shops_list}>
{
list && list.map((item, index) => (
<div className={styles.shops_list_item} key={`shops_list_item_${index}`}>
<div className={cx(styles.shops_list_item_item, styles.morehalf)}>
<div className={cx(styles.shops_list_item_item)}>
<div className={styles.shop_header_info}>
<div className={styles.shop_header_info_logo}>
<img src={item.logo} />
......@@ -98,7 +99,8 @@ const Shops: React.FC = () => {
<span>{item.memberName}</span>
</div>
<div className={styles.shop_header_info_content_about}>
<div className={styles.shop_header_info_content_about_item}>
<ShopCredit creditPoint={item.creditPoint || 0} />
{/* <div className={styles.shop_header_info_content_about_item}>
<i className={styles.icon}><img src={shop_icon} /></i>
<span className={styles.red}>{item.registerYears || 0}</span>
<span>年</span>
......@@ -106,7 +108,7 @@ const Shops: React.FC = () => {
<div className={styles.shop_header_info_content_about_item}>
<i className={styles.icon}><img src={credit_icon} /></i>
<span>{item.creditPoint || 0}</span>
</div>
</div> */}
</div>
</div>
......@@ -116,13 +118,14 @@ const Shops: React.FC = () => {
{/* <i className={cx(styles.level_icon, styles.level3)}></i> */}
<div className={styles.rate_wrap}>
<span>满意度：</span>
<Rate disabled defaultValue={item.avgTradeCommentStar || 0} />
<StarRate value={item.avgTradeCommentStar || 0} />
{/* <Rate disabled defaultValue={item.avgTradeCommentStar || 0} /> */}
</div>
</div>
<div className={cx(styles.shops_list_item_item)}>
<span className={styles.date}>{moment(item.collectTime).format("YYYY-MM-DD HH:mm")}</span>
</div>
<div className={cx(styles.shops_list_item_item)}>
<div className={cx(styles.shops_list_item_item, styles.float_right)}>
<div className={cx(styles.collection_state)} onClick={() => handleCancelCollect(item)}>
<StarFilled />
<label>收藏</label>
......@@ -134,13 +137,13 @@ const Shops: React.FC = () => {
</div>
{
totalCount > 0 && (
totalCount > pageSize && (
<div className={styles.pagination_wrap}>
<Pagination showSizeChanger={false} current={current} total={totalCount} pageSize={pageSize} onChange={handleChange} />
</div>
)
}
</>
</PageHeaderWrapper>
)
}
......
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