Browse Source

上传

v1
前端-胡立永 9 months ago
parent
commit
08575c99bc
11 changed files with 266 additions and 287 deletions
  1. +1
    -0
      App.vue
  2. +5
    -5
      api/api.js
  3. +3
    -3
      api/http.js
  4. +6
    -0
      pages.json
  5. +0
    -75
      pages/index/index.vue
  6. +105
    -101
      pages/login/login.vue
  7. +130
    -0
      pages/login/wxUserInfo.vue
  8. +0
    -95
      pages/map/map.vue
  9. +1
    -1
      pages/payment/payment.vue
  10. +4
    -1
      pages/weddingCelebration/weddingCelebration.vue
  11. +11
    -6
      store/store.js

+ 1
- 0
App.vue View File

@ -1,6 +1,7 @@
<script>
export default {
onLaunch: function() {
this.$store.commit('initConfig')
},
onShow: function() {
// this.$store.commit('initConfig')


+ 5
- 5
api/api.js View File

@ -12,9 +12,9 @@ const config = {
//下单
createOrderPay: { url: '/cheer/info/createOrderPay', method: 'GET', auth: true },
//获取折扣、客户电话、微信
getConfig: { url: '/cheer/info/getConfig', method: 'GET', auth: true },
getConfig: { url: '/cheer/info/getConfig', method: 'GET'},
//获取充值套餐
getRechargePage: { url: '/cheer/info/getRechargePage', method: 'GET', auth: true },
getRechargePage: { url: '/cheer/info/getRechargePage', method: 'GET'},
}
@ -49,9 +49,9 @@ export function api(key, data, callback, loadingTitle) {
//必须登录
if (req.auth) {
if (!uni.getStorageSync('token')) {
uni.navigateTo({
url: '/pages/login/mobile'
})
// uni.navigateTo({
// url: '/pages/login/mobile'
// })
console.error('需要登录')
return
}


+ 3
- 3
api/http.js View File

@ -28,9 +28,9 @@ function http(uri, data, callback, method = 'GET', showLoading, title) {
res.data.message == '操作失败,token非法无效!'){
uni.removeStorageSync('token')
console.error('登录过期');
uni.navigateTo({
url: '/pages/auth/login'
})
// uni.navigateTo({
// url: '/pages/auth/login'
// })
}
if(res.statusCode == 200 && res.data.code != 200){


+ 6
- 0
pages.json View File

@ -17,6 +17,12 @@
"navigationBarTitleText": "授权登录"
}
},
{
"path": "pages/login/wxUserInfo",
"style": {
"navigationBarTitleText": "授权登录"
}
},
{
"path": "pages/weddingCelebration/weddingCelebration",
"style": {


+ 0
- 75
pages/index/index.vue View File

@ -1,75 +0,0 @@
<template>
<view class="content">
<button @click="$refs.configPopup.open()">{{ locale.agreement }}</button>
<button @click="$refs.changeLanguage.open()">切换语言</button>
<button @click="$utils.navigateTo('/map/map')">地图</button>
<button @click="uploadImage">图片上传</button>
<text>{{ image }}</text>
<uv-upload
:fileList="fileList"
:maxCount="5"
multiple
width="150rpx"
height="150rpx"
@delete="deleteImage"
@afterRead="afterRead"
:previewFullImage="true"></uv-upload>
<changeLanguage ref="changeLanguage"/>
<configPopup
keyValue="asd"
ref="configPopup"/>
</view>
</template>
<script>
export default {
data() {
return {
image : '',
fileList: [],
}
},
computed : {
locale(){
return this.$t('pages.index.index')
}
},
methods: {
//
uploadImage(){
let self = this
this.$Oss.ossUploadImage({
success(url){
self.image = url
}
})
},
deleteImage(e){
this.fileList.splice(e.index, 1)
},
afterRead(e){
let self = this
e.file.forEach(file => {
self.$Oss.ossUpload(file.url).then(url => {
self.fileList.push({
url
})
})
})
},
}
}
</script>
<style scoped lang="scss">
.content{
padding: 20px;
button{
margin-bottom: 10rpx;
}
}
</style>

+ 105
- 101
pages/login/login.vue View File

@ -1,37 +1,47 @@
<template>
<view class="login">
<view class="title">
帧视界
<view class="logo">
<image src="/static/image/login/logo.png" mode=""></image>
</view>
<view class="title">
申请获取你的头像昵称
欢迎登录真视界
</view>
<button class="chooseAvatar" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
<view class="line">
<view class="">
头像
</view>
<view class="">
<image :src="userInfo.headImage" v-if="userInfo.headImage" style="width: 60rpx;height: 60rpx;"
mode=""></image>
<image src="/static/login/6.png" v-else style="width: 50rpx;height: 50rpx;" mode=""></image>
</view>
</view>
</button>
<view class="line">
<view class="">
昵称
<view class="btn mt">
<view class="icon">
<image src="/static/image/login/wx.png" mode=""></image>
</view>
<view class="">
<input type="nickname" placeholder="请输入昵称" style="text-align: right;" id="nickName"
v-model="userInfo.nickName" />
<view class=""
@click="wxLogin">
微信授权手机号登录
</view>
</view>
<view class="btn" @click="submit">
确认
<view class="btn b2">
使用短信验证登录
</view>
<view class="config">
<uv-checkbox-group
v-model="checkboxValue"
shape="circle">
<view class="content">
<view
style="display: flex;">
<uv-checkbox
size="30rpx"
:name="1"
></uv-checkbox>
阅读并同意我们的<text>服务协议与隐私条款</text>
</view>
<view class="">
以及<text>个人信息保护指引</text>
</view>
</view>
</uv-checkbox-group>
</view>
</view>
</template>
@ -39,92 +49,86 @@
export default {
data() {
return {
userInfo: {
headImage: '',
nickName: '',
}
};
checkboxValue : []
}
},
onShow() {},
computed: {},
methods: {
onChooseAvatar(res) {
let self = this
self.$Oss.ossUpload(res.target.avatarUrl)
.then(url => {
self.userInfo.headImage = url
})
},
submit() {
let self = this
uni.createSelectorQuery().in(this)
.select("#nickName")
.fields({
properties: ["value"],
})
.exec((res) => {
const nickName = res?.[0]?.value
self.userInfo.nickName = nickName
})
if (this.$utils.verificationAll(this.userInfo, {
headImage: '请选择头像',
nickName: '请填写昵称',
})) {
return
}
this.$api('infoUpdateInfo', this.userInfo, res => {
if (res.code == 200) {
uni.navigateBack(-1)
}
})
wxLogin(){
this.$store.commit('login')
},
}
}
</script>
<style lang="scss" scoped>
.login {
<style scoped lang="scss">
.login{
display: flex;
justify-content: center;
align-items: center;
height: 80vh;
flex-direction: column;
position: relative;
.logo{
height: 80rpx;
width: 80rpx;
padding: 40rpx 30rpx;
background-color: #ddd;
border-radius: 70rpx;
image{
width: 80rpx;
height: 80rpx;
}
margin-bottom: 20rpx;
}
.title{
position: relative;
font-weight: 900;
font-size: 45rpx;
&::after{
content: '';
position: absolute;
left: 0;
top: 100%;
display: block;
height: 8rpx;
width: 210rpx;
background: linear-gradient(to right,#3c69f1, #fff);
}
}
.btn{
width: 80%;
height: 100rpx;
background-color: #3c69f1;
color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 80vh;
.title {
line-height: 45rpx;
font-weight: 900;
}
.line {
display: flex;
justify-content: space-between;
align-items: center;
width: 80%;
border-bottom: 1px solid #00000023;
padding: 30rpx 0;
margin: 0 auto;
margin: 20rpx 0;
.icon{
margin-right: 10rpx;
image{
width: 40rpx;
height: 35rpx;
}
}
.chooseAvatar {
width: 100%;
padding: 0;
margin: 0;
margin-top: 10vh;
border: none;
}
.btn {
// background: $uni-linear-gradient-btn-color;
background: lightblue;
color: #fff;
width: 80%;
padding: 20rpx 0;
text-align: center;
border-radius: 15rpx;
margin-top: 10vh;
}
.b2{
background-color: #3c69f122;
color: #3c69f1;
}
.mt{
margin-top: 200rpx;
}
.config{
position: absolute;
bottom: 0;
font-size: 22rpx;
text-align: center;
line-height: 40rpx;
text{
color: #3c69f1;
}
}
</style>
}
</style>

+ 130
- 0
pages/login/wxUserInfo.vue View File

@ -0,0 +1,130 @@
<template>
<view class="login">
<view class="title">
帧视界
</view>
<view class="title">
申请获取你的头像昵称
</view>
<button class="chooseAvatar" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
<view class="line">
<view class="">
头像
</view>
<view class="">
<image :src="userInfo.headImage" v-if="userInfo.headImage" style="width: 60rpx;height: 60rpx;"
mode=""></image>
<image src="/static/login/6.png" v-else style="width: 50rpx;height: 50rpx;" mode=""></image>
</view>
</view>
</button>
<view class="line">
<view class="">
昵称
</view>
<view class="">
<input type="nickname" placeholder="请输入昵称" style="text-align: right;" id="nickName"
v-model="userInfo.nickName" />
</view>
</view>
<view class="btn" @click="submit">
确认
</view>
</view>
</template>
<script>
export default {
data() {
return {
userInfo: {
headImage: '',
nickName: '',
}
};
},
onShow() {},
computed: {},
methods: {
onChooseAvatar(res) {
let self = this
self.$Oss.ossUpload(res.target.avatarUrl)
.then(url => {
self.userInfo.headImage = url
})
},
submit() {
let self = this
uni.createSelectorQuery().in(this)
.select("#nickName")
.fields({
properties: ["value"],
})
.exec((res) => {
const nickName = res?.[0]?.value
self.userInfo.nickName = nickName
})
if (this.$utils.verificationAll(this.userInfo, {
headImage: '请选择头像',
nickName: '请填写昵称',
})) {
return
}
this.$api('infoUpdateInfo', this.userInfo, res => {
if (res.code == 200) {
uni.navigateBack(-1)
}
})
},
}
}
</script>
<style lang="scss" scoped>
.login {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 80vh;
.title {
line-height: 45rpx;
font-weight: 900;
}
.line {
display: flex;
justify-content: space-between;
align-items: center;
width: 80%;
border-bottom: 1px solid #00000023;
padding: 30rpx 0;
margin: 0 auto;
}
.chooseAvatar {
width: 100%;
padding: 0;
margin: 0;
margin-top: 10vh;
border: none;
}
.btn {
// background: $uni-linear-gradient-btn-color;
background: lightblue;
color: #fff;
width: 80%;
padding: 20rpx 0;
text-align: center;
border-radius: 15rpx;
margin-top: 10vh;
}
}
</style>

+ 0
- 95
pages/map/map.vue View File

@ -1,95 +0,0 @@
<template>
<view class="content">
<map style="width: 100%; height: 90vh;"
:layer-style='5'
:style="{height:mapheight}"
:show-location='true'
:latitude="latitude"
:longitude="longitude"
:markers="markers"
:scale="scale"
@markertap="markertap"
@callouttap='callouttap'>
<!-- subkey="66c5a2ad2849" -->
</map>
</view>
</template>
<script>
import position from '@/utils/position.js'
export default {
data() {
return {
latitude: 23.106574, //
longitude: 113.324587, //
scale: 10, //
bottomData: false,
mapCtx: null,
markers:[
{ //A
iconPath: "/static/logo.png", //
id: 0,
width: 20, //icon
height: 28 ,//icon
latitude: 26.1272,
longitude: 113.11659
}
]
}
},
onLoad() {
position.getLocation(res => {
console.log(res);
this.latitude = res.latitude
this.longitude = res.longitude
})
},
computed: {
mapheight() {
let data = ''
if (this.bottomData) {
if (this.upTop) {
data = '50px'
} else {
data = '200px'
}
} else {
data = '90vh'
}
return data
},
coverbottom() {
let data = ''
if (this.bottomData) {
data = '20rpx'
} else {
data = '100rpx'
}
return data
}
},
onShow() {
this.mapCtx = wx.createMapContext('map');
this.mapCtx && this.mapCtx.addCustomLayer({
layerId: '66c5a2ad2849',
success: (res) => {
console.log('success', res);
},
fail: (e) => {
console.log('fail', e);
},
});
},
methods: {
//
markertap(e) {
console.log("===你点击了标记点===", e)
},
//
callouttap(e) {
console.log('地图点击事件', e)
}
}
}
</script>

+ 1
- 1
pages/payment/payment.vue View File

@ -15,7 +15,7 @@
<uni-section title="输入金额" type="line" titleFontSize="34rpx"></uni-section>
<view class="money-input">
<image src="../../static/payment/money.png" mode="widthFix"></image>
<image src="/static/payment/money.png" mode="widthFix"></image>
<input v-model="form.money" @focus="focus" placeholder="请输入加油金额" type="number" />
</view>


+ 4
- 1
pages/weddingCelebration/weddingCelebration.vue View File

@ -3,7 +3,10 @@
<uni-nav-bar dark :fixed="true" background-color="#00aaff" :border="false" status-bar title="婚庆服务" @clickLeft="back" left-icon="left"/>
<uni-section title="婚庆服务" type="line" titleFontSize="34rpx">
<uni-card :is-shadow="false">
<image style="width: 100%;" src="https://ts1.cn.mm.bing.net/th/id/R-C.b6359b70784d251138d9dc56b650274b?rik=WiMqW3Pnt%2fImmg&riu=http%3a%2f%2fwww.deepp.com%2fimages%2fcode.png&ehk=pWaMA%2fmVIw943tuInsYTSXgBj%2f3oDTqWhx9Hx3hMtRI%3d&risl=&pid=ImgRaw&r=0" mode="widthFix" :show-menu-by-longpress="true"></image>
<!-- <image style="width: 100%;" src="https://ts1.cn.mm.bing.net/th/id/R-C.b6359b70784d251138d9dc56b650274b?rik=WiMqW3Pnt%2fImmg&riu=http%3a%2f%2fwww.deepp.com%2fimages%2fcode.png&ehk=pWaMA%2fmVIw943tuInsYTSXgBj%2f3oDTqWhx9Hx3hMtRI%3d&risl=&pid=ImgRaw&r=0" mode="widthFix" :show-menu-by-longpress="true"></image> -->
<view class="">
添加微信
</view>
</uni-card>
</uni-section>
</view>


+ 11
- 6
store/store.js View File

@ -8,16 +8,21 @@ import api from '@/api/api.js'
//Vuex.Store 构造器选项
const store = new Vuex.Store({
state: {
configList: [], //配置列表
configList: {}, //配置对象
},
getters: {},
mutations: {
// 初始化配置
initConfig(state) {
api('getConfig', res => {
if (res.code == 200) {
state.configList = res.result
}
let config = ['discount', 'wx']
config.forEach(k => {
api('getConfig', {
keyValue : k
}, res => {
if (res.code == 200) {
state.configList[k] = res.result
}
})
})
},
login(state) {
@ -38,7 +43,7 @@ const store = new Vuex.Store({
if (!state.userInfo.nickName || !state.userInfo.headImage) {
uni.navigateTo({
url: '/pages/login/login'
url: '/pages/login/wxUserInfo'
})
}
})


Loading…
Cancel
Save