From a5604d778ca31451a95d8dabdf94f7ebc78e5c55 Mon Sep 17 00:00:00 2001
From: zhaoxiaoqiang <287285524@qq.com>
Date: Fri, 14 Apr 2023 11:24:10 +0800
Subject: [PATCH] v-console

---
 src/views/old/store/business-center.vue | 1003 +++++++++++++++-------------------------------------------
 1 files changed, 264 insertions(+), 739 deletions(-)

diff --git a/src/views/old/store/business-center.vue b/src/views/old/store/business-center.vue
index 27458fd..2b98c40 100644
--- a/src/views/old/store/business-center.vue
+++ b/src/views/old/store/business-center.vue
@@ -1,758 +1,283 @@
 <!--
- * @Descripttion:
- * @Author: WD丶
- * @Date: 2019-08-19 09:20:27
+ * @Author: 小明丶
+ * @Date: 2021-01-06 15:50:26
  * @LastEditors: 小明丶
- * @LastEditTime: 2020-12-19 09:58:28
- -->
+ * @LastEditTime: 2021-01-06 15:50:27
+ * @Description:
+-->
 <template>
-    <div class="business-center">
-        <div class="content" v-if="orgType == 4">
-            <!-- <div class="content-title">
-                办理分期
-            </div> -->
-            <div class="installment-box ">
-
-                <div class="item " v-for="(i,index) in installmentList" :key="index" @click="go(i)">
-                    <img class="item-logo" :src="i.icon"  :alt="i.typeName">
-                    <p v-text="i.typeName"></p>
+  <div class="hb-gmzf">
+    <div v-if='hnOrnxtype == 410000'>
+      <div class="head">
+        <div class="head-left"></div>
+        <div class="head-mid">和微分</div>
+        <div class="head-right" v-on:click="qrCodePage()">授权测试</div>
+      </div>
+      <div class="tab">
+        <van-tabs v-model="active" animated @click="onClick">
+          <van-tab
+            v-for="(item, index) in contTypeList"
+            :title="item.name"
+            :key="index"
+          >
+            <div v-for="(childItem, index) in item.childList" :key="index">
+              <div class="tab-head">
+                <div class="tab-head-icon"></div>
+                <div class="tab-head-font">
+                  {{ childItem.name }}
                 </div>
+                <div class="tab-head-remain"></div>
+              </div>
+              <div class="tab-index">
+                <div class="tab-index-row">
+                  <div
+                    class="tab-index-row-main"
+                    v-for="(grandchildItem, index) in childItem.childList"
+                    :key="index"
+                    v-on:click="productPage(grandchildItem)"
+                  >
+                    <div class="tab-index-row-icon">
+                      <img
+                        class="order-xrw-create-icon-image"
+                        :src="getIndexIcon(grandchildItem)"
+                      />
+                    </div>
+                    <div class="tab-index-row-font">
+                      {{ grandchildItem.name }}
+                    </div>
+                  </div>
+                </div>
+              </div>
             </div>
-
-        </div>
-        <!-- 产品未开通弹窗 -->
-        <van-popup v-model="noOpenShow" class="no-open">
-            <div class="no-open-img">
-                <img src="../../../assets/imgs/openpic.png" alt="">
-            </div>
-            <p>{{ noOpenText }}</p>
-            <van-button type="default" class="no-open-btn" @click="noOpenShow = false" round>确定</van-button>
-        </van-popup>
+          </van-tab>
+        </van-tabs>
+      </div>
     </div>
+    <wxPayScore v-else></wxPayScore>
+  </div>
 </template>
 <script>
-    import {
-        XHeader,
-        XDialog,
-    } from 'vux';
-    import FBlock from '@/components/old/FBlock';
-    import FConfirm from '@/components/old/FConfirm';
-    import {
-        _copyToClipboard
-    } from '@/utils/index';
-    import { mapState, mapGetters } from 'vuex';
-    import { async } from 'q';
-    import Vue from 'vue';
-    import { Toast } from 'vant';
-    import QRCode from "qrcode";
-
-    Vue.use(Toast);
-// import { mapState } from 'vuex';
-    export default {
-        name: 'business-center',
-        components: {
-            XHeader,
-            FBlock,
-            FConfirm,
-            XDialog
-        },
-        data() {
-            return {
-                qrCode:'',
-                errorMsg: '',
-                mblNo: '',
-                showDialogStyle: false,
-                showModal: false,
-                tipText: '敬请期待...',
-                installmentList: [],
-                dmfprod_list: [],
-                shsUrl:'',
-                // swiperList: [],
-                // messageList: [],
-                messageId: '',
-                riskNum: '', //风险订单数
-                complaintNum: '', //投诉订单数
-                noOpenShow: false, //产品未开通弹窗控制
-                noOpenText: '', //产品未开通文本内容
-                info: {},
-                prodTypeRespVoList2: []
-            };
-        },
-        computed:{
-            ...mapState(['userinfo', 'msgCount']),
-            ...mapGetters(['orgType']),
-            hasDmf(){
-                return this.dmfprod_list.length && this.dmfprod_list[0].openStatus!=0;
-            }
-        },
-        created() {
-            this.info = this.userinfo
-            this.getShsUrl();
-            if(this.orgType == 4){
-                this.$api.prodIndexTypeList().then(res => {
-                    let list = res.body.prodTypeRespVoList3 || [];
-                    this.prodTypeRespVoList2 = res.body.prodTypeRespVoList2 || [];
-                    localStorage.hbcp = JSON.stringify(res.body.prodTypeRespVoList2)
-                    this.dmfprod_list = res.body.prodTypeRespVoList1 || [];
-                    list.forEach(item => {
-                        item.active = item.openStatus === 2;
-                    });
-
-                    this.installmentList.push(...list,...res.body.prodTypeRespVoList1);
-                });
-            }
-            // 获取风控订单数
-             this.$api.riskNum().then(res => {
-                this.complaintNum = res.body.complaintNum;
-                this.riskNum = res.body.riskNum;
-            })
-        },
-        methods: {
-            hasHjToken(){
-                if(localStorage.hjToken){
-                    return false
-                }else{
-                    return true
-                }
-            },
-            // 前往选择花呗产品
-            goHbCp(){
-               this.$router.push('/hbcp')
-            },
-            goLthyj() {
-                this.$router.push('/lthyj')
-            },
-            toBdCourse(e, name) {
-                // if(name == '合约分期') {
-                //     Toast('花呗分期教程功能暂未开通,敬请期待')
-                // } else {
-                    let sum = '';
-                    let fileName = '';
-                    if(name == '花呗分期') {
-                        sum = 7
-                        fileName = 'hbfq/'
-                    }
-                    if(name == '智享花' || name == '信用购') {
-                        sum = 9;
-                        fileName = 'zxh/'
-                    }
-                    if(name == '花呗合约机') {
-                        sum = 3;
-                        fileName = 'hyfq/'
-                    }
-                    this.$router.push(`/bdCourse?courseName=${name}&&sum=${sum}&&fileName=${fileName}`)
-                // }
-            },
-            jump(id) {
-                this.$router.push(`/bannerContent?bannerId=${id}`)
-            },
-            //跳转到逾期界面..
-            toOverdue() {
-                this.$router.push('/overdue')
-            },
-            shsClick(val){
-                if(val == 'zfblx') {
-                    this.$router.push("/product/zfblx");
-                }
-                if(val != 'zfblx' && val != 'hbjl') {
-                    location.href = this.shsUrl;
-                }
-                // if(val == 'hbjl'){
-                //     this.$router.push('/creat-hbjl')
-                // }
-            },
-            toMessage(e,id) {
-                this.$router.push(`/message?messageId=${id}`)
-            },
-            getShsUrl(){
-                this.$api.getShsUrl().then((res) => {
-                    this.shsUrl = res.body.url;
-                }).catch((err) => {
-
-                });
-            },
-            goDmf(){
-                let item = this.dmfprod_list[0];
-                if(item.openStatus == 2){
-                    //this.$router.push(`/facepay/calcmoney?typeId=${item.typeId}&prodId=${item.prodId}`)
-                    this.$router.push(`/channel-selection?typeId=${item.typeId}&prodId=${item.prodId}&text=商户收款通道`)
-                }else{
-                    this.noOpenShow = true
-                }
-                // this.$router.push(`/order/dmf?typeId=${item.typeId}&prodId=${item.prodId}`)
-            },
-            changeBlur() {
-                let u = navigator.userAgent,
-                    app = navigator.appVersion;
-                let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
-                if (isIOS) {
-                    setTimeout(() => {
-                        const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0
-                        window.scrollTo(0, Math.max(scrollHeight - 1, 0))
-                    }, 200)
-                }
-            },
-            clearTel() {
-                this.mblNo = '';
-                this.errorMsg = '';
-            },
-            // 复制链接
-            copyLink() {
-
-                let isCopy = _copyToClipboard('http://t.cn/AiTDRMMO')
-                this.$tool.toast('链接已复制');
-            },
-            // 花呗提额功能
-            hbLinesSMS() {
-                let v = this.$tool;
-                if (v.checkValEmpty(this.mblNo)) {
-                    this.errorMsg = '*请输入手机号';
-                    return;
-                }
-                if (!v.checkPhone(this.mblNo)) {
-                    this.errorMsg = '*请输入正确的手机号';
-                    return;
-                }
-                this.$api.hbLinesSMS({
-                    mblNo: this.mblNo,
-                    content: 'http://t.cn/AiTDRMMO'
-                }).then((res) => {
-                    this.showDialogStyle = false;
-                    setTimeout(() => {
-                        this.$tool.toast('短信发送成功');
-                    }, 500);
-                }).catch((err) => {
-
-                });
-            },
-            // flag 代表是产品 还是收款的标志(flag为true代表收款)
-            go(item, flag = false) {
-                //alert('item.active:',item.active)
-                if (item.active) {
-                    let path = '';
-                    let text = '';
-                    item.typeId = Number(item.typeId);
-                    if(item.isHbProd == 1){
-                        path = "/channel-selection"
-                        switch (item.typeId) {
-                            case 200002:
-                                text = '花呗通道';
-                                break;
-                            case 200009:
-                                text = '花呗合约机通道';
-                                break;
-                            case 200010:
-                                text = '商户贴息通道';
-                                break;
-                        }
-                    }else{
-                       if(item.typeId) {
-                            path = '/wx-pay-score';
-                        }
-                    }
-                    this.$router.push({
-                        path,
-                        query: {
-                            typeId: item.typeId,
-                            prodId: item.prodId,
-                            text: text
-                        }
-                    });
-                } else {
-                    this.noOpenText = flag ? '敬请期待...' :  '商户未开通该产品';
-                    this.noOpenShow = true;
-                }
-            },
-        },
-
+import { mapState, mapGetters } from "vuex";
+import  wxPayScore from './wx-pay-score.vue'
+import Vue from "vue";
+import { Tab, Tabs } from "vant";
+Vue.use(Tab);
+Vue.use(Tabs);
+export default {
+  components: {wxPayScore},
+  data() {
+    return {
+      active: "",
+      contTypeList: [],
+      mblNoTypeList: {},
+      showHwfProd: false,
     };
+  },
+  computed: {
+    ...mapState(["userinfo", "msgCount","hnOrnxtype"]),
+    ...mapGetters(["orgType"]),
+  },
+  created() {
+    if (this.orgType == 4) {
+      this.getProdcuctList();
+      this.init();
+    }
+  },
+  methods: {
+    getIndexIcon(item) {
+      let iconSrc =
+        location.origin +
+        location.pathname +
+        "/static/img/" +
+        item.icon +
+        ".png";
+      return iconSrc;
+    },
+    init() {
+      this.$api.wxScoreCreInit2().then(
+        (res) => {
+          this.contTypeList = res.body.contTypeList || {};
+        },
+        (err) => err
+      );
+    },
+    qrCodePage() {
+      this.$router.push({
+        path: "/wx-test-code",
+        query: "",
+      });
+    },
+    productPage(item) {
+      let queryObj = {
+        code: item.code,
+        mblNoType: item.mblNoType,
+      };
+      this.$router.push({
+        path: "/wx-pay-score",
+        query: queryObj,
+      });
+    },
+    getProdcuctList() {
+      this.$api.prodIndexTypeList().then((res) => {
+        let list = res.body.prodTypeRespVoList3 || [];
+        list.forEach((item) => {
+          if (item.prodId == 30000016 && item.openStatus == 2) {
+            this.showHwfProd = true;
+          }
+        });
+      });
+    },
+  },
+};
 </script>
-<style lang='less' scoped>
-    // @import '../../style/mixin';
-    @font-face {
-        font-family: 'iconfont';  /* project id 1351259 */
-        src: url('//at.alicdn.com/t/font_1351259_bg2i5vlti7u.eot');
-        src: url('//at.alicdn.com/t/font_1351259_bg2i5vlti7u.eot?#iefix') format('embedded-opentype'),
-        url('//at.alicdn.com/t/font_1351259_bg2i5vlti7u.woff2') format('woff2'),
-        url('//at.alicdn.com/t/font_1351259_bg2i5vlti7u.woff') format('woff'),
-        url('//at.alicdn.com/t/font_1351259_bg2i5vlti7u.ttf') format('truetype'),
-        url('//at.alicdn.com/t/font_1351259_bg2i5vlti7u.svg#iconfont') format('svg');
-    }
-    .no-open{
-        width: 280px;
-        height: 190px;
-        text-align: center;
-        border-radius: 6px;
-        &-img{
-            width: 100%;
-            margin-top: 13px;
-            img{
-                width: 75px;
-                height: 75px;
-            }
-        }
-        p{
-            font-size: 14px;
-            color: #666666;
-            margin-top: 7px;
-        }
-        &-btn{
-            height: 36px;
-            width: 60%;
-            margin: 0 20%;
-            background: #896EDB;
-            color: #fff;
-            margin-top: 28px;
-            line-height: 36px;
-        }
-    }
-    .cus-service{
-        position: absolute;
-        top: 10px;
-        right: 10px;
-        z-index: 1;
-        width: 24px;
-        height: 24px;
-        background: rgba(0,0,0,1);
-         background:rgba(0,0,0,0.3);
-        border-radius: 50%;
-        text-align: center;
-        line-height: 24px;
-        i{
-            color: #fff;
-            font-size: 16px;
-            // opacity: 1;
-        }
-    }
-
-    .head-title{
-        z-index: 10;
-    }
-    // 顶部轮播
-    .swiper-banner {
-        width: 100%;
-        height: 150px;
-        margin: 0 auto;
-        overflow: hidden;
-        position: relative;
-        // margin-top:-10px;
-        padding: 0;
-        .vipBg {
-            width: 100%;
-            height: 150px;
-            background-size: 100% 100%;
-            background-repeat: no-repeat;
-            // background-image: url("../../../assets/img/bg-qr-code.png");
-        }
-
-        .my-swiper-banner {
-            height: 150px;
-            width: 100%;
-        }
-    }
-    //播报 部分
-    .category {
-        height: 30px;
-        position: relative;
-        width: 94%;
-        padding: 0 3%;
-        background: #fff;
-        .bobao {
-            background: rgba(255, 255, 255, 1);
-            border-radius: 6px;
-            width: 100%;
-
-        }
-        .notice-log{
-            position: absolute;
-            top: 0;
-            left: 15px;
-            font-size: 20px;
-            line-height: 30px;
-        }
-    }
-    .my-swiper-notice{
-        width: 100%;
-        margin: 0 auto;
-        overflow: hidden;
-        // .flexLayout(flex-start, center, row);
-        // flex-wrap: nowrap;
-    }
-    .swipe-item-box{
-        display: flex;
-        flex-direction: column;
-        justify-content: flex-start;
-        align-items: center;
-        width: 100% !important;
-    }
-    .notice-item-title{
-        height: 30px;
-        line-height: 30px;
-        font-size: 12px;
-        margin-left: 10px;
-        white-space: nowrap;
-        color: #333;
-    }
-    .notice-item {
-        line-height: 30px;
-        width: 230px;
-        word-wrap: normal;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        font-size: 12px;
-        // padding-right: 20px;
-        color: #333;
-    }
-    .notice-item-f{
-        color: @c-text-999;
-    }
-    .business-center {
-        padding-bottom: 50px;
-        // padding-top: 54px;
-        // padding-top: 9px;
-        .installment-box {
-            border-radius: 6px;
-            .flexLayout(flex-start, center, row);
-            flex-wrap: wrap;
-            background: #fff;
-            padding: 15px 0;
-            .item {
-                margin-bottom: 15px;
-                width: 33.33%;
-                //width: 25%;
-                text-align: center;
-                i {
-                    font-size: 36px;
-                }
-
-                p {
-                    font-size: 12px;
-                    color: #3a3a3a;
-                }
-                .item-logo{
-                    display: block-line;
-                    vertical-align: middle;
-                    width: 45px;
-                    height: 45px;
-                    margin-left: auto;
-                }
-            }
-        }
-    }
-    .nav-code {
-        // display: flex;
-        // flex-direction: column;
-        // justify-content: center;
-        // align-items: center;
-        // text-align: center;
-        // height: 120px;
-        // background-color: #fff;
-        // color: #bb8b52;
-        // margin-top: 15px;
-        .flexLayout(center, center, row);
-        width: 335px;
-        height: 50px;
-        margin: 12px;
-        margin-bottom: 0;
-        margin-top: 0;
-        border: 1px solid rgba(217,217,217,1);
-        border-radius: 6px;
-        &-logo{
-            width: 36px;
-            height: 36px;
-            margin-right: 12px;
-            img{
-                width: 100%;
-                height: 100%;
-            }
-        }
-        p{
-            font-size: 16px;
-        }
-    }
-    .merCollection{
-        width: 94%;
-        margin: 0 3%;
-        height: 50px;
-        border:  1px dashed #D9D9D9;
-        .flexLayout(center, center, row);
-        i{
-            font-size: 36px;
-            margin-right: 10px;
-        }
-    }
-
-    .dialog {
-        position: relative;
-
-        .dialog-content {
-            background-color: #fff;
-            width: 280px;
-            height: 270px;
-            margin: 0 auto;
-            padding: 40px 15px 0;
-            box-sizing: border-box;
-            border-radius: 6px;
-        }
-
-        .text {
-            width: 150px;
-            font-size: 14px;
-            margin: 0 auto;
-            color: #666666;
-
-            .blue {
-                color: #4074F8;
-                text-decoration: underline;
-            }
-        }
-
-        .input-box {
-            height: 44px;
-            .flexLayout(flex-start, center);
-            padding-left: 10px;
-            border: 1px solid rgba(230, 230, 230, 1);
-            width: 250px;
-            margin: 20px auto 0;
-            box-sizing: border-box;
-
-            .icon {
-                position: relative;
-                padding-right: 10px;
-
-                &::after {
-                    content: '';
-                    display: block;
-                    position: absolute;
-                    right: 0;
-                    top: 50%;
-                    transform: translateY(-50%);
-                    width: 1px;
-                    height: 15px;
-                    background-color: #3A3A3A;
-
-                }
-            }
-
-            .input {
-                margin-left: 10px;
-                padding: 10px 0;
-                flex: 1;
-                font-size: 12px;
-                border: none;
-                outline: none;
-
-                &.error {
-                    color: #FE2A2A;
-                }
-            }
-        }
-
-        .errmsg {
-            text-align: left;
-            margin-left: 10px;
-            margin-bottom: 20px;
-            height: 15px;
-            color: #FE2A2A;
-            font-size: 10px;
-        }
-
-        .btn {
-
-            width: 250px;
-            height: 44px;
-            text-align: center;
-            outline: none;
-            border: none;
-            background-color: #3A3A3A;
-            color: #fff;
-        }
-
-        .logo {
-            width: 64px;
-            height: 64px;
-            transform: translateY(32px);
-        }
-
-        .close {
-            margin-top: 20px;
-        }
-
-    }
-    //逾期
-    .overdue-box{
-        width: 96%;
-        margin: 12px 2%;
-        background: #fff;
-        border-radius:6px;
-        height: 92px;
-        display: flex;
-        padding: 10px;
-        box-sizing: border-box;
-        font-family: PingFang SC;
-        color: #666666;
-        .overdue-box-left {
-            width: 74%;
-            display: flex;
-            flex-direction: column;
-            justify-content: space-around;
-            .title {
-                font-size: 12px;
-                font-weight: 500;
-            }
-            .title:before {
-                content: "";
-                width: 3px;
-                height: 12px;
-                background: #9459EC;
-                border-radius: 2px;
-                display: inline-block;
-                margin-right: 6px;
-            }
-            .order {
-                margin-top: 5px;
-                font-size: 12px;
-                color: #666;
-                .orderItem {
-                    margin-right: 10px;
-                }
-                .ordernum {
-                    font-size: 18px;
-                    font-weight: bold;
-                    color: #333;
-                    margin-right: 5px;
-                }
-            }
-            .tip {
-                height: 12px;
-                font-size: 12px;
-                font-weight: 500;
-                color: #999999;
-                margin-top: 5px;
-            }
-        }
-        .overdue-box-right {
-            width: 26%;
-            display: flex;
-            flex-direction: column;
-            justify-items: center;
-            justify-content: center;
-            .view {
-                width: 80px;
-                height: 28px;
-                background: linear-gradient(90deg, #8F6AFF, #9459EC);
-                box-shadow: 0px 4px 7px 0px rgba(99, 19, 232, 0.25);
-                border-radius: 14px;
-                font-size: 12px;
-                font-weight: 500;
-                color: #FFFFFF;
-                text-align: center;
-                line-height: 28px;
-            }
-        }
-    }
-  .content{
-    //   width: 100%;
-    width: 96%;
-    margin: 12px 2%;
-    border-radius: 6px;
+<style lang="less" scoped>
+.head {
+  width: 100%;
+  height: 40px;
+  display: flex;
+  line-height: 40px;
+  background: #ffffff;
+  text-align: center;
+  &-left {
+    width: 33.3%;
+    height: 40px;
   }
-//   .content-title{
-//       width: 96%;
-//       height: 45px;
-//       background-color: #fff;
-//       line-height: 45px;
-//       margin-top: 20px;
-//       padding-left: 4%;
-//       margin-bottom: 5px;
-//   }
-//办单教程
-.course{
-    width: 96%;
-    height: 140px;
-    margin: 12px 2%;
-    margin-bottom: 20px;
-    padding-bottom: 27px;
-    background: #fff;
-    box-sizing: border-box;
-    border-radius: 6px;
-    &-title{
-        // padding: 10px;
-        padding-top: 15px;
-        padding-left: 12px;
-        padding-bottom: 15px;
-        font-size: 16px;
-        font-weight:bold;
-        color:rgba(51,51,51,1)
-    }
-    &-content{
-        margin-top: 10px;
-      .flexLayout(space-between, center);
-      &-item{
-          width: 33.33%;
-          text-align: center;
-          i{
-              font-size: 36px;
-          }
-          p{
-              color: #666666;
-              margin-top: 5px;
-              font-size: 14px;
-          }
-      }
-    }
+  &-mid {
+    width: 33.3%;
+    height: 40px;
+    font-size: 18px;
+    font-family: PingFang SC;
+    font-weight: bold;
+    color: #333333;
+  }
+  &-right {
+    width: 33.4%;
+    height: 40px;
+    font-size: 14px;
+    font-family: PingFang SC;
+    color: #333333;
+  }
 }
-.courseDl{
-    width: 96%;
-    height: 165px;
-    margin: 12px 2% 0 2%;
-    // margin-bottom: 20px;
-    // padding-bottom: 27px;
-    background: #fff;
-    box-sizing: border-box;
-    border-radius: 6px;
-    &-title{
-        // padding: 10px;
-        padding-top: 15px;
-        padding-left: 12px;
-        padding-bottom: 15px;
-        font-size: 16px;
-        font-weight:bold;
-        color:rgba(51,51,51,1)
+
+.tab {
+  width: 100%;
+  height: 100%;
+  &-head {
+    margin: 20px 30px 20px 30px;
+    width: 100%;
+    height: 24px;
+    line-height: 24px;
+    &-icon {
+      width: 3px;
+      margin-top: 3px;
+      float: left;
+      height: 18px;
+      background: #6c68ff;
     }
-    &-content{
-        // margin-top: 10px;
-        border-radius: 6px;
+    &-font {
+      width: 20%;
+      margin-left: 10px;
+      height: 20px;
+      float: left;
+      font-size: 16px;
+      font-family: PingFang SC;
+      font-weight: bold;
+      color: #333333;
+    }
+    &-remain {
+      width: 70%;
+      float: left;
+      height: 20px;
+    }
+  }
+  .tab-index {
+    margin: 20px;
+    height: 110px;
+    line-height: 110px;
+    background: #ffffff;
+    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.04);
+    border-radius: 16px;
+    &-row {
+      width: 100%;
+      height: 100px;
+      line-height: 100px;
+      margin: 0px 20px 0px 20px;
+      &-main {
+        width: 22.5%;
+        height: 100%;
+        float: left;
+        text-align: center;
+      }
+      &-icon {
         width: 100%;
-      .flexLayout(space-between, center);
-      flex-wrap: wrap;
-      &-item{
-          width: 50%;
-          height: 50px;
-          text-align: center;
-          .flexLayout(flex-start, center);
-          i{
-              margin-left: 40px;
-              font-size: 30px;
-              margin-right: 13px;
-          }
-          p{
-              width: 60px;
-              color: #666666;
-              text-align: left;
-            //   margin-top: 5px;
-              font-size: 14px;
-              line-height: 50px;
-          }
+        height: 30%;
+        &-image {
+          width: 100%;
+          height: 100%;
+        }
+      }
+      &-font {
+        width: 100%;
+        height: 30%;
+        font-size: 10px;
+        font-family: PingFang SC;
+        color: #333333;
       }
     }
+  }
 }
-.notice-continer{
-    width: 95%;
-    display: flex;
-    justify-content: flex-start;
-    align-items: center;
-    padding-left: 5%;
+
+.order-xrw {
+  margin: -50px 10px 10px 10px;
+  padding: 0 10px 0 10px;
+  line-height: 100px;
+  background: #ffffff;
+  box-shadow: 0px 0px 26px 0px rgba(0, 0, 0, 0.04);
+  border-radius: 16px;
+  &-create {
+    width: 100%;
+    height: 100px;
+    margin: 0px 10px 0px 10px;
+    &-icon {
+      width: 20%;
+      height: 100%;
+      float: left;
+      text-align: center;
+      &-image {
+        width: 43px;
+        height: 43px;
+        margin-top: 25px;
+      }
+    }
+    &-text {
+      width: 70%;
+      float: left;
+      heght: 100%;
+      font-size: 18px;
+      font-family: PingFang SC;
+      color: #333333;
+    }
+  }
+}
+
+.button-maintain {
+  width: 100%;
+//   height: 100%;
+  padding: 0 20px 0 20px;
+  box-sizing: inherit;
+  .button {
+    margin: 50px 0 0 0;
+    width: 100%;
+    height: 50px;
+    text-align: center;
+    line-height: 50px;
+    background: linear-gradient(90deg, #1c87fd, #219ffd);
+    border-radius: 44px;
+    .button-txt {
+      margin: 8px 0 0 0;
+      font-size: 22px;
+      color: #ffffff;
+    }
+  }
 }
 </style>

--
Gitblit v1.8.0