diff --git a/src/components/moveBtn/index.module.scss b/src/components/moveBtn/index.module.scss index 3954ef6..ae2e259 100644 --- a/src/components/moveBtn/index.module.scss +++ b/src/components/moveBtn/index.module.scss @@ -70,7 +70,7 @@ .video_box { border-radius: 16px; - width: 300px; + width: 250px; height: 300px; // background-color: red; position: relative; @@ -86,14 +86,25 @@ position: absolute; bottom: -100px; z-index: 999; - text-align: center; width: 100%; height: 40px; line-height: 40px; + display: flex; + align-items: center; background-color: #337fff; - color: #fff; - border-bottom-left-radius: 16px; - border-bottom-right-radius: 16px; - font-size: 26px; + // border-bottom-left-radius: 16px; + // border-bottom-right-radius: 16px; + border-radius: 16px; + + .fonts { + width: 140px; + height: 40px; + color: #fff; + font-size: 26px; + margin-left: 10px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } } } diff --git a/src/components/moveBtn/index.tsx b/src/components/moveBtn/index.tsx index 42da56e..14669ee 100644 --- a/src/components/moveBtn/index.tsx +++ b/src/components/moveBtn/index.tsx @@ -14,6 +14,8 @@ import { formatImgUrl } from '@/common/fotmat' import { ORDER_STATUS } from '@/common/enum' import IconFont from '@/components/iconfont/iconfont' import { IMG_CND_Prefix } from '@/common/constant' +import DotLoading from '@/components/dotLoading' +import { MallCherryestimate_catevideoview } from '@/api/material' type ShowStatus = 'shop'|'customer'|'order'|'code' interface param { @@ -114,6 +116,16 @@ const MoveBtn = ({ showFloatVideo = false, floatVideoFile = [], playVideo = true } }, [playVideo]) + const { fetchData: viewNumsFetch } = MallCherryestimate_catevideoview() + + const handSee = async(e) => { + console.log(e, 'eeeee') + if (e.detail.fullScreen) { + await viewNumsFetch({ id: floatVideoFile[0]?.estimate_video_id }) + } + // e.stopPropagation() + } + return ( {children} @@ -152,7 +164,7 @@ const MoveBtn = ({ showFloatVideo = false, floatVideoFile = [], playVideo = true className={classnames(styles.moveBtn, showVido && showFloatVideo ? styles.no_bg_moveBtn_next : styles.no_bg_moveBtn_next_ever)} direction="all" inertia - x="470rpx" + x="500rpx" y="100rpx" > @@ -161,14 +173,21 @@ const MoveBtn = ({ showFloatVideo = false, floatVideoFile = [], playVideo = true - {floatVideoFile?.[0]?.title} + + + + + + {floatVideoFile?.[0]?.title} + } {showCode && } diff --git a/src/pages/details/index.module.scss b/src/pages/details/index.module.scss index a79be42..1f687cb 100644 --- a/src/pages/details/index.module.scss +++ b/src/pages/details/index.module.scss @@ -188,7 +188,7 @@ page { padding-top: 30px; // width: 100%; border-radius: 16px; - height: 450px; + // height: 450px; background-color: #fff; margin-top: 25px; margin-bottom: 25px; @@ -205,16 +205,16 @@ page { // margin-left: 40px; // margin-top: 30px; margin: 20px; - width: 300px; - height: 190px; + width: 250px; + // height: 190px; position: relative; .cricle { position: absolute; - top: 20px; - right: 20px; - width: 40px; - height: 40px; + top: 90px; + right: 80px; + width: 90px; + height: 90px; border-radius: 50%; background-color: #c7c7c7; display: flex; @@ -226,7 +226,7 @@ page { margin-left: 20px; width: 0px; height: 0px; - border: 15px solid transparent; /*以下四个样式对应四种三角形,任选其一即可实现*/ + border: 20px solid transparent; /*以下四个样式对应四种三角形,任选其一即可实现*/ /* border-top-color:lightseagreen; */ border-left-color: #fff; // border-right-color: lightseagreen; @@ -234,34 +234,46 @@ page { } } .img_style { - border-top-right-radius: 16px; - border-top-left-radius: 16px; + border-top-right-radius: 8px; + border-top-left-radius: 8px; // top: 0; // left: 0; position: absolute; z-index: 12; - width: 300px; - height: 242px; + width: 250px; + height: 270px; } - .bottom_box { - position: absolute; - bottom: -102px; - z-index: 50; - text-align: center; - width: 100%; - height: 50px; - line-height: 50px; - background-color: #c9c9c9; - color: #fff; - border-bottom-left-radius: 16px; - border-bottom-right-radius: 16px; - font-size: 26px; - } - .title_name { - text-align: center; - font-size: 28px; - margin-top: 10px; + .bottom_big { + margin-top: -12px; + width: 247px; + height: 100px; + border: 1px solid #d0d0d0; + border-bottom-left-radius: 8px; + border-bottom-right-radius: 8px; + .bottom_box { + // position: absolute; + // bottom: -102px; + // z-index: 50; + // text-align: center; + margin-top: 10px; + margin-left: 10px; + width: 100%; + height: 50px; + // line-height: 50px; + // background-color: #c9c9c9; + color: #343434; + font-weight: 500; + + font-size: 26px; + } + .title_name { + // text-align: center; + font-size: 28px; + margin-left: 10px; + color: #999999; + // margin-top: 10px; + } } } .tag_box { diff --git a/src/pages/details/index.tsx b/src/pages/details/index.tsx index 06643a9..622d490 100644 --- a/src/pages/details/index.tsx +++ b/src/pages/details/index.tsx @@ -375,7 +375,7 @@ const Details = (props: Params) => { 商品参数 { - productInfo.is_instruct && setshowPopup(true)}>{'特色百科 >'} + productInfo.is_instruct && setshowPopup(true)}>{'详细信息 >'} } @@ -427,7 +427,7 @@ const Details = (props: Params) => { mode="aspectFill" > - {item.title} - {item.result} + + {item.title} + {item.result} + ) })