|
|
@@ -1,317 +0,0 @@
|
|
|
-<template>
|
|
|
- <div class="app-content">
|
|
|
- <form @submit="formSubmit">
|
|
|
- <div class="module-com">
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">花店名称</div>
|
|
|
- <input v-model="form.name" placeholder-class="phcolor" class="tui-input" name="name" placeholder="请输入姓名" />
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="openAddres">
|
|
|
- <div class="tui-title">花店地址</div>
|
|
|
- <div class="tui-input" v-if="form.province">{{ form.province + '-' + form.city }}</div>
|
|
|
- <div class="tui-placeholder" v-else>请选择</div>
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false" :arrow="true" @click="selRegionFn">
|
|
|
- <div class="tui-title">详细地址</div>
|
|
|
- <div class="tui-input" v-if="form.address">{{ form.address }}</div>
|
|
|
- <div class="tui-placeholder" v-else>请选择详细地址</div>
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">门牌号</div>
|
|
|
- <input v-model="form.floor" placeholder-class="phcolor" class="tui-input" name="floor" placeholder="楼号门牌号（选填）" />
|
|
|
- </tui-list-cell>
|
|
|
- </div>
|
|
|
- <!-- 手机号 -->
|
|
|
- <div class="module-com">
|
|
|
- <tui-list-cell class="line-cell" :hover="false">
|
|
|
- <div class="tui-title">手机号</div>
|
|
|
- <input v-model="form.mobile" placeholder-class="phcolor" class="tui-input" name="mobile" placeholder="请输入" type="number" />
|
|
|
- </tui-list-cell>
|
|
|
- <tui-list-cell class="line-cell code-wrap" :hover="false">
|
|
|
- <div class="tui-title">验证码</div>
|
|
|
- <input v-model="form.code" placeholder-class="phcolor" class="tui-input" name="code" placeholder="请输入验证码" type="number" />
|
|
|
- <div class="tui-code" v-if="isSend">{{ countDown + 's' }}</div>
|
|
|
- <div class="tui-code" v-else @click="getCode">获取验证码</div>
|
|
|
- </tui-list-cell>
|
|
|
- </div>
|
|
|
- <!-- 推荐人 -->
|
|
|
- <div class="module-com recommend-wrap" v-if="!$util.isEmpty(merchantData)">
|
|
|
- <div class="recommend-tag">推荐花店</div>
|
|
|
- <div class="recommend-det">
|
|
|
- <app-avatar-module :src="merchantData.smallLogoUrl" :width="78" alt="推荐人头像" />
|
|
|
- <div class="recommend-info">
|
|
|
- <div class="app-size-32">{{ merchantData.merchantName }}</div>
|
|
|
- <div class="app-color-2">{{ merchantData.fullAddress }}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="btn-wrap">
|
|
|
- <button class="admin-button-com blue big" formType="submit">确认</button>
|
|
|
- </div>
|
|
|
- <!-- 选择地区 -->
|
|
|
- <app-area-sel :show.sync="showRegion" @change="changeAreaFn" :city="form.city" />
|
|
|
- <!-- 省市联动 -->
|
|
|
- <simple-address ref="simpleAddress" :region="regionData" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onCityConfirm"></simple-address>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import TuiListCell from '@/components/plugin/list-cell'
|
|
|
- import AppAreaSel from '@/components/app-area-sel'
|
|
|
- import SimpleAddress from '@/components/plugin/simple-address'
|
|
|
- import AppAvatarModule from '@/components/module/app-avatar'
|
|
|
- const form = require('@/utils/formValidation.js')
|
|
|
- // api
|
|
|
- import { getIntroduce, applyRegister, sendSmsW, regionTree } from '@/api/official'
|
|
|
- // import { getShopUser } from '@/utils/auth'
|
|
|
- export default {
|
|
|
- name: 'apply-data',
|
|
|
- components: {
|
|
|
- TuiListCell,
|
|
|
- AppAreaSel,
|
|
|
- SimpleAddress,
|
|
|
- AppAvatarModule
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- merchantData: {},
|
|
|
- form: {
|
|
|
- name: '',
|
|
|
- mobile: '',
|
|
|
- province: '',
|
|
|
- city: '',
|
|
|
- dist: '',
|
|
|
- address: '',
|
|
|
- floor: '',
|
|
|
- longitude: '',
|
|
|
- latitude: ''
|
|
|
- // 推荐商家id
|
|
|
- // oldId: ''
|
|
|
- },
|
|
|
- showRegion: false,
|
|
|
- // 省市联动
|
|
|
- regionData: [],
|
|
|
- cityPickerValueDefault: [0, 0],
|
|
|
- // 验证码
|
|
|
- isSend: 0,
|
|
|
- countDown: 119,
|
|
|
- timer: null
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- // if (!this.$util.isLogin()) {
|
|
|
- // // getShopUser()
|
|
|
- // return false
|
|
|
- // }
|
|
|
- // this.init()
|
|
|
- },
|
|
|
- methods: {
|
|
|
- init() {
|
|
|
- this.$util.getCheckLogin().then(res => {
|
|
|
- if (res) {
|
|
|
- // #ifdef H5
|
|
|
- let id = sessionStorage.getItem('introMerchantId')
|
|
|
- if (id) {
|
|
|
- this._getMerchantDet()
|
|
|
- }
|
|
|
- // #endif
|
|
|
- this._regionTree()
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- _regionTree() {
|
|
|
- regionTree().then(res => {
|
|
|
- this.regionData = res.data.tree
|
|
|
- })
|
|
|
- },
|
|
|
- _getMerchantDet() {
|
|
|
- // #ifdef H5
|
|
|
- let id = sessionStorage.getItem('introMerchantId')
|
|
|
- getIntroduce({ id: id }).then(res => {
|
|
|
- this.merchantData = res.data
|
|
|
- })
|
|
|
- // #endif
|
|
|
- },
|
|
|
- // ==============
|
|
|
- confirmFn() {
|
|
|
- let id = sessionStorage.getItem('introMerchantId')
|
|
|
- applyRegister({
|
|
|
- // oldId: this.option.merchantId || 0,
|
|
|
- introMerchantId: id || 0,
|
|
|
- ...this.form
|
|
|
- }).then(res => {
|
|
|
- uni.setStorageSync('officialApply', res.data)
|
|
|
- this.$util.pageTo({
|
|
|
- // url: '/official/pay',
|
|
|
- url: '/official/callback',
|
|
|
- type: 2,
|
|
|
- query: {
|
|
|
- pagestatus: 3
|
|
|
- // orderSn: this.option.orderSn,
|
|
|
- // payDiscountPrice: res.data.discountAmount
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- // 验证码
|
|
|
- getCode() {
|
|
|
- if (!this.form.mobile || !this.$util.checkMobile(this.form.mobile)) {
|
|
|
- this.$msg('请输入正确的手机号！')
|
|
|
- return false
|
|
|
- }
|
|
|
- this.isSend = 1
|
|
|
- sendSmsW({
|
|
|
- type: 1,
|
|
|
- mobile: this.form.mobile
|
|
|
- })
|
|
|
- .then(res => {
|
|
|
- this.beginCountDown()
|
|
|
- this.$msg('发送成功！')
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- this.isSend = 0
|
|
|
- this.$msg('发送失败！')
|
|
|
- })
|
|
|
- },
|
|
|
- // 倒计时
|
|
|
- beginCountDown() {
|
|
|
- this.countDown = 119
|
|
|
- this.timer = setInterval(() => {
|
|
|
- if (this.countDown === 0) {
|
|
|
- clearInterval(this.timer)
|
|
|
- this.isSend = 0
|
|
|
- return
|
|
|
- }
|
|
|
- this.countDown -= 1
|
|
|
- }, 1000)
|
|
|
- },
|
|
|
- // 选择地址
|
|
|
- selRegionFn() {
|
|
|
- if (!this.form.city) {
|
|
|
- this.$msg('请先选择地址！')
|
|
|
- return false
|
|
|
- }
|
|
|
- this.showRegion = true
|
|
|
- // let that = this
|
|
|
- // uni.chooseLocation({
|
|
|
- // success: (res) => {
|
|
|
- // this.form.address = res.address
|
|
|
- // this.form.latitude = res.latitude
|
|
|
- // this.form.longitude = res.longitude
|
|
|
- // console.log('位置名称：' + res.name)
|
|
|
- // console.log('详细地址：' + res.address)
|
|
|
- // console.log('纬度：' + res.latitude)
|
|
|
- // console.log('经度：' + res.longitude)
|
|
|
- // }
|
|
|
- // })
|
|
|
- },
|
|
|
- changeAreaFn(e) {
|
|
|
- console.log('changeAreaFn', e)
|
|
|
- this.form.address = e.address
|
|
|
- this.form.latitude = e.location.lat
|
|
|
- this.form.longitude = e.location.lng
|
|
|
- },
|
|
|
- // -----
|
|
|
- // 省市联动
|
|
|
- openAddres() {
|
|
|
- this.$refs.simpleAddress.open()
|
|
|
- },
|
|
|
- onCityConfirm(e) {
|
|
|
- // this.form.receiveAddress = e.label
|
|
|
- this.form.province = e.provinceName
|
|
|
- this.form.city = e.cityName
|
|
|
- // this.pickerText = JSON.stringify(e)
|
|
|
- },
|
|
|
- // 表单验证
|
|
|
- formSubmit(e) {
|
|
|
- // 表单规则
|
|
|
- let rules = []
|
|
|
- // 进行表单检查
|
|
|
- let formData = e.detail.value
|
|
|
- let checkRes = form.validation(formData, rules)
|
|
|
- // 验证通过!
|
|
|
- if (!checkRes) {
|
|
|
- setTimeout(() => {
|
|
|
- this.confirmFn()
|
|
|
- })
|
|
|
- } else {
|
|
|
- this.$msg(checkRes)
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss" scoped>
|
|
|
- .module-com {
|
|
|
- margin-bottom: 20px;
|
|
|
- background-color: #fff;
|
|
|
- .module-tit {
|
|
|
- padding: 20px 18px;
|
|
|
- font-size: 28px;
|
|
|
- font-weight: 600;
|
|
|
- border-bottom: 1px solid $borderColor;
|
|
|
- }
|
|
|
- .module-det {
|
|
|
- padding: 0 30px;
|
|
|
- }
|
|
|
- }
|
|
|
- // 公共
|
|
|
- .line-cell {
|
|
|
- .tui-title {
|
|
|
- width: 210px;
|
|
|
- color: $fontColor2;
|
|
|
- }
|
|
|
- .tui-input {
|
|
|
- width: calc(100% - 210px);
|
|
|
- font-size: 28px;
|
|
|
- }
|
|
|
- .tui-placeholder {
|
|
|
- color: #ccc;
|
|
|
- }
|
|
|
- .phcolor {
|
|
|
- color: #ccc;
|
|
|
- }
|
|
|
- }
|
|
|
- .btn-wrap {
|
|
|
- width: 90%;
|
|
|
- margin: 60px auto;
|
|
|
- .admin-button-com {
|
|
|
- width: 100%;
|
|
|
- margin: 0 auto;
|
|
|
- }
|
|
|
- }
|
|
|
- // 验证码
|
|
|
- .code-wrap {
|
|
|
- .tui-input {
|
|
|
- width: calc(100% - 410px);
|
|
|
- font-size: 28px;
|
|
|
- }
|
|
|
- .tui-code {
|
|
|
- width: 200px;
|
|
|
- text-align: center;
|
|
|
- border-left: 1px solid $borderColor;
|
|
|
- color: $mainColor;
|
|
|
- }
|
|
|
- }
|
|
|
- // 推荐人
|
|
|
- .recommend-wrap {
|
|
|
- padding: 30px 45px;
|
|
|
- .recommend-tag {
|
|
|
- font-size: 28px;
|
|
|
- color: $fontColor2;
|
|
|
- margin-bottom: 24px;
|
|
|
- }
|
|
|
- .recommend-det {
|
|
|
- @include disFlex(center, flex-start);
|
|
|
- .recommend-info {
|
|
|
- margin-left: 20px;
|
|
|
- .app-size-32 {
|
|
|
- margin-bottom: 4px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|
shish