feat:登录注册也图片和协议接口对接

package.json

@@ -42,7 +42,7 @@
     "copy-to-clipboard": "^3.3.1",
     "god": "0.1.28",
     "lingxi-design": "^1.0.7",
-    "lingxi-design-ui": "^1.1.5",
+    "lingxi-design-ui": "^1.1.7",
     "lingxi-editor-core": "^1.0.6",
     "lingxi-web": "^1.0.6",
     "lint-staged": "^10.0.7",

src/components/ImageBox/index.less

@@ -4,4 +4,10 @@
     background-repeat: no-repeat;
     background-position: center center;
   }
+
+  &.column {
+    .image_box_img {
+      background-size: auto 100%;
+    }
+  }
 }
\ No newline at end of file

src/components/ImageBox/index.tsx

@@ -8,14 +8,15 @@ interface ImageBoxPropsType {
   height?: number;
   imgUrl: string;
   className?: any;
+  direction?: "column" | "row"
 }
 
 const ImageBox: React.FC<ImageBoxPropsType> = (props) => {
 
-  const { width = 120, height = 80, imgUrl = "", className } = props
+  const { width = 120, height = 80, imgUrl = "", className, direction = "row" } = props
 
   return (
-    <div className={styles.image_box}>
+    <div className={cx(styles.image_box, direction === 'column' ? styles.column : '')}>
       <div className={cx(styles.image_box_img, className)} style={{ backgroundImage: `url(${imgUrl})`, width: `${width}px`, height: `${height}px` }}></div>
     </div>
   )

src/pages/lxMall/components/Information/index.tsx

@@ -115,7 +115,7 @@ const Information: React.FC<InformationPropsType> = (props) => {
         <div className={styles.information_header}>
           <span>行情资讯</span>
           <label>{renderColumns()}</label>
-          <a href={toMoreLink()} className={styles.more_link}>更多好货 <RightOutlined /></a>
+          <a href={toMoreLink()} className={styles.more_link}>更多资讯 <RightOutlined /></a>
         </div>
         <div className={styles.information_list}>
 

src/pages/user/agreement/index.less

@@ -16,7 +16,7 @@
   }
 
   & article {
-    padding-bottom: 200px;
+    padding: 50px;
 
     h4 {
       width: 96px;

src/pages/user/agreement/index.tsx

-import React from 'react'
+import React, { useEffect, useState } from 'react'
+import { PublicApi } from '@/services/api';
 import styles from './index.less'
+import Loading from '@/components/Loading';
 
-const Agreement: React.FC = () => {
+interface AgreementPropsType {
+  location: any
+}
+
+const Agreement: React.FC<AgreementPropsType> = (props) => {
+  const { id } = props.location.query
+  const [agreementInfo, setAgreementInfo] = useState<any>()
+
+  useEffect(() => {
+    fetchAgreement()
+  }, [])
+
+  const fetchAgreement = () => {
+    let param = {
+      columnType: 2
+    }
+    //@ts-ignore
+    PublicApi.getManageContentNoticeFindAllByColumnType(param).then(res => {
+      if (res.code === 1000) {
+        initData(res.data)
+      }
+    })
+  }
+
+  const initData = (data) => {
+    let result = null
+    if (data) {
+      for (let item of data) {
+        if (item.id === Number(id)) {
+          result = item
+        }
+
+      }
+    }
+    setAgreementInfo(result)
+  }
 
-  return (
+  return agreementInfo ? (
     <div className={styles.policyBox}>
-      <h1>隐私政策</h1>
+      <h1>{agreementInfo.title}</h1>
       <div className={styles.policyBox_container}>
-        <article>
+        <article dangerouslySetInnerHTML={{ __html: agreementInfo.content }}></article>
+        {/* <article>
           <h4>一、权利归属</h4>
           <main>
             <p>1.1. 涂鸦网站的Logo、“涂鸦”、“涂鸦智能”、“tuya”等文字、图形及其组合，以及涂鸦网站的其他标识、徽记、涂鸦服务的名称等为涂鸦及其关联公司在中国和其他国家的注册商标。未经涂鸦书面授权，任何人不得以任何方式展示、使用或做其他处理（包括但不限于复制、传播、展示、镜像、上传、下载），也不得向他人表明您有权展示、使用或做其他处理。</p>
@@ -20,10 +58,10 @@ const Agreement: React.FC = () => {
             <p>2.2. 涂鸦网站所有的产品、服务、技术与所有程序（以下或简称“技术服务”）的知识产权均归属于涂鸦或归其权利人所有。</p>
             <p>2.3. 除非涂鸦另行声明，涂鸦拥有涂鸦在网站内发布文档等信息（包括但不限于文字、图形、图片、照片、音频、视频、图标、色彩、版面设计、电子文档）的所有权利（包括但不限于版权、商标权、专利权、商业秘密和其他所有相关权利）。未经涂鸦许可，任何人不得擅自使用如上内容（包括但不限于通过程序或设备监视、复制、转播、展示、镜像、上传、下载涂鸦网站内的任何内容）。被授权浏览、复制、打印和传播属于涂鸦网站内信息内容的，该等内容都不得用于商业目的且所有信息内容及其任何部分的使用都必须包括此权利声明。</p>
           </main>
-        </article>
+        </article> */}
       </div>
     </div>
-  )
+  ) : <Loading />
 }
 
 export default Agreement

src/pages/user/index.less

 @import '~@/global/styles/global.less';
+
 #root {
 
   .loginItem {
     flex: 1;
   }
-  
+
   .loginCtl {
     position: relative;
     background: @white;
   }
-  
+
   .loginWrap {
     padding: 141px 0 102px;
   }
-  
+
   .readyLogin {
     text-align: center;
     margin-top: 24px;
   }
-  
+
   .loginMain {
     position: relative;
     background: @white;
     padding: 64px 56px 0;
     color: #909399;
-  
+
     &>h2 {
       font-size: 32px;
       margin-bottom: 32px;
     }
-  
+
     .clickUsernameLogin {
       .ab-position(right, top, 8, 8);
       font-size: 14px;
       color: rgba(107, 119, 140, 1);
     }
-  
+
     .clickScanLogin {
       // .center-text();
       .ab-position(right, top, 8, 8);
@@ -43,74 +44,74 @@
       height: 32px;
       background: url("../../../mockStatic/qr_code1.png") center center no-repeat;
       background-size: cover;
-  
+
       &:hover {
         background: url("../../../mockStatic/qr_code2.png") center center no-repeat;
       }
     }
-  
+
     .scanTips {
       .make-center(flex);
       font-size: 12px;
       color: rgba(107, 119, 140, 1);
-  
+
       .scanIcon {
         font-size: 30px;
         margin-right: @margin-sm;
       }
     }
   }
-  
+
   .loginDesc {
-    background: url("../../../mockStatic/image_ad.png") center center no-repeat;
+    // background: url("../../../mockStatic/image_ad.png") center center no-repeat;
     background-size: cover;
-  
+
     .adBox {
       color: @white;
       .make-center(text);
-  
+
       & h2 {
         margin-top: 20px;
         .font-height-color(32, 80, @white);
         letter-spacing: 2px;
       }
-  
+
       & p {
         padding: 10px 60px;
         text-indent: 2em;
       }
     }
   }
-  
+
   .thirdLogin {
     height: 64px;
     background: #FAFBFC;
     margin-top: 90px;
-  
+
     & a {
       margin-left: 6px;
       .make-center(text);
       vertical-align: middle;
     }
   }
-  
+
   .loginVerBtn {
     background: #EBF7F2;
   }
-  
+
   .scanLoginWrap {
     .make-center(text);
-  
+
     &>h2 {
       color: #909399;
     }
-  
+
     .qrCodeImage {
       .make-center(text);
       width: 224px;
       height: 224px;
       .make-center-space(margin, 30, 18);
-  
+
       &>img {
         .make-center(block);
         width: 100%;
@@ -118,17 +119,18 @@
       }
     }
   }
-  
+
   .mr_t-40 {
     margin-top: 40px;
   }
+
   .mr_t-24 {
     margin-top: 24px;
   }
-  
+
   // register
   .register {
-  
+
     // width: 100%;
     &>h3 {
       padding: 40px 0;
@@ -137,17 +139,20 @@
       margin-bottom: 0;
     }
   }
+
   .registerForm {
     max-width: 335px;
     margin: 0px auto;
     padding-top: 40px;
   }
+
   .registerBox {
     width: 100%;
     min-height: 700px;
     padding-bottom: 40px;
     background: #fff;
     padding-bottom: 40px;
+
     .stepWrap {
       height: 72px;
       background: #FAFBFC;
@@ -155,14 +160,14 @@
       .make-center(flexAlign);
     }
   }
-  
-  
-  
+
+
+
   .formBoxStep1 {
     width: 324px;
     .make-center-space(margin, 40, 0);
   }
-  
+
   .formBefore {
     width: 54px;
     .font-height-color(undefined, 40, #606266, #F4F5F7);
@@ -170,68 +175,68 @@
     border: 1px solid #DFE1E6;
     border-right: 0;
   }
-  
+
   .formBoxStep2 {
     width: 704px;
     .make-center(margin);
-  
+
     & h3 {
       margin-top: 48px;
     }
   }
-  
+
   .continueButton {
     .make-center(block);
     width: 340px;
     height: 40px;
     .make-center-space(margin, 8);
   }
-  
-  
+
+
   .formBoxStep3 {
     width: 704px;
     .make-center(margin);
     .make-center(text);
-  
+
     & .description {
       margin-bottom: 40px;
-  
+
       & p {
         .font-height-color(14, 20, #606266);
       }
     }
-  
+
     &.guid {
       .font-height-color(14, 22, #909399);
     }
-  
+
     & h2 {
       font-size: 24px;
       color: rgba(23, 43, 77, 1);
       margin: 24px 0;
     }
-  
+
     & img {
       display: block;
       .make-center(margin);
     }
   }
-  
+
   .agreement {
     font-size: 12px;
   }
-  
+
   .checkTypes {
     width: 702px;
     .make-center(margin);
   }
-  
+
   .margin320 {
     width: 320px;
     .make-center(margin);
     display: block;
   }
-  
+
   .default {
     width: 148px;
     margin-right: 24px;
@@ -239,12 +244,12 @@
     .make-center(text);
     height: 32px;
     line-height: 32px;
-  
+
     &:nth-child(2n) {
       margin-right: 0;
     }
   }
-  
+
   .large {
     width: 320px;
     margin-bottom: 24px;
@@ -252,13 +257,13 @@
     height: 48px;
     line-height: 48px;
   }
-  
+
   .btnCenter {
     width: 320px;
     .make-center(margin);
     display: block;
   }
-  
+
   // get back password
   .getBackBox {
     &>h2 {
@@ -266,14 +271,14 @@
       .make-center(text);
       .font-height-color(24, 120, #303133);
     }
-  
+
     .getBackForm {
       background-color: @white;
-  
+
       .formBox {
         width: 320px;
         .make-center-space(margin, 40, 40);
-  
+
         .back {
           width: 100%;
           .make-center(block);
@@ -283,28 +288,28 @@
       }
     }
   }
-  
+
   // policy
   .policyBox {
     width: 100%;
     // height: 100vh;
     background-color: #fff;
-  
+
     &>h1 {
       .font-height-color(24, 96, #303133, #F4F5F7);
       .make-center(text)
     }
-  
+
     & article {
       padding-bottom: 200px;
-  
+
       h4 {
         width: 96px;
         .font-height-color(16, 48, #303133);
         font-weight: 500;
         margin-top: 24px;
       }
-  
+
       p {
         font-size: 14px;
         color: rgba(66, 82, 110, 1);
@@ -312,6 +317,6 @@
       }
     }
   }
-  
-  
-}
+
+
+}
\ No newline at end of file

src/pages/user/index.tsx

-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import globalStyles from '@/global/styles/global.less';
 import './index.less'
 import cx from 'classnames';
-import { Row, Col, Form, Input, Button, Space } from 'antd';
+import { Row, Col, Space, Carousel } from 'antd';
+import ImageBox from '@/components/ImageBox'
 import TextLink from '@/components/TextLink';
 import {
   ExclamationCircleFilled,
   ScanOutlined
-} from '@ant-design/icons';
+} from '@ant-design/icons'
 import { Link, history } from 'umi'
 import ScanLoginWrap from './components/ScanLoginWrap';
 // import leftPicture from '../../../mockStatic/image_ad.png'
+import { PublicApi } from '@/services/api'
+import { GetManageContentImageFindAllByUseSceneAndPositionResponse } from '@/services/PassApi'
 import wechat from '../../../mockStatic/Wechat.png'
 import qq from '../../../mockStatic/QQ.png'
 import alipay from '../../../mockStatic/Alipay.png'
-import LoginWrap from './components/LoginWrap';
+import LoginWrap from './components/LoginWrap'
 
 const User: React.FC = () => {
   const [isScanQrCode, setIsScanQrCode] = useState(false)
+  const [sceneList, setSceneList] = useState<GetManageContentImageFindAllByUseSceneAndPositionResponse>()
 
   const handleGuideLogin = (param: boolean) => {
     setIsScanQrCode(param)
@@ -28,13 +32,32 @@ const User: React.FC = () => {
     console.log('找回密码')
   }
 
+  useEffect(() => {
+    fetchUseScene()
+  }, [])
+
+  const fetchUseScene = () => {
+    let param = {
+      useScene: 1,
+      position: 1
+    }
+    //@ts-ignore
+    PublicApi.getManageContentImageFindAllByUseSceneAndPosition(param).then(res => {
+      if (res.code === 1000) {
+        setSceneList(res.data)
+      }
+    })
+  }
+
   return (
     <Row className={cx('loginWrap', globalStyles.lingxiBusinessContent1024)}>
       <Col className={cx('loginItem', 'loginDesc')}>
         <div className={'adBox'}>
-          {/*<img src={leftPicture} alt="数商云"/>*/}
-          <h2>欢迎来到数商云</h2>
-          <p>广州市数商云网络科技有限公司（软件企业编号：粤RO-2018-0284 | 高新科技企业编号：GR201844008227），简称「数商云」，是一家领先的企业全链数字化运营服务提供商。致力于通过大数据、云计算等新技术协助企业打造渠道端—营销端—数据端等全链数字化运营体系，全面提升企业运营效益与智慧数字化商业转型。自2013年成立以来，数商云致力于提供企业数字化运营产品及解决方案。目前，数商云拥有数商云贸、数商云销、数商云批、数商云MA、数商云DMP五大产品，分别为企业提供大型B2B供应链电商系统开发、企业级B2C电商系统开发、批发销售管理系统、大数据营销自动化、大数据管理平台全链数字化运营解决方案。</p>
+          <Carousel autoplay>
+            {
+              sceneList && sceneList.map(item => <ImageBox direction={"column"} width={512} height={550} imgUrl={item.imageUrl} />)
+            }
+          </Carousel>
         </div>
       </Col>
       <Col className={cx('loginItem', 'loginCtl')}>

src/pages/user/register.tsx

@@ -66,6 +66,8 @@ const UserRegistry = () => {
   const [current, setCurrent] = useState(0)
   const [subStep, setSubStep] = useState(false)
   const [submitLoading, setSubmitLoading] = useState(false)
+  const [agreementList, setAgreementList] = useState([])
+
   const stepList = [
     { title: '填写信息', key: 'message', name: 'message' },
     { title: '完善资料', key: 'over', name: 'over' },
@@ -84,7 +86,7 @@ const UserRegistry = () => {
     //@ts-ignore
     PublicApi.getManageContentNoticeFindAllByColumnType(param).then(res => {
       if (res.code === 1000) {
-
+        setAgreementList(res.data)
       }
     })
   }
@@ -233,9 +235,9 @@ const UserRegistry = () => {
             phoneBefore: <div className={'formBefore'}>+86</div>,
             smsCodeAfter: <Button disabled={isActive} style={{ minWidth: 110, marginLeft: 8 }} size='large' onClick={start}>{text}</Button>,
             checkBoxChildren: <span style={{ fontSize: 12 }}>阅读并同意<span className='commonPickColor'>
-              <a href="/user/agreement" target="_blank">《会员服务协议》</a>
-              <a href="/user/agreement" target="_blank">《法律条款》</a>
-              <a href="/user/agreement" target="_blank">《隐私政策》</a>
+              {
+                agreementList && agreementList.map(item => (<a key={`aggreem_${item.id}`} href={`/user/agreement?id=${item.id}`} target="_blank">《{item.title}》</a>))
+              }
             </span>
             </span>,
             memberTypeTitle: <span className={'commonPanelTitle'}>请选择您的身份</span>,