diff --git a/src/components/knockGold/index.jsx b/src/components/knockGold/index.jsx
index bd6e83a8..edfd0dac 100644
--- a/src/components/knockGold/index.jsx
+++ b/src/components/knockGold/index.jsx
@@ -30,6 +30,7 @@ import MobileComponent from "./mobileComponent"
import rules from "./rules"
import WangEditor from "./wangEditor"
import YSFMobileComponent from "./ysf-mobileComponent"
+import ZFBMobileComponent from "./zfb-mobileComponent"
const cardTypeList = [
{ key: "1", text: "借记卡" },
{ key: "2", text: "信用卡" }
@@ -743,6 +744,16 @@ export default class addKnockGold extends Component {
if (newData.length < 1) this.setState({ warningInput: "" })
}
+ switchComponents() {
+ if (this.state.model.channel == 1 && this.state.model.receive_mode === 2) {
+ return
+ }
+ if (this.state.model.channel == 3) {
+ return
+ }
+ return
+ }
+
render() {
return (
@@ -787,18 +798,26 @@ export default class addKnockGold extends Component {
福建兴旺
-
- {
- this.onHandleChange(target.value, "receive_mode")
- }}
- value={this.state.model.receive_mode}
+ {this.state.model.channel == 1 ? (
+
- 支付宝
- H5页面
-
-
+ {
+ this.onHandleChange(target.value, "receive_mode")
+ }}
+ value={this.state.model.receive_mode}
+ >
+ 官方领取
+ 账号领取
+
+
+ ) : (
+ <>
+ )}
{
@@ -1500,12 +1519,7 @@ export default class addKnockGold extends Component {
-
- {this.state.model.channel != 3 ? (
-
- ) : (
-
- )}
+ {this.switchComponents()}
)
}
diff --git a/src/components/knockGold/index.less b/src/components/knockGold/index.less
index 314092f0..69ce6a5f 100644
--- a/src/components/knockGold/index.less
+++ b/src/components/knockGold/index.less
@@ -638,6 +638,16 @@
}
}
+.zfb-knockGoldViews {
+ background-color: #418be0 !important;
+
+ .left,
+ .right,
+ .form-button {
+ background: #418be0 !important;
+ }
+}
+
.r-f {
margin: 5px 0;
font-size: 11px;
diff --git a/src/components/knockGold/zfb-mobileComponent.jsx b/src/components/knockGold/zfb-mobileComponent.jsx
new file mode 100644
index 00000000..af897ce7
--- /dev/null
+++ b/src/components/knockGold/zfb-mobileComponent.jsx
@@ -0,0 +1,91 @@
+import { Placeholder } from "zent"
+import "./index.less"
+import TimeComponent from "./timeComponent"
+const widths = [24, 100, 100, 100, 80, 100, 100, 100, 80, 100, 100, 100, 80, 100, 100, 100, 100]
+export default ({ data }) => {
+ /* 动态font */
+ function fonts() {
+ const { denomination, reduce_amount } = data
+ const defaultCss = { a: "30px" }
+ const count =
+ String(parseFloat(denomination)).length + String(parseFloat(reduce_amount)).length + 1
+ if (count > 12) {
+ return {
+ a: 30 - (count - 12) * 1.8 + "px"
+ }
+ } else {
+ return defaultCss
+ }
+ }
+
+ return (
+
+
+
+
{data.batch_goods_name || "支付宝立减金"}
+
+
+ 满{data.denomination ? parseFloat(data.denomination) : 100.1}元减
+ {data.reduce_amount ? parseFloat(data.reduce_amount) : 99.99}元
+
+
+ 请在
+ {data.entry_time[0] || "2023-12-30 59:59:59"} ~{" "}
+ {data.entry_time[1] || "2023-12-30 59:59:59"}
+ 内领取
+
+
+
+ {data?.card_type.length > 0
+ ? data.card_type.map((item) => (item === "1" ? "借记卡" : "信用卡") + " ")
+ : "xxx"}
+
+
+
+
+
支付宝账号
+
+
+
您可在支付宝的个人信息中查看【支付宝账号】
+
+
+
+
+
+
+
+
+ {data.instruction || data.usable_time ? (
+ <>
+
+
活动说明
+
+
+ ) : (
+
+ )}
+
+
+
@@ -551,18 +562,26 @@ export default class addKnockGold extends Component {
随机
-
- {
- this.onHandleChange(target.value, "receive_mode")
- }}
- value={this.state.model.receive_mode}
+ {this.state.model.channel === 1 ? (
+
- 支付宝
- H5页面
-
-
+ {
+ this.onHandleChange(target.value, "receive_mode")
+ }}
+ value={this.state.model.receive_mode}
+ >
+ 官方领取
+ 账号领取
+
+
+ ) : (
+ <>
+ )}
-
- {this.state.model.channel !== 3 ? (
-
- ) : (
-
- )}
+ {this.switchComponents()}
)
}
diff --git a/src/components/redPackets/index.less b/src/components/redPackets/index.less
index 773256bf..73bcf748 100644
--- a/src/components/redPackets/index.less
+++ b/src/components/redPackets/index.less
@@ -388,8 +388,6 @@
}
}
-
-
#redPackets {
& {
border: 0;
@@ -635,4 +633,234 @@
}
}
+}
+
+#zfb-mobileComponent {
+ position: fixed !important;
+ top: 130px !important;
+ right: 90px !important;
+ border: 1px solid #e4e4e4;
+ border-radius: 5px;
+ font-size: 16px;
+ width: 375px !important;
+ box-sizing: border-box;
+ padding: 0 !important;
+ z-index: 1003;
+ overflow: auto;
+ scrollbar-width: none;
+ background-color: rgb(250, 67, 59);
+
+ &::-webkit-scrollbar {
+ display: none
+ }
+
+ .form {
+ margin: -20px 0 30px;
+ color: #fff;
+
+ .but {
+ max-width: 100%;
+ }
+ }
+
+ .mt0 {
+ margin-top: 0 !important;
+ }
+
+ .form-label {
+ font-size: 18px;
+ margin-left: 5px;
+ }
+
+ .form-input {
+ width: 100%;
+ height: 40px;
+ border-radius: 50px;
+ outline: 0;
+ border: .16px solid rgb(217, 216, 218);
+ background: #fffefe;
+ padding: 0 10px;
+ box-sizing: border-box;
+ margin: 10px 0;
+ font-size: 12px;
+ }
+
+ .form-input::placeholder {
+ color: rgb(204, 205, 209);
+ font-size: 14px;
+ }
+
+ .form-note {
+ font-size: 12px;
+ margin-left: 5px;
+ margin-bottom: 20px;
+ }
+
+ .top {
+ height: 500px;
+ position: relative;
+ }
+
+ .box {
+ padding: 15px 8px 20px;
+ box-sizing: border-box;
+ min-height: 667px;
+ width: 100%;
+ background: url('https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/zfb-red-banner.png') no-repeat top center;
+ background-size: 100%;
+ }
+
+ .effect_date {
+ font-size: 11px;
+ color: #FFC49C;
+ position: absolute;
+ top: 16%;
+ width: 100%;
+ text-align: center;
+ }
+
+ .effect_date>span {
+ background: linear-gradient(to left top, #ff6049, #fd322a);
+ border: 1px solid #ffc3a5;
+ border-radius: 20px;
+ padding: 4px 12px;
+ }
+
+ .bt {
+ top: 62%;
+ left: 22.5%;
+ position: absolute;
+ width: 200px;
+ }
+
+ .title {
+ font-size: 28px;
+ font-weight: bold;
+ color: #fff;
+ width: 100%;
+ text-align: center;
+ position: absolute;
+ top: 5%;
+ }
+
+ .type {
+ color: #FD3B2D;
+ font-size: 10px;
+ top: 40.2%;
+ width: 100%;
+ text-align: center;
+ position: absolute;
+ }
+
+ .type>span {
+ padding: 4px 12px;
+ background-color: #fdc9a2;
+ border-radius: 20px;
+ }
+
+ .money {
+ font-weight: bold;
+ color: #FE0F0B;
+ font-size: 40px;
+ top: 29.5%;
+ position: absolute;
+ width: 100%;
+ height: 42px;
+ display: flex;
+ align-items: flex-end;
+ justify-content: center;
+ }
+
+ .tag {
+ font-size: 16px;
+ display: inline-block;
+ margin-bottom: 4px;
+ }
+
+ .available_time {
+ text-align: left;
+ margin-bottom: 8px;
+
+ h3 {
+ font-size: 14px;
+ color: #171717;
+ padding-bottom: 5px;
+ margin-top: 5px;
+ box-sizing: border-box;
+
+ }
+
+ .timeList {
+ display: grid;
+ grid-template-columns: repeat(3, 33.33%);
+ text-align: center;
+
+ li {
+ margin: 3px 0;
+ font-size: 12px;
+ color: #a8a8a8;
+ }
+
+ }
+ }
+
+ .instruction-text {
+ font-size: 14px;
+ color: #171717;
+ padding-bottom: 5px;
+ margin-top: 5px;
+ box-sizing: border-box;
+ }
+
+ .instruction-box {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ }
+
+ .instruction {
+ width: 100%;
+ background: url('https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_text.png') no-repeat top center;
+ background-size: 100% 100%;
+ font-size: 12px;
+ color: #959595;
+ padding: 0 10px 10px;
+ box-sizing: border-box;
+ line-height: 20px;
+ }
+
+
+ .instruction-header {
+ width: 100%;
+ height: 43px;
+ background: url('https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/redPacktes/common_img_header.png') no-repeat;
+ background-size: 100%;
+ }
+
+ .TextBlock {
+ margin-top: 20px;
+ }
+
+ .notice {
+ width: 170px;
+ margin-bottom: 2px;
+ }
+
+ .instruction-2 {
+ margin-top: 10px;
+ }
+
+ .scroll {
+ height: 380px;
+ overflow: auto;
+ scrollbar-width: none;
+
+ &::-webkit-scrollbar {
+ display: none
+ }
+ }
+
+ .center {
+ text-align: center;
+ }
}
\ No newline at end of file
diff --git a/src/components/redPackets/zfb-mobileComponent.jsx b/src/components/redPackets/zfb-mobileComponent.jsx
new file mode 100644
index 00000000..1a144d19
--- /dev/null
+++ b/src/components/redPackets/zfb-mobileComponent.jsx
@@ -0,0 +1,107 @@
+import { Placeholder } from "zent"
+import "./index.less"
+import TimeComponent from "./timeComponent"
+const widths = [24, 100, 100, 100, 80, 100, 100, 100, 80, 100, 100, 100, 80, 100, 100, 100, 100]
+export default ({ data }) => {
+ /* 动态font */
+ function fonts() {
+ const { cash_amount_type, min_denomination, max_denomination } = data
+ const defaultCss = { b: "20px", a: "40px" }
+ if (cash_amount_type === "2") {
+ const count =
+ String(parseFloat(min_denomination)).length +
+ String(parseFloat(max_denomination)).length +
+ 1
+ if (count > 6) {
+ return {
+ a: 32 - (count - 6) * 1.1 + "px",
+ b: 20 - (count - 6) + "px"
+ }
+ } else {
+ return defaultCss
+ }
+ } else {
+ return defaultCss
+ }
+ }
+
+ return (
+
+
+
+
{data.batch_goods_name || 福利来袭 红包兑换}
+
+
+ 红包有限期截止:
+ {data.effect_date[1] || "2023-12-30 23:59:59"}
+
+
+
+
+ ￥
+
+ {data.cash_amount_type === "1"
+ ? parseFloat(data.denomination || 0.01)
+ : `${parseFloat(data.min_denomination || 0.01)}~${parseFloat(
+ data.max_denomination || 88.88
+ )}`}
+
+
+ {data.cash_amount_type === "1" ? "固额红包" : "随机红包"}
+
+
+
+
支付宝账号
+
+
+
您可在支付宝的个人信息中查看【支付宝账号】
+
+
+
+
+
+
+
+ 
+
+
+ {data.instruction || [1, 2, 3].includes(data.receive_type) ? (
+ <>
+
+
使用规则
+
+
+ ) : (
+
+ )}
+
+
+
+
+