b2894lxlx/yunxinwei-uniapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

第一次提交

Browse Source
This commit is contained in:
gxwebsoft
2023-08-04 13:04:21 +08:00
commit 7a73b38bd5
764 changed files with 166417 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

316
package/dealer/apply.vue Executable file
View File

@@ -0,0 +1,316 @@
<template>
<view v-if="!isLoading" class="container b-f">
<!-- 头部背景图 -->
<view class="dealer-bg">
<image class="image" mode="widthFix" :src="background"></image>
</view>
<!-- 等待审核 -->
<view v-if="isApplying" class="dealer-boot dis-flex flex-dir-column flex-y-center">
<view class="boot__msg f-30 dis-flex flex-dir-column flex-y-center">
<text class="msg__icon iconfont icon-shenhezhong"></text>
<text class="msg__content m-top20 f-29 col-80">{{ words.wait_audit.value }}</text>
</view>
<!-- 去商城逛逛 -->
<view class="boot__submit form-submit dis-flex flex-x-center">
<button class="button" @click="$navTo('pages/index/index')">{{ words.goto_mall.value }}</button>
</view>
</view>
<!-- 填写申请信息 -->
<view v-else class="dis-flex flex-dir-column flex-y-center">
<view class="widget-form b-f m-top20 dis-flex flex-dir-column">
<view class="form-title f-30">{{ words.title.value }}</view>
<view class="form-box dis-flex flex-dir-column">
<form @submit="handleSubmit">
<view class="form-field dis-flex flex-y-center">
<view class="field-label">邀请人</view>
<view class="field-input">
<text>{{ refereeName }}（请核对）</text>
</view>
</view>
<view class="form-field dis-flex flex-y-center">
<view class="field-label">姓名</view>
<view class="field-input flex-box">
<input class="input" name="name" placeholder="请输入真实姓名"></input>
</view>
</view>
<view class="form-field dis-flex flex-y-center">
<view class="field-label">手机号</view>
<view class="field-input flex-box">
<input class="input" name="mobile" placeholder="请输入手机号"></input>
</view>
</view>
<!-- 申请协议 -->
<view class="form-license dis-flex flex-x-center flex-y-center">
<view class="license-radio dis-flex flex-y-center" @click="isRead = !isRead">
<text class="license-icon f-38 iconfont icon-radio" :class="[isRead ? 'c-violet' : 'col-bb']"></text>
<text class="f-28 col-80">我已阅读并了解</text>
</view>
<text @click="handleShowLicense()" class="f-28 c-violet">【{{ words.license.value }}】</text>
</view>
<!-- 立即申请 -->
<view class="form-submit dis-flex flex-x-center">
<button formType="submit" :disabled="disabled">{{ words.submit.value }}</button>
</view>
</form>
</view>
</view>
</view>
<!-- 入驻协议弹窗 -->
<u-modal v-model="showLicense" title="申请协议">
<scroll-view class="pops-content" :scroll-y="true">
<text>{{ license }}</text>
</scroll-view>
</u-modal>
</view>
</template>
<script>
import * as ApplyApi from '@/api/dealer/apply'
import SettingModel from '@/common/model/dealer/Setting'
export default {
data() {
return {
// 正在加载
isLoading: true,
// 当前是否为分销商
isDealer: undefined,
// 当前是否在申请中
isApplying: undefined,
// 推荐人昵称
refereeName: undefined,
// 文字设置
words: undefined,
// 背景图
background: undefined,
// 入驻协议
license: undefined,
// 入驻协议阅读状态
isRead: false,
// 显示入驻协议弹窗
showLicense: false,
// 按钮禁用
disabled: false
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
this.getSetting()
this.getApplyStatus()
},
methods: {
// 获取分销设置
getSetting() {
const app = this
SettingModel.data()
.then(setting => {
// 赋值属性
app.words = setting.words.apply.words
app.background = setting.background.apply
app.license = setting.license.license
// 设置当前页面标题
app.setPageTitle(setting.words.apply.title)
})
},
// 分销商申请状态
getApplyStatus() {
const app = this
app.isLoading = true
ApplyApi.status()
.then(result => {
const data = result.data
app.isDealer = data.isDealer
app.isApplying = data.isApplying
app.refereeName = data.refereeName
})
.finally(() => app.isLoading = false)
},
// 设置当前页面标题
setPageTitle(title) {
uni.setNavigationBarTitle({ title: title.value })
},
// 切换支付选项
handleChecked(value) {
this.payment = value
},
// 显示入驻协议弹窗
handleShowLicense() {
this.showLicense = true
},
// 表单提交
handleSubmit({ detail }) {
const app = this
// 表单验证
if (!app.onValidation(detail.value)) {
return false
}
// 确认提交
app.disabled = true
ApplyApi.submit({ form: detail.value })
.then(result => {
app.$toast(result.message)
setTimeout(() => uni.navigateBack(), 1200)
})
.finally(() => app.disabled = false)
},
// 表单验证
onValidation(data) {
const app = this
// 验证可提现佣金
if (!data.name) {
app.$error('请填写姓名')
return false
}
// 验证手机号
if (!/^\+?\d[\d -]{8,12}\d/.test(data.mobile)) {
app.$error('手机号格式不正确')
return false
}
// 验证是否阅读协议
if (!app.isRead) {
app.$error('请先阅读分销商申请协议')
return false
}
return true
},
}
}
</script>
<style>
page {
background: #fff;
}
</style>
<style lang="scss" scoped>
.c-violet {
color: #786cff;
}
.col-80 {
color: #808080;
}
.col-bb {
color: #bbb;
}
.f-38 {
font-size: 38rpx;
}
.dealer-bg {
.image {
width: 100%;
}
}
.widget-form {
position: relative;
width: 700rpx;
box-sizing: border-box;
box-shadow: 0 1rpx 20rpx rgba(0, 0, 0, 0.21);
border-radius: 12rpx;
margin-top: -80rpx;
.form-title {
padding: 0 40rpx;
height: 90rpx;
border-bottom: 1rpx solid #e7e7e7;
display: flex;
align-items: center;
}
.form-box {
padding: 40rpx 35rpx;
.form-field {
height: 80rpx;
margin-bottom: 24rpx;
padding: 10rpx 28rpx;
background-color: #f9f9f9;
box-sizing: border-box;
font-size: 28rpx;
.field-label {
width: 130rpx;
color: #808080;
}
.input {
font-size: 28rpx;
}
}
}
}
.form-license {
.license-icon {
margin-right: 12rpx;
}
}
.form-submit {
margin-top: 40rpx;
button {
font-size: 30rpx;
background: #786cff;
border: 1rpx solid #786cff;
color: white;
border-radius: 50rpx;
padding: 0 120rpx;
&[disabled] {
background: #8e84fc;
border-color: #8e84fc;
color: white;
}
}
}
// 申请协议
.pops-content {
padding: 30rpx 48rpx;
font-size: 28rpx;
line-height: 50rpx;
text-align: left;
color: #606266;
min-height: 320rpx;
max-height: 640rpx;
box-sizing: border-box;
}
// 等待审核
.dealer-boot {
padding: 10rpx 30rpx;
margin-top: 80rpx;
.msg__icon {
font-size: 120rpx;
color: #8e84fc;
}
.boot__submit {
margin-top: 60rpx;
}
}
</style>