新增商户入驻页面

pages.json

@@ -5,6 +5,7 @@
       "style": {
         "navigationBarTitleText": "首页",
         "navigationStyle": "custom",
+        "enablePullDownRefresh": true,
         // #ifdef APP-PLUS
         "enablePullDownRefresh": true,
         // #endif
@@ -17,14 +18,16 @@
       "path": "pages/gather/gather",
       "style": {
         "navigationBarTitleText": "工作台",
-        "navigationStyle": "custom"
+        "navigationStyle": "custom",
+        "enablePullDownRefresh": true
       }
     },
     {
       "path": "pages/plant_release/index",
       "style": {
         "navigationBarTitleText": "常用",
-        "navigationStyle": "custom"
+        "navigationStyle": "custom",
+        "enablePullDownRefresh": true
       }
     },
     {
@@ -699,7 +702,16 @@
             "navigationBarTitleText": "店铺资质信息"
           }
         }
-      ]
+          ,{
+                    "path" : "settledApply/settledApply",
+                    "style" :                                                                                    
+                {
+                    "navigationBarTitleText": "入驻申请",
+                    "enablePullDownRefresh": true
+                }
+                
+                }
+            ]
     },
     {
       "root": "pages/admin",

pages/home/index.vue

@@ -14,7 +14,7 @@
       </view>
 
       <view class="search_wrapper flex_a_c">
-        <view class="place_wrapper flex_a_c">
+        <view class="place_wrapper flex_a_c" @click.stop="showPicker=true">
           <view class="iconfont icon-weizhi"></view>
           <view class="town_name">{{street}}</view>
         </view>
@@ -58,6 +58,10 @@
       </view>
     </view>
 
+    <u-picker :defaultIndex="[0,0]" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm"
+      @cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker>
+    <view class="bg_color"></view>
+
     <view class="bg_color"></view>
 
     <m-tabbar native>
@@ -76,6 +80,7 @@
   import { graphicLstApi, getTopicList, graphicStartApi } from '@/api/community.js'
   import { getIndexData } from '@/api/api.js'
   import { getGeocoder, merClassifly } from '@/api/store.js';
+  import { getArea, getStreet } from '@/api/article.js';
   import { Toast } from '@/libs/uniApi'
   export default {
     components: {
@@ -83,6 +88,8 @@
     },
     data() {
       return {
+        showPicker: false,
+        columnData: [],
         show: false,
         swiper: {
           url: [{
@@ -127,9 +134,33 @@
       this.getCateList()
       this.getGoods()
       this.selfLocation()
+      this.Area()
     },
     onShow() {},
     methods: {
+      confirm(e) {
+        this.where.street_id = e.value[1].code
+        this.showPicker = false
+      },
+      changeHandler(e) {
+        const { columnIndex, value, values, index, picker = this.$refs.uPicker } = e;
+        if (columnIndex === 0) {
+          getStreet({ area_code: value[0]['code'] }).then(res => {
+            this.$refs.uPicker.setColumnValues(1, res);
+          });
+        }
+      },
+      Area() {
+        getArea({ city_code: 510500 }).then(res => {
+          this.$refs.uPicker.setColumnValues(0, res.data);
+          this.Street(res.data[0]['code']);
+        });
+      },
+      Street(code) {
+        getStreet({ area_code: code }).then(res => {
+          this.$refs.uPicker.setColumnValues(1, res.data);
+        });
+      },
       gogogo(item) {
         uni.navigateTo({
           url: '/pages/plantGrass/plant_detail/index?id=' + item.community_id

pages/nongKe/supply_chain/component/shop_card.vue

@@ -87,9 +87,10 @@
     /* box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.25); */
     border-radius: 28.07rpx;
     margin-bottom: 17.54rpx;
-    background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/2/storeBg.png');
+    // background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/2/storeBg.png');
     background-size: 100% 100%;
     background-repeat: no-repeat;
+    background-color: #f5f5f5;
 
     .merchant_msg {
       display: flex;

pages/nongKe/supply_chain/merchant.vue

@@ -19,6 +19,9 @@
 
     <block v-for="(item,index) in list" :key="index">
       <view class="item_list flex">
+        <view>
+          <image class="goods_image" :src="item.image" mode="aspectFill"></image>
+        </view>
         <view class="left_goods_msg">
           <view class="name">{{ item.store_name }}</view>
           <view class="classify flex_a_c">
@@ -99,6 +102,7 @@
     onShow() {},
     methods: {
       async searchBtn() {
+        this.infoData.page = 1
         const res = await getStoreGoods(this.id, this.infoData)
         this.list = res.data.list
       },
@@ -316,14 +320,27 @@
     width: 694.74rpx;
     background: #FFFFFF;
     border-radius: 8px;
+    font-size: 24.56rpx;
+
+    .goods_image {
+      width: 119.3rpx;
+      height: 119.3rpx;
+      border-radius: 8px;
+      margin-right: 26.32rpx;
+    }
 
     .left_goods_msg {
       width: 100%;
       flex: 1;
 
       .name {
-        font-size: 31.58rpx;
+        font-size: 28.07rpx;
-        font-weight: bold;
+        font-weight: 700;
+        width: 315.79rpx;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+
       }
 
       .price {
@@ -340,7 +357,7 @@
       align-items: flex-end;
 
       .num {
-        font-size: 31.58rpx;
+        font-size: 24.56rpx;
         color: $uni-theme-color;
       }
 
@@ -357,7 +374,7 @@
         width: 180rpx;
         height: 60rpx;
         line-height: 60rpx;
-        background-color: $uni-theme-color;
+        background: $uni-theme-bg-color;
         border-radius: 100px;
         color: #fff;
       }

pages/store/settledApply/settledApply.vue

@@ -0,0 +1,484 @@
+<template>
+  <view class="settledApply">
+    <form report-submit='true'>
+      <view class="settled-wrapper">
+        <view class="set-item">
+          <view class="title">商户名称</view>
+          <input class="input-box" type="text" maxlength="30" placeholder="请输入商户名称" v-model="formData.enterprise_name"
+            placeholder-class='placeholder' />
+        </view>
+        <view class="set-item">
+          <view class="title">真实姓名</view>
+          <input class="input-box" type="text" maxlength="30" placeholder="请输入真实姓名" v-model="formData.user_name"
+            placeholder-class='placeholder' />
+        </view>
+        <view class="set-item">
+          <view class="title">联系电话</view>
+          <input class="input-box" type="text" maxlength="30" placeholder="请输入联系电话" v-model="formData.phone"
+            placeholder-class='placeholder' />
+        </view>
+        <view class="set-item">
+          <view class="title">验证码</view>
+          <view class="input-box">
+            <input type="text" maxlength="30" placeholder="请输入验证码" v-model="formData.yanzhengma"
+              placeholder-class='placeholder' />
+            <button class="code" :disabled="disabled" :class="disabled === true ? 'on' : ''" @click="handleVerify">
+              {{ text }}
+            </button>
+          </view>
+        </view>
+        <view class="set-item">
+          <view class="title">店铺分类</view>
+          <view class="input-box flex_a_c_j_sb" @click="pickerIsShow('class')">
+            <input type="text" maxlength="30" placeholder="请选择店铺分类" disabled v-model="formData.classification"
+              placeholder-class='placeholder' />
+            <view class="iconfont icon-xialazhankai"></view>
+          </view>
+        </view>
+        <view class="set-item">
+          <view class="title">店铺类型</view>
+          <view class="input-box flex_a_c_j_sb" @click="pickerIsShow('type')">
+            <input type="text" maxlength="30" placeholder="请选择店铺类型" disabled v-model="formData.mer_type"
+              placeholder-class='placeholder' />
+            <view class="iconfont icon-xialazhankai"></view>
+          </view>
+        </view>
+        <view class="set-item">
+          <view class="title">店铺所在地</view>
+          <view class="input-box flex_a_c_j_sb" @click="pickerIsShow('site')">
+            <input type="text" maxlength="30" placeholder="请选择商圈" disabled v-model="formData.site"
+              placeholder-class='placeholder' />
+            <view class="iconfont icon-xialazhankai"></view>
+          </view>
+        </view>
+        <view class="set-item">
+          <view class="title">是否农贸市场</view>
+          <view class="input-box no-border">
+            <u-switch v-model="isOpenFair" @change="switchcChange"></u-switch>
+          </view>
+        </view>
+        <view class="set-item">
+          <text class="item-title">请上传营业执照及行业相关资质证明图片</text>
+          <text class="item-desc">(图片最多可上传10张,图片格式支持JPG、PNG、JPEG)</text>
+          <view class="upload">
+            <view class='pictrue' v-for="(item,index) in pics" :key="index" :data-index="index"
+              @click="getPhotoClickIdx">
+              <image :src='item'></image>
+              <text class='iconfont icon-guanbi1' @click.stop='DelPic(index)'></text>
+            </view>
+            <view class='pictrue acea-row row-center-wrapper row-column' @click='uploadpic' v-if="pics.length < 10">
+              <text class='iconfont icon-icon25201'></text>
+              <view>上传图片</view>
+            </view>
+          </view>
+        </view>
+        <view class="set-item no-border flex">
+          <checkbox-group @change='ChangeIsAgree'>
+            <checkbox class="checkbox" :checked="isAgree ? true : false" />已阅读并同意
+          </checkbox-group>
+          <button class="settleAgree" @click="getConfig">《入驻协议》</button>
+        </view>
+        <button class='submitBtn' :class="validate === true ? 'on-submit':''" @click="formSubmit">提交申请</button>
+      </view>
+    </form>
+    <Verify @success="success" :captchaType="'blockPuzzle'" :imgSize="{ width: '330px', height: '155px' }" ref="verify">
+    </Verify>
+    <u-picker :defaultIndex="[0,0]" :show="pickerShow" @change="changeHandler" @confirm="confirm" :columns="columns"
+      :keyName="keyName" ref="uPicker" @cancel="pickerShow = false"></u-picker>
+  </view>
+</template>
+
+<script>
+  import {
+    create,
+    verify,
+    merClassifly,
+    getGoodsDetails,
+    updateGoodsRecord,
+    getStoreTypeApi
+  } from '@/api/store.js';
+  import { getArea, getStreet } from '@/api/article.js';
+  import Verify from '@/components/verify/verify.vue';
+  import { Toast } from '@/libs/uniApi';
+  export default {
+    components: {
+      Verify
+    },
+    data() {
+      return {
+        formData: {
+          enterprise_name: '',
+          user_name: '',
+          phone: '',
+          yanzhengma: '',
+          classification: '',
+          mer_type: '',
+          site: ''
+        },
+        disabled: false,
+        timer: "",
+        text: "获取验证码",
+        pickerShow: false,
+        keyName: '',
+        columns: [],
+        mer_classification: '', // 商户分类
+        mer_storeType: '', // 店铺类型
+        isOpenFair: false, // 是否农贸市场
+        pics: [],
+        isAgree: false,
+        validate: false,
+      }
+    },
+    beforeDestroy() {
+      clearTimeout(this.timer)
+    },
+    onLoad() {},
+    onShow() {},
+    methods: {
+      formSubmit() {
+
+      },
+      ChangeIsAgree: function(e) {
+        this.isAgree = !this.isAgree;
+      },
+      switchcChange(e) {
+        console.log(e);
+      },
+      // 获取商户分类
+      async getClassfication() {
+        const res = await merClassifly().catch(err => Toast(err));
+        this.keyName = 'category_name'
+        this.$refs.uPicker.setColumnValues(0, res.data);
+        this.pickerShow = true
+      },
+      // 获取店铺类型
+      async getStoreType() {
+        const res = await getStoreTypeApi().catch(err => Toast(err));
+        this.keyName = 'type_name'
+        this.$refs.uPicker.setColumnValues(0, res.data);
+        this.pickerShow = true
+      },
+      // 获取商圈
+      Area() {
+        getArea({ city_code: 510500 }).then(res => {
+          this.$refs.uPicker.setColumnValues(0, res.data);
+          this.Street(res.data[0]['code']);
+        });
+      },
+      Street(code) {
+        getStreet({ area_code: code }).then(res => {
+          this.keyName = 'name'
+          this.$refs.uPicker.setColumnValues(1, res.data);
+          this.pickerShow = true
+        });
+      },
+      pickerIsShow(type) {
+        switch (type) {
+          case 'class':
+            this.getClassfication()
+            break;
+          case 'type':
+            this.getStoreType()
+            break;
+          case 'site':
+            this.Area()
+            break;
+        }
+      },
+      confirm(e) {
+        console.log('e', e);
+        switch (this.keyName) {
+          case 'category_name':
+            this.formData.classification = e.value[0].category_name
+            break;
+          case 'type_name':
+            this.formData.mer_type = e.value[0].type_name
+            break;
+          case 'name':
+            this.formData.site = e.value[1].name
+            break;
+        }
+        this.pickerShow = false
+      },
+      changeHandler(e) {
+        const { columnIndex, value, values, index, picker = this.$refs.uPicker } = e;
+        if (this.keyName === 'site') {
+          if (columnIndex === 0) {
+            getStreet({ area_code: value[0]['code'] }).then(res => {
+              this.$refs.uPicker.setColumnValues(1, res);
+            });
+          }
+        }
+      },
+      async code(data) {
+        let that = this;
+        if (!that.formData.phone) return that.$util.Tips({
+          title: '请填写手机号码'
+        });
+        if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(that.formData.phone)) return that.$util.Tips({
+          title: '请输入正确的手机号码'
+        });
+        await verify({
+            phone: that.formData.phone,
+            // key: that.codeKey,
+            // code: that.codeVal,
+            type: 'intention',
+            captchaType: 'blockPuzzle',
+            captchaVerification: data.captchaVerification
+          })
+          .then(res => {
+            that.$util.Tips({
+              title: res.msg
+            });
+            that.sendCode();
+          })
+          .catch(res => {
+            that.$util.Tips({
+              title: res
+            });
+            if (res.status == 402) {
+              // that.getcaptcha();
+            }
+          });
+      },
+      sendCode() {
+        if (this.disabled) return;
+        this.disabled = true;
+        let n = 60;
+        this.text = "剩余 " + n + "s";
+        const run = setInterval(() => {
+          n = n - 1;
+          if (n < 0) {
+            clearInterval(run);
+          }
+          this.text = "剩余 " + n + "s";
+          if (this.text < "剩余 " + 0 + "s") {
+            this.disabled = false;
+            this.text = "重新获取";
+          }
+        }, 1000);
+      },
+      success(data) {
+        this.$refs.verify.hide();
+        this.code(data);
+      },
+      handleVerify() {
+        if (!this.formData.phone) return this.$util.Tips({
+          title: '请输入手机号'
+        });
+        if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(this.formData.phone)) return this.$util.Tips({
+          title: '请输入正确的手机号码'
+        });
+        if (!this.isAgree) return this.$util.Tips({
+          title: '请勾选并同意入驻协议'
+        });
+        this.$refs.verify.show();
+      },
+      // 图片预览
+      // 获得相册 idx
+      getPhotoClickIdx(e) {
+        let _this = this;
+        let idx = e.currentTarget.dataset.index;
+        _this.imgPreview(_this.pics, idx);
+      },
+      // 图片预览
+      imgPreview: function(list, idx) {
+        // list：图片 url 数组
+        if (list && list.length > 0) {
+          uni.previewImage({
+            current: list[idx], //  传 Number H5端出现不兼容
+            urls: list
+          });
+        }
+      },
+      /**
+       * 上传文件
+       *
+       */
+      uploadpic: function() {
+        let that = this;
+        that.$util.uploadImageOne('upload/image', function(res) {
+          that.pics.push(res.data.path);
+          that.$set(that, 'pics', that.pics);
+        });
+      },
+      /**
+       * 删除图片
+       *
+       */
+      DelPic: function(index) {
+        let that = this,
+          pic = this.pics[index];
+        that.pics.splice(index, 1);
+        that.$set(that, 'pics', that.pics);
+      },
+    },
+    onPullDownRefresh() {
+      uni.stopPullDownRefresh()
+    }
+  }
+</script>
+
+<style lang="scss">
+  .settled-wrapper {
+    width: 694.74rpx;
+    margin: 0 auto;
+    padding: 35.09rpx 28.07rpx;
+    background: #fff;
+    border-radius: 8px;
+
+    .set-item {
+      width: 100%;
+      margin-bottom: 31.58rpx;
+
+      .title {
+        font-size: 31.58rpx;
+      }
+
+      .input-box {
+        position: relative;
+        display: flex;
+        width: 100%;
+        height: 48px;
+        margin-top: 17.54rpx;
+        padding: 21.05rpx;
+        background: #FFFFFF;
+        border-radius: 8px;
+        border: 1px solid #CCCCCC;
+        box-sizing: border-box;
+
+        .code {
+          position: absolute;
+          right: 10px;
+          width: 93px;
+          line-height: 27px;
+          border: 1px solid $uni-theme-color;
+          border-radius: 15px;
+          color: $uni-theme-color;
+          text-align: center;
+          bottom: 8px;
+          font-size: 12px;
+        }
+
+        .on {
+          background-color: #bbb;
+          color: #fff;
+          border-color: #bbb;
+        }
+      }
+
+      .placeholder {
+        color: #ccc;
+      }
+
+      .no-border {
+        padding: 0;
+        border: none;
+      }
+
+      // 图片上传
+      .item-title {
+        color: #666666;
+        font-size: 28rpx;
+        display: block;
+      }
+
+      .item-desc {
+        color: #B2B2B2;
+        font-size: 22rpx;
+        display: block;
+        margin-top: 9rpx;
+        line-height: 36rpx;
+      }
+
+      .upload {
+        display: -webkit-box;
+        display: -moz-box;
+        display: -webkit-flex;
+        display: -ms-flexbox;
+        display: flex;
+        -webkit-box-lines: multiple;
+        -moz-box-lines: multiple;
+        -o-box-lines: multiple;
+        -webkit-flex-wrap: wrap;
+        -ms-flex-wrap: wrap;
+        flex-wrap: wrap;
+        margin-top: 20rpx;
+      }
+
+      .pictrue {
+        width: 130rpx;
+        height: 130rpx;
+        margin: 24rpx 22rpx 0 0;
+        position: relative;
+        font-size: 11px;
+        color: #bbb;
+
+        &: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;
+        }
+      }
+
+      // 是否勾选
+      .settleAgree {
+        display: inline-block;
+        font-size: 24rpx;
+        color: $uni-theme-color;
+        position: relative;
+        top: 2px;
+        left: 8px;
+      }
+    }
+
+    .submitBtn {
+      width: 588rpx;
+      margin: 0 auto;
+      height: 86rpx;
+      border-radius: 25px;
+      text-align: center;
+      line-height: 86rpx;
+      font-size: 15px;
+      color: #fff;
+      background: #E3E3E3;
+      margin-top: 25px;
+      pointer-events: none;
+    }
+
+    .on-submit {
+      background: $uni-theme-bg-color;
+      pointer-events: all;
+    }
+  }
+</style>

pages/supply_chains/supply_chains.vue

@@ -81,7 +81,7 @@
 
       <!-- 滚动 -->
       <scroll-view scroll-y="true" class="article_box">
-        <view>
+        <view @click="navigat">
           <block v-for="item in ArticleHotList" :key="item.article_id">
             <view class="article_item">
               <view class="title">{{item.title}}</view>
@@ -214,6 +214,11 @@
     onShow() {},
     computed: mapGetters(['location']),
     methods: {
+      navigat() {
+        uni.navigateTo({
+          url: '/pages/store/settledApply/settledApply'
+        })
+      },
       async articleHotList() {
         const res = await getArticleList(19)
         this.ArticleHotList = res.data.list