修改
This commit is contained in:
cjb
parent
4e5031eb9d
commit
a256b227f4
39
src/components/mytabbar/mytabbar.scss
Normal file
39
src/components/mytabbar/mytabbar.scss
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
/* 主要颜色 */
|
||||||
|
$base: #00aa7f; // 基础颜色
|
||||||
|
.page-total{
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
// height: 100rpx;
|
||||||
|
}
|
||||||
|
.tab-list{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 120rpx;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
.list{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 20%;
|
||||||
|
height: 120rpx;
|
||||||
|
image{
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
text{
|
||||||
|
color: #333333;
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
.action{
|
||||||
|
color: $base;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
135
src/components/mytabbar/mytabbar.vue
Normal file
135
src/components/mytabbar/mytabbar.vue
Normal file
@ -0,0 +1,135 @@
|
|||||||
|
<template>
|
||||||
|
<view class="page-total">
|
||||||
|
<view class="tab-list">
|
||||||
|
<view class="list" v-for="(item,index) in TabBarList"
|
||||||
|
@tap="onTabBar(index)" :style="{marginTop: (index == 1) ? '-26px' : '0px'}"
|
||||||
|
:key="index">
|
||||||
|
<image :src="item.img" mode="widthFix" v-show="tabBarShow === index" :style="{width: (index == 1) ? '40px' : '28px',borderRadius: (index == 1) ? '12px' : '0px'}"></image>
|
||||||
|
<image :src="item.acImg" mode="widthFix" v-show="tabBarShow != index" :style="{width: (index == 1) ? '40px' : '28px',borderRadius: (index == 1) ? '12px' : '0px'}"></image>
|
||||||
|
|
||||||
|
<!-- background: (index == 2) ? 'red' : '' -->
|
||||||
|
<text :class="{'action':tabBarShow===index}" :style="{marginTop: (index == 1) ? '4px' : '0px'}">{{item.name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref } from 'vue'
|
||||||
|
import { carlist } from '@/utils/service'
|
||||||
|
import { onLoad } from '@dcloudio/uni-app'
|
||||||
|
|
||||||
|
const TabBarList = [
|
||||||
|
{
|
||||||
|
index: 0,
|
||||||
|
name: '首页',
|
||||||
|
img: '../../static/img/tabbar/home.png',
|
||||||
|
acImg: '../../static/img/tabbar/home.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
index: 1,
|
||||||
|
name: '扫码换电',
|
||||||
|
img: '../../static/img/tabbar/saom.png',
|
||||||
|
acImg: '../../static/img/tabbar/saom.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
index: 2,
|
||||||
|
name: '我的',
|
||||||
|
img: '../../static/img/tabbar/wode.png',
|
||||||
|
acImg: '../../static/img/tabbar/wode.png'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
|
||||||
|
let codeheight = ref(0)
|
||||||
|
let isOverall = ref(0)
|
||||||
|
let phoneModel = ref('')
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<{
|
||||||
|
tabBarShow?:string|number
|
||||||
|
}>(), {
|
||||||
|
tabBarShow:0
|
||||||
|
})
|
||||||
|
|
||||||
|
function onTabBar(index:string|number){
|
||||||
|
|
||||||
|
switch (index){
|
||||||
|
case 0:
|
||||||
|
uni.switchTab({
|
||||||
|
url:'/pages/home/index'
|
||||||
|
})
|
||||||
|
break
|
||||||
|
case 1:
|
||||||
|
if(uni.getStorageSync('wxuid')){
|
||||||
|
carlist(uni.getStorageSync('wxuid')).then((rps:any) => {
|
||||||
|
if(rps.data && rps.data.length > 0){
|
||||||
|
uni.scanCode({
|
||||||
|
onlyFromCamera:true,
|
||||||
|
success(res){
|
||||||
|
let hdzcode = '' //??
|
||||||
|
|
||||||
|
// console.log('条码类型：' + res.scanType);
|
||||||
|
// console.log('条码内容：' + res.result);
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/homePages/reservation/index?hdzcode=${hdzcode}&phoneNumber=${uni.getStorageSync('userInfor').phoneNumber?uni.getStorageSync('userInfor').phoneNumber:''}`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail() {
|
||||||
|
uni.switchTab({
|
||||||
|
url: '/pages/home/index'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.showToast({
|
||||||
|
title:'请您联系管理员绑定车辆',
|
||||||
|
icon:'none'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}else{
|
||||||
|
uni.showToast({
|
||||||
|
title:'请您先登录',
|
||||||
|
icon:'none'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
uni.switchTab({
|
||||||
|
url:'/pages/mine/index'
|
||||||
|
})
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onLoad(() =>{
|
||||||
|
try {
|
||||||
|
const res = uni.getSystemInfoSync();
|
||||||
|
// 获取系统信息
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success(res) {
|
||||||
|
console.log(res.brand) //手机牌子
|
||||||
|
console.log(res.model) //手机型号
|
||||||
|
console.log(res.screenWidth) //屏幕宽度
|
||||||
|
console.log(res.screenHeight) //屏幕高度
|
||||||
|
|
||||||
|
codeheight.value = Math.round(res.screenHeight);
|
||||||
|
phoneModel.value =res.model
|
||||||
|
if(res.model.search('iPhone')){
|
||||||
|
isOverall.value = 0;
|
||||||
|
}else if(Math.round(res.screenHeight)>740){
|
||||||
|
isOverall.value = 1;
|
||||||
|
}
|
||||||
|
console.log(isOverall);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
// error
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import 'mytabbar.scss';
|
||||||
|
</style>
|
||||||
145
src/components/mytabbar/mytabbar2.vue
Normal file
145
src/components/mytabbar/mytabbar2.vue
Normal file
@ -0,0 +1,145 @@
|
|||||||
|
<template>
|
||||||
|
<view class="page-total">
|
||||||
|
<view class="tab-list">
|
||||||
|
<view class="list" v-for="(item,index) in TabBarList"
|
||||||
|
@tap="onTabBar(item,index)" :style="{marginTop: (index == 1) ? '-26px' : '0px'}"
|
||||||
|
:key="index">
|
||||||
|
<image :src="item.acImg" mode="widthFix" v-show="tabBarShow === index" :style="{width: (index == 1) ? '40px' : '28px',borderRadius: (index == 1) ? '12px' : '0px'}"></image>
|
||||||
|
<image :src="item.img" mode="widthFix" v-show="tabBarShow != index" :style="{width: (index == 1) ? '40px' : '28px',borderRadius: (index == 1) ? '12px' : '0px'}"></image>
|
||||||
|
|
||||||
|
<!-- background: (index == 2) ? 'red' : '' -->
|
||||||
|
<text :class="{'action':tabBarShow===index}" :style="{marginTop: (index == 1) ? '4px' : '0px'}">{{item.name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { carlist } from '@/utils/service'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
TabBarList:[
|
||||||
|
{
|
||||||
|
index: 0,
|
||||||
|
name: '首页',
|
||||||
|
img: '../../static/img/home.png',
|
||||||
|
acImg: '../../static/img/home.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
index: 1,
|
||||||
|
name: '扫码换电',
|
||||||
|
img: '../../static/img/saom.png',
|
||||||
|
acImg: '../../static/img/saom.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
index: 2,
|
||||||
|
name: '我的',
|
||||||
|
img: '../../static/img/wode.png',
|
||||||
|
acImg: '../../static/img/wode.png'
|
||||||
|
},
|
||||||
|
],
|
||||||
|
codeheight: 0,
|
||||||
|
isOverall: 0,
|
||||||
|
phoneModel: '',
|
||||||
|
};
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
tabBarShow: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
try {
|
||||||
|
const res = uni.getSystemInfoSync();
|
||||||
|
let that = this;
|
||||||
|
// 获取系统信息
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success(res) {
|
||||||
|
console.log(res.brand) //手机牌子
|
||||||
|
console.log(res.model) //手机型号
|
||||||
|
console.log(res.screenWidth) //屏幕宽度
|
||||||
|
console.log(res.screenHeight) //屏幕高度
|
||||||
|
that.codeheight = Math.round(res.screenHeight);
|
||||||
|
that.phoneModel =res.model
|
||||||
|
if(res.model.search('iPhone')){
|
||||||
|
that.isOverall = 0;
|
||||||
|
}else if(Math.round(res.screenHeight)>740){
|
||||||
|
that.isOverall = 1;
|
||||||
|
}
|
||||||
|
console.log(that.isOverall);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
// error
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
/**
|
||||||
|
* @param {Object} item
|
||||||
|
* @param {Number} index
|
||||||
|
*/
|
||||||
|
onTabBar(item,index){
|
||||||
|
// this.tabBarShow = index;
|
||||||
|
const _this = this
|
||||||
|
|
||||||
|
//??
|
||||||
|
// carlist(uni.getStorageSync('wxuid')).then((rps:any) => {
|
||||||
|
// if(rps.data && rps.data.length > 0){
|
||||||
|
|
||||||
|
// }else{
|
||||||
|
// uni.showToast({
|
||||||
|
// title:'请您联系管理员绑定车辆',
|
||||||
|
// icon:'none'
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
//??
|
||||||
|
|
||||||
|
switch (index){
|
||||||
|
case 0:
|
||||||
|
uni.switchTab({
|
||||||
|
url:'/pages/home/index'
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
if(uni.getStorageSync('wxuid')){
|
||||||
|
uni.scanCode({
|
||||||
|
onlyFromCamera:true,
|
||||||
|
success(res){
|
||||||
|
let hdzcode = '' //??
|
||||||
|
|
||||||
|
// console.log('条码类型：' + res.scanType);
|
||||||
|
// console.log('条码内容：' + res.result);
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/homePages/reservation/index?hdzcode=${hdzcode}&phoneNumber=${uni.getStorageSync('userInfor').phoneNumber?uni.getStorageSync('userInfor').phoneNumber:''}`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail() {
|
||||||
|
uni.switchTab({
|
||||||
|
url: '/pages/home/index'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.showToast({
|
||||||
|
title:'请您先登录',
|
||||||
|
icon:'none'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
uni.switchTab({
|
||||||
|
url:'/pages/mine/index'
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import 'mytabbar.scss';
|
||||||
|
</style>
|
||||||
@ -69,7 +69,7 @@
|
|||||||
>
|
>
|
||||||
<view style="display: flex;align-items: center;">
|
<view style="display: flex;align-items: center;">
|
||||||
<view>暂未绑定车辆</view>
|
<view>暂未绑定车辆</view>
|
||||||
<view style="padding-left:40rpx;color: #8bc34a;">去绑定</view>
|
<!-- <view style="padding-left:40rpx;color: #8bc34a;">去绑定</view> -->
|
||||||
</view>
|
</view>
|
||||||
</up-form-item>
|
</up-form-item>
|
||||||
</template>
|
</template>
|
||||||
@ -125,12 +125,15 @@
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<!--时间段-->
|
<!--时间段-->
|
||||||
<up-picker
|
<template v-if="timeshow">
|
||||||
:show="timeshow"
|
<up-picker
|
||||||
:columns="timecolumns"
|
:show="timeshow"
|
||||||
@confirm="timeconfirm"
|
:columns="timecolumns"
|
||||||
@cancel="timecancel"
|
@confirm="timeconfirm"
|
||||||
/>
|
@cancel="timecancel"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--修改手机号-->
|
<!--修改手机号-->
|
||||||
@ -166,8 +169,8 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, reactive } from 'vue'
|
import { ref, reactive } from 'vue'
|
||||||
import { addrese,gethdz,getphone,carlist } from '@/utils/service'
|
import { addrese,gethdz,getphone,carlist } from '@/utils/service'
|
||||||
import { onLoad } from '@dcloudio/uni-app'
|
import { onLoad,onShow } from '@dcloudio/uni-app'
|
||||||
|
import { isToday } from '@/utils/commen'
|
||||||
//查询车辆
|
//查询车辆
|
||||||
let cpcolumns = ref<any[]>([])
|
let cpcolumns = ref<any[]>([])
|
||||||
carlist(uni.getStorageSync('wxuid')).then((rps:any) => {
|
carlist(uni.getStorageSync('wxuid')).then((rps:any) => {
|
||||||
@ -215,7 +218,178 @@
|
|||||||
nuindex.value = 1
|
nuindex.value = 1
|
||||||
}
|
}
|
||||||
|
|
||||||
//formdata.stationCode = hdzcode.value?hdzcode.value:''
|
// formdata.stationCode = hdzcode.value
|
||||||
|
// formdata.stationName = opt.hdzname?opt.hdzname:''
|
||||||
|
|
||||||
|
})
|
||||||
|
const timecolumns:any = ref([
|
||||||
|
// [
|
||||||
|
// '8:00 - 9:00',
|
||||||
|
// '9:00 - 10:00',
|
||||||
|
// '10:00 - 11:00',
|
||||||
|
// '11:00 - 12:00',
|
||||||
|
// '12:00 - 13:00',
|
||||||
|
// '13:00 - 14:00',
|
||||||
|
// '14:00 - 15:00',
|
||||||
|
// '15:00 - 16:00',
|
||||||
|
// '16:00 - 17:00',
|
||||||
|
// '17:00 - 18:00'
|
||||||
|
// ]
|
||||||
|
])
|
||||||
|
|
||||||
|
const datelist = [
|
||||||
|
{
|
||||||
|
time:0,
|
||||||
|
timeslot:'00:00 - 1:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:1,
|
||||||
|
timeslot:'1:00 - 2:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:2,
|
||||||
|
timeslot:'2:00 - 3:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:3,
|
||||||
|
timeslot:'3:00 - 4:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:4,
|
||||||
|
timeslot:'4:00 - 5:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:5,
|
||||||
|
timeslot:'5:00 - 6:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:6,
|
||||||
|
timeslot:'6:00 - 7:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:7,
|
||||||
|
timeslot:'7:00 - 8:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:8,
|
||||||
|
timeslot:'8:00 - 9:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:9,
|
||||||
|
timeslot:'9:00 - 10:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:10,
|
||||||
|
timeslot:'10:00 - 11:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:11,
|
||||||
|
timeslot:'11:00 - 12:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:12,
|
||||||
|
timeslot:'12:00 - 13:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:13,
|
||||||
|
timeslot:'13:00 - 14:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:14,
|
||||||
|
timeslot:'14:00 - 15:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:15,
|
||||||
|
timeslot:'15:00 - 16:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:16,
|
||||||
|
timeslot:'16:00 - 17:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:17,
|
||||||
|
timeslot:'17:00 - 18:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:18,
|
||||||
|
timeslot:'18:00 - 19:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:19,
|
||||||
|
timeslot:'19:00 - 20:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:20,
|
||||||
|
timeslot:'20:00 - 21:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:21,
|
||||||
|
timeslot:'21:00 - 22:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:22,
|
||||||
|
timeslot:'22:00 - 23:00'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
time:23,
|
||||||
|
timeslot:'23:00 - 24:00'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
function settime(init?:boolean) {
|
||||||
|
timecolumns.value.splice(0)
|
||||||
|
const date = new Date()
|
||||||
|
const hours = date.getHours()
|
||||||
|
const Minutes = date.getMinutes()
|
||||||
|
let arr:any = []
|
||||||
|
datelist.forEach(n => {
|
||||||
|
if(n.time > hours || Minutes <= 30 && (n.time == hours)){
|
||||||
|
arr.push(n.timeslot)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if(init){
|
||||||
|
timecolumns.value.push(arr)
|
||||||
|
}else{
|
||||||
|
if(isToday(new Date(formdata.swapDay))){
|
||||||
|
timecolumns.value.push(arr)
|
||||||
|
}else{
|
||||||
|
timecolumns.value.push([
|
||||||
|
'0:00 - 1:00',
|
||||||
|
'1:00 - 2:00',
|
||||||
|
'2:00 - 3:00',
|
||||||
|
'3:00 - 4:00',
|
||||||
|
'4:00 - 5:00',
|
||||||
|
'5:00 - 6:00',
|
||||||
|
'6:00 - 7:00',
|
||||||
|
'7:00 - 8:00',
|
||||||
|
'8:00 - 9:00',
|
||||||
|
'9:00 - 10:00',
|
||||||
|
'10:00 - 11:00',
|
||||||
|
'11:00 - 12:00',
|
||||||
|
'12:00 - 13:00',
|
||||||
|
'13:00 - 14:00',
|
||||||
|
'14:00 - 15:00',
|
||||||
|
'15:00 - 16:00',
|
||||||
|
'16:00 - 17:00',
|
||||||
|
'17:00 - 18:00',
|
||||||
|
'18:00 - 19:00',
|
||||||
|
'19:00 - 20:00',
|
||||||
|
'20:00 - 21:00',
|
||||||
|
'21:00 - 22:00',
|
||||||
|
'22:00 - 23:00',
|
||||||
|
'23:00 - 24:00'
|
||||||
|
])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
onShow(() => {
|
||||||
|
settime(true)
|
||||||
|
// name:n.name,
|
||||||
|
// code:n.code,
|
||||||
|
// label:`${n.name}${n.isSuitable?'':'(不支持)'}`,
|
||||||
|
// isSuitable:n.isSuitable
|
||||||
})
|
})
|
||||||
const rules = {
|
const rules = {
|
||||||
uname: {
|
uname: {
|
||||||
@ -277,9 +451,13 @@
|
|||||||
function cpconfirm(v:any) {
|
function cpconfirm(v:any) {
|
||||||
cpshow.value = false
|
cpshow.value = false
|
||||||
formdata.plateNum = v.value[0].plateNum
|
formdata.plateNum = v.value[0].plateNum
|
||||||
|
hdzcolumns.value.splice(0)
|
||||||
|
formdata.stationCode = ''
|
||||||
|
formdata.stationName = ''
|
||||||
//获取换电站
|
//获取换电站
|
||||||
gethdz({
|
gethdz({
|
||||||
plateNum:formdata.plateNum
|
plateNum:formdata.plateNum
|
||||||
|
//code:hdzcode
|
||||||
}).then((rps:any) => {
|
}).then((rps:any) => {
|
||||||
ishdz.value = true
|
ishdz.value = true
|
||||||
let arr:any[] = rps.data.map((n:any,i:any) => {
|
let arr:any[] = rps.data.map((n:any,i:any) => {
|
||||||
@ -313,7 +491,6 @@
|
|||||||
icon:'none'
|
icon:'none'
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function hdzconfirm(v:any) {
|
function hdzconfirm(v:any) {
|
||||||
@ -339,20 +516,7 @@
|
|||||||
function timehand() {
|
function timehand() {
|
||||||
timeshow.value = true
|
timeshow.value = true
|
||||||
}
|
}
|
||||||
const timecolumns = ref([
|
|
||||||
[
|
|
||||||
'8:00 - 9:00',
|
|
||||||
'9:00 - 10:00',
|
|
||||||
'10:00 - 11:00',
|
|
||||||
'11:00 - 12:00',
|
|
||||||
'12:00 - 13:00',
|
|
||||||
'13:00 - 14:00',
|
|
||||||
'14:00 - 15:00',
|
|
||||||
'15:00 - 16:00',
|
|
||||||
'16:00 - 17:00',
|
|
||||||
'17:00 - 18:00'
|
|
||||||
]
|
|
||||||
])
|
|
||||||
function timeconfirm(v:any) {
|
function timeconfirm(v:any) {
|
||||||
formdata.swapDuration = v.value[0]
|
formdata.swapDuration = v.value[0]
|
||||||
timeshow.value = false
|
timeshow.value = false
|
||||||
@ -368,7 +532,10 @@
|
|||||||
}
|
}
|
||||||
function dateconfirm(v:any) {
|
function dateconfirm(v:any) {
|
||||||
formdata.swapDay = v[0]
|
formdata.swapDay = v[0]
|
||||||
|
|
||||||
dateshow.value = false
|
dateshow.value = false
|
||||||
|
formdata.swapDuration = ''
|
||||||
|
settime()
|
||||||
}
|
}
|
||||||
|
|
||||||
function dateclose() {
|
function dateclose() {
|
||||||
|
|||||||
@ -9,11 +9,18 @@
|
|||||||
/>
|
/>
|
||||||
<view class="content">
|
<view class="content">
|
||||||
<view id="mancont" class="jiner">
|
<view id="mancont" class="jiner">
|
||||||
<view class="num">
|
<view style="display: flex;">
|
||||||
<view>余额</view>
|
<view class="num">
|
||||||
<view><text style="font-size: 50rpx;">{{totalAmount/100}}</text> 元</view>
|
<view>余额</view>
|
||||||
|
<view><text style="font-size: 50rpx;">{{totalAmount/100}}</text> 元</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="ctbn" @tap="topage('/minePages/recharge/index')">充值</view>
|
<view style="display: flex;">
|
||||||
|
<view @tap="zchand" class="ctbn" style="margin-right: 20rpx;border: 1px solid #fff;color: #fff;background:none;">转出</view>
|
||||||
|
<view class="ctbn" @tap="topage('/minePages/recharge/index')">充值</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="mingxi">
|
<view class="mingxi">
|
||||||
<view class="tit">余额明细</view>
|
<view class="tit">余额明细</view>
|
||||||
@ -23,14 +30,13 @@
|
|||||||
<view>
|
<view>
|
||||||
<view v-if="n.tradeType == 1" style="padding-bottom: 8rpx;font-size: 40rpx;color: #00aa00;">充值</view>
|
<view v-if="n.tradeType == 1" style="padding-bottom: 8rpx;font-size: 40rpx;color: #00aa00;">充值</view>
|
||||||
<view v-else-if="n.tradeType == 2" style="padding-bottom: 8rpx;font-size: 40rpx;color: #191919;">支付</view>
|
<view v-else-if="n.tradeType == 2" style="padding-bottom: 8rpx;font-size: 40rpx;color: #191919;">支付</view>
|
||||||
<view v-else-if="n.tradeType == 9" style="padding-bottom: 8rpx;font-size: 40rpx;color: #c79a11;">提现</view>
|
<view v-else-if="n.tradeType == 9" style="padding-bottom: 8rpx;font-size: 40rpx;color: #c79a11;">转出</view>
|
||||||
<view style="font-size: 30rpx;color: #ccc;">{{n.ctime}}</view>
|
<view style="font-size: 30rpx;color: #ccc;">{{n.ctime}}</view>
|
||||||
</view>
|
</view>
|
||||||
<view style="text-align: right;">
|
<view style="text-align: right;">
|
||||||
<view v-if="n.tradeType == 1" style="padding-bottom: 8rpx;font-size: 40rpx;color: #00aa00;">+<text>{{n.tradeTotalAmount/100}}</text></view>
|
<view v-if="n.tradeType == 1" style="padding-bottom: 8rpx;font-size: 40rpx;color: #00aa00;">+<text>{{n.tradeTotalAmount/100}}</text></view>
|
||||||
<view v-else-if="n.tradeType == 2" style="padding-bottom: 8rpx;font-size: 40rpx;color: #191919;"><text>{{n.tradeTotalAmount/100}}</text></view>
|
<view v-else-if="n.tradeType == 2" style="padding-bottom: 8rpx;font-size: 40rpx;color: #191919;"><text>{{n.tradeTotalAmount/100}}</text></view>
|
||||||
<view v-else-if="n.tradeType == 9" style="padding-bottom: 8rpx;font-size: 40rpx;color: #c79a11;">-<text>{{n.tradeTotalAmount/100}}</text></view>
|
<view v-else-if="n.tradeType == 9" style="padding-bottom: 8rpx;font-size: 40rpx;color: #c79a11;">-<text>{{n.tradeTotalAmount/100}}</text></view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- <view style="font-size: 30rpx;color: #ccc;">实际到账金额：100元</view> -->
|
<!-- <view style="font-size: 30rpx;color: #ccc;">实际到账金额：100元</view> -->
|
||||||
@ -48,6 +54,41 @@
|
|||||||
</view> -->
|
</view> -->
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<up-popup
|
||||||
|
:show="zcshow"
|
||||||
|
mode="center"
|
||||||
|
round="10"
|
||||||
|
closeable
|
||||||
|
@close="close"
|
||||||
|
>
|
||||||
|
<view style="width: 70vw;padding: 100rpx 30rpx 0;">
|
||||||
|
<view style="padding-bottom: 30rpx;text-align: center;">
|
||||||
|
可转出<text style="padding: 0 10rpx;font-size: 50rpx;color: #ffaa7f;">{{totalAmount/100}}</text>元
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;align-items: center;justify-content: center;">
|
||||||
|
<view style="width: 420rpx;">
|
||||||
|
<up-input
|
||||||
|
type="number"
|
||||||
|
maxlength="10"
|
||||||
|
v-model="zcjiner"
|
||||||
|
@focus="focus"
|
||||||
|
placeholder="请输入金额" clearable
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view style="width: 200rpx;color: #c79a11;text-align: right;">全部转出</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view style="box-sizing: border-box;height: 100rpx;padding-top: 5rpx;font-size: 28rpx;color: #f00;">
|
||||||
|
<view v-if="errtip">请输入金额</view>
|
||||||
|
</view>
|
||||||
|
<view style="padding:30rpx;">
|
||||||
|
<up-button type="success" @tap="zdysave">确认转出</up-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</up-popup>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -114,6 +155,7 @@
|
|||||||
})
|
})
|
||||||
status.value = 'nomore'
|
status.value = 'nomore'
|
||||||
list.value.splice(0)
|
list.value.splice(0)
|
||||||
|
isempty.value = false
|
||||||
getylist()
|
getylist()
|
||||||
})
|
})
|
||||||
|
|
||||||
@ -128,6 +170,27 @@
|
|||||||
url
|
url
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//余额转出
|
||||||
|
let zcshow = ref(false)
|
||||||
|
let zcjiner = ref('') //转出金额
|
||||||
|
let errtip = ref(false)
|
||||||
|
|
||||||
|
function zchand() {
|
||||||
|
zcshow.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
function close() {
|
||||||
|
zcshow.value = false
|
||||||
|
}
|
||||||
|
|
||||||
|
function focus() {
|
||||||
|
errtip.value = false
|
||||||
|
}
|
||||||
|
//确认转出
|
||||||
|
function zdysave() {
|
||||||
|
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@ -147,9 +210,13 @@
|
|||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
.ctbn{
|
.ctbn{
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: flex;
|
||||||
width: 120rpx;
|
width: 120rpx;
|
||||||
height: 60rpx;
|
height: 60rpx;
|
||||||
line-height: 60rpx;
|
// line-height: 60rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #00aa00;
|
color: #00aa00;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
|||||||
@ -53,12 +53,12 @@
|
|||||||
<view v-if="n.status == 6" class="qxyy" @tap="topay(`/minePages/payment/index?orderNo=${n.orderNo}&amount=${n.amount}&plateNum=${n.plateNum}&stationName=${n.stationName}`)">去支付</view>
|
<view v-if="n.status == 6" class="qxyy" @tap="topay(`/minePages/payment/index?orderNo=${n.orderNo}&amount=${n.amount}&plateNum=${n.plateNum}&stationName=${n.stationName}`)">去支付</view>
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
</view> -->
|
||||||
<parent :actv="0">
|
<parent :actv="actindex">
|
||||||
<item v-for="(n,index) in list" :key="n.orderNo" :n="n" :index="index" />
|
<item v-for="(n,index) in list" :key="n.orderNo" :n="n" :index="index" />
|
||||||
</parent>
|
</parent>
|
||||||
|
|
||||||
<up-empty v-if="isempty" mode="list" text="暂无订单" />
|
<up-empty v-if="isempty" mode="list" text="暂无订单" />
|
||||||
<up-loadmore v-else :status="status" color="#c0c4cc" lineColor="#c0c4cc" />
|
<up-loadmore v-else :status="status" color="#c0c4cc" lineColor="#c0c4cc" />
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<up-popup
|
<up-popup
|
||||||
:show="show"
|
:show="show"
|
||||||
@ -80,6 +80,8 @@
|
|||||||
import { orderlist,dzbzxq } from '@/utils/service'
|
import { orderlist,dzbzxq } from '@/utils/service'
|
||||||
import { onShow,onReachBottom } from '@dcloudio/uni-app'
|
import { onShow,onReachBottom } from '@dcloudio/uni-app'
|
||||||
|
|
||||||
|
import { abort } from '@/utils/request'
|
||||||
|
|
||||||
import Parent from './parcont.vue'
|
import Parent from './parcont.vue'
|
||||||
import Item from './item.vue'
|
import Item from './item.vue'
|
||||||
|
|
||||||
@ -134,12 +136,17 @@
|
|||||||
let pageNo = ref(1)
|
let pageNo = ref(1)
|
||||||
let stanum = ref('')
|
let stanum = ref('')
|
||||||
let isempty = ref(false)
|
let isempty = ref(false)
|
||||||
|
|
||||||
|
let actindex = ref(0)
|
||||||
//点击tabs
|
//点击tabs
|
||||||
function tabshand(n:any){
|
function tabshand(n:any){
|
||||||
|
abort()
|
||||||
pageNo.value = 1
|
pageNo.value = 1
|
||||||
list.value.splice(0)
|
list.value.splice(0)
|
||||||
stanum.value = n.status
|
stanum.value = n.status
|
||||||
isempty.value = false
|
isempty.value = false
|
||||||
|
|
||||||
|
actindex.value = 0
|
||||||
getlist()
|
getlist()
|
||||||
}
|
}
|
||||||
function getlist() {
|
function getlist() {
|
||||||
|
|||||||
@ -33,7 +33,8 @@
|
|||||||
<view v-if="isactv" style="display: block;margin-top: 15rpx;padding-top: 30rpx;border-top: 1px dashed #009688;">
|
<view v-if="isactv" style="display: block;margin-top: 15rpx;padding-top: 30rpx;border-top: 1px dashed #009688;">
|
||||||
<!--v-if="bzlist.length == 2"-->
|
<!--v-if="bzlist.length == 2"-->
|
||||||
<!--border: 1px solid #009688;border-radius: 10rpx;-->
|
<!--border: 1px solid #009688;border-radius: 10rpx;-->
|
||||||
<view style="display:flex;margin-bottom:20px;align-items: center;justify-content: space-between;">
|
<!--v-if="bzlist.length == 2"-->
|
||||||
|
<view v-if="bzlist.length == 2 && !hdorderNo" style="display:flex;margin-bottom:20px;align-items: center;justify-content: space-between;">
|
||||||
<view style="display:flex;align-items: center;color:#009688;">
|
<view style="display:flex;align-items: center;color:#009688;">
|
||||||
<view style="padding-right: 5rpx;">车辆已到达指定位置</view>
|
<view style="padding-right: 5rpx;">车辆已到达指定位置</view>
|
||||||
<up-icon name="checkmark" color="#009688" size="20" />
|
<up-icon name="checkmark" color="#009688" size="20" />
|
||||||
@ -51,6 +52,8 @@
|
|||||||
<up-loading-icon v-if="loading" />
|
<up-loading-icon v-if="loading" />
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<!---->
|
||||||
<view v-if="n.status == 6" class="qxyy" @tap="topay(`/minePages/payment/index?orderNo=${n.orderNo}&amount=${n.amount}&plateNum=${n.plateNum}&stationName=${n.stationName}`)">去支付</view>
|
<view v-if="n.status == 6" class="qxyy" @tap="topay(`/minePages/payment/index?orderNo=${n.orderNo}&amount=${n.amount}&plateNum=${n.plateNum}&stationName=${n.stationName}`)">去支付</view>
|
||||||
|
|
||||||
<up-popup
|
<up-popup
|
||||||
@ -59,7 +62,7 @@
|
|||||||
round="10"
|
round="10"
|
||||||
:closeOnClickOverlay="true"
|
:closeOnClickOverlay="true"
|
||||||
>
|
>
|
||||||
<view style="box-sizing: border-box;position: relative;;width: 640rpx;">
|
<view style="box-sizing: border-box;padding-bottom:50rpx;position: relative;;width: 640rpx;">
|
||||||
<view style="padding: 50rpx 20rpx 150rpx;text-align: center;">
|
<view style="padding: 50rpx 20rpx 150rpx;text-align: center;">
|
||||||
<view style="font-size:38rpx;">确认方向盘是否回正</view>
|
<view style="font-size:38rpx;">确认方向盘是否回正</view>
|
||||||
<view style="padding-top: 10rpx;color: #f00;">方向盘未回正可能会对车辆造成损伤!</view>
|
<view style="padding-top: 10rpx;color: #f00;">方向盘未回正可能会对车辆造成损伤!</view>
|
||||||
@ -74,7 +77,7 @@
|
|||||||
round="10"
|
round="10"
|
||||||
:closeOnClickOverlay="true"
|
:closeOnClickOverlay="true"
|
||||||
>
|
>
|
||||||
<view style="box-sizing: border-box;position: relative;;width: 640rpx;">
|
<view style="box-sizing: border-box;padding-bottom:50rpx;position: relative;;width: 640rpx;">
|
||||||
<view style="padding: 50rpx 20rpx 150rpx;text-align: center;">
|
<view style="padding: 50rpx 20rpx 150rpx;text-align: center;">
|
||||||
<view style="font-size:38rpx;">确认手刹是否放开</view>
|
<view style="font-size:38rpx;">确认手刹是否放开</view>
|
||||||
<view style="padding-top: 10rpx;color: #f00;">手刹未放开可能会对车辆造成损伤!</view>
|
<view style="padding-top: 10rpx;color: #f00;">手刹未放开可能会对车辆造成损伤!</view>
|
||||||
@ -82,12 +85,41 @@
|
|||||||
<view style="width: 50%;margin: 0 auto;text-align: center;height: 80rpx;line-height: 80rpx;background: #009688;border-radius:20rpx;color: #fff;" @tap="huandhand">确认手刹已放开</view>
|
<view style="width: 50%;margin: 0 auto;text-align: center;height: 80rpx;line-height: 80rpx;background: #009688;border-radius:20rpx;color: #fff;" @tap="huandhand">确认手刹已放开</view>
|
||||||
</view>
|
</view>
|
||||||
</up-popup>
|
</up-popup>
|
||||||
|
|
||||||
|
<up-popup
|
||||||
|
:show="false"
|
||||||
|
:closeOnClickOverlay="true"
|
||||||
|
mode="center"
|
||||||
|
round="10"
|
||||||
|
>
|
||||||
|
<view style="box-sizing: border-box;padding-bottom:50rpx;position: relative;;width: 640rpx;">
|
||||||
|
<view style="padding: 50rpx 20rpx 150rpx;text-align: center;">
|
||||||
|
<!-- <up-loading-icon size="100" vertical color="#009688" text="正在启动中" /> -->
|
||||||
|
<!-- <view style="font-size:38rpx;">换电启动失败，请重新启动</view> -->
|
||||||
|
|
||||||
|
<!-- <view style="font-size:38rpx;"></view> -->
|
||||||
|
</view>
|
||||||
|
<!-- <view style="width: 50%;margin: 0 auto;text-align: center;height: 80rpx;line-height: 80rpx;background: #009688;border-radius:20rpx;color: #fff;" @tap="huandhand">重新启动</view> -->
|
||||||
|
</view>
|
||||||
|
</up-popup>
|
||||||
|
|
||||||
|
<!-- <zero-loading
|
||||||
|
v-if="hdmgsPop"
|
||||||
|
type="gear"
|
||||||
|
:mask="true"
|
||||||
|
:showText="true"
|
||||||
|
:maskOpacity="0.7"
|
||||||
|
text="正在启动中..."
|
||||||
|
textGap="5rpx"
|
||||||
|
textColor="#dedede"
|
||||||
|
/> -->
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref,inject,computed } from 'vue'
|
import { ref,inject,computed } from 'vue'
|
||||||
import { dzbzxq } from '@/utils/service'
|
import { onUnload } from '@dcloudio/uni-app'
|
||||||
|
import { dzbzxq,starthz,gethzmsg } from '@/utils/service'
|
||||||
const props = withDefaults(defineProps<{
|
const props = withDefaults(defineProps<{
|
||||||
n:any
|
n:any
|
||||||
index:string|number
|
index:string|number
|
||||||
@ -98,7 +130,9 @@
|
|||||||
|
|
||||||
const { actv, setActv } = inject<any>('parc')
|
const { actv, setActv } = inject<any>('parc')
|
||||||
|
|
||||||
const isactv = computed(() => actv.value === props.index)
|
const isactv = computed(() => {
|
||||||
|
return actv.value === props.index
|
||||||
|
})
|
||||||
|
|
||||||
function toghand() {
|
function toghand() {
|
||||||
if(!isactv.value){
|
if(!isactv.value){
|
||||||
@ -127,8 +161,10 @@
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let hdorderNo = ref('')
|
||||||
if(isactv.value){
|
if(isactv.value){
|
||||||
getbz(props.n.orderNo)
|
getbz(props.n.orderNo)
|
||||||
|
hdorderNo.value = uni.getStorageSync('orderNo')
|
||||||
}
|
}
|
||||||
|
|
||||||
function hdbzname(n:string|number) {
|
function hdbzname(n:string|number) {
|
||||||
@ -173,19 +209,61 @@
|
|||||||
let showPop = ref(false) //方向盘
|
let showPop = ref(false) //方向盘
|
||||||
let showsxpop = ref(false) //手刹
|
let showsxpop = ref(false) //手刹
|
||||||
|
|
||||||
|
let hdmgsPop = ref(false) //启动
|
||||||
|
|
||||||
function showsxhand(){
|
function showsxhand(){
|
||||||
showPop.value = false
|
showPop.value = false
|
||||||
showsxpop.value = true
|
showsxpop.value = true
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let hdtimer:any = null
|
||||||
|
|
||||||
//确认换电
|
//确认换电
|
||||||
function huandhand() {
|
function huandhand() {
|
||||||
showsxpop.value = false
|
showsxpop.value = false
|
||||||
uni.showToast({
|
|
||||||
title: '操作成功',
|
hdmgsPop.value = true
|
||||||
duration: 2000
|
if(hdtimer){
|
||||||
|
clearInterval(hdtimer)
|
||||||
|
}
|
||||||
|
|
||||||
|
//开始换电
|
||||||
|
starthz(uni.getStorageSync('wxuid'),props.n.orderNo).then(() => {
|
||||||
|
uni.showToast({
|
||||||
|
title: '操作成功',
|
||||||
|
duration: 2000
|
||||||
|
})
|
||||||
|
if(isactv.value){
|
||||||
|
setTimeout(() => {
|
||||||
|
getbz(props.n.orderNo)
|
||||||
|
},2000)
|
||||||
|
}
|
||||||
|
uni.setStorageSync('orderNo',props.n.orderNo)
|
||||||
|
//是否启动成功
|
||||||
|
// hdtimer = setInterval(()=>{
|
||||||
|
// gethzmsg(uni.getStorageSync('wxuid'),props.n.orderNo).then((rps:any) => {
|
||||||
|
// if(rps.data == 1) {
|
||||||
|
|
||||||
|
// }
|
||||||
|
// console.log(rps,'换电')
|
||||||
|
// })
|
||||||
|
// },1000)
|
||||||
|
}).catch(() => {
|
||||||
|
// hdtimer = setInterval(()=>{
|
||||||
|
// gethzmsg(uni.getStorageSync('wxuid'),props.n.orderNo).then((rps:any) => {
|
||||||
|
// console.log(rps,'换电')
|
||||||
|
// })
|
||||||
|
// },1000)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
onUnload(() => {
|
||||||
|
if(hdtimer){
|
||||||
|
clearInterval(hdtimer)
|
||||||
|
}
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
308
src/minePages/order/item2.vue
Normal file
308
src/minePages/order/item2.vue
Normal file
@ -0,0 +1,308 @@
|
|||||||
|
<template>
|
||||||
|
<view :key="n.orderNo" class="list">
|
||||||
|
<view class="zoddu">
|
||||||
|
<view>
|
||||||
|
<view>订单号</view>
|
||||||
|
<view style="font-size: 28rpx;">{{n.orderNo}}</view>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<view>车牌号</view>
|
||||||
|
<view>{{n.plateNum}}</view>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<view>换电站</view>
|
||||||
|
<view>{{n.stationName}}</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="n.status == 6 || n.status == 7">
|
||||||
|
<view>订单金额</view>
|
||||||
|
<view>{{n.amount/100}}元</view>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<view>订单状态</view>
|
||||||
|
<view>{{statev[n.status]}}</view>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<view style="color: #5f5f5f;">{{n.orderTime}}</view>
|
||||||
|
<!-- <view style="color: #009688;" @tap="getbz(n.orderNo)">查看换电详情</view> -->
|
||||||
|
<view style="display: flex;align-items:center;color: #009688;" @tap="toghand">
|
||||||
|
<view style="padding-right: 10rpx;">查看换电步骤</view>
|
||||||
|
<up-icon v-if="isactv" name="arrow-up" color="#009688" size="16" />
|
||||||
|
<up-icon v-else name="arrow-down" color="#009688" size="16" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="isactv" style="display: block;margin-top: 15rpx;padding-top: 30rpx;border-top: 1px dashed #009688;">
|
||||||
|
<!--v-if="bzlist.length == 2"-->
|
||||||
|
<!--border: 1px solid #009688;border-radius: 10rpx;-->
|
||||||
|
<!--v-if="bzlist.length == 2 && !hdorderNo"-->
|
||||||
|
<view style="display:flex;margin-bottom:20px;align-items: center;justify-content: space-between;">
|
||||||
|
<view style="display:flex;align-items: center;color:#009688;">
|
||||||
|
<view style="padding-right: 5rpx;">车辆已到达指定位置</view>
|
||||||
|
<up-icon name="checkmark" color="#009688" size="20" />
|
||||||
|
</view>
|
||||||
|
<view style="width: 160rpx;height: 70rpx;line-height: 70rpx;border:1px solid #009688;border-radius:10rpx;text-align: center;color:#009688;" @tap="showPop = true">确认换电</view>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<up-steps v-if="bzlist.length > 0" :current="bzlist.length" direction="column" activeColor="#009688">
|
||||||
|
<up-steps-item v-for="n in bzlist" :title="hdbzname(n.step)" :desc="n.stepTime" :key="n.step" />
|
||||||
|
</up-steps>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<up-empty v-if="isempty" mode="list" text="暂无换电记录" />
|
||||||
|
<up-loading-icon v-if="loading" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!---->
|
||||||
|
<view v-if="n.status == 6" class="qxyy" @tap="topay(`/minePages/payment/index?orderNo=${n.orderNo}&amount=${n.amount}&plateNum=${n.plateNum}&stationName=${n.stationName}`)">去支付</view>
|
||||||
|
|
||||||
|
<up-popup
|
||||||
|
:show="showPop"
|
||||||
|
mode="center"
|
||||||
|
round="10"
|
||||||
|
:closeOnClickOverlay="true"
|
||||||
|
>
|
||||||
|
<view style="box-sizing: border-box;padding-bottom:50rpx;position: relative;;width: 640rpx;">
|
||||||
|
<view style="padding: 50rpx 20rpx 150rpx;text-align: center;">
|
||||||
|
<view style="font-size:38rpx;">确认方向盘是否回正</view>
|
||||||
|
<view style="padding-top: 10rpx;color: #f00;">方向盘未回正可能会对车辆造成损伤!</view>
|
||||||
|
</view>
|
||||||
|
<view style="width: 50%;margin: 0 auto;text-align: center;height: 80rpx;line-height: 80rpx;background: #009688;border-radius:20rpx;color: #fff;" @tap="showsxhand">确认方向盘已回正</view>
|
||||||
|
</view>
|
||||||
|
</up-popup>
|
||||||
|
|
||||||
|
<up-popup
|
||||||
|
:show="showsxpop"
|
||||||
|
mode="center"
|
||||||
|
round="10"
|
||||||
|
:closeOnClickOverlay="true"
|
||||||
|
>
|
||||||
|
<view style="box-sizing: border-box;padding-bottom:50rpx;position: relative;;width: 640rpx;">
|
||||||
|
<view style="padding: 50rpx 20rpx 150rpx;text-align: center;">
|
||||||
|
<view style="font-size:38rpx;">确认手刹是否放开</view>
|
||||||
|
<view style="padding-top: 10rpx;color: #f00;">手刹未放开可能会对车辆造成损伤!</view>
|
||||||
|
</view>
|
||||||
|
<view style="width: 50%;margin: 0 auto;text-align: center;height: 80rpx;line-height: 80rpx;background: #009688;border-radius:20rpx;color: #fff;" @tap="huandhand">确认手刹已放开</view>
|
||||||
|
</view>
|
||||||
|
</up-popup>
|
||||||
|
|
||||||
|
<up-popup
|
||||||
|
:show="false"
|
||||||
|
:closeOnClickOverlay="true"
|
||||||
|
mode="center"
|
||||||
|
round="10"
|
||||||
|
>
|
||||||
|
<view style="box-sizing: border-box;padding-bottom:50rpx;position: relative;;width: 640rpx;">
|
||||||
|
<view style="padding: 50rpx 20rpx 150rpx;text-align: center;">
|
||||||
|
<!-- <up-loading-icon size="100" vertical color="#009688" text="正在启动中" /> -->
|
||||||
|
<!-- <view style="font-size:38rpx;">换电启动失败，请重新启动</view> -->
|
||||||
|
|
||||||
|
<!-- <view style="font-size:38rpx;"></view> -->
|
||||||
|
</view>
|
||||||
|
<!-- <view style="width: 50%;margin: 0 auto;text-align: center;height: 80rpx;line-height: 80rpx;background: #009688;border-radius:20rpx;color: #fff;" @tap="huandhand">重新启动</view> -->
|
||||||
|
</view>
|
||||||
|
</up-popup>
|
||||||
|
|
||||||
|
<zero-loading
|
||||||
|
v-if="hdmgsPop"
|
||||||
|
type="gear"
|
||||||
|
:mask="true"
|
||||||
|
:showText="true"
|
||||||
|
:maskOpacity="0.7"
|
||||||
|
text="正在启动中..."
|
||||||
|
textGap="5rpx"
|
||||||
|
textColor="#dedede"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref,inject,computed } from 'vue'
|
||||||
|
import { onUnload } from '@dcloudio/uni-app'
|
||||||
|
import { dzbzxq,starthz,gethzmsg } from '@/utils/service'
|
||||||
|
const props = withDefaults(defineProps<{
|
||||||
|
n:any
|
||||||
|
index:string|number
|
||||||
|
}>(), {
|
||||||
|
n:{},
|
||||||
|
index:0
|
||||||
|
})
|
||||||
|
|
||||||
|
const { actv, setActv } = inject<any>('parc')
|
||||||
|
|
||||||
|
const isactv = computed(() => {
|
||||||
|
return actv.value === props.index
|
||||||
|
})
|
||||||
|
|
||||||
|
function toghand() {
|
||||||
|
if(!isactv.value){
|
||||||
|
getbz(props.n.orderNo)
|
||||||
|
}
|
||||||
|
setActv(props.index)
|
||||||
|
}
|
||||||
|
|
||||||
|
//查看换电步骤
|
||||||
|
let bzlist = ref<any[]>([])
|
||||||
|
let isempty = ref(false)
|
||||||
|
let loading = ref(true)
|
||||||
|
function getbz(orderNo:any) {
|
||||||
|
bzlist.value.splice(0)
|
||||||
|
isempty.value = false
|
||||||
|
dzbzxq(orderNo).then((rps:any) => {
|
||||||
|
loading.value = false
|
||||||
|
if(rps.data && rps.data.length > 0){
|
||||||
|
bzlist.value = rps.data
|
||||||
|
}else{
|
||||||
|
isempty.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
}).catch(() => {
|
||||||
|
loading.value = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
let hdorderNo = ref('')
|
||||||
|
if(isactv.value){
|
||||||
|
getbz(props.n.orderNo)
|
||||||
|
hdorderNo.value = uni.getStorageSync('orderNo')
|
||||||
|
}
|
||||||
|
|
||||||
|
function hdbzname(n:string|number) {
|
||||||
|
if(n == 1){
|
||||||
|
return '车辆进站'
|
||||||
|
}else if(n == 2){
|
||||||
|
return '车辆到达指定位置'
|
||||||
|
}else if(n == 3){
|
||||||
|
return '启动对中机构'
|
||||||
|
}else if(n == 4){
|
||||||
|
return '取新电池'
|
||||||
|
}else if(n == 5){
|
||||||
|
return '拆旧电池'
|
||||||
|
}else if(n == 6){
|
||||||
|
return '装新电池'
|
||||||
|
}else if(n == 7){
|
||||||
|
return '放旧电池'
|
||||||
|
}else if(n == 8){
|
||||||
|
return '换电完成'
|
||||||
|
}
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
|
||||||
|
const statev =ref({
|
||||||
|
1:'已创建',
|
||||||
|
2:'换电中',
|
||||||
|
3:'换电完成',
|
||||||
|
4:'充电中',
|
||||||
|
5:'充电完成',
|
||||||
|
6:'待支付',
|
||||||
|
7:'已完成',
|
||||||
|
9:'已取消'
|
||||||
|
})
|
||||||
|
|
||||||
|
function topay(url:string) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
//确定换电提示
|
||||||
|
let showPop = ref(false) //方向盘
|
||||||
|
let showsxpop = ref(false) //手刹
|
||||||
|
|
||||||
|
let hdmgsPop = ref(false) //启动
|
||||||
|
|
||||||
|
function showsxhand(){
|
||||||
|
showPop.value = false
|
||||||
|
showsxpop.value = true
|
||||||
|
}
|
||||||
|
|
||||||
|
let hdtimer:any = null
|
||||||
|
|
||||||
|
//确认换电
|
||||||
|
function huandhand() {
|
||||||
|
showsxpop.value = false
|
||||||
|
|
||||||
|
hdmgsPop.value = true
|
||||||
|
if(hdtimer){
|
||||||
|
clearInterval(hdtimer)
|
||||||
|
}
|
||||||
|
|
||||||
|
//开始换电
|
||||||
|
starthz(uni.getStorageSync('wxuid'),props.n.orderNo).then(() => {
|
||||||
|
|
||||||
|
uni.setStorageSync('orderNo',props.n.orderNo)
|
||||||
|
|
||||||
|
//获取是否启动成功
|
||||||
|
hdtimer = setInterval(()=>{
|
||||||
|
gethzmsg(uni.getStorageSync('wxuid'),props.n.orderNo).then((rps:any) => {
|
||||||
|
if(rps.data == 1) {
|
||||||
|
if(hdtimer){
|
||||||
|
clearInterval(hdtimer)
|
||||||
|
}
|
||||||
|
|
||||||
|
hdmgsPop.value = false
|
||||||
|
uni.showToast({
|
||||||
|
title: '启动成功',
|
||||||
|
duration: 2000
|
||||||
|
})
|
||||||
|
if(isactv.value){
|
||||||
|
setTimeout(() => {
|
||||||
|
getbz(props.n.orderNo)
|
||||||
|
},2000)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log(rps,'换电')
|
||||||
|
})
|
||||||
|
},1000)
|
||||||
|
}).catch(() => {
|
||||||
|
// hdtimer = setInterval(()=>{
|
||||||
|
// gethzmsg(uni.getStorageSync('wxuid'),props.n.orderNo).then((rps:any) => {
|
||||||
|
// console.log(rps,'换电')
|
||||||
|
// })
|
||||||
|
// },1000)
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
onUnload(() => {
|
||||||
|
if(hdtimer){
|
||||||
|
clearInterval(hdtimer)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.list{
|
||||||
|
margin:0 25rpx 40rpx;
|
||||||
|
//padding: 25rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
box-shadow: 0 0 10px 2px rgba(190, 190, 190, 0.5);
|
||||||
|
background: #fff;
|
||||||
|
.zoddu{
|
||||||
|
padding: 25rpx;
|
||||||
|
//margin-bottom: 30rpx;
|
||||||
|
//padding-top: 20rpx;
|
||||||
|
//border-top: 1px dashed #ccc;
|
||||||
|
>view{
|
||||||
|
display: flex;
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
justify-content: space-between;
|
||||||
|
>view:last-child{
|
||||||
|
color: #7a7a7a;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>view:last-child{
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.qxyy{
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
border-radius: 0 0 20rpx 20rpx;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
background: #00aa00;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -19,7 +19,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<view>
|
<view>
|
||||||
<view>订单金额</view>
|
<view>订单金额</view>
|
||||||
<view>¥{{order.amount}}</view>
|
<view>¥{{order.amount/100}}</view>
|
||||||
</view>
|
</view>
|
||||||
<view>
|
<view>
|
||||||
<view>车牌号</view>
|
<view>车牌号</view>
|
||||||
|
|||||||
@ -12,7 +12,7 @@
|
|||||||
<view>付款金额</view>
|
<view>付款金额</view>
|
||||||
<view style="color: #ffaa00;">
|
<view style="color: #ffaa00;">
|
||||||
<text>¥ </text>
|
<text>¥ </text>
|
||||||
<text style="font-size: 50rpx;">{{payqs.total}}</text>
|
<text style="font-size: 50rpx;">{{payqs.total/100}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view style="padding: 40rpx 20rpx 20rpx;color: #959595;">选择支付方式</view>
|
<view style="padding: 40rpx 20rpx 20rpx;color: #959595;">选择支付方式</view>
|
||||||
@ -53,8 +53,9 @@
|
|||||||
payqs.goodsDetail[0].merchantGoodsId = opt.orderNo
|
payqs.goodsDetail[0].merchantGoodsId = opt.orderNo
|
||||||
payqs.goodsDetail[0].unitPrice = opt.amount*1
|
payqs.goodsDetail[0].unitPrice = opt.amount*1
|
||||||
|
|
||||||
payqs.description = `${opt.plateNum}在${opt.stationName}换电`
|
payqs.description = `${opt.plateNum}在${opt.stationName}换电` //??
|
||||||
payqs.attach.description = `${opt.plateNum}在${opt.stationName}换电`
|
payqs.attach.description = `${opt.plateNum}在${opt.stationName}换电` //??
|
||||||
|
|
||||||
// payqs.detail.costPrice = opt.amount
|
// payqs.detail.costPrice = opt.amount
|
||||||
// payqs.detail.goodsDetail.unitPrice = opt.amount
|
// payqs.detail.goodsDetail.unitPrice = opt.amount
|
||||||
|
|
||||||
@ -152,8 +153,9 @@
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
}else{
|
}else{
|
||||||
payqs.attach = JSON.stringify(payqs.attach)
|
//payqs.attach = JSON.stringify(payqs.attach)
|
||||||
payment(payqs).then((rps:any) => {
|
let objpay = Object.assign({},payqs,{attach:JSON.stringify(payqs.attach)})
|
||||||
|
payment(objpay).then((rps:any) => {
|
||||||
|
|
||||||
//#ifdef MP-WEIXIN
|
//#ifdef MP-WEIXIN
|
||||||
wx.requestPayment({
|
wx.requestPayment({
|
||||||
|
|||||||
@ -34,7 +34,7 @@
|
|||||||
<view style="width: 70vw;padding: 100rpx 50rpx 0;">
|
<view style="width: 70vw;padding: 100rpx 50rpx 0;">
|
||||||
<up-input
|
<up-input
|
||||||
type="number"
|
type="number"
|
||||||
maxlength="4"
|
maxlength="10"
|
||||||
v-model="zdyjr"
|
v-model="zdyjr"
|
||||||
@focus="focus"
|
@focus="focus"
|
||||||
placeholder="请输入金额" clearable
|
placeholder="请输入金额" clearable
|
||||||
@ -50,16 +50,19 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref,reactive } from 'vue'
|
import { ref,reactive,watch } from 'vue'
|
||||||
import { payment,getip,getInfo,getaccou,openaccou,isktbal } from '@/utils/service'
|
import { payment,getip,getInfo,getaccou,openaccou,isktbal } from '@/utils/service'
|
||||||
import { onLoad } from '@dcloudio/uni-app'
|
import { onLoad } from '@dcloudio/uni-app'
|
||||||
|
|
||||||
|
import { setNum } from '@/utils/commen'
|
||||||
|
|
||||||
// onLoad((opt:any) => {
|
// onLoad((opt:any) => {
|
||||||
// payqs.attach.walletCode = opt.walletCode
|
// payqs.attach.walletCode = opt.walletCode
|
||||||
// })
|
// })
|
||||||
|
|
||||||
isktbal(uni.getStorageSync('wxuid')).then((rps:any) => {
|
isktbal(uni.getStorageSync('wxuid')).then((rps:any) => {
|
||||||
if(!rps.data.records){
|
if(!rps.data){
|
||||||
|
|
||||||
//开通余额
|
//开通余额
|
||||||
openaccou(uni.getStorageSync('wxuid'))
|
openaccou(uni.getStorageSync('wxuid'))
|
||||||
}
|
}
|
||||||
@ -110,6 +113,11 @@
|
|||||||
//自定义
|
//自定义
|
||||||
let zdyjr = ref<any>('')
|
let zdyjr = ref<any>('')
|
||||||
let errtip = ref(false)
|
let errtip = ref(false)
|
||||||
|
|
||||||
|
// watch(() => zdyjr.value, v => {
|
||||||
|
// zdyjr.value = setNum(v)
|
||||||
|
// })
|
||||||
|
|
||||||
function zdysave() {
|
function zdysave() {
|
||||||
if(zdyjr.value == ''){
|
if(zdyjr.value == ''){
|
||||||
errtip.value = true
|
errtip.value = true
|
||||||
@ -164,9 +172,14 @@
|
|||||||
function payhand() {
|
function payhand() {
|
||||||
//'{"type":1,"trader":"cijiangbo","tradercode":"8d4638c713e9391baa60395385932fb3","walletCode":"YTWAP1863511124008374272NARVLW"}'
|
//'{"type":1,"trader":"cijiangbo","tradercode":"8d4638c713e9391baa60395385932fb3","walletCode":"YTWAP1863511124008374272NARVLW"}'
|
||||||
|
|
||||||
payqs.attach = JSON.stringify(payqs.attach)
|
//payqs.attach = JSON.stringify(payqs.attach)
|
||||||
payqs.total = payqs.total*100
|
//payqs.total = payqs.total*100
|
||||||
payment(payqs).then((rps:any) => {
|
|
||||||
|
let objpay = Object.assign({},payqs,{
|
||||||
|
attach:JSON.stringify(payqs.attach),
|
||||||
|
total:payqs.total*100
|
||||||
|
})
|
||||||
|
payment(objpay).then((rps:any) => {
|
||||||
|
|
||||||
//#ifdef MP-WEIXIN
|
//#ifdef MP-WEIXIN
|
||||||
wx.requestPayment({
|
wx.requestPayment({
|
||||||
|
|||||||
@ -53,6 +53,8 @@
|
|||||||
import { getyylist,cancelrese } from '@/utils/service'
|
import { getyylist,cancelrese } from '@/utils/service'
|
||||||
import { onShow,onReachBottom } from '@dcloudio/uni-app'
|
import { onShow,onReachBottom } from '@dcloudio/uni-app'
|
||||||
|
|
||||||
|
import { abort } from '@/utils/request'
|
||||||
|
|
||||||
onShow(() => {
|
onShow(() => {
|
||||||
pageNo.value = 1
|
pageNo.value = 1
|
||||||
list.value.splice(0)
|
list.value.splice(0)
|
||||||
@ -62,7 +64,7 @@
|
|||||||
|
|
||||||
//预约状态
|
//预约状态
|
||||||
const statelist = reactive([
|
const statelist = reactive([
|
||||||
{ name: '全部', status:'1'},
|
{ name: '全部', status:null},
|
||||||
{ name: '已使用', status:'2' },
|
{ name: '已使用', status:'2' },
|
||||||
{ name: '已取消', status:'3' },
|
{ name: '已取消', status:'3' },
|
||||||
{ name: '已过期', status:'4'}
|
{ name: '已过期', status:'4'}
|
||||||
@ -76,6 +78,7 @@
|
|||||||
let isempty = ref(false)
|
let isempty = ref(false)
|
||||||
//点击tabs
|
//点击tabs
|
||||||
function tabshand(n:any){
|
function tabshand(n:any){
|
||||||
|
abort()
|
||||||
pageNo.value = 1
|
pageNo.value = 1
|
||||||
list.value.splice(0)
|
list.value.splice(0)
|
||||||
stanum.value = n.status
|
stanum.value = n.status
|
||||||
@ -120,6 +123,9 @@
|
|||||||
duration: 2000
|
duration: 2000
|
||||||
})
|
})
|
||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
|
pageNo.value = 1
|
||||||
|
list.value.splice(0)
|
||||||
|
isempty.value = false
|
||||||
getlist()
|
getlist()
|
||||||
},2000)
|
},2000)
|
||||||
})
|
})
|
||||||
|
|||||||
118
src/minePages/reserlist/index1.vue
Normal file
118
src/minePages/reserlist/index1.vue
Normal file
@ -0,0 +1,118 @@
|
|||||||
|
<template>
|
||||||
|
<up-navbar
|
||||||
|
title="预约记录"
|
||||||
|
bgColor="#00aa7f"
|
||||||
|
:autoBack="true"
|
||||||
|
leftIconColor="#fff"
|
||||||
|
titleStyle="color:#fff"
|
||||||
|
:placeholder="true"
|
||||||
|
/>
|
||||||
|
<view class="content">
|
||||||
|
<view v-for="n in list" :key="n.pkId" class="list">
|
||||||
|
<view class="zoddu">
|
||||||
|
<view>
|
||||||
|
<view>换电站：</view>
|
||||||
|
<view>{{n.stationName}}</view>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<view>车牌号：</view>
|
||||||
|
<view>{{n.plateNum}}</view>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<view>手机号：</view>
|
||||||
|
<view>{{n.phone}}</view>
|
||||||
|
</view>
|
||||||
|
<view>
|
||||||
|
<view>预约时间：</view>
|
||||||
|
<view style="font-size: 30rpx;">{{ytime(n.swapDay,n.swapDuration)}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="n.status == 1" @tap="cancel(n.pkId)" class="qxyy" style="background: #00aa00;">取消预约</view>
|
||||||
|
<view v-else-if="n.status == 2" class="qxyy">已使用</view>
|
||||||
|
<view v-else-if="n.status == 3" class="qxyy">已取消</view>
|
||||||
|
<view v-else class="qxyy">已过期</view>
|
||||||
|
</view>
|
||||||
|
<up-empty v-if="list.length == 0" mode="list" text="暂无预约记录" />
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref } from 'vue'
|
||||||
|
import { getyylist,cancelrese } from '@/utils/service'
|
||||||
|
|
||||||
|
let list = ref<any[]>([])
|
||||||
|
getlist()
|
||||||
|
function getlist() {
|
||||||
|
getyylist({
|
||||||
|
ucode:uni.getStorageSync('wxuid')
|
||||||
|
// plateNum:'冀A12345D',
|
||||||
|
// status:'1',
|
||||||
|
// stationCode:'123456789'
|
||||||
|
}).then((rps:any) => {
|
||||||
|
list.value = rps.data.records
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function cancel(id:string) {
|
||||||
|
uni.showModal({
|
||||||
|
title: '温馨提示',
|
||||||
|
content: '确定取消?',
|
||||||
|
success(res){
|
||||||
|
if(res.confirm){
|
||||||
|
cancelrese(id).then(() => {
|
||||||
|
uni.showToast({
|
||||||
|
title: '取消成功',
|
||||||
|
duration: 2000
|
||||||
|
})
|
||||||
|
setTimeout(()=>{
|
||||||
|
getlist()
|
||||||
|
},2000)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
//预约时间
|
||||||
|
function ytime(n:string,v?:string){
|
||||||
|
return `${n.substring(0,4)}年${n.substring(4,6)}月${n.substring(6,8)}日 ${v?v:''}`
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.content{
|
||||||
|
padding: 25rpx;
|
||||||
|
.list{
|
||||||
|
margin-bottom: 40rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
box-shadow: 0 0 10px 2px rgba(190, 190, 190, 0.5);
|
||||||
|
background: #fff;
|
||||||
|
.zoddu{
|
||||||
|
padding: 25rpx;
|
||||||
|
//margin-bottom: 30rpx;
|
||||||
|
//padding-top: 20rpx;
|
||||||
|
//border-top: 1px dashed #ccc;
|
||||||
|
>view{
|
||||||
|
display: flex;
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
justify-content: space-between;
|
||||||
|
>view:last-child{
|
||||||
|
color: #7a7a7a;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>view:last-child{
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.qxyy{
|
||||||
|
height: 80rpx;
|
||||||
|
line-height: 80rpx;
|
||||||
|
border-radius: 0 0 20rpx 20rpx;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
background: #ccc;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -78,32 +78,33 @@
|
|||||||
"navigationStyle": "custom" //去除小程序顶部导航栏
|
"navigationStyle": "custom" //去除小程序顶部导航栏
|
||||||
},
|
},
|
||||||
"tabBar": {
|
"tabBar": {
|
||||||
//"custom":true,
|
//"custom":false
|
||||||
"color": "#404244",
|
"color": "#404244",
|
||||||
"selectedColor": "#00aa00",
|
"selectedColor": "#00aa00",
|
||||||
"borderStyle": "black",
|
"borderStyle": "black",
|
||||||
"backgroundColor": "#ffffff",
|
"backgroundColor": "#ffffff",
|
||||||
// "midButton":{ //小程序不支持
|
"midButton":{ //小程序不支持
|
||||||
// "width": "100px",
|
"width": "100px",
|
||||||
// "height": "80px",
|
"height": "80px",
|
||||||
// //"pagePath": "pages/scanCode/index",
|
//"pagePath": "pages/scanCode/index",
|
||||||
// "iconPath": "static/img/tabbar/saom.png",
|
"iconPath": "static/img/tabbar/saom.png",
|
||||||
// "backgroundImage":"static/img/tabbar/saom.png",
|
"backgroundImage":"static/img/tabbar/saom.png",
|
||||||
// //"selectedIconPath": "static/img/tabbar/saom.png",
|
//"selectedIconPath": "static/img/tabbar/saom.png",
|
||||||
// "text": "扫码换电"
|
"text": "扫码换电"
|
||||||
// },
|
},
|
||||||
"list": [{
|
"list": [
|
||||||
|
{
|
||||||
"pagePath": "pages/home/index",
|
"pagePath": "pages/home/index",
|
||||||
"iconPath": "static/img/tabbar/home.png",
|
"iconPath": "static/img/tabbar/home.png",
|
||||||
"selectedIconPath": "static/img/tabbar/home.png",
|
"ielectedIconPath": "static/img/tabbar/home.png",
|
||||||
"text": "首页"
|
"text": "首页"
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
"pagePath":"pages/scanCode/index",
|
// "pagePath":"pages/scanCode/index",
|
||||||
"iconPath": "static/img/tabbar/saom.png",
|
// "iconPath": "static/img/tabbar/saom.png",
|
||||||
"selectedIconPath": "static/img/tabbar/saom.png",
|
// "selectedIconPath": "static/img/tabbar/saom.png",
|
||||||
"text": "扫码换电"
|
// "text": "扫码换电"
|
||||||
},
|
// },
|
||||||
{
|
{
|
||||||
"pagePath": "pages/mine/index",
|
"pagePath": "pages/mine/index",
|
||||||
"iconPath": "static/img/tabbar/wode.png",
|
"iconPath": "static/img/tabbar/wode.png",
|
||||||
|
|||||||
@ -101,16 +101,20 @@
|
|||||||
</template> -->
|
</template> -->
|
||||||
</map>
|
</map>
|
||||||
<view v-if="showxq" class="dibucoten">
|
<view v-if="showxq" class="dibucoten">
|
||||||
<view style="margin-bottom: 10rpx;padding-bottom:10rpx;font-size: 38rpx;color: #00aa7f;border-bottom:1px #00aa7f dashed;">{{hdzname}}</view>
|
<view style="margin-bottom: 10rpx;padding-bottom:10rpx;font-size: 38rpx;color: #00aa7f;border-bottom:1px #00aa7f dashed;">{{maphdzname}}</view>
|
||||||
<view>营业时间：<text style="color: #5f5f5f;">8:30 - 17:30</text></view>
|
<view>营业时间：<text style="color: #5f5f5f;">8:30 - 17:30</text></view>
|
||||||
|
|
||||||
<view style="display: flex;justify-content: space-between;">
|
<view style="display: flex;justify-content: space-between;">
|
||||||
<view style="padding-top: 8rpx;">距您 <text style="color: #5f5f5f;">4.5km</text></view>
|
<view style="padding-top: 8rpx;">距您约 <text style="color: #5f5f5f;">{{getMapDistance(latitude,longitude,marketLat,marketLng)}}km</text></view>
|
||||||
<view @tap="getdh()" style="width: 150rpx;height: 60rpx;line-height: 60rpx;text-align: center;background: #00aa7f;color: #fff;border-radius: 10rpx;">导航</view>
|
<view style="display: flex;">
|
||||||
|
<view @tap="topage(`/homePages/reservation/index?hdzcode=${maphdzcode}&hdzname=${maphdzname}&phoneNumber=${userInfo.phoneNumber}`,true)" class="daohang" style="margin-right: 15rpx;background: #00aa00;">预约</view>
|
||||||
|
<view @tap="getdh()" class="daohang">导航</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view v-if="islogin" @tap="topage(`/homePages/reservation/index?hdzcode=${hdzcode}&phoneNumber=${userInfo.phoneNumber}`)" class="yuyue">预 约</view>
|
<view v-if="islogin" @tap="topage(`/homePages/reservation/index?hdzcode=${maphdzcode}&phoneNumber=${userInfo.phoneNumber}`,true)" class="yuyue">预 约</view>
|
||||||
<view v-else @tap="wdltip()" class="yuyue">预约</view>
|
<view v-else @tap="wdltip()" class="yuyue">预 约</view>
|
||||||
<!--xyshow-->
|
<!--xyshow-->
|
||||||
<up-popup
|
<up-popup
|
||||||
:show="xyshow"
|
:show="xyshow"
|
||||||
@ -120,12 +124,12 @@
|
|||||||
>
|
>
|
||||||
<view style="box-sizing: border-box;padding: 20rpx;background: #fff;">
|
<view style="box-sizing: border-box;padding: 20rpx;background: #fff;">
|
||||||
<view style="margin-bottom: 20rpx;padding-bottom:20rpx;font-size: 40rpx;text-align: center;color: #00aa7f;border-bottom: 1px #00aa7f dashed;">伊特换电使用协议</view>
|
<view style="margin-bottom: 20rpx;padding-bottom:20rpx;font-size: 40rpx;text-align: center;color: #00aa7f;border-bottom: 1px #00aa7f dashed;">伊特换电使用协议</view>
|
||||||
<view style="height: 600rpx;overflow-y: auto;">
|
<view>
|
||||||
<view style="padding: 25rpx 25rpx 50rpx;font-size: 26rpx;">
|
<view style="padding: 25rpx 25rpx 50rpx;font-size: 26rpx;">
|
||||||
<view style="padding-bottom: 30rpx;font-weight: bold;text-align: center;">{{xyobj.title}}</view>
|
<view style="padding-bottom: 30rpx;font-weight: bold;text-align: center;">{{xyobj.title}}</view>
|
||||||
|
|
||||||
<scroll-view scroll-y="true" style="height: 600rpx;">
|
<scroll-view scroll-y="true" style="height: 700rpx;">
|
||||||
<up-parse :content="decodeURIComponent(xyobj.content)"></up-parse>
|
<up-parse :content="decodeURIComponent(xyobj.content)"></up-parse>
|
||||||
</scroll-view>
|
</scroll-view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -140,11 +144,16 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</up-popup>
|
</up-popup>
|
||||||
|
<!-- <cc-myTabbar :tabBarShow="0"></cc-myTabbar> -->
|
||||||
|
<mytabbar :tabBarShow="0" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref,reactive,watch,getCurrentInstance } from 'vue'
|
import { ref,reactive,watch,getCurrentInstance } from 'vue'
|
||||||
import { onLoad,onShow,onTabItemTap } from '@dcloudio/uni-app'
|
import { onLoad,onShow,onTabItemTap } from '@dcloudio/uni-app'
|
||||||
|
|
||||||
|
import mytabbar from '@/components/mytabbar/mytabbar.vue'
|
||||||
|
|
||||||
import {
|
import {
|
||||||
login,
|
login,
|
||||||
getUser,
|
getUser,
|
||||||
@ -153,9 +162,12 @@ import {
|
|||||||
swiperimg,
|
swiperimg,
|
||||||
agreement,
|
agreement,
|
||||||
getInfo,
|
getInfo,
|
||||||
getaccou
|
getaccou,
|
||||||
|
carlist
|
||||||
} from '@/utils/service'
|
} from '@/utils/service'
|
||||||
|
|
||||||
|
uni.hideTabBar()
|
||||||
|
|
||||||
let height = ref('')
|
let height = ref('')
|
||||||
let islogin = ref(false)
|
let islogin = ref(false)
|
||||||
let PhoneNumber = ref('')
|
let PhoneNumber = ref('')
|
||||||
@ -163,10 +175,12 @@ let covers =ref<any[]>([])
|
|||||||
let hdzcode = ref('')
|
let hdzcode = ref('')
|
||||||
let imglist = ref<any[]>([])
|
let imglist = ref<any[]>([])
|
||||||
|
|
||||||
uni.removeStorageSync('wxuid')
|
// uni.removeStorageSync('wxuid')
|
||||||
uni.removeStorageSync('wxToken')
|
// uni.removeStorageSync('wxToken')
|
||||||
uni.removeStorageSync('PhoneNumber')
|
// uni.removeStorageSync('PhoneNumber')
|
||||||
uni.removeStorageSync('Init')
|
// uni.removeStorageSync('Init')
|
||||||
|
|
||||||
|
//console.log(wx.getAccountInfoSync().miniProgram.envVersion,'小程序环境')
|
||||||
|
|
||||||
let xyobj = ref<any>({})
|
let xyobj = ref<any>({})
|
||||||
let account = ref<any>({})
|
let account = ref<any>({})
|
||||||
@ -188,8 +202,9 @@ onLoad((opt:any) => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
onShow(() => {
|
onShow(() => {
|
||||||
|
showxq.value = false
|
||||||
xyshow.value = false
|
xyshow.value = false
|
||||||
uni.showTabBar()
|
//uni.showTabBar()
|
||||||
//判断是否登录
|
//判断是否登录
|
||||||
if(uni.getStorageSync('wxuid')){
|
if(uni.getStorageSync('wxuid')){
|
||||||
islogin.value = true
|
islogin.value = true
|
||||||
@ -226,7 +241,8 @@ onShow(() => {
|
|||||||
//获取经纬度
|
//获取经纬度
|
||||||
let latitude = ref(37.844522)
|
let latitude = ref(37.844522)
|
||||||
let longitude = ref(114.530428)
|
let longitude = ref(114.530428)
|
||||||
let hdzname = ref('')
|
let maphdzname = ref('')
|
||||||
|
let maphdzcode = ref('')
|
||||||
|
|
||||||
let xyshow = ref(false)
|
let xyshow = ref(false)
|
||||||
|
|
||||||
@ -249,6 +265,7 @@ function username() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function getinfo(){
|
function getinfo(){
|
||||||
|
|
||||||
//获取轮播图
|
//获取轮播图
|
||||||
swiperimg({
|
swiperimg({
|
||||||
appid:'wx2ab384cf1e6f85a1',
|
appid:'wx2ab384cf1e6f85a1',
|
||||||
@ -267,6 +284,7 @@ function getinfo(){
|
|||||||
let jwd = n.locationPoint?n.locationPoint.split(','):[]
|
let jwd = n.locationPoint?n.locationPoint.split(','):[]
|
||||||
covers.value.push({
|
covers.value.push({
|
||||||
id:i,
|
id:i,
|
||||||
|
code:n.code,
|
||||||
latitude: jwd[0]?jwd[0]:'',
|
latitude: jwd[0]?jwd[0]:'',
|
||||||
longitude: jwd[1]?jwd[1]:'',
|
longitude: jwd[1]?jwd[1]:'',
|
||||||
width:20,
|
width:20,
|
||||||
@ -317,10 +335,26 @@ function toux() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
//页面跳转
|
//页面跳转
|
||||||
function topage(url:string){
|
function topage(url:string,isy?:boolean){
|
||||||
uni.navigateTo({
|
if(isy){
|
||||||
url
|
carlist(uni.getStorageSync('wxuid')).then((rps:any) => {
|
||||||
})
|
if(rps.data && rps.data.length > 0){
|
||||||
|
uni.navigateTo({
|
||||||
|
url
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.showToast({
|
||||||
|
title:'请您联系管理员绑定车辆',
|
||||||
|
icon:'none'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.navigateTo({
|
||||||
|
url
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function wdltip() {
|
function wdltip() {
|
||||||
@ -332,9 +366,9 @@ function wdltip() {
|
|||||||
|
|
||||||
function getdh() {
|
function getdh() {
|
||||||
uni.openLocation({
|
uni.openLocation({
|
||||||
latitude:latitude.value*1,
|
latitude:marketLat.value*1,
|
||||||
longitude:longitude.value*1,
|
longitude:marketLng.value*1,
|
||||||
address:hdzname.value,
|
address:maphdzname.value,
|
||||||
success() {
|
success() {
|
||||||
console.log('success');
|
console.log('success');
|
||||||
},
|
},
|
||||||
@ -346,6 +380,8 @@ function getdh() {
|
|||||||
|
|
||||||
//点击地图标注
|
//点击地图标注
|
||||||
let showxq = ref(false)
|
let showxq = ref(false)
|
||||||
|
let marketLat = ref<any>('')
|
||||||
|
let marketLng = ref<any>('')
|
||||||
function markertap(v:any) {
|
function markertap(v:any) {
|
||||||
showxq.value = true
|
showxq.value = true
|
||||||
|
|
||||||
@ -356,9 +392,13 @@ function markertap(v:any) {
|
|||||||
console.log(n,'123')
|
console.log(n,'123')
|
||||||
// 当前点击的标注显示气泡
|
// 当前点击的标注显示气泡
|
||||||
n.callout.display = 'ALWAYS'
|
n.callout.display = 'ALWAYS'
|
||||||
hdzname.value = n.callout.content
|
maphdzname.value = n.callout.content
|
||||||
latitude.value = n.latitude
|
maphdzcode.value = n.code
|
||||||
longitude.value = n.longitude
|
// latitude.value = n.latitude
|
||||||
|
// longitude.value = n.longitude
|
||||||
|
|
||||||
|
marketLat.value = n.latitude
|
||||||
|
marketLng.value = n.longitude
|
||||||
}else{
|
}else{
|
||||||
// 其他标注隐藏气泡
|
// 其他标注隐藏气泡
|
||||||
n.callout.display = 'BYCLICK'
|
n.callout.display = 'BYCLICK'
|
||||||
@ -374,7 +414,7 @@ function showxy() {
|
|||||||
type:'1'
|
type:'1'
|
||||||
}).then((rps:any) => {
|
}).then((rps:any) => {
|
||||||
xyobj.value = rps.data[0]
|
xyobj.value = rps.data[0]
|
||||||
uni.hideTabBar()
|
//uni.hideTabBar()
|
||||||
xyshow.value = true
|
xyshow.value = true
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@ -383,7 +423,7 @@ function btnshan(type:number = 1) {
|
|||||||
if(type == 1){
|
if(type == 1){
|
||||||
getUser().then(() => {
|
getUser().then(() => {
|
||||||
xyshow.value = false
|
xyshow.value = false
|
||||||
uni.showTabBar()
|
//uni.showTabBar()
|
||||||
islogin.value = true
|
islogin.value = true
|
||||||
|
|
||||||
//是否初次使用
|
//是否初次使用
|
||||||
@ -417,6 +457,28 @@ function btnshan(type:number = 1) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//根据经纬度计算距离
|
||||||
|
function Rad(d:any) {
|
||||||
|
return d * Math.PI / 180.0 //经纬度转换成三角函数中度分表形式。
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
计算距离，参数分别为第一点的纬度，经度；第二点的纬度，经度
|
||||||
|
默认单位km
|
||||||
|
*/
|
||||||
|
function getMapDistance(lat1:any, lng1:any, lat2:any, lng2:any) {
|
||||||
|
let radLat1 = Rad(lat1)
|
||||||
|
let radLat2 = Rad(lat2)
|
||||||
|
let a = radLat1 - radLat2
|
||||||
|
let b = Rad(lng1) - Rad(lng2)
|
||||||
|
let s:any = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) +
|
||||||
|
Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)))
|
||||||
|
s = s * 6378.137; // EARTH_RADIUS;
|
||||||
|
s = Math.round(s * 10000) / 10000 //输出为公里
|
||||||
|
s = s.toFixed(2)
|
||||||
|
return s
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@ -461,7 +523,7 @@ page{
|
|||||||
border-radius: 10rpx;
|
border-radius: 10rpx;
|
||||||
background:#fff; //#00aa00;
|
background:#fff; //#00aa00;
|
||||||
left: 5%;
|
left: 5%;
|
||||||
bottom: 20rpx;
|
bottom: 150rpx;
|
||||||
box-shadow: 0 0 20px 2px rgba(0, 170, 0, 0.5);
|
box-shadow: 0 0 20px 2px rgba(0, 170, 0, 0.5);
|
||||||
}
|
}
|
||||||
.xybtns{
|
.xybtns{
|
||||||
@ -485,7 +547,7 @@ page{
|
|||||||
.yuyue{
|
.yuyue{
|
||||||
position: fixed;
|
position: fixed;
|
||||||
right: 5%;
|
right: 5%;
|
||||||
bottom: 300rpx;
|
bottom: 450rpx;
|
||||||
width: 120rpx;
|
width: 120rpx;
|
||||||
height: 120rpx;
|
height: 120rpx;
|
||||||
line-height: 120rpx;
|
line-height: 120rpx;
|
||||||
@ -503,4 +565,13 @@ page{
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
.daohang{
|
||||||
|
width: 110rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
line-height: 60rpx;
|
||||||
|
text-align: center;
|
||||||
|
background: #00aa7f;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -171,6 +171,8 @@
|
|||||||
</view>
|
</view>
|
||||||
</view> -->
|
</view> -->
|
||||||
<!-- <view style="position: absolute;width:100%;bottom: 30rpx;text-align: center;color: #c1c1c1;">关于我们</view> -->
|
<!-- <view style="position: absolute;width:100%;bottom: 30rpx;text-align: center;color: #c1c1c1;">关于我们</view> -->
|
||||||
|
<!-- <cc-myTabbar :tabBarShow="2"></cc-myTabbar> -->
|
||||||
|
<mytabbar :tabBarShow="2" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
@ -178,6 +180,10 @@
|
|||||||
import { onShow } from '@dcloudio/uni-app'
|
import { onShow } from '@dcloudio/uni-app'
|
||||||
import { getInfo,getaccou } from '@/utils/service'
|
import { getInfo,getaccou } from '@/utils/service'
|
||||||
|
|
||||||
|
import mytabbar from '@/components/mytabbar/mytabbar.vue'
|
||||||
|
|
||||||
|
uni.hideTabBar()
|
||||||
|
|
||||||
let islogin = ref(false)
|
let islogin = ref(false)
|
||||||
let PhoneNumber = ref('')
|
let PhoneNumber = ref('')
|
||||||
|
|
||||||
|
|||||||
@ -15,7 +15,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { BarHeight } from '@/utils/commen'
|
import { BarHeight } from '@/utils/commen'
|
||||||
import { onTabItemTap } from '@dcloudio/uni-app'
|
import { onTabItemTap,onShow } from '@dcloudio/uni-app'
|
||||||
let code = ref<any>('')
|
let code = ref<any>('')
|
||||||
let hdzcode = ref('')
|
let hdzcode = ref('')
|
||||||
onTabItemTap((item) => {
|
onTabItemTap((item) => {
|
||||||
@ -25,7 +25,7 @@
|
|||||||
code.value = res
|
code.value = res
|
||||||
console.log('条码类型：' + res.scanType);
|
console.log('条码类型：' + res.scanType);
|
||||||
console.log('条码内容：' + res.result);
|
console.log('条码内容：' + res.result);
|
||||||
uni.redirectTo({
|
uni.navigateTo({
|
||||||
url:`/homePages/reservation/index?hdzcode=${hdzcode}&phoneNumber=${uni.getStorageSync('userInfor').phoneNumber?uni.getStorageSync('userInfor').phoneNumber:''}`
|
url:`/homePages/reservation/index?hdzcode=${hdzcode}&phoneNumber=${uni.getStorageSync('userInfor').phoneNumber?uni.getStorageSync('userInfor').phoneNumber:''}`
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|||||||
12
src/uni_modules/cc-myTabbar/changelog.md
Normal file
12
src/uni_modules/cc-myTabbar/changelog.md
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
## 2.2.4（2024-10-03）
|
||||||
|
组件优化
|
||||||
|
## 2.2.2（2024-07-13）
|
||||||
|
组件优化
|
||||||
|
## 2.2（2024-06-27）
|
||||||
|
优化
|
||||||
|
## 2.0（2024-05-16）
|
||||||
|
组件优化
|
||||||
|
## 1.0.1（2023-06-22）
|
||||||
|
组件使用说明优化
|
||||||
|
## 1.0.0（2023-06-22）
|
||||||
|
组件初始化
|
||||||
@ -0,0 +1,39 @@
|
|||||||
|
/* 主要颜色 */
|
||||||
|
$base: #00aa7f; // 基础颜色
|
||||||
|
.page-total{
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
// height: 100rpx;
|
||||||
|
}
|
||||||
|
.tab-list{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 120rpx;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
.list{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 20%;
|
||||||
|
height: 120rpx;
|
||||||
|
image{
|
||||||
|
width: 48rpx;
|
||||||
|
height: 48rpx;
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
text{
|
||||||
|
color: #333333;
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
.action{
|
||||||
|
color: $base;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,131 @@
|
|||||||
|
<template>
|
||||||
|
<view class="page-total">
|
||||||
|
<view class="tab-list">
|
||||||
|
<view class="list" v-for="(item,index) in TabBarList"
|
||||||
|
@click="onTabBar(item,index)" :style="{marginTop: (index == 1) ? '-26px' : '0px'}"
|
||||||
|
:key="index">
|
||||||
|
<image :src="item.acImg" mode="widthFix" v-show="tabBarShow === index" :style="{width: (index == 1) ? '40px' : '28px',borderRadius: (index == 1) ? '12px' : '0px'}"></image>
|
||||||
|
<image :src="item.img" mode="widthFix" v-show="tabBarShow != index" :style="{width: (index == 1) ? '40px' : '28px',borderRadius: (index == 1) ? '12px' : '0px'}"></image>
|
||||||
|
|
||||||
|
<!-- background: (index == 2) ? 'red' : '' -->
|
||||||
|
<text :class="{'action':tabBarShow===index}" :style="{marginTop: (index == 1) ? '4px' : '0px'}">{{item.name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
TabBarList:[
|
||||||
|
{
|
||||||
|
index: 0,
|
||||||
|
name: '首页',
|
||||||
|
img: '../../static/img/home.png',
|
||||||
|
acImg: '../../static/img/home.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
index: 1,
|
||||||
|
name: '扫码换电',
|
||||||
|
img: '../../static/img/saom.png',
|
||||||
|
acImg: '../../static/img/saom.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
index: 2,
|
||||||
|
name: '我的',
|
||||||
|
img: '../../static/img/wode.png',
|
||||||
|
acImg: '../../static/img/wode.png'
|
||||||
|
},
|
||||||
|
],
|
||||||
|
codeheight: 0,
|
||||||
|
isOverall: 0,
|
||||||
|
phoneModel: '',
|
||||||
|
};
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
tabBarShow: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
try {
|
||||||
|
const res = uni.getSystemInfoSync();
|
||||||
|
let that = this;
|
||||||
|
// 获取系统信息
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success(res) {
|
||||||
|
console.log(res.brand) //手机牌子
|
||||||
|
console.log(res.model) //手机型号
|
||||||
|
console.log(res.screenWidth) //屏幕宽度
|
||||||
|
console.log(res.screenHeight) //屏幕高度
|
||||||
|
that.codeheight = Math.round(res.screenHeight);
|
||||||
|
that.phoneModel =res.model
|
||||||
|
if(res.model.search('iPhone')){
|
||||||
|
that.isOverall = 0;
|
||||||
|
}else if(Math.round(res.screenHeight)>740){
|
||||||
|
that.isOverall = 1;
|
||||||
|
}
|
||||||
|
console.log(that.isOverall);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} catch (e) {
|
||||||
|
// error
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
/**
|
||||||
|
* @param {Object} item
|
||||||
|
* @param {Number} index
|
||||||
|
*/
|
||||||
|
onTabBar(item,index){
|
||||||
|
// this.tabBarShow = index;
|
||||||
|
const _this = this
|
||||||
|
switch (index){
|
||||||
|
case 0:
|
||||||
|
uni.switchTab({
|
||||||
|
url:'/pages/home/index'
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
if(uni.getStorageSync('wxuid')){
|
||||||
|
uni.scanCode({
|
||||||
|
onlyFromCamera:true,
|
||||||
|
success(res){
|
||||||
|
let hdzcode = '' //??
|
||||||
|
|
||||||
|
console.log('条码类型：' + res.scanType);
|
||||||
|
console.log('条码内容：' + res.result);
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/homePages/reservation/index?hdzcode=${hdzcode}&phoneNumber=${uni.getStorageSync('userInfor').phoneNumber?uni.getStorageSync('userInfor').phoneNumber:''}`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail() {
|
||||||
|
uni.switchTab({
|
||||||
|
url: '/pages/home/index'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}else{
|
||||||
|
uni.showToast({
|
||||||
|
title:'请您先登录',
|
||||||
|
icon:'none'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
uni.switchTab({
|
||||||
|
url:'/pages/mine/index'
|
||||||
|
})
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import 'cc-myTabbar.scss';
|
||||||
|
</style>
|
||||||
86
src/uni_modules/cc-myTabbar/package.json
Normal file
86
src/uni_modules/cc-myTabbar/package.json
Normal file
@ -0,0 +1,86 @@
|
|||||||
|
{
|
||||||
|
"id": "cc-myTabbar",
|
||||||
|
"displayName": "自定义tabbar底部tabbar凸起tabbar兼容苹果刘海屏小程序和APP",
|
||||||
|
"version": "2.2.4",
|
||||||
|
"description": "自定义tabbar底部tabbar凸起tabbar兼容苹果刘海屏Home键小程序和APP 可自定义tabbar图片文字大小及位置",
|
||||||
|
"keywords": [
|
||||||
|
"tabbar",
|
||||||
|
"自定义tabbar",
|
||||||
|
"底部导航",
|
||||||
|
"自定义",
|
||||||
|
"凸起导航"
|
||||||
|
],
|
||||||
|
"repository": "",
|
||||||
|
"engines": {
|
||||||
|
"HBuilderX": "^3.8.0"
|
||||||
|
},
|
||||||
|
"dcloudext": {
|
||||||
|
"type": "component-vue",
|
||||||
|
"sale": {
|
||||||
|
"regular": {
|
||||||
|
"price": "0.00"
|
||||||
|
},
|
||||||
|
"sourcecode": {
|
||||||
|
"price": "0.00"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"contact": {
|
||||||
|
"qq": ""
|
||||||
|
},
|
||||||
|
"declaration": {
|
||||||
|
"ads": "无",
|
||||||
|
"data": "无",
|
||||||
|
"permissions": "无"
|
||||||
|
},
|
||||||
|
"npmurl": ""
|
||||||
|
},
|
||||||
|
"uni_modules": {
|
||||||
|
"dependencies": [],
|
||||||
|
"encrypt": [],
|
||||||
|
"platforms": {
|
||||||
|
"cloud": {
|
||||||
|
"tcb": "y",
|
||||||
|
"aliyun": "y",
|
||||||
|
"alipay": "n"
|
||||||
|
},
|
||||||
|
"client": {
|
||||||
|
"Vue": {
|
||||||
|
"vue2": "y",
|
||||||
|
"vue3": "y"
|
||||||
|
},
|
||||||
|
"App": {
|
||||||
|
"app-vue": "y",
|
||||||
|
"app-nvue": "y"
|
||||||
|
},
|
||||||
|
"H5-mobile": {
|
||||||
|
"Safari": "y",
|
||||||
|
"Android Browser": "y",
|
||||||
|
"微信浏览器(Android)": "y",
|
||||||
|
"QQ浏览器(Android)": "y"
|
||||||
|
},
|
||||||
|
"H5-pc": {
|
||||||
|
"Chrome": "y",
|
||||||
|
"IE": "y",
|
||||||
|
"Edge": "y",
|
||||||
|
"Firefox": "y",
|
||||||
|
"Safari": "y"
|
||||||
|
},
|
||||||
|
"小程序": {
|
||||||
|
"微信": "y",
|
||||||
|
"阿里": "y",
|
||||||
|
"百度": "y",
|
||||||
|
"字节跳动": "y",
|
||||||
|
"QQ": "y",
|
||||||
|
"钉钉": "y",
|
||||||
|
"快手": "y",
|
||||||
|
"飞书": "y",
|
||||||
|
"京东": "y"
|
||||||
|
},
|
||||||
|
"快应用": {
|
||||||
|
"华为": "y",
|
||||||
|
"联盟": "y"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
89
src/uni_modules/cc-myTabbar/readme.md
Normal file
89
src/uni_modules/cc-myTabbar/readme.md
Normal file
@ -0,0 +1,89 @@
|
|||||||
|
# cc-myTabbar
|
||||||
|
|
||||||
|
|
||||||
|
##uniapp专属精品组件页面模板（由前端组件开发出品）精品组件页面模板
|
||||||
|
|
||||||
|
###●组件模板规划：
|
||||||
|
由前端组件开发出品的精品组件页面模板，将陆续发布，预计高达约几百种供您使用，是快速快发项目、创业的必备精品。
|
||||||
|
|
||||||
|
合集地址： uni-app模板合集地址：(https://ext.dcloud.net.cn/publisher?id=274945) 如查看全部页面模板，请前往上述uniapp插件市场合集地址；
|
||||||
|
|
||||||
|
###●组件模板效果图：
|
||||||
|
可下载项目后预览，效果图见右侧图片；
|
||||||
|
|
||||||
|
###●组件模板费用：
|
||||||
|
学习：免费下载，进行学习，无费用；
|
||||||
|
|
||||||
|
使用/商用：本页面地址赞赏10元后，可终身商用；
|
||||||
|
|
||||||
|
###●组件模板使用版权/商用：
|
||||||
|
本组件模板免费下载可供学习，如需使用及商用，请在本组件页面模板进行赞赏10元
|
||||||
|
|
||||||
|
（仅需10元获取精品页面模板代码-物有所值，1个组件页面市场价100元 ）
|
||||||
|
|
||||||
|
赞赏10后（当前项目产生赞赏订单可追溯）即可终身商用当前本地址下载的页面模版代码，不同下载地址需进行不同的赞赏。（不赞赏就进行商用使用者，面临侵权！保留追究知识产权法律责任！后果自负！）
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
### 我的技术公众号(私信可加前端技术交流群)
|
||||||
|
|
||||||
|
群内气氛挺不错的，应该或许可能大概，算是为数不多的，专搞技术的前端群，偶尔聊天摸鱼
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
#### 使用方法
|
||||||
|
```使用方法
|
||||||
|
<!-- tabBarShow：显示第几个tabbar -->
|
||||||
|
<cc-myTabbar :tabBarShow="0"></cc-myTabbar>
|
||||||
|
|
||||||
|
<!-- 隐藏原生tabbar -->
|
||||||
|
onReady() {
|
||||||
|
uni.hideTabBar()
|
||||||
|
}
|
||||||
|
|
||||||
|
<!-- 页面距离底部140rpx(自定义tabbar的高度) -->
|
||||||
|
page {
|
||||||
|
padding-bottom: 140rpx;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
#### HTML代码实现部分
|
||||||
|
```html
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="page">
|
||||||
|
|
||||||
|
<!-- tabBarShow：显示第几个tabbar -->
|
||||||
|
<cc-myTabbar :tabBarShow="0"></cc-myTabbar>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
uni.hideTabBar()
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
page {
|
||||||
|
padding-bottom: 140rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
```
|
||||||
BIN
src/uni_modules/cc-myTabbar/static/img/home.png
Normal file
BIN
src/uni_modules/cc-myTabbar/static/img/home.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
BIN
src/uni_modules/cc-myTabbar/static/img/saom.png
Normal file
BIN
src/uni_modules/cc-myTabbar/static/img/saom.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
BIN
src/uni_modules/cc-myTabbar/static/img/wode.png
Normal file
BIN
src/uni_modules/cc-myTabbar/static/img/wode.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
51
src/uni_modules/zero-loading/changelog.md
Normal file
51
src/uni_modules/zero-loading/changelog.md
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
## 1.4.2（2025-04-03）
|
||||||
|
## 增加两个动画
|
||||||
|
| locating | 定位 (自定义颜色) |
|
||||||
|
| photo | 照片 (自定义颜色) |
|
||||||
|
## 1.4.1（2024-07-02）
|
||||||
|
### 1. 增加动画equal(等边), wobble(摇摆)
|
||||||
|
### 2. 原来的triangle(三角)改为surround(环绕)
|
||||||
|
### 3. 新增可自定义颜色项
|
||||||
|
## 1.4.0（2024-06-28）
|
||||||
|
|
||||||
|
## 增加 loading 加载文字提醒配置项,默认 false
|
||||||
|
|
||||||
|
## 1.3.2（2023-10-31）
|
||||||
|
|
||||||
|
修改遮罩默认透明度为 0.1
|
||||||
|
|
||||||
|
## 1.3.1（2023-10-31）
|
||||||
|
|
||||||
|
## 新增支持,自定义动画颜色(仅部分动画支持)
|
||||||
|
|
||||||
|
## 新增动画-annulus(圆环)
|
||||||
|
|
||||||
|
## 1.3.0（2023-08-11）
|
||||||
|
|
||||||
|
支持 vue3 使用, 增加动画类型 radar(雷达)
|
||||||
|
|
||||||
|
## 1.2.2（2023-06-12）
|
||||||
|
|
||||||
|
增加 maskOpacity, maskMini, maskDark 自定义参数, 提供更丰富的自定义遮罩层能力
|
||||||
|
|
||||||
|
## 1.2.1（2022-09-09）
|
||||||
|
|
||||||
|
增加齿轮动画 type=gear
|
||||||
|
|
||||||
|
## 1.2.0（2022-05-27）
|
||||||
|
|
||||||
|
1. 增加加载类型-剑气（sword），原子（atom）
|
||||||
|
2. 默认类型改为 atom
|
||||||
|
3. 遮罩透明度调整
|
||||||
|
|
||||||
|
## 1.1.1（2022-04-02）
|
||||||
|
|
||||||
|
更新使用说明
|
||||||
|
|
||||||
|
## 1.1.0（2022-02-23）
|
||||||
|
|
||||||
|
增加 type="love" 的心形加载动画
|
||||||
|
|
||||||
|
## 1.0.0（2022-01-28）
|
||||||
|
|
||||||
|
首次发布
|
||||||
@ -0,0 +1,45 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="loader" :style="{ '--color': color }"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-annulus",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#0396FF",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.loader {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader::before {
|
||||||
|
content: "";
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: absolute;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 50%;
|
||||||
|
border-top: 2px solid var(--color);
|
||||||
|
border-right: 2px solid transparent;
|
||||||
|
animation: spinner 1s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spinner {
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,108 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box" :style="{ '--color': color }">
|
||||||
|
<view class="atom"></view>
|
||||||
|
<view class="atom"></view>
|
||||||
|
<view class="atom"></view>
|
||||||
|
<view class="dot"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-atom",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#0396FF",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.box {
|
||||||
|
position: relative;
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
}
|
||||||
|
.dot {
|
||||||
|
position: absolute;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
background: var(--color);
|
||||||
|
animation: dotbreath 2s linear infinite;
|
||||||
|
}
|
||||||
|
.atom {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 50%;
|
||||||
|
border-left-width: 6rpx;
|
||||||
|
border-top-width: 6rpx;
|
||||||
|
border-left-color: var(--color);
|
||||||
|
border-left-style: solid;
|
||||||
|
border-top-style: solid;
|
||||||
|
border-top-color: transparent;
|
||||||
|
}
|
||||||
|
.atom:nth-of-type(1) {
|
||||||
|
left: 0%;
|
||||||
|
top: 0%;
|
||||||
|
animation: atom1 1s linear infinite;
|
||||||
|
}
|
||||||
|
.atom:nth-of-type(2) {
|
||||||
|
right: 0%;
|
||||||
|
top: 0%;
|
||||||
|
animation: atom2 1s linear infinite;
|
||||||
|
}
|
||||||
|
.atom:nth-of-type(3) {
|
||||||
|
right: 0%;
|
||||||
|
bottom: 0%;
|
||||||
|
animation: atom3 1s linear infinite;
|
||||||
|
}
|
||||||
|
@keyframes dotbreath {
|
||||||
|
0% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes atom1 {
|
||||||
|
0% {
|
||||||
|
transform: rotateZ(120deg) rotateX(66deg) rotateZ(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotateZ(120deg) rotateX(66deg) rotateZ(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes atom2 {
|
||||||
|
0% {
|
||||||
|
transform: rotateZ(240deg) rotateX(66deg) rotateZ(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotateZ(240deg) rotateX(66deg) rotateZ(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes atom3 {
|
||||||
|
0% {
|
||||||
|
transform: rotateZ(360deg) rotateX(66deg) rotateZ(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotateZ(360deg) rotateX(66deg) rotateZ(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,84 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box">
|
||||||
|
<view class="dot dot1"></view>
|
||||||
|
<view class="dot dot2"></view>
|
||||||
|
<view class="dot dot3"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-bounce",
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.box {
|
||||||
|
width: 100rpx;
|
||||||
|
height: 50rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.dot {
|
||||||
|
width: 14rpx;
|
||||||
|
height: 14rpx;
|
||||||
|
background: #007aff;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: absolute;
|
||||||
|
top: calc(50% - 5rpx);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot1 {
|
||||||
|
background: #1fa2ff;
|
||||||
|
left: 0rpx;
|
||||||
|
-webkit-animation: bounce 0.5s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate
|
||||||
|
infinite;
|
||||||
|
animation: bounce 0.5s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot2 {
|
||||||
|
background: #12d8fa;
|
||||||
|
left: 40rpx;
|
||||||
|
-webkit-animation: bounce 0.5s 0.2s cubic-bezier(0.77, 0.47, 0.64, 0.28)
|
||||||
|
alternate infinite;
|
||||||
|
animation: bounce 0.5s 0.2s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate
|
||||||
|
infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot3 {
|
||||||
|
background: #29ffc6;
|
||||||
|
left: 80rpx;
|
||||||
|
-webkit-animation: bounce 0.5s 0.4s cubic-bezier(0.77, 0.47, 0.64, 0.28)
|
||||||
|
alternate infinite;
|
||||||
|
animation: bounce 0.5s 0.4s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate
|
||||||
|
infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes bounce {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: translateY(0);
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
-webkit-transform: translateY(-20rpx);
|
||||||
|
transform: translateY(-20rpx);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes bounce {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: translateY(0);
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
-webkit-transform: translateY(-20rpx);
|
||||||
|
transform: translateY(-20rpx);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,96 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="loader" :style="{ '--color': color }"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-circle",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#0396FF",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
// .container {
|
||||||
|
// position: absolute;
|
||||||
|
// top: 50%;
|
||||||
|
// left: 50%;
|
||||||
|
// transform: translate(-50%, -50%);
|
||||||
|
// }
|
||||||
|
.loader {
|
||||||
|
display: block;
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 3rpx solid transparent;
|
||||||
|
border-top-color: var(--color);
|
||||||
|
-webkit-animation: spin 2s linear infinite;
|
||||||
|
animation: spin 2s linear infinite;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 8rpx;
|
||||||
|
left: 8rpx;
|
||||||
|
right: 8rpx;
|
||||||
|
bottom: 8rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 3rpx solid transparent;
|
||||||
|
border-top-color: var(--color);
|
||||||
|
-webkit-animation: spin 3s linear infinite;
|
||||||
|
animation: spin 3s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 16rpx;
|
||||||
|
left: 16rpx;
|
||||||
|
right: 16rpx;
|
||||||
|
bottom: 16rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 3rpx solid transparent;
|
||||||
|
border-top-color: var(--color);
|
||||||
|
-webkit-animation: spin 1.5s linear infinite;
|
||||||
|
animation: spin 1.5s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes spin {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: rotate(0deg);
|
||||||
|
-ms-transform: rotate(0deg);
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
-webkit-transform: rotate(360deg);
|
||||||
|
-ms-transform: rotate(360deg);
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: rotate(0deg);
|
||||||
|
-ms-transform: rotate(0deg);
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
-webkit-transform: rotate(360deg);
|
||||||
|
-ms-transform: rotate(360deg);
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,81 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="loader" :style="{ '--color': color }"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-equal",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#ff1919",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.loader {
|
||||||
|
width: 50px;
|
||||||
|
aspect-ratio: 1.154;
|
||||||
|
position: relative;
|
||||||
|
background: conic-gradient(
|
||||||
|
from 120deg at 50% 64%,
|
||||||
|
#0000,
|
||||||
|
var(--color) 1deg 120deg,
|
||||||
|
#0000 121deg
|
||||||
|
);
|
||||||
|
animation: spin 1.5s infinite cubic-bezier(0.3, 1, 0, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader:before,
|
||||||
|
.loader:after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
inset: 0;
|
||||||
|
background: inherit;
|
||||||
|
transform-origin: 50% 66%;
|
||||||
|
animation: separate 1.5s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader:after {
|
||||||
|
--s: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
0%,
|
||||||
|
30% {
|
||||||
|
transform: rotate(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
70% {
|
||||||
|
transform: rotate(120deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
70.01%,
|
||||||
|
100% {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes separate {
|
||||||
|
0% {
|
||||||
|
transform: rotate(calc(var(--s, 1) * 120deg)) translate(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
30%,
|
||||||
|
70% {
|
||||||
|
transform: rotate(calc(var(--s, 1) * 120deg))
|
||||||
|
translate(calc(var(--s, 1) * -5px), 10px);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(calc(var(--s, 1) * 120deg)) translate(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,78 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box">
|
||||||
|
<view class="eye"></view>
|
||||||
|
<view class="eye"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-eyes",
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.box {
|
||||||
|
width: 110rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eye {
|
||||||
|
width: 50rpx;
|
||||||
|
height: 50rpx;
|
||||||
|
background: linear-gradient(135deg, #1fa2ff, #12d8fa);
|
||||||
|
border-radius: 50%;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eye:after {
|
||||||
|
background-color: #ffffff;
|
||||||
|
width: 18rpx;
|
||||||
|
height: 18rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
left: 20rpx;
|
||||||
|
top: 24rpx;
|
||||||
|
position: absolute;
|
||||||
|
content: "";
|
||||||
|
-webkit-animation: eyeball 1s linear infinite alternate;
|
||||||
|
-moz-animation: eyeball 1s linear infinite alternate;
|
||||||
|
animation: eyeball 1s linear infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes eyeball {
|
||||||
|
0% {
|
||||||
|
left: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
left: 2rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-moz-keyframes eyeball {
|
||||||
|
0% {
|
||||||
|
left: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
left: 2rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes eyeball {
|
||||||
|
0% {
|
||||||
|
left: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
left: 2rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,118 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box">
|
||||||
|
<view class="gear1">
|
||||||
|
<view class="inner inner1"> </view>
|
||||||
|
<view class="inner inner2"> </view>
|
||||||
|
<view class="inner inner3"> </view>
|
||||||
|
</view>
|
||||||
|
<view class="gear2">
|
||||||
|
<view class="inner inner1"> </view>
|
||||||
|
<view class="inner inner2"> </view>
|
||||||
|
<view class="inner inner3"> </view>
|
||||||
|
</view>
|
||||||
|
<view class="gear3">
|
||||||
|
<view class="inner inner1"> </view>
|
||||||
|
<view class="inner inner2"> </view>
|
||||||
|
<view class="inner inner3"> </view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-gear",
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
$size: 80rpx;
|
||||||
|
$bgc: red;
|
||||||
|
|
||||||
|
.box {
|
||||||
|
width: 200rpx;
|
||||||
|
height: 200rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin gear($size: $size, $bgc: $bgc) {
|
||||||
|
width: $size;
|
||||||
|
height: $size;
|
||||||
|
.inner {
|
||||||
|
position: absolute;
|
||||||
|
width: $size;
|
||||||
|
height: $size;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background: $bgc;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
mask: radial-gradient(transparent 40%, #fff 60%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.inner2 {
|
||||||
|
transform: rotate(120deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.inner3 {
|
||||||
|
transform: rotate(240deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
// &:after {
|
||||||
|
// position: absolute;
|
||||||
|
// content: '';
|
||||||
|
// background: #fff;
|
||||||
|
// width: $size / 1.8;
|
||||||
|
// height: $size / 1.8;
|
||||||
|
// border-radius: 100%;
|
||||||
|
// top: 50%;
|
||||||
|
// left: 50%;
|
||||||
|
// transform: translate(-50%, -50%);
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.gear1 {
|
||||||
|
@include gear(60rpx, #0396ff);
|
||||||
|
position: absolute;
|
||||||
|
top: 35rpx;
|
||||||
|
left: 35rpx;
|
||||||
|
animation: rotate 5s infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gear2 {
|
||||||
|
@include gear(50rpx, #dd524d);
|
||||||
|
position: absolute;
|
||||||
|
top: 50rpx;
|
||||||
|
left: 110rpx;
|
||||||
|
animation: rotateR 5s infinite linear;
|
||||||
|
}
|
||||||
|
.gear3 {
|
||||||
|
@include gear(50rpx, #f0ad4e);
|
||||||
|
position: absolute;
|
||||||
|
top: 110rpx;
|
||||||
|
left: 50rpx;
|
||||||
|
animation: rotateR 5s infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes rotate {
|
||||||
|
from {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes rotateR {
|
||||||
|
from {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: rotate(-360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,81 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="loader" :style="{ '--color': color }"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-locating",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#0396FF",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
.loader {
|
||||||
|
width: 96rpx;
|
||||||
|
height: 96rpx;
|
||||||
|
display: block;
|
||||||
|
margin: 40rpx auto;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader::after {
|
||||||
|
content: '';
|
||||||
|
width: 96rpx;
|
||||||
|
height: 96rpx;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
position: absolute;
|
||||||
|
border-radius: 50% 50% 0;
|
||||||
|
border: 30rpx solid var(--color);
|
||||||
|
transform: rotate(45deg) translate(0, 0);
|
||||||
|
box-sizing: border-box;
|
||||||
|
animation: animMarker 0.4s ease-in-out infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader::before {
|
||||||
|
content: '';
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
margin: auto;
|
||||||
|
top: 150%;
|
||||||
|
width: 48rpx;
|
||||||
|
height: 8rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: rgba(0, 0, 0, 0.2);
|
||||||
|
animation: animShadow 0.4s ease-in-out infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes animMarker {
|
||||||
|
0% {
|
||||||
|
transform: rotate(45deg) translate(10rpx, 10rpx);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(45deg) translate(-10rpx, -10rpx);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes animShadow {
|
||||||
|
0% {
|
||||||
|
transform: scale(0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,201 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box">
|
||||||
|
<view class="item"></view>
|
||||||
|
<view class="item"></view>
|
||||||
|
<view class="item"></view>
|
||||||
|
<view class="item"></view>
|
||||||
|
<view class="item"></view>
|
||||||
|
<view class="item"></view>
|
||||||
|
<view class="item"></view>
|
||||||
|
<view class="item"></view>
|
||||||
|
<view class="item"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-love",
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-flow: row nowrap;
|
||||||
|
height: 160rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
background: linear-gradient(to bottom, #f00000, #e73827);
|
||||||
|
width: 16rpx;
|
||||||
|
height: 16rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(1) {
|
||||||
|
animation: love1 4s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(2) {
|
||||||
|
animation: love2 4s infinite;
|
||||||
|
animation-delay: 0.15s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(3) {
|
||||||
|
animation: love3 4s infinite;
|
||||||
|
animation-delay: 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(4) {
|
||||||
|
animation: love4 4s infinite;
|
||||||
|
animation-delay: 0.45s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(5) {
|
||||||
|
animation: love5 4s infinite;
|
||||||
|
animation-delay: 0.6s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(6) {
|
||||||
|
animation: love4 4s infinite;
|
||||||
|
animation-delay: 0.75s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(7) {
|
||||||
|
animation: love3 4s infinite;
|
||||||
|
animation-delay: 0.9s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(8) {
|
||||||
|
animation: love2 4s infinite;
|
||||||
|
animation-delay: 1.05s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item:nth-child(9) {
|
||||||
|
animation: love1 4s infinite;
|
||||||
|
animation-delay: 1.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes love1 {
|
||||||
|
30%,
|
||||||
|
50% {
|
||||||
|
height: 50rpx;
|
||||||
|
transform: translateY(-20rpx);
|
||||||
|
}
|
||||||
|
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
height: 20rpx;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes love2 {
|
||||||
|
30%,
|
||||||
|
50% {
|
||||||
|
height: 90rpx;
|
||||||
|
transform: translateY(-25rpx);
|
||||||
|
}
|
||||||
|
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
height: 20rpx;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes love3 {
|
||||||
|
30%,
|
||||||
|
50% {
|
||||||
|
height: 120rpx;
|
||||||
|
transform: translateY(-20rpx);
|
||||||
|
}
|
||||||
|
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
height: 20rpx;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes love4 {
|
||||||
|
30%,
|
||||||
|
50% {
|
||||||
|
height: 130rpx;
|
||||||
|
transform: translateY(-10rpx);
|
||||||
|
}
|
||||||
|
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
height: 20rpx;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes love5 {
|
||||||
|
30%,
|
||||||
|
50% {
|
||||||
|
height: 130rpx;
|
||||||
|
transform: translateY(10rpx);
|
||||||
|
}
|
||||||
|
|
||||||
|
75%,
|
||||||
|
100% {
|
||||||
|
height: 20rpx;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .item:nth-child(1) {
|
||||||
|
// height: 50rpx;
|
||||||
|
// transform: translateY(-20rpx);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .item:nth-child(2) {
|
||||||
|
// height: 90rpx;
|
||||||
|
// transform: translateY(-25rpx);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .item:nth-child(3) {
|
||||||
|
// height: 120rpx;
|
||||||
|
// transform: translateY(-20rpx);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .item:nth-child(4) {
|
||||||
|
// height: 130rpx;
|
||||||
|
// transform: translateY(-10rpx);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .item:nth-child(5) {
|
||||||
|
// height: 130rpx;
|
||||||
|
// transform: translateY(10rpx);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .item:nth-child(6) {
|
||||||
|
// height: 130rpx;
|
||||||
|
// transform: translateY(-10rpx);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .item:nth-child(7) {
|
||||||
|
// height: 120rpx;
|
||||||
|
// transform: translateY(-20rpx);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .item:nth-child(8) {
|
||||||
|
// height: 90rpx;
|
||||||
|
// transform: translateY(-25rpx);
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .item:nth-child(9) {
|
||||||
|
// height: 50rpx;
|
||||||
|
// transform: translateY(-20rpx);
|
||||||
|
// }
|
||||||
|
</style>
|
||||||
@ -0,0 +1,87 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="loader" :style="{ '--color': color }"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-photo",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#0396FF",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
.loader {
|
||||||
|
width: 128rpx;
|
||||||
|
height: 128rpx;
|
||||||
|
position: relative;
|
||||||
|
background: #f4f4f4;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader:before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
transform: rotate(45deg) translate(30%, 40%);
|
||||||
|
background: var(--color);
|
||||||
|
box-shadow: 64rpx -68rpx 0 10rpx var(--color);
|
||||||
|
animation: slide 2s infinite ease-in-out alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader:after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
left: 20rpx;
|
||||||
|
top: 20rpx;
|
||||||
|
width: 28rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: var(--color);
|
||||||
|
transform: rotate(0deg);
|
||||||
|
transform-origin: 70rpx 290rpx;
|
||||||
|
animation: rotate 2s infinite ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slide {
|
||||||
|
0% , 100% {
|
||||||
|
bottom: -70rpx
|
||||||
|
}
|
||||||
|
|
||||||
|
25% , 75% {
|
||||||
|
bottom: -4rpx
|
||||||
|
}
|
||||||
|
|
||||||
|
20% , 80% {
|
||||||
|
bottom: 4rpx
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes rotate {
|
||||||
|
0% {
|
||||||
|
transform: rotate(-15deg)
|
||||||
|
}
|
||||||
|
|
||||||
|
25% , 75% {
|
||||||
|
transform: rotate(0deg)
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(25deg)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,67 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box" :style="{ '--color': color }">
|
||||||
|
<view class="pulse-bubble pulse-bubble-1"></view>
|
||||||
|
<view class="pulse-bubble pulse-bubble-2"></view>
|
||||||
|
<view class="pulse-bubble pulse-bubble-3"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-pulse",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#0396FF",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.box {
|
||||||
|
width: 100rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse-bubble {
|
||||||
|
width: 16rpx;
|
||||||
|
height: 16rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: var(--color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse-bubble-1 {
|
||||||
|
// background: #1fa2ff;
|
||||||
|
animation: pulse 0.4s ease 0s infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse-bubble-2 {
|
||||||
|
// background: #12d8fa;
|
||||||
|
animation: pulse 0.4s ease 0.2s infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pulse-bubble-3 {
|
||||||
|
// background: #29ffc6;
|
||||||
|
animation: pulse 0.4s ease 0.4s infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
from {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 0.25;
|
||||||
|
transform: scale(0.75);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,132 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="radar">
|
||||||
|
<view class="dot dot-1"></view>
|
||||||
|
<view class="dot dot-2"></view>
|
||||||
|
<view class="dot dot-3"></view>
|
||||||
|
<view class="cover"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-radar",
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
$size: 180rpx;
|
||||||
|
$dotSize: 4rpx;
|
||||||
|
$maincolor: #2da3f6;
|
||||||
|
|
||||||
|
.radar {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
height: $size;
|
||||||
|
width: $size;
|
||||||
|
background: -webkit-repeating-radial-gradient(
|
||||||
|
rgba(45, 163, 246, 0) 0%,
|
||||||
|
rgba(45, 163, 246, 0) 23%,
|
||||||
|
rgba(45, 163, 246, 0.7) 24%,
|
||||||
|
rgba(45, 163, 246, 0) 25%
|
||||||
|
);
|
||||||
|
margin: 0 auto;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 2rpx solid rgba(45, 163, 246, 0.7);
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.radar::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
width: $dotSize;
|
||||||
|
height: $dotSize;
|
||||||
|
background: $maincolor;
|
||||||
|
margin-left: -1rpx;
|
||||||
|
margin-top: -1rpx;
|
||||||
|
border-radius: 1rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot {
|
||||||
|
position: absolute;
|
||||||
|
width: $dotSize;
|
||||||
|
height: $dotSize;
|
||||||
|
background: $maincolor;
|
||||||
|
opacity: 0;
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: breath 3s linear infinite;
|
||||||
|
box-shadow: 0 0 2rpx 2rpx rgba(45, 163, 246, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot-1 {
|
||||||
|
top: 50rpx;
|
||||||
|
left: 30rpx;
|
||||||
|
animation-delay: 1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot-2 {
|
||||||
|
top: 60rpx;
|
||||||
|
right: 20rpx;
|
||||||
|
animation-delay: 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot-3 {
|
||||||
|
top: 140rpx;
|
||||||
|
right: 100rpx;
|
||||||
|
animation-delay: 2.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cover {
|
||||||
|
transform-origin: bottom right;
|
||||||
|
border-right: 1rpx solid $maincolor;
|
||||||
|
background: linear-gradient(
|
||||||
|
45deg,
|
||||||
|
rgba(255, 255, 255, 0) 45%,
|
||||||
|
$maincolor 100%
|
||||||
|
);
|
||||||
|
width: 50%;
|
||||||
|
height: 50%;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
animation: rotation 3s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes rotation {
|
||||||
|
0% {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes breath {
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
10% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
20% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
40% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,140 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box">
|
||||||
|
<view class="sun"></view>
|
||||||
|
<view class="orbit orbit1">
|
||||||
|
<view class="planetX planet1"></view>
|
||||||
|
</view>
|
||||||
|
<view class="orbit orbit2">
|
||||||
|
<view class="planetX planet2"></view>
|
||||||
|
</view>
|
||||||
|
<view class="orbit orbit3">
|
||||||
|
<view class="planetX planet3"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-sun",
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.box {
|
||||||
|
width: 210rpx;
|
||||||
|
height: 210rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.sun {
|
||||||
|
background: radial-gradient(#ff0, #f90);
|
||||||
|
height: 50rpx;
|
||||||
|
width: 50rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.planetX {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 100;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.planet1 {
|
||||||
|
left: 20rpx;
|
||||||
|
height: 13rpx;
|
||||||
|
width: 13rpx;
|
||||||
|
background-color: #fed313;
|
||||||
|
}
|
||||||
|
|
||||||
|
.planet2 {
|
||||||
|
left: 23rpx;
|
||||||
|
height: 20rpx;
|
||||||
|
width: 20rpx;
|
||||||
|
background: linear-gradient(#00ff00, #09f, #09f);
|
||||||
|
-webkit-animation: rotation 1s infinite linear;
|
||||||
|
animation: rotation 1s infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.planet3 {
|
||||||
|
left: 49rpx;
|
||||||
|
height: 17rpx;
|
||||||
|
width: 17rpx;
|
||||||
|
background: radial-gradient(#ff9900, #ff4400);
|
||||||
|
}
|
||||||
|
|
||||||
|
.orbit {
|
||||||
|
background: transparent;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 1rpx solid #cccccc;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orbit1 {
|
||||||
|
height: 100rpx;
|
||||||
|
width: 100rpx;
|
||||||
|
-webkit-animation: rotation 2s infinite linear;
|
||||||
|
-moz-animation: rotation 2s infinite linear;
|
||||||
|
animation: rotation 2s infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orbit2 {
|
||||||
|
height: 150rpx;
|
||||||
|
width: 150rpx;
|
||||||
|
-webkit-animation: rotation 3s infinite linear;
|
||||||
|
-moz-animation: rotation 3s infinite linear;
|
||||||
|
animation: rotation 3s infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orbit3 {
|
||||||
|
height: 200rpx;
|
||||||
|
width: 200rpx;
|
||||||
|
-moz-animation: rotation 6s infinite linear;
|
||||||
|
-webkit-animation: rotation 6s infinite linear;
|
||||||
|
animation: rotation 6s infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes rotation {
|
||||||
|
from {
|
||||||
|
-webkit-transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
-webkit-transform: rotate(359deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes rotation {
|
||||||
|
from {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: rotate(359deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-moz-keyframes rotation {
|
||||||
|
from {
|
||||||
|
-moz-transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
-moz-transform: rotate(359deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,91 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box">
|
||||||
|
<view class="loader">
|
||||||
|
<view class="loader__ball"></view>
|
||||||
|
<view class="loader__ball"></view>
|
||||||
|
<view class="loader__ball"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-triangle",
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
$dotColor: linear-gradient(135deg, #1fa2ff, #12d8fa, #29ffc6);
|
||||||
|
$dotSize: 30rpx;
|
||||||
|
$duration: 2s;
|
||||||
|
.animations {
|
||||||
|
width: 160rpx;
|
||||||
|
height: 160rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.box {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
.loader {
|
||||||
|
animation: rotate $duration linear infinite normal;
|
||||||
|
position: relative;
|
||||||
|
transform-origin: 50% 50%;
|
||||||
|
|
||||||
|
&__ball {
|
||||||
|
height: $dotSize;
|
||||||
|
width: $dotSize;
|
||||||
|
left: -$dotSize * 0.5;
|
||||||
|
position: absolute;
|
||||||
|
top: -$dotSize * 0.5;
|
||||||
|
transform-origin: 50% 50%;
|
||||||
|
|
||||||
|
&:nth-of-type(2) {
|
||||||
|
transform: rotate(120deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-of-type(3) {
|
||||||
|
transform: rotate(240deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
animation: move $duration * 0.5 ease-in-out infinite alternate;
|
||||||
|
background: $dotColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
content: "";
|
||||||
|
display: inline-block;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
transform-origin: 50% 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes rotate {
|
||||||
|
from {
|
||||||
|
transform: rotate(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes move {
|
||||||
|
0%,
|
||||||
|
15% {
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: translateY(-150%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,81 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="box" :style="{ '--color': color }">
|
||||||
|
<view class="sword"></view>
|
||||||
|
<view class="sword"></view>
|
||||||
|
<view class="sword"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-sword",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#ED213A",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.box {
|
||||||
|
position: relative;
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
}
|
||||||
|
.sword {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.sword:nth-of-type(1) {
|
||||||
|
left: 0%;
|
||||||
|
top: 0%;
|
||||||
|
border-bottom: 8rpx solid var(--color);
|
||||||
|
animation: sword1 0.8s linear infinite;
|
||||||
|
}
|
||||||
|
.sword:nth-of-type(2) {
|
||||||
|
right: 0%;
|
||||||
|
top: 0%;
|
||||||
|
border-right: 8rpx solid var(--color);
|
||||||
|
animation: sword2 0.8s linear infinite;
|
||||||
|
}
|
||||||
|
.sword:nth-of-type(3) {
|
||||||
|
right: 0%;
|
||||||
|
bottom: 0%;
|
||||||
|
border-top: 8rpx solid var(--color);
|
||||||
|
animation: sword3 0.8s linear infinite;
|
||||||
|
}
|
||||||
|
@keyframes sword1 {
|
||||||
|
0% {
|
||||||
|
transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes sword2 {
|
||||||
|
0% {
|
||||||
|
transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes sword3 {
|
||||||
|
0% {
|
||||||
|
transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,127 @@
|
|||||||
|
<template>
|
||||||
|
<view class="animations">
|
||||||
|
<view class="three-body" :style="{ '--color': color }">
|
||||||
|
<view class="three-body__dot"></view>
|
||||||
|
<view class="three-body__dot"></view>
|
||||||
|
<view class="three-body__dot"></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "loading-wobble",
|
||||||
|
props: {
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#0396FF",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
$size: 100rpx;
|
||||||
|
$speed: 1s;
|
||||||
|
.three-body {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
height: $size;
|
||||||
|
width: $size;
|
||||||
|
animation: spin78236 calc($speed * 2.5) infinite linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.three-body__dot {
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
width: 27%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.three-body__dot:after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
height: 0%;
|
||||||
|
width: 100%;
|
||||||
|
padding-bottom: 100%;
|
||||||
|
background-color: var(--color);
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.three-body__dot:nth-child(1) {
|
||||||
|
bottom: 5%;
|
||||||
|
left: 0;
|
||||||
|
transform: rotate(60deg);
|
||||||
|
transform-origin: 50% 85%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.three-body__dot:nth-child(1)::after {
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
animation: wobble1 $speed infinite ease-in-out;
|
||||||
|
animation-delay: calc($speed * -0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.three-body__dot:nth-child(2) {
|
||||||
|
bottom: 5%;
|
||||||
|
right: 0;
|
||||||
|
transform: rotate(-60deg);
|
||||||
|
transform-origin: 50% 85%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.three-body__dot:nth-child(2)::after {
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
animation: wobble1 $speed infinite calc($speed * -0.15) ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
.three-body__dot:nth-child(3) {
|
||||||
|
bottom: -5%;
|
||||||
|
left: 0;
|
||||||
|
transform: translateX(116.666%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.three-body__dot:nth-child(3)::after {
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
animation: wobble2 $speed infinite ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin78236 {
|
||||||
|
0% {
|
||||||
|
transform: rotate(0deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes wobble1 {
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
transform: translateY(0%) scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: translateY(-66%) scale(0.65);
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes wobble2 {
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
transform: translateY(0%) scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
transform: translateY(66%) scale(0.65);
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,186 @@
|
|||||||
|
<template>
|
||||||
|
<!-- -->
|
||||||
|
<view
|
||||||
|
:style="{ position: position, 'z-index': zIndex, '--opacity': maskOpacity }"
|
||||||
|
class="container"
|
||||||
|
:class="[
|
||||||
|
mask ? 'mask' : '',
|
||||||
|
maskMini ? 'mask-mini' : '',
|
||||||
|
(mask || maskMini) && maskDark ? 'mask-dark' : '',
|
||||||
|
]"
|
||||||
|
@click.prevent="handleClick"
|
||||||
|
>
|
||||||
|
<view>
|
||||||
|
<view class="main">
|
||||||
|
<loading0 v-if="type == 'circle'" :color="color"></loading0>
|
||||||
|
<loading1 v-if="type == 'pulse'" :color="color"></loading1>
|
||||||
|
<loading2 v-if="type == 'bounce'"></loading2>
|
||||||
|
<loading3 v-if="type == 'eyes'"></loading3>
|
||||||
|
<loading4 v-if="type == 'surround'"></loading4>
|
||||||
|
<loading5 v-if="type == 'sun'"></loading5>
|
||||||
|
<loading6 v-if="type == 'love'"></loading6>
|
||||||
|
<loading7 v-if="type == 'sword'" :color="color"></loading7>
|
||||||
|
<loading8 v-if="type == 'atom'" :color="color"></loading8>
|
||||||
|
<loading9 v-if="type == 'gear'"></loading9>
|
||||||
|
<loading10 v-if="type == 'radar'"></loading10>
|
||||||
|
<loading11 v-if="type == 'annulus'" :color="color"></loading11>
|
||||||
|
<loading12 v-if="type == 'wobble'" :color="color"></loading12>
|
||||||
|
<loading13 v-if="type == 'equal'" :color="color"></loading13>
|
||||||
|
<loading14 v-if="type == 'photo'" :color="color"></loading14>
|
||||||
|
<loading15 v-if="type == 'locating'" :color="color"></loading15>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
class="tips"
|
||||||
|
v-if="showText"
|
||||||
|
:style="{ color: textColor, fontSize: textSize, marginTop: textGap }"
|
||||||
|
>{{ text }}</view
|
||||||
|
>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import loading0 from "./static/loading-circle.vue";
|
||||||
|
import loading1 from "./static/loading-pulse.vue";
|
||||||
|
import loading2 from "./static/loading-bounce.vue";
|
||||||
|
import loading3 from "./static/loading-eyes.vue";
|
||||||
|
import loading4 from "./static/loading-surround.vue";
|
||||||
|
import loading5 from "./static/loading-sun.vue";
|
||||||
|
import loading6 from "./static/loading-love.vue";
|
||||||
|
import loading7 from "./static/loading-sword.vue";
|
||||||
|
import loading8 from "./static/loading-atom.vue";
|
||||||
|
import loading9 from "./static/loading-gear.vue";
|
||||||
|
import loading10 from "./static/loading-radar.vue";
|
||||||
|
import loading11 from "./static/loading-annulus.vue";
|
||||||
|
import loading12 from "./static/loading-wobble.vue";
|
||||||
|
import loading13 from "./static/loading-equal.vue";
|
||||||
|
import loading14 from "./static/loading-photo.vue";
|
||||||
|
import loading15 from "./static/loading-locating.vue";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "zero-loading",
|
||||||
|
components: {
|
||||||
|
loading0,
|
||||||
|
loading1,
|
||||||
|
loading2,
|
||||||
|
loading3,
|
||||||
|
loading4,
|
||||||
|
loading5,
|
||||||
|
loading6,
|
||||||
|
loading7,
|
||||||
|
loading8,
|
||||||
|
loading9,
|
||||||
|
loading10,
|
||||||
|
loading11,
|
||||||
|
loading12,
|
||||||
|
loading13,
|
||||||
|
loading14,
|
||||||
|
loading15,
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
type: {
|
||||||
|
type: String,
|
||||||
|
default: "atom",
|
||||||
|
},
|
||||||
|
position: {
|
||||||
|
type: String,
|
||||||
|
default: "fixed",
|
||||||
|
},
|
||||||
|
zIndex: {
|
||||||
|
type: Number,
|
||||||
|
default: 9,
|
||||||
|
},
|
||||||
|
mask: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
maskOpacity: {
|
||||||
|
type: Number,
|
||||||
|
default: 0.1,
|
||||||
|
},
|
||||||
|
maskMini: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
maskDark: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true,
|
||||||
|
},
|
||||||
|
color: {
|
||||||
|
type: String,
|
||||||
|
default: "#0396FF",
|
||||||
|
},
|
||||||
|
showText: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
|
text: {
|
||||||
|
type: String,
|
||||||
|
default: "加载中...",
|
||||||
|
},
|
||||||
|
textSize: {
|
||||||
|
type: String,
|
||||||
|
default: "28rpx",
|
||||||
|
},
|
||||||
|
textColor: {
|
||||||
|
type: String,
|
||||||
|
default: "#333333",
|
||||||
|
},
|
||||||
|
textGap: {
|
||||||
|
type: String,
|
||||||
|
default: "40rpx",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleClick() {
|
||||||
|
this.$emit("click");
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.container {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.tips {
|
||||||
|
// margin-top: 40rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mask {
|
||||||
|
z-index: 999 !important;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
background: rgba(255, 255, 255, var(--opacity));
|
||||||
|
transform: translate(0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.mask-mini {
|
||||||
|
height: 300rpx;
|
||||||
|
width: 300rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.mask-dark {
|
||||||
|
background: rgba(7, 17, 27, var(--opacity));
|
||||||
|
}
|
||||||
|
</style>
|
||||||
83
src/uni_modules/zero-loading/package.json
Normal file
83
src/uni_modules/zero-loading/package.json
Normal file
@ -0,0 +1,83 @@
|
|||||||
|
{
|
||||||
|
"id": "zero-loading",
|
||||||
|
"displayName": "zero-loading(加载动画)",
|
||||||
|
"version": "1.4.2",
|
||||||
|
"description": "纯css加载动画, 一个标签元素即可实现炫酷的全屏loading效果,支持vue2,vue3",
|
||||||
|
"keywords": [
|
||||||
|
"loading",
|
||||||
|
"加载动画",
|
||||||
|
"css动画",
|
||||||
|
"加载"
|
||||||
|
],
|
||||||
|
"repository": "",
|
||||||
|
"engines": {
|
||||||
|
"HBuilderX": "^3.1.0"
|
||||||
|
},
|
||||||
|
"dcloudext": {
|
||||||
|
"sale": {
|
||||||
|
"regular": {
|
||||||
|
"price": "0.00"
|
||||||
|
},
|
||||||
|
"sourcecode": {
|
||||||
|
"price": "0.00"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"contact": {
|
||||||
|
"qq": ""
|
||||||
|
},
|
||||||
|
"declaration": {
|
||||||
|
"ads": "无",
|
||||||
|
"data": "插件不采集任何数据",
|
||||||
|
"permissions": "无"
|
||||||
|
},
|
||||||
|
"npmurl": "",
|
||||||
|
"type": "component-vue"
|
||||||
|
},
|
||||||
|
"uni_modules": {
|
||||||
|
"dependencies": [],
|
||||||
|
"encrypt": [],
|
||||||
|
"platforms": {
|
||||||
|
"cloud": {
|
||||||
|
"tcb": "y",
|
||||||
|
"aliyun": "y",
|
||||||
|
"alipay": "n"
|
||||||
|
},
|
||||||
|
"client": {
|
||||||
|
"Vue": {
|
||||||
|
"vue2": "y",
|
||||||
|
"vue3": "y"
|
||||||
|
},
|
||||||
|
"App": {
|
||||||
|
"app-vue": "u",
|
||||||
|
"app-nvue": "u",
|
||||||
|
"app-harmony": "u",
|
||||||
|
"app-uvue": "u"
|
||||||
|
},
|
||||||
|
"H5-mobile": {
|
||||||
|
"Safari": "y",
|
||||||
|
"Android Browser": "y",
|
||||||
|
"微信浏览器(Android)": "y",
|
||||||
|
"QQ浏览器(Android)": "y"
|
||||||
|
},
|
||||||
|
"H5-pc": {
|
||||||
|
"Chrome": "y",
|
||||||
|
"IE": "u",
|
||||||
|
"Edge": "y",
|
||||||
|
"Firefox": "y",
|
||||||
|
"Safari": "y"
|
||||||
|
},
|
||||||
|
"小程序": {
|
||||||
|
"微信": "y",
|
||||||
|
"阿里": "u",
|
||||||
|
"百度": "u",
|
||||||
|
"字节跳动": "u",
|
||||||
|
"QQ": "u"
|
||||||
|
},
|
||||||
|
"快应用": {
|
||||||
|
"华为": "u",
|
||||||
|
"联盟": "u"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
69
src/uni_modules/zero-loading/readme.md
Normal file
69
src/uni_modules/zero-loading/readme.md
Normal file
@ -0,0 +1,69 @@
|
|||||||
|
# zero-loading
|
||||||
|
|
||||||
|
> 仅测试于 vue2, vue3, 微信小程序. 其他平台自行测试
|
||||||
|
|
||||||
|
## 使用方法
|
||||||
|
|
||||||
|
导入 `uni_modules` 后直接使用即可
|
||||||
|
|
||||||
|
提供多种加载动画类型,传入 type 改变 loading 样式，不传默认 circle
|
||||||
|
|
||||||
|
### 全屏使用
|
||||||
|
|
||||||
|
```html
|
||||||
|
<zero-loading v-if="loading"></zero-loading>
|
||||||
|
```
|
||||||
|
|
||||||
|
### 局部使用
|
||||||
|
|
||||||
|
**父元素的 `position` 记得改为 `relative` 不然可能影响效果**
|
||||||
|
|
||||||
|
```html
|
||||||
|
<zero-loading type="pulse" position="absolute"></zero-loading>
|
||||||
|
```
|
||||||
|
|
||||||
|
## 参数说明
|
||||||
|
|
||||||
|
| 参数 | 类型 | 默认值 | 描述 |
|
||||||
|
| ----------- | -------- | --------- | ---------------------------------------------- |
|
||||||
|
| type | String | atom | 样式 |
|
||||||
|
| position | String | fixed | 定位方式 |
|
||||||
|
| zIndex | Number | 9 | |
|
||||||
|
| mask | Boolean | false | 是否需要遮罩 (默认为全屏遮罩,背景色默认为黑色) |
|
||||||
|
| maskOpacity | Number | 0.1 | 遮罩透明度 |
|
||||||
|
| maskMini | Boolean | false | 传入 true 时,使用小遮罩 |
|
||||||
|
| maskDark | Boolean | true | 传入 false 时,遮罩背景色为白色 |
|
||||||
|
| color | String | #0396FF | 自定义颜色,仅部分支持 |
|
||||||
|
| showText | showText | false | 是否显示文字 |
|
||||||
|
| text | String | 加载中... | 文本内容 |
|
||||||
|
| textSize | String | 28rpx | 文字大小 |
|
||||||
|
| textColor | String | #333333 | 文字颜色 |
|
||||||
|
| textGap | String | 40rpx | 文字与 loading 动画的间距 |
|
||||||
|
|
||||||
|
### type 可选值：
|
||||||
|
|
||||||
|
| type 值 | 描述 |
|
||||||
|
| -------- | ----------------- |
|
||||||
|
| locating | 定位 (自定义颜色) |
|
||||||
|
| photo | 照片 (自定义颜色) |
|
||||||
|
| equal | 等边 (自定义颜色) |
|
||||||
|
| wobble | 摇摆 (自定义颜色) |
|
||||||
|
| annulus | 圆环 (自定义颜色) |
|
||||||
|
| sword | 剑气 (自定义颜色) |
|
||||||
|
| atom | 原子 (自定义颜色) |
|
||||||
|
| pulse | 脉冲 (自定义颜色) |
|
||||||
|
| circle | 圆圈 (自定义颜色) |
|
||||||
|
| eyes | 眼睛 |
|
||||||
|
| surround | 环绕 |
|
||||||
|
| bounce | 弹跳 |
|
||||||
|
| radar | 雷达 |
|
||||||
|
| gear | 齿轮 |
|
||||||
|
| love | 爱心 |
|
||||||
|
| sun | 太阳 |
|
||||||
|
|
||||||
|
插件预览:
|
||||||
|
|
||||||
|
|
||||||
|
> 小程序搜索: 零技术
|
||||||
|
|
||||||
|
> 预览的小程序不一定能及时更新当前插件
|
||||||
@ -1 +1,36 @@
|
|||||||
export const BarHeight = uni.getSystemInfoSync().statusBarHeight
|
export const BarHeight = uni.getSystemInfoSync().statusBarHeight
|
||||||
|
|
||||||
|
//保留两位小数
|
||||||
|
export function setNum(v?:any){
|
||||||
|
if(v){
|
||||||
|
v = v+''
|
||||||
|
//替换掉数字和小数点 . 之外的字符
|
||||||
|
v = v.replace(/[^\d.]/g,'')
|
||||||
|
//把2个以上的小数点 . 替换成一个小数点 .
|
||||||
|
v = v.replace(/\.{2,}/g,'.')
|
||||||
|
//保证第一个字符为数字而不是小数点 .
|
||||||
|
v = v.replace(/^\./g,'')
|
||||||
|
//保证最后一个字符为数字而不是小数点 .
|
||||||
|
//v = v.replace(/\.$/g,'')
|
||||||
|
//保证小数点 . 只出现一次，而不能出现两次以上
|
||||||
|
v = v.replace('.','$#$').replace(/\./g,'').replace('$#$','.')
|
||||||
|
//只能输入两个小数
|
||||||
|
v = v.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')
|
||||||
|
|
||||||
|
if(/^0+[1-9]$/.test(v) || /^0+\d+\./.test(v)) {
|
||||||
|
v = v.replace(/^0+/,'')
|
||||||
|
}
|
||||||
|
if(/^(0+\.)/.test(v) || /^0+\.$/.test(v) || /^0+$/.test(v)) {
|
||||||
|
v = v.replace(/^0+/,'0')
|
||||||
|
}
|
||||||
|
return v
|
||||||
|
}
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
|
||||||
|
//是否是今天
|
||||||
|
//date : new Date(2025-04-01)
|
||||||
|
export function isToday(date:any) {
|
||||||
|
const today = new Date()
|
||||||
|
return date.toISOString().slice(0, 10) === today.toISOString().slice(0, 10)
|
||||||
|
}
|
||||||
@ -1,7 +1,6 @@
|
|||||||
const ENV = process.env.APP_ENV || process.env.NODE_ENV;
|
const ENV = process.env.APP_ENV || process.env.NODE_ENV;
|
||||||
|
|
||||||
const confing = {
|
const development = {
|
||||||
development: {
|
|
||||||
// #ifdef MP-WEIXIN
|
// #ifdef MP-WEIXIN
|
||||||
//apiBaseUrl:'https://587910rq36.zicp.fun' //'http://192.168.110.73:8082/' //https://xcjf.56365.cc/' //'/fetch'//网站域名接口地址参考，发布小程序和APP时使用
|
//apiBaseUrl:'https://587910rq36.zicp.fun' //'http://192.168.110.73:8082/' //https://xcjf.56365.cc/' //'/fetch'//网站域名接口地址参考，发布小程序和APP时使用
|
||||||
// #endif
|
// #endif
|
||||||
@ -9,16 +8,18 @@ const confing = {
|
|||||||
// #ifdef H5
|
// #ifdef H5
|
||||||
//apiBaseUrl:'https://587910rq36.zicp.fun' //'/fetch/' //'http://192.168.110.73:8082/' //https://xcjf.56365.cc/' //'/fetch'//网站域名接口地址参考，发布小程序和APP时使用
|
//apiBaseUrl:'https://587910rq36.zicp.fun' //'/fetch/' //'http://192.168.110.73:8082/' //https://xcjf.56365.cc/' //'/fetch'//网站域名接口地址参考，发布小程序和APP时使用
|
||||||
// #endif
|
// #endif
|
||||||
apiBaseUrl:'http://192.168.5.213:9100/gateway'
|
//apiBaseUrl:'http://192.168.5.213:9100/gateway'
|
||||||
},
|
apiBaseUrl:'http://192.168.5.14:9104'
|
||||||
production: {
|
|
||||||
//apiBaseUrl:'http://124.239.176.15:8888',
|
|
||||||
apiBaseUrl:'https://api.evo-techina.com'
|
|
||||||
//API_URL:'http://chuangcheng.56365.cc' //测试环境
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const production = {
|
||||||
|
//apiBaseUrl:'http://124.239.176.15:8888',
|
||||||
|
apiBaseUrl:'https://api.evo-techina.com'
|
||||||
|
//API_URL:'http://chuangcheng.56365.cc' //测试环境
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
ENV,
|
ENV,
|
||||||
...confing[ENV]
|
config:ENV == 'production'?production:development
|
||||||
}
|
}
|
||||||
24
src/utils/configtab.ts
Normal file
24
src/utils/configtab.ts
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
export default {
|
||||||
|
color: "#161616",
|
||||||
|
selectedColor: "#161616",
|
||||||
|
borderStyle: "black",
|
||||||
|
backgroundColor: "#ffffff",
|
||||||
|
list: [{
|
||||||
|
pagePath: "/pages/home/index",
|
||||||
|
iconPath: "/static/img/tabbar/home.png",
|
||||||
|
selectedIconPath: "/static/img/tabbar/home.png",
|
||||||
|
text: "首页",
|
||||||
|
openType: 'navigate', //新版本新增，页面被打开方式，默认为reLaunch
|
||||||
|
//dot: 1 //新版本新增参数，详细看页面最下方使用说明
|
||||||
|
}, {
|
||||||
|
pagePath: "/pages/scanCode/index",
|
||||||
|
iconPath: "/static/img/tabbar/saom.png",
|
||||||
|
selectedIconPath: "/static/img/tabbar/saom.png",
|
||||||
|
text: "扫码换电"
|
||||||
|
}, {
|
||||||
|
pagePath: "/pages/mine/index",
|
||||||
|
iconPath: "/static/img/tabbar/wode.png",
|
||||||
|
selectedIconPath: "/static/img/tabbar/wode.png",
|
||||||
|
text: "我的"
|
||||||
|
}]
|
||||||
|
}
|
||||||
@ -28,8 +28,8 @@ export function request(method:any,url:string,data?:any,isLoading?:any){
|
|||||||
httpList.push(
|
httpList.push(
|
||||||
uni.request({
|
uni.request({
|
||||||
header:headers,
|
header:headers,
|
||||||
//url:'http://192.168.5.200:9100/gateway'+ url,//`${conf.apiBaseUrl}${url}`,
|
//url:`${conf.config.apiBaseUrl}${url}`,
|
||||||
//url:'http://192.168.5.14:9104'+ url,
|
//url:'http://192.168.5.200:9104'+ url,
|
||||||
url:'https://api.evo-techina.com'+url,
|
url:'https://api.evo-techina.com'+url,
|
||||||
method,
|
method,
|
||||||
data:data,
|
data:data,
|
||||||
|
|||||||
@ -236,4 +236,14 @@ export function balancpay(parameter:Bapay){
|
|||||||
//查询用户是否开通余额
|
//查询用户是否开通余额
|
||||||
export function isktbal(wuid:string){
|
export function isktbal(wuid:string){
|
||||||
return request('post_form','/wechat/wechat/user/wallet/isOpenAccount',{wuid})
|
return request('post_form','/wechat/wechat/user/wallet/isOpenAccount',{wuid})
|
||||||
|
}
|
||||||
|
|
||||||
|
//开始换电
|
||||||
|
export function starthz(wuid:string,orderId:string){
|
||||||
|
return request('post_form','/wechat/order/swap/startSwap',{wuid,orderId})
|
||||||
|
}
|
||||||
|
|
||||||
|
//查询启动换电是否成功
|
||||||
|
export function gethzmsg(wuid:string,orderId:string){
|
||||||
|
return request('post_form','/wechat/order/swap/getStartSwap',{wuid,orderId},false)
|
||||||
}
|
}
|
||||||
Loading…
Reference in New Issue
Block a user