shenwu 2 mēneši atpakaļ
vecāks
revīzija
e2c7d4e453
1 mainītis faili ar 47 papildinājumiem un 32 dzēšanām
  1. 47 32
      src/pages/ldPage/index.tsx

+ 47 - 32
src/pages/ldPage/index.tsx

@@ -28,10 +28,9 @@ function LdPage() {
                     content?.elementsSpecList?.map((item, index) => {
                         if (item.elementType === "QR_CODE") {
                             let url = res.data.data.qrCodeList.find(q => q.siteId == item.id)?.urlList[0]
-                            obj[item.elementType] = { ...item, url, eq: index }
+                            obj[item.elementType] = obj[item.elementType] ? [...obj[item.elementType], { ...item, url, eq: index }] : [{ ...item, url, eq: index }]
                         } else if (item.elementType === "FLOAT_BUTTON") {
                             let url = res.data.data.qrCodeFloatList.find(q => q.siteId == item.id)?.urlList[0]
-                            console.log("url", url)
                             obj[item.elementType] = { ...item, url, eq: index }
                         } else if (item.elementType === "TEXT") {
                             obj[item.elementType] = obj[item.elementType] ? [...obj[item.elementType], { ...item, eq: index }] : [{ ...item, eq: index }]
@@ -40,6 +39,8 @@ function LdPage() {
                         } else {
                             obj[item.elementType] = { ...item, eq: index }
                         }
+                        obj["bgColor"] = content["bgColor"]
+                        obj["pageName"] = content["pageName"]
                     })
                     setDate({ ...res.data.data, ...obj })
                 }
@@ -50,47 +51,61 @@ function LdPage() {
     const onLongPress = (str) => {
         console.log("用户长按了二维码:", str)
     }
+    console.log("data", data)
     return <View >
-        <View style={{ marginTop: (systemInfo.statusBarHeight as any) + 10 }}></View>
-        {/* 标题 */}
-        <View style={{ textAlign: 'center', paddingBottom: 10 }}>{data ? data["name"] : ""}&nbsp;</View>
-        {/* 内容 */}
-        <View style={{ height: `calc(100vh - ${(systemInfo.statusBarHeight || 0) + 32}px)`, backgroundColor: "#d5e8d6", overflowY: "auto" }}>
-            {
-                data ? <View style={{ display: 'flex', flexFlow: 'column', paddingBottom: 100 }}>
+        {data && <>
+            <View style={{ marginTop: (systemInfo.statusBarHeight as any) + 10 }}></View>
+            {/* 标题 */}
+            <View style={{ textAlign: 'center', paddingBottom: 10 }}>{data ? data["pageName"] : data["name"] || ""}&nbsp;</View>
+            {/* 内容 */}
+            {data["bgColor"] ? <View style={{ height: `calc(100vh - ${(systemInfo.statusBarHeight || 0) + 32}px)`, backgroundColor: data ? data["bgColor"] : "#d5e8d6", overflowY: "auto" }}>
+                <View style={{ display: 'flex', flexFlow: 'column', paddingBottom: 100 }}>
                     {/* 顶图 */}
                     {data["TOP_IMAGE"] && <Image src={data["TOP_IMAGE"].url} mode="widthFix" style={{ height: "auto", width: "100vw", order: data["TOP_IMAGE"].eq }} />}
                     {/* 文本 */}
-                    {data["TEXT"] && data["TEXT"].map((textObj, index) => {
-                        return index === 0 ? <View style={{ fontSize: 24, fontWeight: "bold", color: "", padding: "10px 20px", display: 'grid', gap: 10, order: textObj.eq }}>{textObj?.text?.split(/\s/ig)?.map((item, index) => {
-                            return <View style={index === 0 ? { color: "#D0021B", marginBottom: -10 } : {}}>{item}</View>
-                        })}</View> : <View style={{ fontSize: 24, fontWeight: "bold", color: "", padding: "10px 20px", display: 'grid', gap: 10, order: textObj.eq }}>{textObj?.text?.split(/\s/ig)?.map((item, index) => {
-                            return <View>{item}</View>
-                        })}</View>
+                    {data["TEXT"] && data["TEXT"].map((textObj) => {
+                        let { text, eq, elementType, comptActive, ...styles } = textObj
+                        return <View dangerouslySetInnerHTML={{ __html: text }} style={{ paddingLeft: 24, paddingRight: 24, whiteSpace: "pre-wrap", order: eq, ...styles }}></View>
                     })}
                     {/* 图 */}
-                    {data["IMAGE"] && data["IMAGE"].map((imgObj, index) => {
-                        return <Image src={imgObj.url} mode="widthFix" style={{ height: "auto", width: "100vw", order: imgObj.eq }} />
+                    {data["IMAGE"] && data["IMAGE"].map((imgObj) => {
+                        let { eq, elementType, comptActive, url, ...styles } = imgObj
+                        return <Image src={url} mode="widthFix" style={{ height: "auto", width: "100vw", order: imgObj.eq, ...styles }} />
                     })}
                     {/* 二维码 */}
-                    {data["QR_CODE"] && <Image src={data["QR_CODE"].url} onLongPress={() => { onLongPress("QR_CODE") }} mode="widthFix" showMenuByLongpress style={{ height: "auto", width: "70vw", display: 'block', margin: '0 auto', order: data["QR_CODE"].eq }} />}
-                    {/* 动图 */}
-                    {/* <Image src={"https://app-cloud-images.oss-cn-hangzhou.aliyuncs.com/1768559009681.gif"} mode="widthFix" style={{ height: "auto", width: "100vw", marginTop: -30, paddingBottom: 70 }} /> */}
-                    {/* 企业微信客服按钮 - 联系我插件 */}
-                    {/* <View>
-                        <contact-cell
-                            startmessage={startMessage}
-                            completemessage={completeMessage}
-                            plugid='4bed1d4b8d3edf6980c392f61f482077'
-                            style={{ width: '40px', height: '40px' }}
-                            styleType={2}
-                        />
-                    </View> */}
+                    {data["QR_CODE"] && data["QR_CODE"].map((qrObj) => {
+                        let { eq, elementType, comptActive, url, id, imageList, ...styles } = qrObj
+                        return <Image src={url} mode="widthFix" onLongPress={() => { onLongPress("QR_CODE") }} showMenuByLongpress style={{ height: "auto", width: "100vw", order: eq, boxSizing: "border-box", ...styles }} />
+                    })}
                     {/* 底部浮选图 */}
                     {data["FLOAT_BUTTON"] && <Image src={data["FLOAT_BUTTON"].url} mode="widthFix" onLongPress={() => { onLongPress("FLOAT_BUTTON") }} showMenuByLongpress style={{ height: "auto", width: "100vw", position: 'fixed', bottom: 0, left: 0, zIndex: 999, order: data["FLOAT_BUTTON"].eq }} />}
-                </View> : <View></View>
+                </View>
+            </View> : <View style={{ display: 'flex', flexFlow: 'column', paddingBottom: 100 }}>
+                {/* 顶图 */}
+                {data["TOP_IMAGE"] && <Image src={data["TOP_IMAGE"].url} mode="widthFix" style={{ height: "auto", width: "100vw", order: data["TOP_IMAGE"].eq }} />}
+                {/* 文本 */}
+                {data["TEXT"] && data["TEXT"].map((textObj, index) => {
+                    return index === 0 ? <View style={{ fontSize: 24, fontWeight: "bold", color: "", padding: "10px 20px", display: 'grid', gap: 10, order: textObj.eq }}>{textObj?.text?.split(/\s/ig)?.map((item, index) => {
+                        return <View style={index === 0 ? { color: "#D0021B", marginBottom: -10 } : {}}>{item}</View>
+                    })}</View> : <View style={{ fontSize: 24, fontWeight: "bold", color: "", padding: "10px 20px", display: 'grid', gap: 10, order: textObj.eq }}>{textObj?.text?.split(/\s/ig)?.map((item, index) => {
+                        return <View>{item}</View>
+                    })}</View>
+                })}
+                {/* 图 */}
+                {data["IMAGE"] && data["IMAGE"].map((imgObj) => {
+                    return <Image src={imgObj.url} mode="widthFix" style={{ height: "auto", width: "100vw", order: imgObj.eq }} />
+                })}
+                {/* 二维码 */}
+                {data["QR_CODE"] && data["QR_CODE"].map((qrObj) => {
+                   return <Image src={qrObj.url} onLongPress={() => { onLongPress("QR_CODE") }} mode="widthFix" showMenuByLongpress style={{ height: "auto", width: "70vw", display: 'block', margin: '0 auto', order: qrObj.eq }} />
+                })}
+                {/* 动图 */}
+                {/* <Image src={"https://app-cloud-images.oss-cn-hangzhou.aliyuncs.com/1768559009681.gif"} mode="widthFix" style={{ height: "auto", width: "100vw", marginTop: -30, paddingBottom: 70 }} /> */}
+                {/* 底部浮选图 */}
+                {data["FLOAT_BUTTON"] && <Image src={data["FLOAT_BUTTON"].url} mode="widthFix" onLongPress={() => { onLongPress("FLOAT_BUTTON") }} showMenuByLongpress style={{ height: "auto", width: "100vw", position: 'fixed', bottom: 0, left: 0, zIndex: 999, order: data["FLOAT_BUTTON"].eq }} />}
+            </View>
             }
-        </View>
+        </>}
     </View>
 }