diff --git a/src/components/searchInput/index.module.scss b/src/components/searchInput/index.module.scss
index 04d420f..be5208e 100644
--- a/src/components/searchInput/index.module.scss
+++ b/src/components/searchInput/index.module.scss
@@ -1,40 +1,81 @@
-
-.searchInput_main{
+.searchInput_main {
+  display: flex;
+  min-height: 62px;
+  align-items: center;
+  border-bottom: 1px solid #f0f0f0;
+  .searchInput_title {
+    min-width: 145px;
+    min-height: 50px;
+    font-size: 28px;
+    color: $color_font_two;
+    margin-right: 20px;
+    padding-left: 20px;
     display: flex;
-    min-height: 62px;
     align-items: center;
-    border-bottom: 1px solid #F0F0F0;
-    .searchInput_title {
-        min-width: 145px;
-        min-height: 50px;
-        font-size: 28px;
-        color: $color_font_two;
-        margin-right: 20px;
-        padding-left: 20px;
-        display: flex;
-        align-items: center;
-        position: relative;
-        &::before{
-            content: "";
-            height: 30px;
-            width: 1px;
-            background-color: #F0F0F0;
-            position: absolute;
-            right: 0;
-        }
+    position: relative;
+    &::before {
+      content: '';
+      height: 30px;
+      width: 1px;
+      background-color: #f0f0f0;
+      position: absolute;
+      right: 0;
     }
-    .searchInput_con{
-        flex:1;
-        width: 100%;
-        display: flex;
-        width: 100%;
-        align-items: center;
-        input{
-            font-size: 26px;
-        }
+  }
+  .searchInput_con {
+    flex: 1;
+    width: 100%;
+    display: flex;
+    width: 100%;
+    align-items: center;
+    input {
+      font-size: 26px;
     }
-    .icon_more_self{
-        font-size: 28px;
-        color: $color_font_two;
+  }
+  .icon_more_self {
+    font-size: 28px;
+    color: $color_font_two;
+  }
+}
+
+.searchActive {
+  display: flex;
+  min-height: 62px;
+  align-items: center;
+  border-bottom: 1px solid #f0f0f0;
+  justify-content: space-between;
+  .searchInput_title {
+    min-width: 145px;
+    min-height: 50px;
+    font-size: 28px;
+    color: $color_font_two;
+    margin-right: 20px;
+    padding-left: 20px;
+    display: flex;
+    align-items: center;
+    position: relative;
+    &::before {
+      content: '';
+      height: 30px;
+      width: 1px;
+      background-color: #f0f0f0;
+      position: absolute;
+      right: 0;
     }
-}
\ No newline at end of file
+  }
+  .searchInput_con {
+    // flex: 1;
+    // width: 100%;
+    display: flex;
+    // width: 100%;
+    // align-items: center;
+    padding-right: 48px;
+    input {
+      font-size: 26px;
+    }
+  }
+  .icon_more_self {
+    font-size: 28px;
+    color: $color_font_two;
+  }
+}
diff --git a/src/components/searchInput/index.tsx b/src/components/searchInput/index.tsx
index af8ea37..7ec4594 100644
--- a/src/components/searchInput/index.tsx
+++ b/src/components/searchInput/index.tsx
@@ -16,6 +16,7 @@ interface Params {
   height?: string
   titleStyle?: Object
   styleObj?: Object
+  hasCopy?: boolean
 }
 const SearchInput = (props: Params) => {
   const {
@@ -29,6 +30,7 @@ const SearchInput = (props: Params) => {
     clickOnInput,
     height = '80rpx',
     titleStyle = {},
+    hasCopy = false,
   } = props
 
   const stylen = useMemo(() => {
@@ -38,7 +40,7 @@ const SearchInput = (props: Params) => {
     return {}
   }, [showBorder])
   return (
-    <View className={styles.searchInput_main} style={{ height, ...stylen }}>
+    <View className={!hasCopy ? styles.searchInput_main : styles.searchActive} style={{ height, ...stylen }}>
       {showTitle && (
         <View className={styles.searchInput_title} style={titleStyle}>
           {title}
diff --git a/src/pages/order/components/offlinePay/index.module.scss b/src/pages/order/components/offlinePay/index.module.scss
index f84e995..c3df59a 100644
--- a/src/pages/order/components/offlinePay/index.module.scss
+++ b/src/pages/order/components/offlinePay/index.module.scss
@@ -1,46 +1,96 @@
-$top:170px;
-.offlinePay_main{
-    .offlinePay_con{
-        padding: 20px;
-        background-color: #F6F6F6;
-        border-radius: 20px;
-        .miconfont_title{
-            transform: rotate(-180deg);
-            position: absolute;
-            left: 20px;
-            top: 27px;
-            font-size: 37px;
-            color: $color_font_three;
-            z-index: 99;
-        }
+$top: 170px;
+.offlinePay_main {
+  .offlinePay_con {
+    padding-top: 20px;
+    background-color: #f6f6f6;
+    border-radius: 20px;
+    .miconfont_title {
+      transform: rotate(-180deg);
+      position: absolute;
+      left: 20px;
+      top: 27px;
+      font-size: 37px;
+      color: $color_font_three;
+      z-index: 99;
     }
-    .title{
-        font-size: $font_size_big;
-        color: #000000;
-        text-align: center;
-        font-weight: 700;
-        position: relative;
-        
+  }
+  .title {
+    font-size: $font_size_big;
+    color: #000000;
+    text-align: center;
+    font-weight: 700;
+    position: relative;
+  }
+  .topTitle {
+    margin-top: 20px;
+    display: flex;
+    justify-content: center;
+    color: #a5a5a5;
+    font-size: $font_size;
+    font-weight: 400;
+  }
+  .secondTitle {
+    display: flex;
+    align-items: center;
+    margin-top: 30px;
+    width: 750px;
+    height: 74px;
+    background: #fef9f4;
+    padding-left: 30px;
+    .cricle {
+      width: 34px;
+      height: 34px;
+      background: #f79b31;
+      border-radius: 50%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
+      color: #fff;
+      font-size: 24px;
+      margin-right: 14px;
     }
-    
-    .offlinePay_list{
-        border-radius: 10px;
-        padding: 60px 0;
-       .offlinePay_con_text{
-           font-size: $font_size;
-           font-weight: 700;
-       }
+    .cricleFont {
+      font-size: 24px;
+      font-weight: 500;
+      color: #f79b31;
     }
-    .btns{
-        background: #007aff;
-        border-radius: 40px;
-        width: 668px;
-        height: 82px;
-        text-align: center;
-        line-height: 80px;
-        width: 100%;
-        color: #fff;
-        font-size: 32px;
-        margin-top: 30px;
+  }
+  .offlinePay_list {
+    padding-left: 28px;
+    border-radius: 10px;
+    // padding: 60px 0 20px 0;
+
+    .offlinePay_con_text {
+      font-size: $font_size;
+      font-weight: 700;
+      text-align: right;
     }
-}
\ No newline at end of file
+    .copyBtn {
+      min-width: 65px;
+      height: 32px;
+      border-radius: 8px;
+      border: 1px solid #337fff;
+      margin-left: 16px;
+      font-size: 24px;
+      font-weight: 400;
+      color: #337fff;
+      text-align: center;
+      line-height: 32px;
+    }
+  }
+  .btns {
+    background: #007aff;
+    border-radius: 40px;
+    width: 702px;
+    height: 82px;
+    text-align: center;
+    line-height: 80px;
+    // width: 100%;
+    color: #fff;
+    font-size: 32px;
+    margin-top: 30px;
+    margin-left: 24px;
+    // margin-right: 24px;
+  }
+}
diff --git a/src/pages/order/components/offlinePay/index.tsx b/src/pages/order/components/offlinePay/index.tsx
index 1d18a7c..b9686e1 100644
--- a/src/pages/order/components/offlinePay/index.tsx
+++ b/src/pages/order/components/offlinePay/index.tsx
@@ -30,21 +30,44 @@ const OfflinePay = ({ show = true, onClose, offlineInfo }: Param) => {
       },
     })
   }
+
+  const handCopy = (val) => {
+    Taro.setClipboardData({
+      data: val,
+      success(res) {
+        Taro.showToast({
+          icon: 'none',
+          title: '复制成功',
+        })
+      },
+    })
+  }
+
   return (
     <View className={styles.offlinePay_main}>
       <Popup show={show} showTitle={false} onClose={onClose} >
         <View className={styles.offlinePay_con}>
           <View className={classnames('iconfont icon-a-moreback', styles.miconfont_title)} onClick={onClose}></View>
           <View className={styles.title}>线下汇款</View>
+          <View className={styles.topTitle}>
+                请您通过网银转账，或者自行到银行进行汇款
+          </View>
+          <View className={styles.secondTitle}>
+            <View className={styles.cricle}>!</View>
+            <View className={styles.cricleFont}> 温馨提示:受银行处理影响，采用线下汇款方式到账会有延迟</View>
+          </View>
           <View className={styles.offlinePay_list}>
-            <SearchInput showBorder={false} title="开户名称" titleStyle={{ fontSize: '23rpx' }}>
+            <SearchInput showBorder={false} title="开户名称" titleStyle={{ fontSize: '23rpx' }} hasCopy>
               <Text className={styles.offlinePay_con_text}>{offlineInfo?.account_name}</Text>
+              <View className={styles.copyBtn} onClick={() => handCopy(offlineInfo?.account_name)}>复制</View>
             </SearchInput>
-            <SearchInput showBorder={false} title="开户银行" titleStyle={{ fontSize: '23rpx' }}>
+            <SearchInput showBorder={false} title="开户银行" titleStyle={{ fontSize: '23rpx' }} hasCopy>
               <Text className={styles.offlinePay_con_text}>{offlineInfo?.bank_of_deposit}</Text>
+              <View className={styles.copyBtn} onClick={() => handCopy(offlineInfo?.bank_of_deposit)}>复制</View>
             </SearchInput>
-            <SearchInput showBorder={false} title="转账汇款账号" titleStyle={{ fontSize: '23rpx' }}>
+            <SearchInput showBorder={false} title="转账汇款账号" titleStyle={{ fontSize: '23rpx' }} hasCopy>
               <Text className={styles.offlinePay_con_text}>{offlineInfo?.transfer_remittance_account}</Text>
+              <View className={styles.copyBtn} onClick={() => handCopy(offlineInfo?.transfer_remittance_account)}>复制</View>
             </SearchInput>
           </View>
           <View className={styles.btns} onClick={clipboardData}>复制信息</View>