添加：申请成功代理人员

api/agent.js

@@ -8,7 +8,11 @@ export function myAgentList(data) {
 export function inviteSupplierJoinQrCode(data) {
 	return request.get('agent/qr_code_invite',data);
 }
-
+// 代理加入 - 提交申请信息
+export function submitAgentApplyInfo(data) {
+	return request.post('agent/agent_apply',data);
+}
+// 代理加入 - 生成订单
 
 
 // 获取单条代理人员信息

components/areaSelect/index.vue

@@ -2,7 +2,7 @@
 	<view>
     <uni-popup ref="selectAreaPopup" type="bottom" @change="selectAreaStatusChange">
       <view class="select-area-popup">
-        <picker-view :indicator-style="`height: 100rpx;`" :value="value" @change="changeArea" class="picker-view">
+        <picker-view :indicator-style="`height: 100rpx;`" :value="value" @change="changeAddress" class="picker-view">
           <picker-view-column v-if="is_show_province">
             <view class="item" v-for="(item,index) in province_list" :key="index">{{ item.name }}</view>
           </picker-view-column>
@@ -56,9 +56,9 @@ export default {
     return {
       value: [],
       province_index: 0,
-      city_index: '',
+      city_index: 0,
-      area_index: '',
+      area_index: 0,
-      street_index: '',
+      street_index: 0,
       province_list: [],
       city_list: [],
       area_list: [],
@@ -70,48 +70,50 @@ export default {
     isShow: {
       handler(newValue) {
         // console.log('状态变更',newValue)
-        if(newValue) this.$refs.selectAreaPopup.open('bottom');
+        if(newValue) {
-        else this.$refs.selectAreaPopup.close();
+          this.getAreaList(0);
+          this.$refs.selectAreaPopup.open('bottom');
+        }
+        else {
+          this.$refs.selectAreaPopup.close();
+        }
       },
       deep: true
     },
     province_index: {
       handler(newValue) {
+        this.value[0] = this.province_index || 0;
         let areaInfo = this.province_list[this.province_index] || {};
-        this.city_index = 0;
         this.changeSelectContent(areaInfo, 'province');
       },
       deep: true
     },
     city_index: {
       handler(newValue) {
-        let areaInfo = this.province_list[this.province_index] || {};
+        this.value[1] = this.city_index || 0;
-        this.area_index = 0;
+        let areaInfo = this.city_list[this.city_index] || {};
         this.changeSelectContent(areaInfo, 'city');
       },
       deep: true
     },
     area_index: {
       handler(newValue) {
-        let areaInfo = this.province_list[this.province_index] || {};
+        this.value[2] = this.area_index || 0;
-        this.street_index = 0;
+        let areaInfo = this.area_list[this.area_index] || {};
         this.changeSelectContent(areaInfo, 'area');
       },
       deep: true
     },
     street_index: {
       handler(newValue) {
-        let areaInfo = this.province_list[this.province_index] || {};
+        this.value[3] = this.street_index || 0;
+        let areaInfo = this.street_list[this.street_index] || {};
         this.changeSelectContent(areaInfo, 'street');
       },
       deep: true
     },
   },
-  mounted() {
+  mounted() {},
-    this.$nextTick(function() {
-      this.getAreaList(0);
-    })
-  },
   methods: {
     // 关闭弹框
     selectAreaStatusChange(e){
@@ -119,28 +121,58 @@ export default {
       if(!status) this.$emit("close");
     },
     // 获取地区列表
-    getAreaList(pid){
+    async getAreaList(pid){
       let _this = this;
-      getCityV2(pid).then(res => {
+      await getCityV2(pid).then(res => {
         if (Number(res.status) === 200) {
           let data = res.data || {};
           let singleInfo = data[0] ?? {};
           switch (Number(singleInfo.level)) {
             case 1:
+              if(!_this.is_show_province) return false;
               _this.province_list = data;
-              _this.changeSelectContent(singleInfo, 'province');
+              if(Number(_this.city_index) > 0) {
+                _this.getAreaList(singleInfo.id);
+              } else {
+                _this.changeSelectContent(singleInfo, 'province');
+              }
               break;
             case 2:
+              if(!_this.is_show_city) return false;
               _this.city_list = data;
-              _this.changeSelectContent(singleInfo, 'city');
+              if(Number(_this.city_index) > 0){
+                _this.city_index = 0;
+              }else{
+                if(Number(_this.area_index) > 0) {
+                  _this.getAreaList(singleInfo.id);
+                } else {
+                  _this.changeSelectContent(singleInfo, 'city');
+                }
+              }
               break;
             case 3:
+              if(!_this.is_show_area) return false;
               _this.area_list = data;
-              _this.changeSelectContent(singleInfo, 'area');
+              if(Number(_this.area_index) > 0){
+                _this.area_index = 0;
+              }else{
+                if(Number(_this.street_index) > 0) {
+                  _this.getAreaList(singleInfo.id);
+                } else {
+                  _this.changeSelectContent(singleInfo, 'area');
+                }
+              }
               break;
             case 4:
+              if(!_this.is_show_street) return false;
               _this.street_list = data;
-              _this.changeSelectContent(singleInfo, 'street');
+              if(Number(_this.street_index) > 0){
+                _this.street_index = 0;
+              }else{
+                if(Number(_this.street_index) <= 0) {
+                  _this.changeSelectContent(singleInfo, 'street');
+                }
+              }
               break;
           }
 
@@ -151,7 +183,7 @@ export default {
       });
     },
     // 地区选择器 - 地区改变
-    changeArea(e){
+    changeAddress(e){
       let indexArr = e.detail.value || e.target.value;
       this.province_index = indexArr[0] || 0;
       this.city_index = indexArr[1] || 0;
@@ -161,16 +193,11 @@ export default {
     // 改变选中内容
     changeSelectContent(areaInfo, type){
       if(type != 'street') this.getAreaList(areaInfo.id);
-      this.$emit('changeArea',{
+      this.$emit('changeAddress',{
         type: type,
         value: areaInfo
       });
     },
-
-
-
-
-
   }
 }
 </script>
@@ -188,9 +215,10 @@ export default {
     margin-top: 20rpx;
   }
   .item {
-    height: 100rpx!important;
-    line-height: 100rpx!important;
     text-align: center;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
 }
 </style>

pages/agent/invite/index.vue

@@ -37,21 +37,93 @@
         <view class="line">
           <view class="line-content">
             <view class="title">地区选择</view>
-            <input type="text" placeholder="点击选择地区信息" readonly disabled @click="areaPopupChange" />
+            <input :value="address" type="text" placeholder="点击选择地区信息" readonly disabled @click="areaPopupChange" />
           </view>
         </view>
       </block>
       <!-- 仅餐厅 显示详细地址、定位  商户名称、商户分类、商户类型、营业执照及行业相关资质证明图片 -->
       <block v-if="agent_type == 7">
-
+        <view class="line">
-
+          <view class="line-content">
-
+            <view class="title">详细地址</view>
-
+            <input type="text" v-model="apply_info.address" maxlength="130" placeholder="请输入详细地址" />
-
+          </view>
+        </view>
+        <view class="line">
+          <view class="line-content">
+            <view class="title">商户名称</view>
+            <input type="text" v-model="apply_info.mer_name" maxlength="130" placeholder="请输入商户名称" />
+          </view>
+        </view>
+        <view class="line">
+          <view class="line-content">
+            <view class="title">商户分类</view>
+            <view class="right">
+              <picker @change="merChangeClass" :value="mer_cate_index" :range="mer_cate_list" range-key="category_name">
+                <input placeholder="请选择商户分类" type="text" readonly disabled v-model="mer_class_name">
+              </picker>
+            </view>
+          </view>
+        </view>
+        <view class="line">
+          <view class="line-content">
+            <view class="title">店铺类型</view>
+            <view class="right">
+              <picker @change="merChangeType" :value="mer_type_index" :range="mer_type_list" range-key="type_name">
+                <input placeholder="请选择店铺类型" type="text" disabled readonly v-model="mer_type_name">
+              </picker>
+            </view>
+          </view>
+        </view>
+        <view class="line">
+          <view class="item-title">请上传营业执照及行业相关资质证明图片</view>
+          <view class="item-desc">(图片最多可上传10张,图片格式支持JPG、PNG、JPEG)</view>
+          <view class="upload">
+            <view class='pictrue' v-for="(item,index) in apply_info.mer_images" :key="index" :data-index="index">
+              <image :src='item'></image>
+              <text class='iconfont icon-guanbi1' @click="delPic(index)"></text>
+            </view>
+            <view v-else class='pictrue acea-row row-center-wrapper row-column' v-if="Object.values(apply_info.mer_images).length < 10" @click="uploadPic()">
+              <text class='iconfont icon-icon25201'></text>
+              <view>上传图片</view>
+            </view>
+          </view>
+        </view>
       </block>
+      <!--选择支付方式-->
+      <view class="pay-type" v-if="Number(pay_money) > 0">
+        <view class="box-title">支付方式</view>
+        <view class="box-content">
+          <radio-group name="pay_type" @change="changePayType">
+            <view class="pay-label" v-for="(item,index) in pay_list" :key="index" v-if="item.payStatus==1">
+              <label>
+                <view class="pay-item">
+                  <view class="left">
+                    <view :class="['iconfont','animated',item.icon]"></view>
+                    <view class="pay-item-info">
+                      <view class="pay-name">{{ item.name }}</view>
+                      <view class='tip'>
+                        {{item.title}}
+                        <block v-if="item.value == 'balance'">
+                          {{now_money}}
+                        </block>
+                      </view>
+                    </view>
+                  </view>
+                  <view class="right">
+                    <radio :value="item.value" :checked="item.value == pay_info.pay_type ? true : false" />
+                  </view>
+                </view>
+              </label>
+            </view>
+          </radio-group>
+        </view>
+      </view>
       <!--提交按钮-->
       <view class="group-btn">
-        <view class="add-btn">提交</view>
+        <view class="add-btn" @click="submitInfo">
+          {{ Number(pay_money) > 0 ? '去支付 ¥' + pay_money : '提交资料' }}
+        </view>
       </view>
     </view>
     <!-- 地区选择器 -->
@@ -62,9 +134,10 @@
         :is_show_area="['5','6','7'].includes(String(agent_type))"
         :is_show_street="['7'].includes(String(agent_type))"
         @close="areaPopupChange(false)"
-        @changeArea="areaChange"
+        @changeAddress="areaChange"
     ></areaSelect>
-    <!--授权登录-->
+
+    <!-- 授权登录 -->
     <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authClose"></authorize>
 	</view>
 </template>
@@ -73,7 +146,9 @@
 import {mapGetters} from "vuex";
 import authorize from '@/components/Authorize';
 import areaSelect from '@/components/areaSelect';
-import {getSingleAgentInfo,getAgentConfig} from "@/api/agent";
+import {getSingleAgentInfo,getAgentConfig,submitAgentApplyInfo} from "@/api/agent";
+import { merClassifly,getStoreTypeApi } from '@/api/store.js';
+import {getUserInfo} from "@/api/user";
 
 export default {
   name: 'business',
@@ -88,6 +163,7 @@ export default {
     return {
       page_title: '修改申请信息',
       config: {},
+      pay_money: 0,// 支付金额
       // 登录相关
       isAuto: false, //没有授权的不会自动授权
       isShowAuth: false,//是否隐藏授权
@@ -98,22 +174,75 @@ export default {
       apply_info_id: 0,// 申请信息id
       apply_info:{
         pid: 0,
+        mer_images: {},
       },
       // 地区选择器
       area_status: false,
-
+      address: '',
-
+      // 商户相关
-
+      mer_cate_list: [{
-
+        category_name: '',
-
+        mer_class_id: ''
+      }],
+      mer_cate_index: 0,
+      mer_class_name: '',
+      mer_type_list: [{
+        category_name: '',
+        mer_type_id: ''
+      }],
+      mer_type_index: 0,
+      mer_type_name: '',
+      //支付方式
+      pay_list: [
+        {
+          "name": "微信支付",
+          "icon": "icon-weixin2",
+          value: 'weixin',
+          title: '微信快捷支付',
+          payStatus: 1,
+        },
+        {
+          name: "支付宝支付",
+          icon: "icon-icon34",
+          // #ifdef H5 || APP-PLUS
+          value: 'alipay',
+          // #endif
+          // #ifdef MP
+          value: 'alipayQr',
+          // #endif
+          title: '支付宝支付',
+          payStatus: this.$store.getters.globalData.alipay_open
+        },
+        {
+          "name": "余额支付",
+          "icon": "icon-icon-test",
+          value: 'balance',
+          title: '可用余额:',
+          payStatus: this.$store.getters.globalData.yue_pay_status,
+        },
+        {
+          "name": "线下支付",
+          "icon": "icon-yinhangqia",
+          value: 'offline',
+          title: '线下支付',
+          payStatus: 2,
+        },
+      ],
+      now_money: 0,
+      pay_info: {
+        pay_type: 'weixin',
+        // #ifdef H5
+        return_url: 'http://' + window.location.host + '/pages/users/order_list/index',
+        // #endif
+      },
     }
   },
   onLoad(options) {
     let _this = this;
     if(options.scene){
-      console.log('转换前参数：',options.scene)
+      // console.log('转换前参数：',options.scene)
       let scene = _this.$util.getUrlParams(decodeURIComponent(options.scene));
-      console.log("接收参数",scene)
+      // console.log("接收参数",scene)
       _this.agent_id = scene.aid || 0;
       _this.agent_type = scene.lv || 0;
     }
@@ -150,6 +279,12 @@ export default {
       this.getInviteAgentInfo()
       this.generatePageTitle();
       this.getConfig();
+      this.getMerClass();
+      this.getMerType();
+      // 获取用户信息
+      getUserInfo().then(res => {
+        this.now_money = res.data.now_money
+      });
     },
     //  获取邀请人信息
     getInviteAgentInfo(){
@@ -200,6 +335,16 @@ export default {
       getAgentConfig().then(res => {
         if (res.status == 200) {
           _this.config = res.data || {};
+          // 判断：是否需要审核
+          switch (Number(_this.agent_type)) {
+            case 2: _this.pay_money = _this.config.province_money || 0;break;
+            case 3: _this.pay_money = _this.config.field_staff_money || 0;break;
+            case 4: _this.pay_money = _this.config.internal_staff_money || 0;break;
+            case 5: _this.pay_money = _this.config.operator_money || 0;break;
+            case 6: _this.pay_money = _this.config.partner_money || 0;break;
+            case 7: _this.pay_money = _this.config.mer_money || 0;break;
+            case 8: _this.pay_money = _this.config.delivery_money || 0;break;
+          }
         }
       }).catch(err => {
         this.$util.Tips({title: err});
@@ -211,23 +356,336 @@ export default {
     },
     // 地区选择器 - 地区改变
     areaChange(data){
+      let type = data.type || '';
+      let value = data.value || {};
+      switch (type) {
+        case 'province':
+          this.apply_info.province_id = value.id || 0;
+          this.apply_info.province_name = value.name || '';
+          break;
+        case 'city':
+          this.apply_info.city_id = value.id || 0;
+          this.apply_info.city_name = value.name || '';
+          break;
+        case 'area':
+          this.apply_info.area_id = value.id || 0;
+          this.apply_info.area_name = value.name || '';
+          break;
+        case 'street':
+          this.apply_info.street_id = value.id || 0;
+          this.apply_info.street_name = value.name || '';
+          break;
+      }
+      // 地址拼接
+      let provinceName = this.apply_info.province_name || '';
+      let cityName = this.apply_info.city_name || '';
+      let areaName = this.apply_info.area_name || '';
+      let streetName = this.apply_info.street_name || '';
 
-      console.log("地区改变", data)
+      this.address = provinceName + cityName + areaName + streetName;
-
+    },
-    }
+    // 商户相关 - 获取分类列表
-
+    getMerClass() {
-
+      merClassifly().then(res => {
-
+        this.mer_cate_list = res.data
-
+      }).catch(res => {
-
+        this.$util.Tips({
-
+          title: res
-
+        });
-
+      });
-
+    },
-
+    // 商户相关 - 获取类型列表
+    getMerType() {
+      getStoreTypeApi().then(res => {
+        this.mer_type_list = res.data
+      }).catch(res => {
+        this.$util.Tips({
+          title: res
+        });
+      });
+    },
+    // 商户相关 - 分类选中
+    merChangeClass(e) {
+      this.mer_cate_index = e.detail.value || e.target.value
+      this.apply_info.mer_class_id = this.mer_cate_list[this.mer_cate_index]['merchant_category_id']
+      this.mer_class_name = this.mer_cate_list[this.mer_cate_index]['category_name']
+    },
+    // 商户相关 - 类型选中
+    merChangeType(e) {
+      this.mer_type_index = e.detail.value || e.target.value
+      this.apply_info.mer_type_id = this.mer_type_list[this.mer_type_index]['mer_type_id']
+      this.mer_type_name = this.mer_type_list[this.mer_type_index]['type_name']
+    },
+    // 图片上传 - 点击上传图片
+    uploadPic() {
+      let _this = this;
+      _this.$util.uploadImageOne('upload/image', function(res) {
+        if(res.status == 200){
+          let data = res.data || {};
+          let images = _this.apply_info.mer_images || {};
+          let pics = Object.values(images);
+          pics[Object.values(pics).length] = data.path || '';
 
+          _this.$set(_this.apply_info, 'mer_images', pics);
+        }
+      });
+    },
+    // 图片生成 - 删除图片
+    delPic(index){
+      let _this = this;
+      let pics = Object.values(_this.apply_info.mer_images);
+      pics.splice(index, 1);
 
+      _this.$set(_this.apply_info, 'mer_images', pics);
+    },
+    // 提交申请信息
+    submitInfo(){
+      let _this = this;
+      let applyInfo = Object.assign({}, _this.apply_info);
+      let payInfo = Object.assign({}, _this.pay_info);
+      applyInfo.pid = _this.agent_id;
+      applyInfo.agent_type = _this.agent_type;
+      if (payInfo.pay_type == 'weixin') {
+        // #ifdef H5
+        payInfo.pay_type = _this.$wechat.isWeixin() ? 'weixin' : 'h5'
+        // #endif
+        // #ifdef MP
+        payInfo.pay_type = 'routine'
+        // #endif
+        // #ifdef APP-PLUS
+        payInfo.pay_type = 'weixin'
+        // #endif
+      }
+      applyInfo.pay_type = payInfo.pay_type
+      applyInfo.return_url = payInfo.return_url
+      // 提交申请
+      submitAgentApplyInfo(applyInfo).then(res => {
+        if (res.status == 200) {
+          if(Number(_this.pay_money) > 0){
+            let status = res.data.status,
+                orderId = res.data.result.order_id,
+                callback_key = res.data.result.pay_key,
+                jsConfig = res.data.result.config,
+                goPages = '/pages/order_pay_status/index?order_id=' + orderId + '&msg=' + res.message;
+            switch (status) {
+              case 'ORDER_EXIST':
+              case 'EXTEND_ORDER':
+              case 'PAY_ERROR':
+              case 'error':
+                return _this.$util.Tips({
+                  title: res.message
+                }, {
+                  tab: 5,
+                  url: goPages
+                });
+                break;
+              case 'success':
+                return _this.$util.Tips({
+                  title: res.message,
+                  icon: 'success'
+                }, {
+                  tab: 5,
+                  url: goPages
+                });
+                break;
+              case 'alipay':
+              case "alipayQr":
+                uni.navigateTo({
+                  url: '/pages/order_pay_back/index?keyCode=' + callback_key + '&url=' +
+                      jsConfig
+                })
+                return;
+                break;
+                // #ifndef MP
+              case "wechat":
+              case "weixin":
+              case "weixinApp":
+                jsConfig.timeStamp = jsConfig.timestamp;
+                // #ifndef APP-PLUS
+                this.$wechat.pay(jsConfig).then(res => {
+                  return _this.$util.Tips({
+                    title: res.message,
+                    icon: 'success'
+                  }, {
+                    tab: 4,
+                    url: goPages
+                  });
+                }).catch(res => {
+                  if (res.errMsg == 'chooseWXPay:cancel') return _this.$util.Tips({
+                    title: '取消支付'
+                  }, {
+                    tab: 5,
+                    url: goPages + '&status=0'
+                  });
+                })
+                // #endif
+                // #ifdef APP-PLUS
+                let mp_pay_name=''
+                if(uni.requestOrderPayment){
+                  mp_pay_name='requestOrderPayment'
+                }else{
+                  mp_pay_name='requestPayment'
+                }
+                uni[mp_pay_name]({
+                  provider: 'wxpay',
+                  orderInfo: jsConfig,
+                  success: (e) => {
+                    let url = '/pages/order_pay_status/index?order_id=' + orderId +
+                        '&msg=支付成功';
+                    return _this.$util.Tips({
+                      title: '支付成功',
+                      icon: 'success'
+                    }, {
+                      tab: 4,
+                      url: url
+                    });
+                  },
+                  fail: (e) => {
+                    let url = '/pages/order_pay_status/index?order_id=' + orderId + '&msg=取消支付';
+                    return _this.$util.Tips({
+                      title: '取消支付',
+                    }, {
+                      tab: 4,
+                      url: url
+                    });
+                  },
+                  complete: () => {
+                    let url = '/pages/order_pay_status/index?order_id=' + orderId + '&msg=取消支付';
+                    return _this.$util.Tips({
+                      title: '',
+                    }, {
+                      tab: 4,
+                      url: url
+                    });
+                  },
+                });
+                // #endif
+                break;
+                // #endif
+                // #ifdef MP
+              case "routine":
+                jsConfig.timeStamp = jsConfig.timestamp;
+                _this.toPay = true;
+                let mp_pay_name=''
+                if(uni.requestOrderPayment){
+                  mp_pay_name='requestOrderPayment'
+                }else{
+                  mp_pay_name='requestPayment'
+                }
+                uni[mp_pay_name]({
+                  ...jsConfig,
+                  success: function(res) {
+                    uni.hideLoading();
+                    return _this.$util.Tips({
+                      title: '支付成功',
+                      icon: 'success'
+                    }, {
+                      tab: 5,
+                      url: goPages
+                    });
+                  },
+                  fail: function(e) {
+                    let pages = '/pages/order_pay_status/index?order_id=' +
+                        orderId + '&msg=取消支付'
+                    return _this.$util.Tips({
+                      title: '取消支付'
+                    }, {
+                      tab: 5,
+                      url: pages + '&status=0'
+                    });
+                  },
+                })
+                break;
+                // #endif
+              case "balance":
+                //余额
+                return _this.$util.Tips({
+                  title: res.msg
+                }, {
+                  tab: 5,
+                  url: goPages + '&status=1'
+                });
+                break;
+                // #ifdef H5
+              case 'h5':
+                let host = window.location.protocol + "//" + window.location.host;
+                let url = `${host}/pages/order_pay_status/index?order_id=${orderId}&msg=${res.message}`
+                let eUrl = encodeURIComponent(url)
+                let jsurl = jsConfig.mweb_url || jsConfig.h5_url
+                let locations = `${jsurl}&redirect_url=${eUrl}`
+                setTimeout(() => {
+                  location.href = locations;
+                }, 100);
+                break;
+                // #endif
+                // #ifdef APP-PLUS
+              case 'alipayApp':
+                uni.requestPayment({
+                  provider: 'alipay',
+                  orderInfo: jsConfig,
+                  success: (e) => {
+                    return _this.$util.Tips({
+                      title: '支付成功',
+                      icon: 'success'
+                    }, {
+                      tab: 5,
+                      url: goPages
+                    });
+                  },
+                  fail: (e) => {
+                    let pages = '/pages/order_pay_status/index?order_id=' +
+                        orderId + '&msg=支付失败'
+                    return _this.$util.Tips({
+                      title: '支付失败'
+                    }, {
+                      tab: 5,
+                      url: pages
+                    });
+                  },
+                  complete: () => {
+                    uni.hideLoading();
+                    let pages = '/pages/order_pay_status/index?order_id=' +
+                        orderId + '&msg=取消支付'
+                    return _this.$util.Tips({
+                      title: ''
+                    }, {
+                      tab: 5,
+                      url: pages
+                    });
+                  },
+                });
+                break;
+                // #endif
+              default:
+                let pages = '/pages/order_pay_status/index?order_id=' +
+                    orderId + '&msg=取消支付'
+                return _this.$util.Tips({
+                  title: '取消支付'
+                }, {
+                  tab: 5,
+                  url: pages + '&status=0'
+                });
+            }
+          }else{
+            _this.$util.Tips({
+              title: '操作成功！',
+            }
+            // ,{
+            //   tab: 5,
+            //   url: '/pages/supplier/apply/record'
+            // }
+            );
 
+          }
+        }
+      }).catch(err => {
+        this.$util.Tips({title: err});
+      });
+    },
+    // 修改支付方式
+    changePayType(e){
+      this.pay_info.pay_type = e.detail.value || e.target.value;
+    },
 
 
   }
@@ -238,7 +696,7 @@ export default {
 .main-content{
   width: 100vw!important;
   min-height: 100vh!important;
-  background: orange;
+  background: #F6F6F6;
   padding: 0 20rpx 100rpx 20rpx;
 
   .title{
@@ -255,7 +713,6 @@ export default {
     padding: 20rpx!important;
     .line{
       width: 100%;
-
       .line-content{
         width: 100%;
         display: inline-flex;
@@ -323,10 +780,12 @@ export default {
 
 
 
+          }
+          input{
+            width: 100%!important;
           }
         }
       }
-
       .user-content{
         width: 100%;
         display: inline-flex;
@@ -355,6 +814,66 @@ export default {
           }
         }
       }
+
+      .item-title{
+        color: #666666;
+        font-size: 28rpx;
+        display: block;
+      }
+      .item-desc{
+        color: #B2B2B2;
+        font-size: 22rpx;
+        display: block;
+        margin-top: 8rpx;
+        line-height: 36rpx;
+      }
+      .upload{
+        margin-top: 20rpx;
+        display: inline-flex;
+        flex-direction: row;
+        flex-wrap: wrap;
+        align-items: center;
+        justify-content: flex-start;
+        .pictrue {
+          width: 130rpx;
+          height: 130rpx;
+          position: relative;
+          font-size: 11px;
+          color: #bbb;
+          margin-right: 15rpx;
+          margin-bottom: 15rpx;
+          &:nth-child(4n) {
+            margin-right: 0;
+          }
+          &:nth-last-child(1) {
+            border: 0.5px solid #ddd;
+            box-sizing: border-box;
+          }
+          uni-image, image {
+            width: 100%;
+            height: 100%;
+            border-radius: 1px;
+            img {
+              -webkit-touch-callout: none;
+              -webkit-user-select: none;
+              -moz-user-select: none;
+              display: block;
+              position: absolute;
+              top: 0;
+              left: 0;
+              opacity: 0;
+              width: 100%;
+              height: 100%;
+            }
+          }
+          .icon-guanbi1 {
+            font-size: 33rpx;
+            position: absolute;
+            top: -10px;
+            right: -10px;
+          }
+        }
+      }
     }
     .group-btn{
       margin-top: 80rpx!important;
@@ -378,9 +897,87 @@ export default {
     }
   }
 }
-.picker-box{
+// 支付方式
-  width: 100% !important;
+.pay-type{
-  text-align: left!important;
+  .box-title{
-  height: 43rpx;
+    margin: 30rpx 0;
+    height: 50rpx;
+    line-height: 50rpx;
+    font-size: 28rpx;
+    padding-left: 20rpx;
+    font-weight: bold;
+    position: relative;
+  }
+  .box-title:after{
+    content: "";
+    position: absolute;
+    left: 0;
+    top: calc((50rpx - 30rpx) / 2);
+    width: 10rpx;
+    height: 30rpx;
+    background: #1777ff;
+  }
+  .box-content{
+    .pay-label:not(:last-child){
+      margin-bottom: 20rpx;
+    }
+    .pay-item{
+      height: 120rpx;
+      padding: 20rpx;
+      width: 100%;
+      border: 2rpx solid #d9dce4;
+      border-radius: 15rpx;
+      display: inline-flex;
+      flex-direction: row;
+      flex-wrap: nowrap;
+      align-items: center;
+      justify-content: space-around;
+      .left{
+        width: calc(100% - 80rpx);
+        display: inline-flex;
+        flex-direction: row;
+        flex-wrap: nowrap;
+        align-items: center;
+        justify-content: flex-start;
+        .animated{
+          width: 44rpx;
+          height: 44rpx;
+          border-radius: 50%;
+          text-align: center;
+          line-height: 44rpx;
+          background-color: #fe960f;
+          color: #fff;
+          font-size: 30rpx;
+          margin-right: 15rpx;
+        }
+        .icon-weixin2 {
+          background-color: #41b035;
+        }
+        .icon-icon34 {
+          background-color: #4295D5;
+        }
+        .pay-item-info{
+          .pay-name{
+            text-align: left;
+            border-right: 1px solid #eee;
+            justify-content: left;
+          }
+          .tip{
+            text-align: left;
+            font-size: 26rpx;
+            color: #aaa;
+          }
+        }
+      }
+      .right{
+        width: 80rpx;
+        display: inline-flex;
+        flex-direction: row;
+        flex-wrap: nowrap;
+        align-items: center;
+        justify-content: flex-end;
+      }
+    }
+  }
 }
 </style>