|
@@ -0,0 +1,339 @@
|
|
|
+<template>
|
|
|
+ <view class="content">
|
|
|
+ <image class="shop-banner" src="../../static/images/shop-banner.png" mode="widthFix"></image>
|
|
|
+ <view class="enterprise">
|
|
|
+ <view class="enterprise-box">
|
|
|
+ <view class="box-item">
|
|
|
+ <view class="item-left">联系人:</view>
|
|
|
+ <view class="item-right"><input type="text" placeholder="请输入联系人" v-model="nameP" /></view>
|
|
|
+ </view>
|
|
|
+ <view class="box-item">
|
|
|
+ <view class="item-left">联系电话:</view>
|
|
|
+ <view class="item-right"><input type="text" placeholder="请输入联系电话" v-model="phone" /></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="enterprise-box">
|
|
|
+ <view class="box-item">
|
|
|
+ <view class="item-left">店铺名称:</view>
|
|
|
+ <view class="item-right"><input type="text" placeholder="请输入店铺名" v-model="name" /></view>
|
|
|
+ </view>
|
|
|
+ <view class="box-item" @click="getLocation">
|
|
|
+ <view class="item-left">商家地址:</view>
|
|
|
+ <view class="item-right"><input type="text" placeholder="请选择详细地址" v-model="showaddress" /></view>
|
|
|
+ </view>
|
|
|
+ <view class="box-item">
|
|
|
+ <view class="item-left">服务类目:</view>
|
|
|
+ <view class="item-right"><input type="text" placeholder="请输入您的经营范围" v-model="introduction" /></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="enterprise-box">
|
|
|
+ <view class="box-item1">
|
|
|
+ <view class="item-left">商户门头:</view>
|
|
|
+ <view class="item-right">
|
|
|
+ <image :src="cardimg" mode="" class="upload-img" @click.stop="imgsub" v-if="cardimg"></image>
|
|
|
+ <image src="../../static/images/up-img.png" class="upload-img" mode="" v-if="!cardimg" @click.stop="imgsub"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="enterprise-box">
|
|
|
+ <view class="box-item1">
|
|
|
+ <view class="item-left">营业执照:</view>
|
|
|
+ <view class="item-right">
|
|
|
+ <image :src="imgY" mode="" class="upload-img" @click.stop="imgsubY" v-if="imgY"></image>
|
|
|
+ <image src="../../static/images/up-img.png" class="upload-img" mode="" v-if="!imgY" @click.stop="imgsubY"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="enterprise-box">
|
|
|
+ <view class="box-item">
|
|
|
+ <view class="item-left">环境介绍:</view>
|
|
|
+ <view class="item-right"><input type="text" placeholder="请输入" v-model="introductory" /></view>
|
|
|
+ </view>
|
|
|
+ <view class="box-item1">
|
|
|
+ <view class="item-left">店内照片:</view>
|
|
|
+ <view class="item-right">
|
|
|
+ <image :src="shopImg" mode="" class="upload-img" @click.stop="imgsub" v-if="shopImg"></image>
|
|
|
+ <image src="../../static/images/up-img.png" class="upload-img" mode="" v-if="!shopImg" @click.stop="imgsut"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="flex">
|
|
|
+ <view class="">
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="">
|
|
|
+ 我已阅读并同意
|
|
|
+ </view>
|
|
|
+ <view class="shopDetail">
|
|
|
+ 《商户入驻协议》
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ <view class="comfirm" @click="comfirm">提交申请</view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+// import pickerAddress from '@/components/wangding-pickerAddress/wangding-pickerAddress.vue';
|
|
|
+import { mapState, mapMutations } from 'vuex';
|
|
|
+import { upload, apply } from '@/api/order.js';
|
|
|
+export default {
|
|
|
+ // components: {
|
|
|
+ // pickerAddress
|
|
|
+ // },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['userInfo'])
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ imgY: '', //营业执照
|
|
|
+ checked: false,
|
|
|
+ name: '', //店铺名
|
|
|
+ telphone: '', //商家电话
|
|
|
+ introduction: '', //主营项目
|
|
|
+ introductory: '', //简介
|
|
|
+ Idcard: '', //身份证号码
|
|
|
+ spared: '', //推荐人
|
|
|
+ nameP: '', //联系人
|
|
|
+ phone: '', //联系人电话
|
|
|
+ showaddress: '', //详细地址
|
|
|
+ addressDetail: '', //省市区
|
|
|
+ cardimg: '', //店铺logo
|
|
|
+ latitude: '',
|
|
|
+ longitude: '',
|
|
|
+ shopImg:''//店内图片
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 上传门内图片
|
|
|
+ imgsut() {
|
|
|
+ // console.log('上传logo');
|
|
|
+ upload({
|
|
|
+ filename: ''
|
|
|
+ }).then(data => {
|
|
|
+ // console.log('data', data);
|
|
|
+ this.shopImg = data[0].url;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 上传门店logo图片
|
|
|
+ imgsub() {
|
|
|
+ // console.log('上传logo');
|
|
|
+ upload({
|
|
|
+ filename: ''
|
|
|
+ }).then(data => {
|
|
|
+ console.log('data', data);
|
|
|
+ this.cardimg = data[0].url;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 上传营业执照图片
|
|
|
+ imgsubY() {
|
|
|
+ // console.log('i上传营业执照');
|
|
|
+ upload({
|
|
|
+ filename: ''
|
|
|
+ }).then(data => {
|
|
|
+ this.imgY = data[0].url;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ check() {
|
|
|
+ this.checked = !this.checked;
|
|
|
+ },
|
|
|
+ getLocation() {
|
|
|
+ console.log('选择当前位置');
|
|
|
+ let obj = this;
|
|
|
+ uni.chooseLocation({
|
|
|
+ success: function(res) {
|
|
|
+ console.log('1111:' + res);
|
|
|
+ console.log('位置名称:' + res.name);
|
|
|
+ console.log('详细地址:' + res.address);
|
|
|
+ console.log('纬度:' + res.latitude);
|
|
|
+ console.log('经度:' + res.longitude);
|
|
|
+ obj.latitude = res.latitude;
|
|
|
+ obj.longitude = res.longitude;
|
|
|
+ if (res.address) {
|
|
|
+ obj.showaddress = res.address;
|
|
|
+ } else {
|
|
|
+ obj.showaddress = res.name;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 选中城市切换
|
|
|
+ onCityClick({ data }) {
|
|
|
+ this.addressDetail = data.join(',');
|
|
|
+ },
|
|
|
+ // 提交申请
|
|
|
+ comfirm() {
|
|
|
+ const obj = this;
|
|
|
+ if (obj.name == '') {
|
|
|
+ obj.$api.msg('请输入店铺名');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ const reg1 = /^(\+?0?86-?)?1[\d]\d{9}$/;
|
|
|
+ if (!reg1.test(obj.telphone)) {
|
|
|
+ obj.$api.msg('请输入商家电话');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.introduction == '') {
|
|
|
+ obj.$api.msg('请输入您的主营项目');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.introductory == '') {
|
|
|
+ obj.$api.msg('请输入您的商铺简介');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.spared == '') {
|
|
|
+ obj.$api.msg('请输入您的推荐人');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.Idcard == '') {
|
|
|
+ obj.$api.msg('请输入身份证号');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.nameP == '') {
|
|
|
+ obj.$api.msg('请输入联系人');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.adress == '') {
|
|
|
+ obj.$api.msg('请选择详细地址');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.addressDetail == '') {
|
|
|
+ obj.$api.msg('请选择省市区');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.cardimg == '') {
|
|
|
+ obj.$api.msg('请上传店铺LOGO');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (obj.imgY == '') {
|
|
|
+ obj.$api.msg('请上传营业执照');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ apply({
|
|
|
+ name: obj.name,
|
|
|
+ introduction: obj.introductory,
|
|
|
+ phone: obj.telphone,
|
|
|
+ address: obj.addressDetail,
|
|
|
+ detailed_address: obj.showaddress,
|
|
|
+ image: obj.cardimg,
|
|
|
+ latitude: obj.latitude,
|
|
|
+ longitude: obj.longitude,
|
|
|
+ leader: obj.nameP,
|
|
|
+ id_card: obj.Idcard,
|
|
|
+ job: obj.introduction,
|
|
|
+ cert: obj.imgY,
|
|
|
+ spread_uid: obj.spared
|
|
|
+ })
|
|
|
+ .then(e => {
|
|
|
+ uni.showToast({
|
|
|
+ title: '申请成功,请耐心等待审核',
|
|
|
+ icon: 'success',
|
|
|
+ duration: 2000
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(function(e) {
|
|
|
+ console.log('出错了');
|
|
|
+ console.log(e);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+.content {
|
|
|
+}
|
|
|
+.shop-banner{
|
|
|
+ width: 750rpx;
|
|
|
+}
|
|
|
+.enterprise{
|
|
|
+ padding: 30rpx;
|
|
|
+}
|
|
|
+.enterprise-box {
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+ .box-item {
|
|
|
+ display: flex;
|
|
|
+ border-bottom: 1rpx solid #f0f0f0;
|
|
|
+ padding: 32rpx 24rpx;
|
|
|
+ align-items: center;
|
|
|
+ &:nth-last-child(1) {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .item-left {
|
|
|
+ font-size: 28rpx;
|
|
|
+ width: 160rpx;
|
|
|
+ flex-shrink: 0;
|
|
|
+ }
|
|
|
+ .item-right {
|
|
|
+ width: 100%;
|
|
|
+ margin-left: 24rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ color: #999999;
|
|
|
+ input {
|
|
|
+ font-size: 28rpx;
|
|
|
+ }
|
|
|
+ image {
|
|
|
+ width: 160rpx;
|
|
|
+ height: 160rpx;
|
|
|
+ margin-top: 24rpx;
|
|
|
+ margin-left: 60rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .box-item1 {
|
|
|
+ display: flex;
|
|
|
+ border-bottom: 1rpx solid #f0f0f0;
|
|
|
+ padding: 32rpx 24rpx;
|
|
|
+ // align-items: center;
|
|
|
+ &:nth-last-child(1) {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.comfirm {
|
|
|
+ margin: 20rpx auto 0;
|
|
|
+ width: 750rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ background: #681445;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 36rpx;
|
|
|
+}
|
|
|
+.comfirm1 {
|
|
|
+ margin: 0 auto;
|
|
|
+ border-radius: 80rpx;
|
|
|
+ width: 650rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ background: #b1b1b1;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 36rpx;
|
|
|
+}
|
|
|
+.checkbox {
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #eeeeee;
|
|
|
+ background: #eeeeee;
|
|
|
+ border-radius: 50px;
|
|
|
+}
|
|
|
+.checked {
|
|
|
+ color: #fd4343;
|
|
|
+ background: #ffffff;
|
|
|
+}
|
|
|
+.radio {
|
|
|
+ padding-top: 5rpx;
|
|
|
+ margin-right: 15rpx;
|
|
|
+}
|
|
|
+</style>
|