wenfp/temple-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成寺院入驻和法师认证

Browse Source
This commit is contained in:
wenfp
2021-11-11 17:22:48 +08:00
parent 851d9f30a5
commit 628da9d057
9 changed files with 480 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/img/review.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.2 KiB

src/common/tmap.js
+5 -2
View File
@@ -1,7 +1,8 @@
let TMAP;
const defaultConfig = {
version: '1.exp',
key: ''
key: '',
libraries: []
}
module.exports = {
load(config){
@@ -14,8 +15,10 @@ module.exports = {
resolve(TMAP)
return
}
let libraries = config.libraries.length > 0 ? `libraries=${config.libraries.join(',')}&`: '';
const script = document.createElement('script');
script.src = `https://map.qq.com/api/gljs?v=${config.version}&key=${config.key}`;
script.src = `https://map.qq.com/api/gljs?v=${config.version}&key=${config.key}&${libraries}`;
document.head.appendChild(script)
console.log(script)
script.setAttribute('async', true)
src/components/uploader/index.vue
+9 -2
View File
@@ -1,5 +1,6 @@
<template>
<van-uploader class="custom-uploader" v-bind="$attrs" :max-size="maxCount * maxSize" :max-count="maxCount" v-model="fileList" @oversize="onOversize" :after-read="onBeforeUpload"></van-uploader>
<van-uploader class="custom-uploader" v-bind="$attrs" v-model="fileList" :after-read="onBeforeUpload"></van-uploader>
<!-- <van-uploader class="custom-uploader" v-bind="$attrs" :max-size="isOverSize" :max-count="maxCount" v-model="fileList" @oversize="onOversize" :after-read="onBeforeUpload"></van-uploader> -->
</template>
<script>
@@ -9,6 +10,7 @@ export default {
props: {
maxCount: {
type: Number,
default: Infinity
},
maxSize: Number,
value: {
@@ -29,11 +31,16 @@ export default {
}
},
methods: {
isOverSize(){
console.log(this.maxCount * this.maxSize * 1024)
return 500 * 1024
},
onOversize(){
console.log(this.$props)
this.$toast(`文件大小不能超过${this.$props.maxSize}kb`)
this.$toast(`文件大小不能超过${this.isOverSize()}kb`)
},
async onBeforeUpload(obj){
console.log(obj.file.size)
const type = Object.prototype.toString;
if(type.call(obj) === '[object Object]'){
const formData = new FormData();
src/pages/user/approve/index.vue
+1 -1
View File
@@ -136,7 +136,7 @@ export default {
await certifyMonk(params)
this.$toast.success('认证信息提交成功')
await this.$delay(2000)
this.authing = true;
this.$router.replace({ name: 'user-temple-station-review'})
},
getParams(){
src/pages/user/index.vue
+16 -2
View File
@@ -53,8 +53,8 @@
</van-cell-group>
<div class="divider"></div>
<van-cell-group>
<van-cell title="认证法师 领取信众供奉" is-link :value="getMonkStatus(data.master_certify)" to="/user/approve"/>
<van-cell title="寺院入驻" is-link :value="getTempleStatus(data.temple_settled)" to="/user/temple-station"/>
<van-cell title="认证法师 领取信众供奉" is-link :value="getMonkStatus(data.master_certify)" @click="onMonk"/>
<van-cell title="寺院入驻" is-link :value="getTempleStatus(data.temple_settled)" @click="onStation"/>
</van-cell-group>
</div>
</template>
@@ -90,6 +90,20 @@ export default {
}
return m[k]
},
onMonk(){
if(this.data.master_certify === 0){
this.$router.push({ name: 'user-approve'})
} else if(this.data.master_certify === 1) {
this.$router.push({ name: 'user-temple-station-review'})
}
},
onStation(){
if(this.data.temple_settled === 0){
this.$router.push({ name: 'user-temple-station'})
} else if(this.data.temple_settled === 1) {
this.$router.push({ name: 'user-temple-station-review'})
}
}
}
}
</script>
src/pages/user/temple-station/index.vue
+92 -33
View File
@@ -22,7 +22,6 @@
<div class="cert-group">
<p class="cert">《宗教场地登记证》<span>（最多5张）</span></p>
<div class="uploader">
<!-- <van-uploader :max-size="5000 * 1024" v-model="registerFileList" @oversize="onOversize" :max-count="1" :after-read="onBeforeUpload"></van-uploader> -->
<uploader :max-size="3000" :max-count="5" v-model="form.register_cert_url" multiple></uploader>
</div>
</div>
@@ -62,7 +61,17 @@
</div>
</van-form>
<div class="button-group">
<van-button type="info" block class="confirm" @click="onSubmit">提交</van-button>
<van-button type="warning" block class="confirm" @click="onSubmitBefore">下一步</van-button>
</div>
</div>
<div class="administrator_wechat" v-if="step === 3">
<h1 class="title">扫码添加平台管理员微信</h1>
<img class="qrcode" src="https://wdx-temple.oss-cn-hangzhou.aliyuncs.com/uploads/common/religion-cert-bg.jpg" alt="">
<p class="label">平台入驻管理员微信</p>
<p class="notice">审核通过后将微信通知入驻上架具体事宜</p>
<div class="button-group">
<van-button type="warning" block class="confirm" @click="onSubmit">提交</van-button>
</div>
</div>
@@ -80,8 +89,10 @@
</template>
<script>
import { getMonkAppellation, getRegion, postTemple } from '@/api'
import { getRegion, postTemple } from '@/api'
import { getLocation } from '@/common/wechat-web';
import TMAPLoader from '@/common/tmap';
export default {
data(){
const testForm = {
@@ -104,6 +115,7 @@ export default {
password: '123456', // 登录密码
password_confirm: '123456', // 确认密码
}
console.log(testForm)
return {
query: this.$route.query,
active: 0,
@@ -114,25 +126,27 @@ export default {
cascaderValue: 0,
fileList: [],
// form: {
// register_cert_url: [],
// unit_name: '', // 单位名称
// institution_code: '', // 机构代码
// province_id: '', // 省份ID
// city_name: '', // 省份ID
// details_address: '', // 详细地址
// lng: '', // 经度
// lat: '', // 纬度
// represent: '', // 寺院法人
// mobile: '', // 手机号
// source: '', // 寺院来源
// is_representd: '', // 是否为寺院法人
// register_name: '', // 法人姓名
// login_mobile: '', // 登录手机号
// password: '', // 登录密码
// password_confirm: '', // 确认密码
// },
form: testForm
form: {
register_cert_url: [],
unit_name: '', // 单位名称
institution_code: '', // 机构代码
province_id: '', // 省份ID
city_name: '', // 省份ID
details_address: '', // 详细地址
lng: '', // 经度
lat: '', // 纬度
represent: '', // 寺院法人
mobile: '', // 手机号
source: '', // 寺院来源
is_representd: '', // 是否为寺院法人
register_name: '', // 法人姓名
login_mobile: '', // 登录手机号
password: '', // 登录密码
password_confirm: '', // 确认密码
},
// form: testForm,
geocoder: null,
TMap: null
}
},
computed: {
@@ -145,44 +159,60 @@ export default {
return this.form.register_cert_url.length > 0 && this.agreement
}
},
created(){
TMAPLoader.load({
key: process.env.VUE_APP_TMAP_KEY,
libraries: ['service']
}).then(TMap => {
this.TMap = TMap;
this.geocoder = new TMap.service.Geocoder();
})
this.getParams();
},
mounted(){
if(this.form.register_cert_url.length === 0 && Number(this.$route.query.step) !== 1){
return this.$router.push({ query: { step: 1 }});
}
this.getParams();
},
methods: {
onNextStep(){
this.$router.push({ query: { step: this.step + 1 }})
},
onGetAddress(){
getLocation().then(res => {
this.form.lng = res.longitude
this.form.lat = res.latitude
getLocation().then(({ longitude, latitude}) => {
const location = new this.TMap.LatLng(latitude, longitude)
this.geocoder.getAddress({ location }).then(res => {
console.log('geocoder：', res)
this.form.details_address = res.result.address
this.form.lng = longitude
this.form.lat = latitude
})
})
},
getParams(){
getMonkAppellation().then(res => {
console.log(res)
})
getRegion().then(city => {
this.cityOptions = city
})
},
onChangeProvince(){
},
async onSubmitBefore(){
this.onNextStep();
},
async onSubmit(){
const [province_id, city_id, country_id] = this.form.city_id;
const request = {
...this.form,
is_representd: this.is_representd ? 1: 0,
is_representd: this.form.is_representd ? 1: 0,
province_id, city_id, country_id,
register_cert_url: this.form.register_cert_url.map(v => v.url),
}
const res = await postTemple(request);
console.log(res)
this.step = 3;
await postTemple(request);
this.$toast.success('提交成功')
await this.$delay(2000)
this.$router.replace({ name: 'user-home'})
},
onFinishProvince({selectedOptions}){
this.showProvince = false;
@@ -300,6 +330,35 @@ export default {
}
}
}
.administrator_wechat{
padding: .4rem;
.title{
font-size: .4rem;
margin-top: 1rem;
margin-bottom: 1rem;
}
.qrcode{
width: 4rem;
height: 4rem;
display: block;
margin-left: auto;
margin-right: auto;
}
.label{
font-size: .4rem;
padding: .5rem 0;
text-align: center;
}
.notice{
font-size: .4rem;
color: rgb(129, 43, 43);
margin-top: 2rem;
text-align: center;
}
.button-group{
margin-top: 2rem;
}
}
.button-group{
padding: 0 .4rem;
padding-top: 0rem;
src/pages/user/temple-station/review.vue
+44
View File
@@ -0,0 +1,44 @@
<template>
<div class="temple-review">
<img class="icon" src="@/assets/img/review.jpg" alt="">
<h1 class="title">审核中</h1>
<p class="desc">请长按下方【寺院联盟官方公众号】二维码并关注</p>
<img class="qrcode" src="https://img0.baidu.com/it/u=3101623223,11353193&fm=26&fmt=auto" />
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.temple-review{
padding-top: 2rem;
.icon{
display: block;
width: 3rem;
height: 3rem;
margin-left: auto;
margin-right: auto;
}
.title{
font-size: .5rem;
text-align: center;
padding: .3rem;
}
.desc{
font-size: .4rem;
margin-top: 3rem;
text-align: center;
color: #888;
margin-bottom: .3rem;
}
.qrcode{
width: 4rem;
height: 4rem;
margin-left: auto;
margin-right: auto;
display: block;
}
}
</style>
src/router/index.js
+6
View File
@@ -119,6 +119,12 @@ const routes = [
meta: { title: '寺院入驻', showNavBar: false },
component: () => import('@/pages/user/temple-station')
},
{
path: 'temple-station-review',
name: 'user-temple-station-review',
meta: { title: '寺院入驻', showNavBar: false },
component: () => import('@/pages/user/temple-station/review')
},
{
path: 'certificate',
name: 'user-certificate',