Browse Source

fix:pc端修改

shenchunlv 2 years ago
parent
commit
201abf3a69

+ 8 - 6
api/index.js

@@ -14,6 +14,13 @@ export function postListID(params) {
     data: {...params}//get请求使用params,直接拼接在请求url上
   })
 }
+export function downInfo() {
+  // console.log('params',params);
+  return request('https://official.webapi.bicredit.xin/api/app/down/info', {
+    method: 'get',
+    // data: {...params}//get请求使用params,直接拼接在请求url上
+  })
+}
 // 
 // 获取验证码
 export function sendSms(params) {
@@ -31,9 +38,4 @@ export function postCustomer(params) {
     data: {...params}//get请求使用params,直接拼接在请求url上
   })
 }
-// export const getListT = (params) => {
-//   return request('', {
-//     method: 'post',
-//     data: {...params}//post请求使用post
-//   })
-// }
+

+ 61 - 50
pages/user/index.vue

@@ -53,7 +53,29 @@
         </a-form-item>
       </a-form>
     </a-modal>
-    <img src="../../static/image/img_home.png" class="home-back" style="cursor: pointer;" alt="" @click="amodalFn">
+    <div class="home-back">
+    <img src="../../static/image/img_home.png"  style="cursor: pointer;width: 100%;" alt="" @click="amodalFn">
+      <div class="home-head">
+        <div>
+          <img src="../../static/image/hryk.png" style="width: 200px;" alt="">
+        </div>
+        <div class="home-right">
+          <span>
+            首页
+          </span>
+          <span>
+            解决方案
+          </span>
+          <span>
+            联系我们
+          </span>
+          <span @click="amodalFn">
+            申请试用
+          </span>
+        </div>
+      </div>
+    </div>
+    <!-- <img src="../../static/image/img_home.png" class="home-back" style="cursor: pointer;" alt="" @click="amodalFn"> -->
     <div class="home-qa">
       <div class="home-title">为什么选择惠融易客</div>
       <div class="home-title-sub">
@@ -62,47 +84,18 @@
       <div class="home-qa-img-row">
         <div class="container">
           <div v-for="(p, i) in homeList0" :key="i" class="container-row">
-            <!-- <a-row :gutter="[24,24]" wrap justify="center">
-            <a-col span='10'> -->
-            <!-- ../static/image/img_home_ad_0.png -->
             <div class='home-qa-img-row-item'>
-              <img :src="require('../../static/image/img_home_qs_0_' + i + '.png')" alt="">
-              <!-- <img src="../static/image/img_home_qs_0_0.png" alt=""> -->
-              <div class="home-qa-img-row-item-absolute">
-                <div class="home-qa-img-row-item-absolute-title">
-                  {{ p.title }}
-                </div>
-                <div class="home-qa-img-row-item-absolute-subtitle yc-4">
-                  {{ p.content }}
-                </div>
-              </div>
+              <img :src="require('../../static/image/p_img_home_qs_0_' + i + '.png')" alt="">
             </div>
-            <!-- </a-col>
-          </a-row> -->
           </div>
         </div>
       </div>
       <div class="home-qa-img-row">
         <div class="container">
           <div v-for="(p, i) in homeList1" :key="i" class="container-row">
-            <!-- <a-row :gutter="[24,24]" wrap justify="center">
-            <a-col span='10'> -->
-            <!-- ../static/image/img_home_ad_0.png -->
             <div class='home-qa-img-row-item'>
-              <!-- img_home_qs_1_0 -->
-              <img :src="require('../../static/image/img_home_qs_1_' + i + '.png')" alt="">
-              <!-- <img src="../static/image/img_home_qs_0_0.png" alt=""> -->
-              <div class="home-qa-img-row-item-absolute">
-                <div class="home-qa-img-row-item-absolute-title">
-                  <span>0{{ i + 1 }}</span> {{ p.title }}
-                </div>
-                <div class="home-qa-img-row-item-absolute-subtitle yc-4">
-                  {{ p.content }}
-                </div>
-              </div>
+              <img :src="require('../../static/image/p_img_home_qs_1_' + i + '.png')" alt="">
             </div>
-            <!-- </a-col>
-          </a-row> -->
           </div>
         </div>
       </div>
@@ -186,7 +179,8 @@
     </div>
     <!-- 底部 -->
     <div class="home-bottom">
-      <!-- 联系我们 -->
+      <div class="home-bottom-c">
+              <!-- 联系我们 -->
       <div class="contact">
         <span class="contact-1">
           联系我们
@@ -197,60 +191,60 @@
       <div class="home-consult">
         <!-- 左边 -->
         <div class="consult-tel">
-          <div>
+          <!-- <div style="width: 40%;">
             <span>
               <img src="../../static/image/001.png" alt="" class="w-20 h-20">
             </span>
             <span class="color-fff-12">
               咨询: 23232322
             </span>
-          </div>
-          <div>
+          </div> -->
+          <div style="margin-right: 30px;">
             <span>
               <img src="../../static/image/002.png" alt="" class="w-20 h-20">
             </span>
             <span class="color-fff-12">
-              客服: 3333 44333 4311
+              客服: kefu@meloinfo.com
             </span>
           </div>
-          <div>
+          <!-- <div style="width: 40%;">
             <span>
               <img src="../../static/image/003.png" alt="" class="w-20 h-20">
             </span>
             <span class="color-fff-12">
               市场: 3333 44333 4311
             </span>
-          </div>
-          <div>
+          </div> -->
+          <div >
             <span>
               <img src="../../static/image/004.png" alt="" class="w-20 h-20">
             </span>
             <span class="color-fff-12">
-              商务: 3333 44333 4311
+              商务: 17723267692(微信同号)
             </span>
           </div>
         </div>
         <!-- 二维码 -->
         <div class="consult-code">
-          <div class="code-content">
+          <div class="code-content" v-if="bottomCode.wxQrUrl">
             <span class="color-fff-12" style="font-size: 11px; margin-bottom: 5px;">
               关注公众号
             </span>
-            <img src="https://img.atobo.com/ProductImg/EWM/UWeb/1/5/4/4/5124/15445124/1.gif"
+            <img :src="bottomCode.wxQrUrl"
               style="width:100px;height:100px" alt="">
           </div>
-          <div class="code-content" style="margin: 0 15px 0 45px">
+          <div class="code-content" v-if="bottomCode.iosQrUrl" style="margin: 0 15px 0 45px">
             <span class="color-fff-12" style="font-size: 11px; margin-bottom: 5px;">
               iosAPP下载
             </span>
-            <img src="https://img.atobo.com/ProductImg/EWM/UWeb/1/5/4/4/5124/15445124/1.gif"
+            <img :src="bottomCode.iosQrUrl"
               style="width:100px;height:100px" alt="">
           </div>
-          <div class="code-content">
+          <div class="code-content" v-if="bottomCode.androidQrUrl">
             <span class="color-fff-12" style="font-size: 11px; margin-bottom: 5px;">
               安卓APP下载
             </span>
-            <img src="https://img.atobo.com/ProductImg/EWM/UWeb/1/5/4/4/5124/15445124/1.gif"
+            <img :src="bottomCode.androidQrUrl"
               style="width:100px;height:100px" alt="">
           </div>
         </div>
@@ -269,12 +263,14 @@
           渝ICP备2023000211号-4
         </span>
       </div>
+      </div>
+
     </div>
   </div>
 </template>
 
 <script>
-import { postListData, sendSms,postCustomer } from '../../api/index'
+import { postListData, sendSms,postCustomer,downInfo } from '../../api/index'
 import { message } from 'ant-design-vue'
 export default {
   name: 'IndexPage',
@@ -327,6 +323,9 @@ export default {
         phone: '', // 手机号
         verifyCode: '', //验证码
         channel:16, //pc官网16 手机端17
+      },
+      bottomCode:{
+
       },
       // 定时器
       intervalBtn: {},
@@ -336,6 +335,7 @@ export default {
   },
   created() {
     this.postListDataFn()
+    this.downInfoFn()
   },
   methods: {
     async postListDataFn() {
@@ -345,6 +345,13 @@ export default {
       list.data.data ? this.homeList3 = list.data.data.list : ''
       // console.log('this.homeList3',this.homeList3)
     },
+    // 底部内容
+    async downInfoFn() {
+    // const list  = await this.$axios.$get(`https://official.webapi.bicredit.xin/api/app/down/info`)
+    const list  = await downInfo()
+    console.log('list',list)
+    this.bottomCode= list.data.data
+    },
     collapseChange(e) {
       console.log(this.activeKey, 'collapseChange', e)
     },
@@ -435,12 +442,13 @@ export default {
   overflow: hidden !important;
 }
 
-.ant-btn-primary {
+.ad-free-content .ant-btn-primary {
   background-color: #526eea !important;
   border-color: #526eea !important;
+  color: #fff !important;
 }
 
-.ant-btn-primary {
+ .ant-btn-primary {
   background-color: #fff !important;
   border-color: #fff !important;
   color: #1890ff !important;
@@ -461,4 +469,7 @@ export default {
   width: 150px;
   height: 40px;
 }
+.ant-collapse {
+  background: #fff !important;
+}
 </style>

+ 43 - 9
pages/user/m_user.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="home">
     <!-- <img class="home-back" src={require('../../assets/img_home.png')} /> -->
-    <a-modal v-model="amodal" title="申请试用" on-ok="handleOk" centered @afterClose="fouse" destroyOnClose>
+    <a-modal v-model="amodal" title="申请试用" width="1000" on-ok="handleOk" centered @afterClose="fouse" destroyOnClose>
       <template slot="footer">
         <div class="sub">
           <a-button key="submit" type="primary" @click="handleSubmit">
@@ -9,7 +9,7 @@
           </a-button>
         </div>
       </template>
-      <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 50 }" @submit="handleSubmit">
+      <a-form :form="form" :label-col="{ span: 50 }" :wrapper-col="{ span: 200 }" @submit="handleSubmit">
         <a-form-item label="CompanyName">
           <!-- 公司名称 -->
           <a-input v-decorator="['companyName', { rules: [{ required: true, message: '请输入您的公司名称' }] }]"
@@ -73,7 +73,7 @@
                   <div class="home-qa-img-row-item-absolute-title">
                     {{ p.title }}
                   </div>
-                  <div class="home-qa-img-row-item-absolute-subtitle yc-4">
+                  <div class="home-qa-img-row-item-absolute-subtitle yc-3">
                     {{ p.content }}
                   </div>
                 </div>
@@ -92,7 +92,7 @@
                   <div class="home-qa-img-row-item-absolute-title">
                     <span>0{{ i + 1 }}</span> {{ p.title }}
                   </div>
-                  <div class="home-qa-img-row-item-absolute-subtitle yc-4">
+                  <div class="home-qa-img-row-item-absolute-subtitle yc-3">
                     {{ p.content }}
                   </div>
                 </div>
@@ -183,9 +183,10 @@
       </div>
     </div>
     <!-- 底部 -->
-    <div class="home-bottom">
+    <!-- <div class="home-bottom">
       <div>
-        <a-button type="dashed" shape="round" icon="search">
+         <van-icon name="phone" />
+        <a-button type="dashed" shape="round" icon="phone">
           电话咨询
         </a-button>
       </div>
@@ -199,6 +200,24 @@
           申请试用
         </a-button>
       </div>
+    </div> -->
+    <div class="home-bottom">
+      <div>
+        <!-- <van-icon name="phone" /> -->
+        <a-button type="dashed" shape="round">
+          电话咨询
+        </a-button>
+      </div>
+      <div>
+        <a-button type="dashed" shape="round">
+          加入我们
+        </a-button>
+      </div>
+      <div>
+        <a-button type="primary" shape="round" @click="amodalFn">
+          申请试用
+        </a-button>
+      </div>
     </div>
   </div>
 </template>
@@ -369,6 +388,11 @@ export default {
   background-color: #526eea !important;
   border-color: #526eea !important;
 }
+.ad-free-content .ant-btn-primary {
+  background-color: #526eea !important;
+  border-color: #526eea !important;
+  color: #fff !important;
+}
 
 .ant-btn-primary {
   background-color: #fff !important;
@@ -388,16 +412,26 @@ export default {
   background-color: #526eea !important;
   border-color: #526eea !important;
   color: #fff !important;
-  width: 150px;
-  height: 40px;
+  // width: 150px;
+  height: 200px;
 }
 
 .home-bottom .ant-btn {
-  height: 80px !important;
+  height: 200px !important;
 }
 
 .home-bottom .ant-btn-primary {
   background-color: #526eea !important;
   color: #fff !important;
 }
+.ant-collapse{
+  background-color: #fff !important;
+}
+.ant-collapse > .ant-collapse-item > .ant-collapse-header{
+  height: 200px;
+  line-height: 200px;
+}
+.ant-btn-primary{
+  height: 200px;
+}
 </style>

+ 2 - 2
postcss.config.js

@@ -6,7 +6,7 @@ module.exports = {
       // (String) 需要转换的单位,默认为"px"
       unitToConvert: 'px',
       // (Number) 设计稿的视口宽度
-      viewportWidth: 750,
+      viewportWidth: 1920,
       // (Number) 单位转换后保留的精度
       unitPrecision: 5,
       /**
@@ -27,7 +27,7 @@ module.exports = {
        * 如果传入的值为字符串的话,只要选择器中含有传入值就会被匹配:例如 selectorBlackList 为 ['body'] 的话, 那么 .body-class 就会被忽略
        * 如果传入的值为正则表达式的话,那么就会依据CSS选择器是否匹配该正则:例如 selectorBlackList 为 [/^body$/] , 那么 body 会被忽略,而 .body 不会
        */
-      selectorBlackList: [],
+      selectorBlackList: [/^.ant-modal$/,/^.ant-input$/,/^.ant-form-item$/,/^.ant-form$/,/^.ant-modal-body$/,/^.ant-modal-header$/,/^.ant-modal-content$/,/^.ant-input-lg$/,/^.van-nav-bar$/,/^.van-nav-bar__content$/,/^.van-nav-bar__title$/],       
       // (Number) 设置最小的转换数值,如果为1的话,只有大于1的值会被转换
       minPixelValue: 1,
       // (Boolean) 媒体查询里的单位是否需要转换单位

BIN
static/image/hryk.png


BIN
static/image/m_img_home_qs_0_0.png


BIN
static/image/m_img_home_qs_0_1.png


BIN
static/image/m_img_home_qs_0_2.png


BIN
static/image/m_img_home_qs_1_0.png


BIN
static/image/m_img_home_qs_1_1.png


BIN
static/image/m_img_home_qs_1_2.png


BIN
static/image/me.png


BIN
static/image/p_img_home_qs_0_0.png


BIN
static/image/p_img_home_qs_0_1.png


BIN
static/image/p_img_home_qs_0_2.png


BIN
static/image/p_img_home_qs_1_0.png


BIN
static/image/p_img_home_qs_1_1.png


BIN
static/image/p_img_home_qs_1_2.png


BIN
static/image/tryOut.png


+ 85 - 32
static/index.less

@@ -15,7 +15,7 @@
 
 .container-row {
   // width: 100%;
-  width: 33%;
+  width: 32%;
   height: auto;
   // background-color: #5cf;
 }
@@ -34,6 +34,27 @@ body {
 .home {
   .home-back {
     width: 100%;
+    position: relative;
+    .home-head{
+      width: 100%;
+      position: absolute;
+      left: 0;
+      top: 0;
+      // background-color: #1a1;
+      height: 80px;
+      padding: 0 5%;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      color: #fff;
+      .home-right{
+        &>span{
+          padding: 10px 20px;
+          cursor: pointer;
+        }
+      }
+
+    }
   }
 
   .home-title {
@@ -58,9 +79,12 @@ body {
     justify-content: center;
 
     .home-qa-img-row {
-      margin-top: 20px;
+      // margin-top: 20px;
+      // padding: 0 200px;
+      margin: 0 auto 10px;
       // margin: 103px 169px 0;
-      width: 100%;
+      // width: 100%;
+      width: 60%;
 
       .home-qa-img-row-item {
         // max-width: 490px;
@@ -84,17 +108,17 @@ body {
           justify-content: space-around;
 
           .home-qa-img-row-item-absolute-title {
-            font-size: 14px;
+            font-size: 18px;
             font-weight: bold;
 
             &>span {
-              font-size: 40px;
+              font-size: 20px;
             }
           }
 
           .home-qa-img-row-item-absolute-subtitle {
             // height: 100%;
-            font-size: 10px;
+            font-size: 16px;
             font-weight: 400;
           }
         }
@@ -113,6 +137,8 @@ body {
     justify-content: center;
 
     .home-ad-row {
+      width: 60%;
+      margin: 0 auto;
       margin-top: 30px;
       display: flex;
       flex-wrap: wrap;
@@ -196,8 +222,15 @@ body {
   background: #1F1D2A;
   padding: 20px 50px 10px;
 
+  .home-bottom-c {
+    width: 70%;
+    margin: 0 auto;
+
+  }
+
   .contact {
     margin-bottom: 30px;
+
     .contact-1 {
       color: #FFFFFF;
       font-size: 20px;
@@ -208,20 +241,28 @@ body {
       color: #b4b4b8;
     }
   }
-  .home-consult{
+
+  .home-consult {
     display: flex;
     margin-bottom: 40px;
-    .consult-tel{
-      width: 50%;
+
+    .consult-tel {
+      // width: 50%;
       display: flex;
       justify-content: space-between;
+      // flex-direction: column;
+      align-items: center;
       flex-wrap: wrap;
     }
-    .consult-code{
-      margin-left: 10%;
-      width: 40%;
+
+    .consult-code {
+      margin-left: 5%;
+      width: 60%;
       display: flex;
-      .code-content{
+      align-items: center;
+      justify-content: end;
+
+      .code-content {
         display: flex;
         flex-direction: column;
         align-items: center;
@@ -229,7 +270,8 @@ body {
       }
     }
   }
-  .reference{
+
+  .reference {
     display: flex;
     align-items: center;
     justify-content: center;
@@ -242,54 +284,65 @@ body {
 .ant-modal-body {
   padding: 40px !important;
 }
-.color-fff-12{
+
+.color-fff-12 {
   color: #fff;
   font-size: 12px;
 }
-.color-fff{
+
+.color-fff {
   color: #fff;
 }
+
 .w-15 {
   width: 15px;
 }
+
 .h-15 {
   height: 15px;
 }
-.w-20{
+
+.w-20 {
   width: 20px;
 }
-.h-20{
+
+.h-20 {
   height: 20px;
 }
 
 .home-ad-xw {
   display: flex;
+
   // align-items: center;
-  .ad-free-img{
+  .ad-free-img {
     width: 50%;
     // height: 100%;
     margin-right: 50px;
   }
-  .ad-free-content{
+
+  .ad-free-content {
     flex: 1;
     height: 100%;
     border: 1px solid #ECECEC;
   }
 }
-.yc{
-  white-space: nowrap; 
+
+.yc {
+  white-space: nowrap;
   text-overflow: ellipsis;
-  overflow: hidden; 
+  overflow: hidden;
 }
-.yc-3{
+
+.yc-3 {
   display: -webkit-box;
--webkit-line-clamp:3;
--webkit-box-orient: vertical;
-overflow: hidden;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
 }
-.yc-4{
+
+.yc-4 {
   display: -webkit-box;
--webkit-line-clamp:4;
--webkit-box-orient: vertical;
-overflow: hidden;
-}
+  -webkit-line-clamp: 4;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}

+ 9 - 7
static/m_index.less

@@ -77,7 +77,7 @@ body {
 
         &>img {
           width: 100%;
-          height: 200px;
+          height: 400px;
         }
 
         .home-qa-img-row-item-absolute {
@@ -93,11 +93,11 @@ body {
           justify-content: space-around;
 
           .home-qa-img-row-item-absolute-title {
-            font-size: 14px;
-            font-weight: bold;
+            font-size: 18px;
+            font-weight: 600;
 
             &>span {
-              font-size: 40px;
+              font-size: 20px;
             }
           }
 
@@ -185,9 +185,10 @@ body {
 
     .home-static-btn {
       // margin-top: 18px;
-      height: 40px;
-      border-radius: 40px;
+      height: 100px;
+      border-radius: 100px;
       color: #723bed;
+      padding: 0 40px;
       // width: 150px;
       cursor: pointer;
     }
@@ -202,6 +203,7 @@ body {
 
 // 底部
 .home-bottom {
+  height: 200px;
   width: 100%;
   background: #f7f7f7;
   padding: 20px 50px 10px;
@@ -281,7 +283,7 @@ body {
   }
   .ad-free-content{
     flex: 1;
-    height: 100%;
+    height: 800px;
     border: 1px solid #ECECEC;
   }
 }