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-27 16:49:16 +08:00
parent 6f4b7a7b02
commit 00677377ca
17 changed files with 131 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.prettierrc.json
+1 -1
View File
@@ -1,5 +1,5 @@
{
"tabWidth": 4,
"singleQuote": true,
"singleQuote": false,
"printWidth": 200
}
package.json
+1
View File
@@ -9,6 +9,7 @@
"lint": "vue-cli-service lint"
},
"dependencies": {
"async-validator": "^4.0.7",
"axios": "^0.24.0",
"better-scroll": "^2.4.2",
"core-js": "^3.6.5",
src/App.vue
+2 -1
View File
@@ -41,7 +41,8 @@ export default {
'$route': {
handler(val) {
this.active = tabbar.map(v => v.name).indexOf(val.name).toString();
}
},
deep: true,
}
},
computed: {
src/common/tmap.js
-1
View File
@@ -20,7 +20,6 @@ module.exports = {
const script = document.createElement('script');
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)
script.setAttribute('charset', 'utf-8')
script.onload = () => {
src/common/wechat-web.js
+8 -1
View File
@@ -91,5 +91,12 @@ function updateTimelineShareData(title = '', desc = '', link = '', imgUrl = '')
});
}
function previewImage(current, urls){
console.log(current, urls)
wechatInstance.previewImage({
current, urls
})
}
export { signToWechat, getLocation, requestPayment, openLocation, updateAppMessageShareData, updateTimelineShareData };
export { signToWechat, getLocation, requestPayment, openLocation, updateAppMessageShareData, updateTimelineShareData, previewImage };
src/config/index.js
+8
View File
@@ -0,0 +1,8 @@
export default {
qrcode: {
wechatAccount: 'https://wdx-temple.oss-cn-hangzhou.aliyuncs.com/uploads/common/temple_wechat.jpg'
},
RegExp: {
mobile: /^[1](([3][0-9])|([4][5-9])|([5][0-3,5-9])|([6][5,6])|([7][0-8])|([8][0-9])|([9][1,8,9]))[0-9]{8}$/
}
}
src/main.js
+2
View File
@@ -8,10 +8,12 @@ import '@/assets/js/flexable.js';
import './common/vant';
import './components/index'
import 'swiper/css/swiper.css'
import config from './config';
Vue.mixin(globalMixin)
Vue.config.productionTip = false
Vue.prototype.$delay = delay;
Vue.prototype.$config = config;
Vue.use(VueAwesomeSwiper)
new Vue({
src/mixins/index.js
+17
View File
@@ -1,3 +1,5 @@
import { Toast } from 'vant';
export default {
directives: {
numberOnly: {
@@ -10,6 +12,21 @@ export default {
unbind: function(el) {
el.removeEventListener('input', el.handler)
}
},
copy: {
bind(el, binding, vnode){
console.log(el, binding, vnode)
el.addEventListener('click', () => {
const input = document.createElement('textarea');
input.value = binding.value;
document.body.appendChild(input)
input.select();
document.execCommand('copy');
document.body.removeChild(input)
Toast.success('复制成功')
}, false)
},
}
},
methods: {
src/pages/buddha-activity/index.vue
+1 -3
View File
@@ -1,7 +1,7 @@
<template>
<div class="buddha-activity">
<van-nav-bar left-arrow v-if="$route.meta.showNavBar" :title="$route.meta.title" @click-left="$router.back()" :style="{backgroundColor: $route.meta.navBarBackgroundColor}" />
<div div class="process-container">
<div class="process-container">
<scroll-view :height="height - 50" ref="scrollView">
<buddha-process v-for="(p, i) in list" :key="i" :data="p" :show-goods-btn="!query.goods_id"></buddha-process>
<div v-if="total === list.length && list.length > 3" class="no-more">没有更多了</div>
@@ -32,13 +32,11 @@ export default {
methods: {
async getDynamicData(){
const res = await getDynamicData(this.page, this.query.goods_id, this.size)
console.log(res)
this.total = res.total;
this.list = res.results;
this.$nextTick(() => {
this.$refs.scrollView.refresh();
})
console.log(res)
}
}
}
src/pages/user/approve/index.vue
+5 -7
View File
@@ -11,9 +11,7 @@
</div>
</template>
<template v-if="!authing">
<van-notice-bar
text="真实法师社区，法师身份认证审核通过后才能使用"
/>
<van-notice-bar ext="真实法师社区，法师身份认证审核通过后才能使用" />
<van-form @submit="onSubmit">
<van-field
v-model="form.nickname"
@@ -34,7 +32,7 @@
<van-field
v-model="form.place_temple"
type="text"
label="驻赐寺院"
label="驻锡寺院"
placeholder="名称含所在城市； 如：深圳弘法寺"
:rules="[{ required: true }]"
/>
@@ -81,7 +79,7 @@
<van-action-sheet v-model="showTitle" :actions="actions" @select="onSelect" cancel-text="取消" close-on-click-action/>
<!-- 选择城市 -->
<van-popup v-model="showProvince" round position="bottom">
<van-popup v-model="showProvince" round position="bottom" safe-area-inset-bottom>
<van-cascader
v-model="cascaderValue"
title="请选择所在地区"
@@ -111,7 +109,7 @@ export default {
cert_url: [], // 戒牒照片
description: ''
},
cascaderValue: [3,40, 431],
cascaderValue: '',
cityOptions: [],
uploader: [],
actions: [],
@@ -138,7 +136,7 @@ export default {
await this.$delay(2000)
this.$router.replace({ name: 'user-temple-station-review'})
},
getParams(){
getMonkAppellation().then(res => {
this.actions = res;
src/pages/user/certificate/index.vue
+30 -10
View File
@@ -1,14 +1,16 @@
<template>
<div class="user-certificate" :style="style">
<div class="certificate" v-for="(li, index) in list" :key="index">
<img class="img" :src="li.picture_url" alt="">
<div class="img-wrapper">
<img class="img" :src="li.picture_url" alt="" @click="onDownloadCert(li)">
</div>
<div class="info">
<h3 class="title">{{li.goods_name}}</h3>
<h3 class="title">{{li.goods_name}}我都去无群我带我去带我去带我去强无敌我去去带我去带我去带我去请问我去请问带我去带我去</h3>
<span class="date">{{li.date}}</span>
<p class="number">第<span>{{li.count}}</span>份功德</p>
<div class="download">
<div class="download" @click="onDownloadCert(li)">
<span class="iconfont icon-24px"></span>
<p>下载功德证书</p>
<p>长按保存功德证书</p>
</div>
</div>
</div>
@@ -18,6 +20,7 @@
<script>
import { getCertList } from '@/api';
import { previewImage } from '@/common/wechat-web';
export default {
data(){
@@ -32,7 +35,11 @@ export default {
computed: {
style(){
return {
background: `#f5f5f5 url(${this.bg}) center top no-repeat`
backgroundColor: '#f5f5f5',
backgroundImage: `url(${this.bg})`,
backgroundSize: 'contain',
backgroundPosition: 'top center',
backgroundRepeat: 'no-repeat'
}
}
},
@@ -42,6 +49,9 @@ export default {
console.log(res)
this.list = res.results;
this.bg = res.cert_bg;
},
onDownloadCert(cert){
previewImage(cert.picture_url, [cert.picture_url])
}
}
}
@@ -50,8 +60,6 @@ export default {
<style lang="scss">
.user-certificate{
// max-height: 100vh;
background: #f5f5f5 url('https://img1.baidu.com/it/u=3658625472,1613220951&fm=26&fmt=auto') center top no-repeat;
background-size: contain;
padding-top: 4.67rem;
padding-bottom: .5rem;
.certificate{
@@ -61,16 +69,28 @@ export default {
margin: .4rem;
border-radius: .13rem;
padding: .4rem;
box-shadow: 0 0 .2rem rgba(0,0,0,0.05);
.img-wrapper{
width: 2.5rem;
height: 2.5rem;
display: flex;
align-items: center;
justify-content: center;
background: #f9f9f9;
}
img{
width: 2rem;
height: 2rem;
max-width: 100%;
max-height: 100%;
}
.info{
flex: 1;
margin-left: .4rem;
position: relative;
.title{
font-size: .4rem;
font-size: .35rem;
line-height: 1.3;
@extend .text-multiple-2;
height: 2.4em;
}
.date{
margin-top: .8rem;
src/pages/user/customer/index.vue
+6 -28
View File
@@ -7,37 +7,15 @@
<p>使用寺院联盟遇到任何疑问都可以联系我</p>
</div>
</div>
<div class="customer-type-group" v-for="(cus, index) in list" :key="index">
<div class="customer-type-group" v-for="(cus, index) in list" :key="index" >
<img :src="cus.icon_url" alt="">
<div class="info">
<h1>{{cus.title}} <span v-if="cus.title == '客服微信号'" class="wechat-account">{{cus.value}}</span></h1>
<p v-html="cus.content"></p>
<h1>{{cus.title}} <span v-if="cus.title == '客服微信号'" class="wechat-account" v-copy="cus.value">{{cus.value}}</span></h1>
<p v-html="cus.content" ></p>
</div>
<a class="phone" :href="'tel:'+cus.value" v-if="cus.title === '电话客服'"></a>
</div>
<!-- <div class="customer-type-group">
<img src="https://img1.baidu.com/it/u=2403234292,1073721747&fm=26&fmt=auto" alt="">
<div class="info">
<h1>在线客服</h1>
<p>服务时间：周一至周五 10：00-18：00</p>
<p>如不在服务时间，留言后我们会及时与您联系</p>
</div>
</div>
<div class="customer-type-group">
<img src="https://img1.baidu.com/it/u=2403234292,1073721747&fm=26&fmt=auto" alt="">
<div class="info">
<h1>电话客服</h1>
<p>服务时间：周一至周五 10：00-18：00</p>
</div>
</div>
<div class="customer-type-group">
<img src="https://img1.baidu.com/it/u=2403234292,1073721747&fm=26&fmt=auto" alt="">
<div class="info">
<h1>客服微信号</h1>
<p>点击即可复制微信号，在微信中添加好友，我们会及时与您联系</p>
</div>
</div> -->
<img class="qrcode" :src="qrcode" alt="">
</div>
</template>
@@ -58,9 +36,8 @@ export default {
methods: {
async getCustomerList(){
const res = await getCustomerList();
console.log(res)
this.list = res.list;
this.qrcode = res.platform_code;
this.qrcode = this.$config.qrcode.wechatAccount || res.platform_code;
}
}
}
@@ -71,6 +48,7 @@ export default {
min-height: 100vh;
background: #f5f5f5 url('~@/assets/img/customer_background.jpg') center top no-repeat;
background-size: contain;
padding-bottom: env(safe-area-inset-bottom);
.title{
display: flex;
font-size: .4rem;
src/pages/user/index.vue
+3 -1
View File
@@ -2,7 +2,7 @@
<div class="user-home" v-if="data">
<van-nav-bar left-arrow v-if="$route.meta.showNavBar" :title="$route.meta.title" @click-left="$router.back()" :style="{backgroundColor: $route.meta.navBarBackgroundColor}" />
<div class="light">
<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fwx4.sinaimg.cn%2Forj360%2F97cc0d35ly1fwmdvbemq4j20zk0k0taz.jpg&refer=http%3A%2F%2Fwx4.sinaimg.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1638084364&t=1e0d9bd2dcb2906674f8b5142889db7a" alt="">
<img :src="data.banner" alt="">
</div>
<div class="divider"></div>
<div class="user-profile">
@@ -116,6 +116,8 @@ export default {
img{
width: 100%;
border-radius: .13rem;
vertical-align: top;
max-height: 4rem;
}
display: block;
}
src/pages/user/temple-station/index.vue
+39 -6
View File
@@ -75,7 +75,7 @@
</div>
</div>
<van-popup v-model="showProvince" round position="bottom">
<van-popup v-model="showProvince" round position="bottom" safe-area-inset-bottom>
<van-cascader
v-model="cascaderValue"
title="请选择所在地区"
@@ -92,6 +92,7 @@
import { getRegion, postTemple } from '@/api'
import { getLocation } from '@/common/wechat-web';
import TMAPLoader from '@/common/tmap';
import Schema from 'async-validator';
export default {
data(){
@@ -119,7 +120,6 @@ export default {
return {
query: this.$route.query,
active: 0,
agreement: true, // 是否同意寺院联盟服务协议
showProvince: false,
cityOptions: [],
@@ -131,7 +131,7 @@ export default {
unit_name: '', // 单位名称
institution_code: '', // 机构代码
province_id: '', // 省份ID
city_name: '', // 省份ID
city_name: '', // 城市名称
details_address: '', // 详细地址
lng: '', // 经度
lat: '', // 纬度
@@ -144,6 +144,25 @@ export default {
password: '', // 登录密码
password_confirm: '', // 确认密码
},
formRules: {
unit_name: { required: true, message: '请输入单位名称' },
institution_code: [
{ required: true, message: '请输入机构代码' },
{ message: '请输入18位的机构代码', validator: (rule, value) => value.length === 18 }
],
city_id: { required: true, message: '请选择城市' },
details_address: { required: true, message: '请输入详细地址' },
represent: { required: true, message: '请输入寺院法人' },
mobile: [
{ required: true, message: '请输入手机号码' },
{ validator: (rule, value) => this.$config.RegExp.mobile.test(value), message: '请输入合法的手机号码'}
],
source: { required: true, message: '请输入寺院来源' },
register_name: { validator: {} },
login_mobile: { required: true, message: '请输入法人手机号码' },
password: { required: true, message: '请输入登陆密码' },
password_confirm: { required: true, message: '请确认登录密码' }
},
// form: testForm,
geocoder: null,
TMap: null
@@ -173,9 +192,16 @@ export default {
if(this.form.register_cert_url.length === 0 && Number(this.$route.query.step) !== 1){
return this.$router.push({ query: { step: 1 }});
}
},
methods: {
handleErrors(errors){
for(let i = 0; i < errors.length; i++){
if(errors[i]){
this.$toast.fail(errors[i].message)
break;
}
}
},
onNextStep(){
this.$router.push({ query: { step: this.step + 1 }})
},
@@ -198,8 +224,15 @@ export default {
onChangeProvince(){
},
async onSubmitBefore(){
this.onNextStep();
onSubmitBefore(){
const validator = new Schema(this.formRules);
validator.validate(this.form, ((errors) => {
if(errors){
return this.handleErrors(errors)
}
//
this.onNextStep();
}))
},
async onSubmit(){
const [province_id, city_id, country_id] = this.form.city_id;
src/pages/user/temple-station/review.vue
+3 -3
View File
@@ -3,7 +3,7 @@
<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" />
<img class="qrcode" :src="$config.qrcode.wechatAccount" />
</div>
</template>
@@ -34,8 +34,8 @@ export default {};
margin-bottom: .3rem;
}
.qrcode{
width: 4rem;
height: 4rem;
width: 5rem;
height: 5rem;
margin-left: auto;
margin-right: auto;
display: block;
src/router/index.js
-3
View File
@@ -17,7 +17,6 @@ const routes = [
},
{
path: '/temple',
name: 'temple',
meta: { title: '寺院', navBarBackgroundColor: 'white', showNavBar: false },
component: { render: h => h('router-view') },
children: [
@@ -110,7 +109,6 @@ const routes = [
},
{
path: '/user',
name: 'user',
component: () => import('@/pages/user/root'),
children: [
{
@@ -163,7 +161,6 @@ const routes = [
},
{
path: 'course',
name: 'user-course',
meta: { title: '修行' },
component: { render: h => h('router-view')},
children: [
yarn.lock
+5
View File
@@ -1916,6 +1916,11 @@ async-limiter@~1.0.0:
resolved "https://registry.npm.taobao.org/async-limiter/download/async-limiter-1.0.1.tgz#dd379e94f0db8310b08291f9d64c3209766617fd"
integrity sha1-3TeelPDbgxCwgpH51kwyCXZmF/0=
async-validator@^4.0.7:
version "4.0.7"
resolved "https://registry.npmmirror.com/async-validator/download/async-validator-4.0.7.tgz#034a0fd2103a6b2ebf010da75183bec299247afe"
integrity sha1-A0oP0hA6ay6/AQ2nUYO+wpkkev4=
async@^2.6.2:
version "2.6.3"
resolved "https://registry.nlark.com/async/download/async-2.6.3.tgz?cache=0&sync_timestamp=1628205815983&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fasync%2Fdownload%2Fasync-2.6.3.tgz#d72625e2344a3656e3a3ad4fa749fa83299d82ff"