Browse Source

活动列表接口联调,首页加交互效果

feature
mk 1 year ago
parent
commit
d5ac6bba2a
  1. 6
      src/api/home.js
  2. 6
      src/api/user.js
  3. BIN
      src/assets/images/icons/about.png
  4. BIN
      src/assets/images/icons/activity.png
  5. BIN
      src/assets/images/icons/privacy.png
  6. BIN
      src/assets/images/icons/satisfaction.png
  7. 45
      src/components/registerDialog/index.vue
  8. 2
      src/plugins/vant.js
  9. 3
      src/router/index.js
  10. 6
      src/router/router.config.js
  11. 13
      src/store/modules/app.js
  12. 5
      src/views/home/index.less
  13. 71
      src/views/home/index.vue
  14. 26
      src/views/houseQR/index.vue
  15. 24
      src/views/mine/index.vue
  16. 22
      src/views/register/index.vue
  17. 5
      src/views/selectAgency/index.vue

6
src/api/home.js

@ -2,10 +2,10 @@
import request from '@/utils/request'
// 【社区服务】活动列表+轮播图
export function communityActivity(params) {
export function communityActivity(data) {
return request({
url: `/actual/base/communityActivity/page`,
method: 'get',
params
method: 'post',
data
})
}

6
src/api/user.js

@ -19,12 +19,12 @@ export function checkWxmpRegister(params) {
})
}
// 获取用户信息
export function getUserWechatByUserId(params) {
export function getUserWechatByUserId(id) {
return request({
url: `/auth/loginH5/resiH5/getUserInfoByToken`,
url: `epmetuser/user/getH5LoginUserInfo/${id}`,
method: 'get',
message: '获取用户信息中...',
params
})
}

BIN
src/assets/images/icons/about.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
src/assets/images/icons/activity.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
src/assets/images/icons/privacy.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

BIN
src/assets/images/icons/satisfaction.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

45
src/components/registerDialog/index.vue

@ -0,0 +1,45 @@
<template>
<van-dialog v-model="show" show-cancel-button confirm-button-text="确定" @confirm="$router.push('/register')" @cancel="$emit('close')">
<div class="tip">
<h3>温馨提示</h3>
<p>请您先进行手号注册</p>
</div>
</van-dialog>
</template>
<script>
export default {
name: 'Perfect',
data() {
return {
show: true
}
},
mounted() {
}
}
</script>
<style scoped lang="less">
:deep(.van-dialog) {
display: flex;
flex-direction: column;
}
:deep(.van-dialog__content) {
flex: 1;
background: url('@/assets/dialog_bg.png') no-repeat;
background-size: 100%;
min-height: 180px;
width: 100%;
padding: 25px;
box-sizing: border-box;
p {
margin-top: 48px;
font-family: pingfang-bold;
}
}
</style>

2
src/plugins/vant.js

@ -26,6 +26,7 @@ import {
Search,
Swipe,
SwipeItem,
NoticeBar
} from 'vant'
Vue.use(Button)
@ -53,3 +54,4 @@ Vue.use(Button)
.use(Search)
.use(Swipe)
.use(SwipeItem)
.use(NoticeBar)

3
src/router/index.js

@ -87,9 +87,10 @@ router.beforeEach((to, from, next) => {
}
})
} else {
if (getQueryStringByName('code') && !whiteList.includes(to.path)) {
if (getQueryStringByName('code')) {
login({ wxCode: getQueryStringByName('code'),appId:'wx1078fa1e99424de9'}).then(res => {
localStorage.setItem('token', res.token)
localStorage.setItem('userId', res.userH5DTO.id)
let state = decodeURIComponent(getQueryStringByName('state'))
state = state.replace(/[\\\b\f\n\r\t]/g, '')
state = state.replace(/(\s*?{\s*?|\s*?,\s*?)(['"])?([a-zA-Z0-9]+)(['"])?:/g, '$1"$3":')

6
src/router/router.config.js

@ -79,4 +79,10 @@ export const constantRouterMap = [
component: () => import('@/views/selectAgency'),
meta: { title: '选择所在社区', keepAlive: false }
}
,{
path: '/houseQR',
name: 'houseQR',
component: () => import('@/views/houseQR'),
meta: { title: '电子门牌', keepAlive: false }
}
]

13
src/store/modules/app.js

@ -2,11 +2,15 @@ import {checkWxmpRegister, getUserWechatByUserId} from '@/api/user'
const state = {
userInfo: {},
appId: ''
appId: '',
realNameFlag:null,
agencyId:null
}
const mutations = {
SET_USER_INFO(state, userInfo) {
state.userInfo = userInfo
state.userInfo = userInfo;
state.agencyId = userInfo.agencyId;
state.realNameFlag = userInfo.realName;
},
SET_APP_ID(state, appId) {
state.appId = appId
@ -19,9 +23,8 @@ const actions = {
if (Object.keys(state.userInfo).length) {
resolve(state.userInfo)
}
getUserWechatByUserId({
token: localStorage.getItem('token')
})
console.log(state.userInfo);
getUserWechatByUserId(localStorage.getItem('userId'))
.then(res => {
commit('SET_USER_INFO', res)
resolve(res)

5
src/views/home/index.less

@ -65,3 +65,8 @@
border-bottom: none;
}
}
.tip{
// background-image: url('@/assets/dialog_bg.png');
// background-size: 100% 100%;
}

71
src/views/home/index.vue

@ -5,13 +5,15 @@
<div class="flex flex-end">
<div class="flex flex-center2 white">
<img src="@/assets/images/icons/home.png" class="img_17 m-right10" alt="">
<span>社区</span>
<span>{{ this.$store.state.app.userInfo.agencyName || '--' }}</span>
</div>
<div class="flex flex-center2">
<van-search v-model="searchKey" placeholder="请输入搜索关键词" shape="round" background="#3974f6"
style="width: 170px;" @search="$router.push({ path: '/search', query: { searchKey: searchKey } })" />
style="width: 170px;"
@search="$router.push({ path: '/search', query: { searchKey: searchKey } })" />
<img src="@/assets/images/icons/mine.png"
@click="$router.push({ path: '/mine', query: { searchKey: searchKey } })" class="img_20 " alt="">
@click="$router.push({ path: '/mine', query: { searchKey: searchKey } })" class="img_20 "
alt="">
</div>
</div>
<div class="swipe">
@ -24,16 +26,17 @@
</van-swipe>
</div>
<div class="card flex flex-end flex-center2 m-top15 notice">
<img src="@/assets/images/icons/notice.png" class="img_17 m-right7" alt="">
<img src="@/assets/images/icons/notice.png" class="img_17" alt="">
<div class="van-ellipsis flex-1">
这个vant真的好好好用强烈推!!!!!!!!
<van-notice-bar color="#555555" background="#ffffff" text="在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。" />
</div>
<span class="gray notice_time">05-06</span>
<span class="gray">更多</span>
</div>
<div class="card m-top10">
<div class="flex white">
<div class="appeal m-right10 flex flex-y">
<div class="appeal m-right10 flex flex-y" @click="handelClickJump('event')">
<div>我有诉求</div>
<div class="font-size13 m-top5" style="color: #d8e6fe;"> 居民点单 社区接单</div>
</div>
@ -43,8 +46,8 @@
</div>
</div>
<div class="flex flex-centr2 flex-mean m-top18">
<div class="flex-y flex flex-center1 flex-center2 nav font-size13 "
v-for="(item, index) in tabList">
<div class="flex-y flex flex-center1 flex-center2 nav font-size13 " v-for="(item, index) in tabList"
@click="handelClickJump(item.path)" :key="index">
<img :src="item.imgSrc" alt="">
<span>{{ item.title }}</span>
</div>
@ -66,7 +69,8 @@
<span>报名人数</span> <span class="font-size18 orange">{{ item.resiNum }}</span>/<span
class="font-size14">{{ item.total }}</span>
</div>
<van-button type="info" size="small" round>报名</van-button>
<van-button type="info" size="small" round
@click="handelClickJump('activity')">报名</van-button>
</div>
</div>
</div>
@ -93,10 +97,12 @@
</div>
</div>
</div>
<register-dialog v-if="showRegister" @close="showRegister = false"></register-dialog>
</div>
</template>
<script>
import registerDialog from '@/components/registerDialog';
import { communityActivity } from '@/api/home';
export default {
data() {
@ -106,27 +112,27 @@ export default {
{
imgSrc: require('@/assets/images/nav/1.png'),
title: '社区讯息',
path: '/notice'
path: 'notice'
},
{
imgSrc: require('@/assets/images/nav/2.png'),
title: '社区活动',
path: '/notice'
path: 'notice'
},
{
imgSrc: require('@/assets/images/nav/3.png'),
title: '居民议事',
path: '/notice'
path: 'notice'
},
{
imgSrc: require('@/assets/images/nav/4.png'),
title: '满意度测评',
path: '/notice'
path: 'notice'
},
{
imgSrc: require('@/assets/images/nav/5.png'),
title: '可享服务',
path: '/notice'
path: 'service'
}
],
activityList: [
@ -160,21 +166,46 @@ export default {
title: '社区活动测试测试测试时杀死社区活动测试测试测试时杀死还是上海市普陀区金沙江路还是上海市普陀区金沙江路',
oppose: 10
}
]
],
showRegister: false
};
},
created() {
// this.communityActivity()//
this.agencyId = this.$store.state.app.agencyId;
this.communityActivity()//
},
methods: {
async communityActivity() {
let { data, code, msg } = await communityActivity()
if (code === 0) {
console.log(data);
let parm = {
pageSize: 10,
pageNo: 1,
agencyId: this.agencyId,
activityName: "",
status: "",
typeId: "",
startTime: "",
endTime: "",
address: "",
assistingParty: ""
}
let res = await communityActivity(parm)
if (res) {
console.log(res);
}
},
handelClickJump(path) {
if (path === 'event' || path === 'service' || path === 'activity') {
if (this.$store.state.app.userInfo.mobile) {
this.$router.push({ path: `/${path}` });
} else {
this.showRegister = true;
}
} else {
this.$router.push({ path: `/${path}` })
}
}
},
components: {},
components: { registerDialog },
computed: {},
watch: {},
}

26
src/views/houseQR/index.vue

@ -0,0 +1,26 @@
<template>
<div class="container">
</div>
</template>
<script>
export default {
name: 'houseQR',
data() {
return {
houesId:this.$route.query.houseId,
}
},
created(){
console.log(this.houesId,'房屋Id');
},
mounted() {
}
}
</script>
<style scoped lang="less">
</style>

24
src/views/mine/index.vue

@ -11,7 +11,7 @@
<div class="text">{{ userInfo.realName ? userInfo.realName : userInfo.nickname }}</div>
<div class="grid">
<svg-icon iconClass="grid" class-name="img" />
{{ userInfo.gridName }}
{{ userInfo.agencyName }}
</div>
</div>
</div>
@ -21,7 +21,6 @@
</div>
</div>
</div>
<div class="container">
<div class="cell-group">
<van-cell title="我的诉求" is-link to="/appeal">
@ -29,12 +28,27 @@
<van-image style="margin-right: 5px" :src="require('@/assets/sq.png')" width="20" height="20" />
</template>
</van-cell>
<van-cell title="我的家庭" is-link>
<van-cell title="我参与的活动" is-link>
<template #icon>
<van-image style="margin-right: 5px" :src="require('@/assets/images/icons/activity.png')" width="20" height="20" />
</template>
</van-cell>
<van-cell title="我参与的满意度调查" is-link>
<template #icon>
<van-image style="margin-right: 5px" :src="require('@/assets/images/icons/satisfaction.png')" width="20" height="20" />
</template>
</van-cell>
</div>
</div>
<div class="container">
<div class="cell-group">
<van-cell title="隐私保护" is-link>
<template #icon>
<van-image style="margin-right: 5px" :src="require('@/assets/jt.png')" width="20" height="20" />
<van-image style="margin-right: 5px" :src="require('@/assets/images/icons/privacy.png')" width="20" height="20" />
</template>
</van-cell>
<van-cell title="关于" is-link>
<van-cell title="关于我们" is-link>
<template #icon>
<van-image style="margin-right: 5px" :src="require('@/assets/gy.png')" width="20" height="20" />
</template>

22
src/views/register/index.vue

@ -15,7 +15,7 @@
</van-tab>
<van-tab title="实名认证">
<div class="block container">
<van-field v-model="name" label="真实姓名" placeholder="请输入" required />
<van-field v-model="realName" label="真实姓名" placeholder="请输入" required />
<van-field v-model="idCard" label="身份证号" placeholder="请输入" required/>
<van-field v-model="phone" label="手机号" placeholder="请输入" required />
<van-field v-model="smsCode" label="验证码" placeholder="请输入" required>
@ -32,7 +32,7 @@
</template>
<script>
import { register, sendsmscode } from '@/api/user'
import { editUser, sendsmscode } from '@/api/user'
var leftTime
export default {
@ -44,12 +44,11 @@ export default {
userInfo: {},
phone: '',
smsCode: '',
surName: '',
gender: '',
userId: '',
active:0,
idCard:null,
name:null,
realName:null,
}
},
@ -67,25 +66,28 @@ export default {
this.type = this.$route.params.type ? this.$route.params.type : ''
this.userInfo = this.$store.state.app.userInfo
this.gender = this.userInfo.gender
this.surName = this.userInfo.realName || this.userInfo.nickname
this.realName = this.userInfo.realName || this.userInfo.nickname
},
submit() {
let params = {
phone: this.phone,
...this.userInfo,
mobile: this.phone,
smsCode: this.smsCode,
surName: this.surName,
realName: this.realName,
appId: this.$store.state.app.appId,
gender: this.gender
gender: this.gender,
idNum:this.idCard
}
if (!params.phone) {
if (!params.mobile) {
this.$toast.fail('请输入手机号')
return
}
if (!params.smsCode) {
this.$toast.fail('请输入验证码')
return
}
register(params).then(res => {
editUser(params).then(res => {
localStorage.setItem('token', res.token)
this.$toast.success('注册成功')
let query = this.$route.query

5
src/views/selectAgency/index.vue

@ -41,8 +41,9 @@ export default {
if (item.level === 'community') {
let parm = this.$store.state.app.userInfo;
parm.agencyId = item.agencyId;
let {code} = await editUser(parm)
if(code == 0){
let res = await editUser(parm)
if(res){
// this.$router.replace('home')
this.$router.replace('/')
}
} else {

Loading…
Cancel
Save