Compare commits

..

14 Commits

Author SHA1 Message Date
zmj 05a69374ea add 2024-06-21 10:59:01 +08:00
zmj 4220fd42ad add 2024-06-20 18:45:16 +08:00
zmj 6bfc0b0d48 add 2024-06-20 16:28:19 +08:00
zmj de66593e4a add 2024-06-20 14:58:05 +08:00
zmj 02faeccc96 add 2024-06-20 13:45:12 +08:00
zmj b6b5fbd790 add 2024-06-20 13:39:08 +08:00
zmj aa324b5ceb ad 2024-06-20 11:53:55 +08:00
weipengfei acebf1a3ac 更新 2024-06-19 19:09:26 +08:00
weipengfei 83a8306ea4 更新 2024-06-19 18:41:03 +08:00
zmj 8c33ae1516 add 2024-06-18 19:03:33 +08:00
zmj ca9c5bfbf1 add 2024-06-18 15:50:26 +08:00
zmj 2a1e112e57 Merge branch 'dev' of https://gitea.lihaink.cn/weipengfei/purchase-let 2024-06-18 14:27:11 +08:00
weipengfei 6f6ceda684 Merge branch 'master' of https://gitea.lihaink.cn/weipengfei/purchase-let 2024-06-18 11:36:53 +08:00
weipengfei bdf4b08ef2 更新 2024-06-18 11:36:47 +08:00
20 changed files with 973 additions and 69 deletions

View File

@ -4,7 +4,7 @@
console.log('App Launch');
},
onShow: function() {
console.log('App Show')
console.log('App Show');
},
onHide: function() {
console.log('App Hide');

View File

@ -22,3 +22,11 @@ export const villageListApi = (data) => {
export const brigadeListApi = (data) => {
return request.get('/brigade', data);
}
export const getMassageCode = (data) => {
return request.post('/brigade', data);
}
export const setPayPassword = (data) => {
return request.post('/brigade', data);
}

View File

@ -86,7 +86,7 @@
const change = () => {
if (+datas.value.cart_num < +datas.value.batch) return uni.$u.toast(
`购买数量不能小于${datas.value.cart_num}${datas.value.unit_name}`);
`购买数量不能小于${datas.value.batch}${datas.value.unit_name}`);
if (subtotal.value <= 0) {
uni.$u.toast('金额不可小于等于0');
datas.value.cart_num = '';
@ -97,8 +97,8 @@
const subtotal = computed(() => {
let num = +datas.value.cart_num || 0;
let sell = +datas.value.sell || datas.value.price;
return Math.ceil(num * sell * 100) / 100
let sell = +datas.value.sell || +datas.value.price;
return Number(num * sell * 100 / 100).toFixed(2)
})
defineExpose({

146
components/pwdKeyBord.vue Normal file
View File

@ -0,0 +1,146 @@
<template>
<!-- <up-popup ref="popup" type="bottom" :mask-background-color="isPay?'rgba(0,0,0,.8)':'transparent'" safeArea
backgroundColor="transparent" :animation="true" @maskClick="maskClick">
<view class="popup-wrap" :style="{'border-radius':isPay?'': 0}">
<view class="paybox" v-if="isPay">
<view class="paybox-title">
<view class="paybox-title-left"></view>
<view class="paybox-title-middle">{{title}}</view>
<view class="paybox-titler-right" @click="handleClose">
<up-icon name="close" size="18" color="#666" />
</view>
</view>
<view class="paybox-input">
<u-code-input v-model="value" mode="box" dot readonly></u-code-input>
</view>
</view>
<view class="keyboard">
<view class="keyboard-left" :style="{width:isPay?'100%':''}">
<block v-for="(item,indx) in keys" :key="indx">
<view class="keyboard-left-item active del" v-if="item=='del'" @click="handleClick(item)">
<image style="width: 48rpx;height: 48rpx;" src="@/static/del.webp" />
</view>
<view class="keyboard-left-item word active" :style="{width:isPay?'0%':'',border:isPay?'0':''}"
v-else-if="item == '.'" @click="handleClick(item)">
{{isPay?'':item}}
</view>
<view class="keyboard-left-item word active" :style="{width:(isPay && item == '0')?'66.66%':''}"
v-else @click="handleClick(item)">
{{item}}
</view>
</block>
</view>
<view class="keyboard-right" :style="{width:isPay?'0%':''}">
<view class="keyboard-right-clear word active" @click="handleClear">清空</view>
<view class="keyboard-right-pay word active-pay" @click="handlePay">{{txt}}</view>
</view>
</view>
</view>
</up-popup> -->
<view class="">
sds
</view>
</template>
<script setup></script>
<style lang="scss" scoped>
.popup-wrap {
background-color: #fff;
border-radius: 30rpx 30rpx 0 0;
.paybox {
.paybox-title {
display: flex;
justify-content: space-between;
padding: 40rpx;
.paybox-title-left {}
.paybox-title-middle {
font-size: 30rpx;
font-weight: bold;
color: #333;
}
.paybox-titler-right {}
}
.paybox-input {
display: flex;
justify-content: center;
margin-bottom: 40rpx;
:deep(.u-code-input__item) {
background-color: #E6E6E6;
border-radius: 8rpx;
border: 0 !important;
}
}
}
}
.keyboard {
display: flex;
padding-bottom: 20rpx;
border-top: 2rpx solid #E6E6E6;
.keyboard-left {
width: 75%;
display: flex;
flex-wrap: wrap;
.keyboard-left-item {
width: 33.3%;
height: 120rpx;
line-height: 102rpx;
border-bottom: 2rpx solid #E6E6E6;
border-right: 2rpx solid #E6E6E6;
}
.del {
display: flex;
justify-content: center;
align-items: center;
}
}
.keyboard-right {
width: 25%;
.keyboard-right-clear {
width: 100%;
height: 120rpx;
line-height: 120rpx;
}
.keyboard-right-pay {
width: 100%;
height: 360rpx;
line-height: 360rpx;
text-align: center;
background-color: #40AE36;
color: #fff !important;
}
}
.word {
font-weight: 600;
font-size: 34rpx;
color: #000000;
text-align: center;
}
.active:active {
background-color: rgba(232, 232, 232, 0.5);
}
.active-pay:active {
opacity: .9;
}
}
</style>

View File

@ -10,7 +10,7 @@ switch (env) {
BASE_URL = 'https://test-multi-store.lihaink.cn';
break;
case 'liu':
BASE_URL = 'http://192.168.1.22:8545';
BASE_URL = 'http://192.168.1.201:8545';
break;
default:
BASE_URL = 'https://multi-store.lihaink.cn';

View File

@ -89,6 +89,7 @@
//
const onChooseShop = (item) => {
return
currShop.value = item.id;
uni.setStorageSync('STORE_INFO', JSON.stringify(item));
// ,
@ -161,10 +162,8 @@
const getLocation = () => {
let location = uni.getStorageSync('location');
if (location) {
let [lng, lat] = location.split(',');
queryParams.longitude = lng;
queryParams.latitude = lat;
queryParams.longitude = location.lat
queryParams.latitude = location.long
//
getShopList();
} else {
@ -178,7 +177,10 @@
getShopList();
//
uni.setStorageSync('location', `${res.longitude},${res.latitude}`)
uni.setStorageSync('location', {
lat: queryParams.latitude,
long: queryParams.longitude
})
}
})
}

View File

@ -161,6 +161,13 @@
"navigationBarTitleText": "确认订单",
"enablePullDownRefresh": false
}
},
{
"path": "setPayPassword/index",
"style": {
"navigationBarTitleText": "设置密码",
"enablePullDownRefresh": false
}
}
]
},
@ -228,6 +235,8 @@
"enablePullDownRefresh": true
}
}
]
}
],

View File

@ -109,8 +109,15 @@
</view>
</view>
<view style="width: 200rpx;">
<up-button color="#20b128" shape="circle" :disabled="!checkAll" @click="settleAccounts">去结算<text
v-if="checkAll">({{checkAll}})</text></up-button>
<up-button color="#20b128" shape="circle" :disabled="!checkAll || c_price0<500 "
@click="settleAccounts">
<view class="" v-if='c_price0>=500'>
去结算<text v-if="checkAll">({{checkAll}})</text>
</view>
<view class="" v-else>
¥500起订
</view>
</up-button>
</view>
</view>
<view v-else class="btn-boxs">

View File

@ -24,7 +24,7 @@
<view class="store-info">
<view style="display: flex;font-size: 30rpx;font-weight: bold;">
<text v-if="userStore.userInfo.user_ship==1 || shareInfo.store_id"
style="max-width: 400rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{(shareInfo.real_name||userStore.userInfo.nickname) + '的供销个人门店' }}</text>
style="max-width: 400rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{(shareInfo.real_name||( userStore.userInfo.real_name|| userStore.userInfo.nickname)) + '的供销个人门店' }}</text>
<text v-else
style="max-width: 400rpx;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">{{STORE_INFO.store_name}}</text>
<up-icon name="arrow-right"></up-icon>
@ -134,29 +134,29 @@
scroll-y @scrolltolower="loadMoreGood">
<view class="shop-item" v-for="(item, index) in goodList" :key="item.id"
@click="openGoodPopup(item)">
<view class="shop-img">
<up-image width="120rpx" height="120rpx" :src="item.image"></up-image>
<view class="shop-img"
:style="{backgroundImage: `url(${item.image}?x-oss-process=image/format,webp)`}">
</view>
<view class="shop-content">
<view class="title">
<view class="name u-line-2">{{item.store_name}}</view>
<view class="tip u-line-1">
<text>{{item.spec}}</text>
<!-- <text>{{item.brand_name}}|</text> -->
<!-- <text>{{item.class_name}}|</text> -->
<!-- <text>{{item.unit_name}}</text> -->
</view>
</view>
<view style="display: flex;" v-if='userStore?.userInfo?.user_ship==1'>
<view class="price" style="margin-right: 10rpx;">{{item.vip_price}}</view>
<text class='price'>会员价</text>
</view>
<view class="price-btn">
<view class="price">{{item.price}}</view>
<view class="price" style="font-size: 24rpx;">{{item.price}}</view>
<view class="btn">
<u--icon name="plus-circle-fill" size="20" color="#20b128"></u--icon>
</view>
</view>
</view>
</view>
<view style="width: 100%;height: 350rpx;"></view>
<view style="width: 100%;height: 470rpx;"></view>
</scroll-view>
</view>
</view>
@ -172,7 +172,8 @@
</view> -->
</view>
<view class="btn">
<up-button color="#20b128" :disabled="cartInfo.count==0" @click="settleAccounts">结算</up-button>
<up-button color="#20b128" :disabled="cartInfo.total_price<500" @click="settleAccounts">
{{cartInfo.total_price<500?"¥500起订":"结算" }} </up-button>
</view>
<view class="cart" @click="navTo('/pages/cart/cart')">
<image src="@/static/icon/cart.png"></image>
@ -222,8 +223,8 @@
import useUserStore from "@/store/user";
const userStore = useUserStore();
const STORE_INFO = reactive({
id: 5,
store_name: "测试"
id: 4,
store_name: "农(特)产品直营店"
})
const getStoreInfoFn = () => {
@ -232,11 +233,14 @@
for (let key in data) {
STORE_INFO[key] = data[key]
}
} else {
getStoreInfo().then(res => {
uni.setStorageSync("STORE_INFO", JSON.stringify(res.data))
})
}
getStoreInfo().then(res => {
uni.setStorageSync("STORE_INFO", JSON.stringify(res.data));
let data = res.data;
for (let key in data) {
STORE_INFO[key] = data[key]
}
})
}
getStoreInfoFn()
@ -249,7 +253,7 @@
.real_name || userStore.userInfo.nickname)
}
let shareInfo = {
title: userStore.userInfo.nickname,
title: (userStore.userInfo.real_name || userStore.userInfo.nickname) + '的供销个人门店',
path: '/pages/index/index' + shareStr,
imageUrl: STORE_INFO.image || '',
success() {
@ -263,12 +267,14 @@
})
/*商品列表滚动隐藏头部导航 */
const instance = getCurrentInstance(); //
const targetHeight = ref(0)
let scoHeight = 0
const isScroll = ref(false)
let lastScollTop = 0
const hideHeadView = (e) => {
if (e.detail.scrollTop <= 0 || e.detail.scrollTop >= targetHeight.value) return
if (e.detail.scrollTop < 100) return
if (e.detail.scrollTop <= 0 || e.detail.scrollTop > targetHeight.value)
return
isScroll.value = e.detail.scrollTop > lastScollTop
lastScollTop = e.detail.scrollTop
}
@ -290,6 +296,8 @@
const leftActive = ref(0);
const changeTwo = (item, index) => {
isScroll.value = false;
getWXDom(instance)
leftActive.value = item.id;
show.value = 0;
goodClassThree.value = item?.children || [];
@ -334,7 +342,7 @@
const where = ref({
page_no: 1,
page_size: 25,
page_size: 15,
name: '',
order: '',
store_name: '',
@ -372,6 +380,8 @@
//
const loadMoreGood = () => {
getWXDom(instance)
getGoodList(true);
}
@ -558,6 +568,13 @@
store_id: ''
});
const getShareInfo = () => {
if (uni.getStorageSync('SHARE_INFO')) {
shareInfo.value = (uni.getStorageSync('SHARE_INFO'))
}
}
getShareInfo()
onLoad(async (opt) => {
where.value.store_id = opt.id || STORE_INFO.id;
// id
@ -576,8 +593,10 @@
}
getgoodClassList(0);
getGoodList();
// #ifndef H5
//
btns.value = uni.getMenuButtonBoundingClientRect();
// #endif
})
onShow(() => {
@ -597,8 +616,8 @@
}
});
onMounted(() => {
const instance = getCurrentInstance(); //
let instance; //
const getWXDom = () => {
let query = uni.createSelectorQuery().in(instance).select("#drag_area");
query.fields({
@ -606,12 +625,16 @@
scrollOffset: true,
},
(data) => {
scoHeight = data.scrollHeight
targetHeight.value = data.scrollHeight - data.height
}
).exec();
}
onMounted(() => {
instance = getCurrentInstance(); //
setTimeout(() => {
getWXDom()
getWXDom(instance)
}, 500)
})
</script>
@ -919,6 +942,8 @@
margin-right: 20rpx;
border-radius: 14rpx;
overflow: hidden;
background-size: 100% 100%;
// background-image: url();
}
.shop-content {

View File

@ -16,7 +16,7 @@
<up-button @click="weixinLogin" color="#20B128" size="large"><up-icon name="weixin-fill"
color="#fff" size="28"></up-icon></up-button>
</view>
<view class="btn">
<view class="btn" v-if="config.ENV=='dev'">
<up-button @click="navgo('/pages/login/test')" color="#20B128" size="large"><up-icon
name="weixin-fill" color="#fff" size="28"></up-icon></up-button>
</view>
@ -96,6 +96,9 @@
import useUserStore from "@/store/user.js"
import bindPhone from "@/components/bindPhone.vue"
import modal from "@/components/modal.vue"
import {
config
} from "@/config/app.js"
const showOfficial = ref(false);

View File

@ -44,20 +44,20 @@
<view class="rest">
<view class="rest-item">
<view class="rest-item-num">{{userInfo.now_money}}</view>
<view class="rest-item-num">{{userInfo.now_money||"0.00"}}</view>
<view class="rest-item-txt">余额</view>
</view>
<view class="rest-item">
<view class="rest-item-num">{{userInfo.purchase_funds}}</view>
<view class="rest-item-num">{{userInfo.purchase_funds||'0.00'}}</view>
<view class="rest-item-txt">采购款</view>
</view>
<view class="rest-item">
<view class="rest-item-num">{{userInfo.return_money}}</view>
<view class="rest-item-num">{{userInfo.return_money||'0.00'}}</view>
<view class="rest-item-txt">返还金</view>
</view>
<view class="rest-item">
<view class="rest-item-num">{{userInfo.integral}}</view>
<view class="rest-item-num">{{userInfo.integral ||"0.00"}}</view>
<view class="rest-item-txt">礼品券</view>
</view>
</view>
@ -107,8 +107,8 @@
<view class="card">
<up-cell-group>
<up-cell title="我的余额" :isLink="true" url="/pageQuota/Balance/index"></up-cell>
<up-cell title="我的地址" :isLink="true" url="/pagesOrder/addressList/addressList"></up-cell>
<up-cell title="支付密码" :isLink="true" url="/pagesOrder/setPayPassword/index"></up-cell>
</up-cell-group>
</view>

View File

@ -4,17 +4,17 @@
还剩<text>{{countDown}}</text>订单自动取消
</view>
<view class="m-card m-address" style="margin-top: 20rpx;">
<view class="address-info" @click="callPhone(shopInfo.phone)">
<view class="address-info"
style='display: flex;justify-content: space-between;width: 690rpx;align-items: center;'
@click="callPhone(shopInfo.phone)">
<view class="top" style="align-items: flex-start;">
<view style="color: #333;display: flex;align-items: center;">
<view style="color: #333;display: flex;align-items: center;flex-shrink: 0;">
<up-icon name="map"></up-icon>
<text style="margin: 0 10rpx;">自提点</text>
</view>
<view v-if="shopInfo.id">
<view style="color: #333;">
{{shopInfo.name}}
<!-- <text v-if="shopInfo.recommend"
style="font-size: 20rpx;color: #fff;background-color: #20b128;padding: 2rpx 5rpx;padding: 1rpx 4rpx;">推荐</text> -->
</view>
<view style="font-size: 24rpx;color: #333;">
{{shopInfo.detailed_address}}
@ -24,16 +24,14 @@
<text style="margin-right: 10rpx;">{{shopInfo.name||shopInfo.mer_real_name}}</text>
<text>{{shopInfo.phone}}</text>
</view>
<!-- <text v-if="shopInfo.distance"
style="color: #20b128;font-size: 22rpx;border: 1px solid #20b128;border-radius: 4rpx;">{{shopInfo.distance}}</text> -->
</view>
</view>
</view>
<view @click.stop="navgo('/multipleShop/index/index')"
style="padding: 20rpx;background-color:#20B128;color: white;border-radius: 40rpx;flex-shrink: 0;">
所有提货点
</view>
</view>
<!-- <view class="address-btn" v-if="datas.paid==0">
<view style="width: 80px;"><up-button @click="shopListShow=true" size="small" shape="circle"
color="#f6f6f6" :customStyle="{color:'#666666'}">修改</up-button></view>
</view> -->
</view>
<view class="m-card m-address" style="margin-top: 20rpx;" v-if="addressInfo && addressInfo.address_id">
<view class="address-info">
@ -237,11 +235,12 @@
const datas = ref({})
const getDetails = () => {
orderDetailApi({
order_id: datas.value.id
order_id: datas.value.id,
...location
}).then(res => {
datas.value = res.data;
options.code = datas.value.verify_code; //
shopInfo.value = res.data.store_info;
shopInfo.value = res.data.near_store;
if (addressList.value.length > 0 && res.data.paid) {
addressInfo.value = addressList.value.find(item => item.address_id == res.data.address_id);
} else {
@ -456,13 +455,37 @@
})
}
//
let location = {
lat: "",
long: "",
}
const getLocation = () => {
if (uni.getStorageSync('location')) {
location = uni.getStorageSync('location')
} else {
uni.getLocation({
type: "gcj02",
success(res) {
location.lat = res.latitude;
location.long = res.longitude;
uni.setStorageSync('location', location)
return getDetails()
}
})
}
getDetails()
}
onLoad((option) => {
uni.setNavigationBarTitle({
title: option.type == 0 ? '等待付款' : '订单详情'
});
if (option.id) {
datas.value.id = option.id;
getDetails()
getLocation()
}
})
@ -470,6 +493,12 @@
clearInterval(timer);
console.log("清除");
})
const navgo = (url) => {
uni.navigateTo({
url
})
}
</script>
<style lang="scss">

View File

@ -0,0 +1,135 @@
<template>
<view class='card'>
<up-input v-model="form.phone" placeholder="手机号" border="none"></up-input>
<up-line color="#D3E3FD" style="margin: 30rpx 0;"></up-line>
<view style="display: flex;justify-content: space-between;align-items: center;">
<up-input v-model="form.code" placeholder="验证码" border="none" type='number'></up-input>
<view class="code-btn">
<up-line color="grey" direction="col" length="30rpx" style="margin: 0 20rpx;"></up-line>
<text class='btn-text' style="color: grey;" v-if='cutDown'>重新获取({{cutDown}})</text>
<text @click="getCode" class='btn-text' v-else> {{flag?'获取验证码':'重新获取' }} </text>
</view>
</view>
</view>
<view class='card'>
<!-- type='password' -->
<view @click="showKeyBorad=true,type=1">
<up-input style="pointer-events: none;" v-model="form.password" placeholder="请输入你的密码" border="none"
readonly></up-input>
</view>
<up-line color="#D3E3FD" style="margin: 30rpx 0;"></up-line>
<view @click="showKeyBorad=true,type=2">
<up-input style="pointer-events: none;" v-model="form.rePassword" placeholder="请再次输入你的密码" border="none"
readonly></up-input>
</view>
</view>
<view class='submit-btn'>
<up-button color="#20B128" shape="circle" @click="submit">确认</up-button>
</view>
<up-keyboard dotDisabled safeAreaInsetBottom ref="uKeyboard" @close="showKeyBorad=false" mode="number"
:tooltip="false" :show="showKeyBorad" @change='onKetDown' @backspace='backspaceFn' />
</template>
<script setup>
import useUserStore from "@/store/user";
import {
getMassageCode,
setPayPassword
} from "@/api/address.js"
import {
ref,
reactive
} from "vue"
const userInfo = useUserStore().userInfo;
const form = reactive({
phone: userInfo.mobile, //
code: "", //
password: "", //6
rePassword: "" //
})
//
const cutDown = ref(0)
const flag = ref(true)
const code = ref('')
const checkPhone = (phone) => {
const regex = /^1[3-9]\d{9}$/;
return regex.test(phone) ? true : false
}
const getCode = async () => {
if (!checkPhone(phone.value)) return uni.$u.toast('请输入正确的手机号')
await getMassageCode()
flag.value = false
cutDown.value = 10
let timer = setInterval(() => {
cutDown.value--
if (cutDown.value <= 0) clearInterval(timer)
}, 1000)
}
//
//
const showKeyBorad = ref(false)
const type = ref(1) // 1 2
const onKetDown = (e) => {
if (type.value == 1) {
form.password.length < 6 ?
form.password += e :
showKeyBorad.value = false
} else {
form.rePassword.length < 6 ?
form.rePassword += e :
showKeyBorad.value = false
}
}
const backspaceFn = () => {
if (type.value == 1) {
form.password = form.password.slice(0, -1);
} else {
form.rePassword = form.rePassword.slice(0, -1);
}
}
//
const submit = async () => {
if (!form.code) return uni.$u.toast('请输入验证码');
if (form.password !== form.rePassword) return uni.$u.toast('两次密码不一致');
await setPayPassword(...form)
uni.$u.toast('设置成功')
setTimeout(() => {
uni.navigateBack()
}, 1000)
}
</script>
<style lang='scss'>
.card {
padding: 50rpx;
background-color: white;
margin-bottom: 30rpx;
padding-bottom: 30rpx;
}
.submit-btn {
position: absolute;
bottom: 100rpx;
width: 710rpx;
left: 50%;
transform: translateX(-50%);
}
.code-btn {
display: flex;
align-items: center;
}
.btn-text {
color: #20B128;
}
</style>

View File

@ -1,6 +1,6 @@
<template>
<view class="">
<view class="m-card m-address">
<!-- <view class="m-card m-address">
<view class="address-info" @click="showAddress = true" v-if='orderInfo.shipping_type == 1'>
<view class="top">
<up-icon name="account"></up-icon>
@ -31,7 +31,7 @@
</view>
</view>
</view>
</view>
</view> -->
<view class="m-card m-good" v-for="(item, index) in cartList" :key="index">
<view class="image">
<up-image width="160rpx" height="160rpx" :src="item.imgs"></up-image>
@ -72,8 +72,8 @@
</view>
<view class="row" v-if="userInfo.user_ship==1 ">
<view>消费返利</view>
<view style="color: red;">
<text>-¥</text>{{ c_price(orderInfo.activities, 0) }}<text>.{{ c_price(orderInfo.activities, 1) }}</text>
<view>
<text>¥</text>{{ c_price(orderInfo.activity_price, 0) }}<text>.{{ c_price(orderInfo.activity_price, 1) }}</text>
</view>
</view>
</view>
@ -93,9 +93,11 @@
<view class="row"
v-if="userInfo.user_ship == 4 || userInfo.user_ship == 5 || userInfo.user_ship == 6 || userInfo.user_ship == 1">
<!-- <view class="row"> -->
<view class="icon-text">
<image src="@/static/icon/YEZF.png" style="width:40rpx;height: 40rpx;" />
<text style="margin-left: 20rpx;font-size: 26rpx;">余额支付</text>
<text style="margin-left: 20rpx;font-size: 22rpx;color: #FFB76D;">( 可用¥{{userInfo.now_money}} )</text>
</view>
<view class="icon" @click="onChoosePaytype(3)">
<image v-if="pay_type == 3" src="@/static/icon/check.png" />
@ -108,6 +110,7 @@
<view class="icon-text">
<image src="@/static/icon/cgkzf.png" style="width:40rpx;height: 40rpx;" />
<text style="margin-left: 20rpx;font-size: 26rpx;">采购款支付</text>
<text style="margin-left: 20rpx;font-size: 22rpx;color: #1296DB;">( 可用¥{{userInfo.purchase_funds}} )</text>
</view>
<view class="icon" @click="onChoosePaytype(18)">
<image v-if="pay_type == 18" src="@/static/icon/check.png" />
@ -352,7 +355,7 @@
})
}
const pay_type = ref('');
const pay_type = ref('7');
const createOrder = () => {
if (!pay_type.value) return uni.$u.toast('请选择支付方式');

BIN
static/del.webp Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

View File

@ -0,0 +1,24 @@
## 1.3.32024-04-23
- 修复 当元素会受变量影响自动隐藏的bug
## 1.3.22023-05-04
- 修复 NVUE 平台报错的问题
## 1.3.12021-11-23
- 修复 init 方法初始化问题
## 1.3.02021-11-19
- 优化 组件UI并提供设计资源详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移,详见:[https://uniapp.dcloud.io/component/uniui/uni-transition](https://uniapp.dcloud.io/component/uniui/uni-transition)
## 1.2.12021-09-27
- 修复 init 方法不生效的 Bug
## 1.2.02021-07-30
- 组件兼容 vue3如何创建 vue3 项目,详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.1.12021-05-12
- 新增 示例地址
- 修复 示例项目缺少组件的 Bug
## 1.1.02021-04-22
- 新增 通过方法自定义动画
- 新增 custom-class 非 NVUE 平台支持自定义 class 定制样式
- 优化 动画触发逻辑,使动画更流畅
- 优化 支持单独的动画类型
- 优化 文档示例
## 1.0.22021-02-05
- 调整为 uni_modules 目录规范

View File

@ -0,0 +1,131 @@
// const defaultOption = {
// duration: 300,
// timingFunction: 'linear',
// delay: 0,
// transformOrigin: '50% 50% 0'
// }
// #ifdef APP-NVUE
const nvueAnimation = uni.requireNativePlugin('animation')
// #endif
class MPAnimation {
constructor(options, _this) {
this.options = options
// 在iOS10+QQ小程序平台下传给原生的对象一定是个普通对象而不是Proxy对象否则会报parameter should be Object instead of ProxyObject的错误
this.animation = uni.createAnimation({
...options
})
this.currentStepAnimates = {}
this.next = 0
this.$ = _this
}
_nvuePushAnimates(type, args) {
let aniObj = this.currentStepAnimates[this.next]
let styles = {}
if (!aniObj) {
styles = {
styles: {},
config: {}
}
} else {
styles = aniObj
}
if (animateTypes1.includes(type)) {
if (!styles.styles.transform) {
styles.styles.transform = ''
}
let unit = ''
if(type === 'rotate'){
unit = 'deg'
}
styles.styles.transform += `${type}(${args+unit}) `
} else {
styles.styles[type] = `${args}`
}
this.currentStepAnimates[this.next] = styles
}
_animateRun(styles = {}, config = {}) {
let ref = this.$.$refs['ani'].ref
if (!ref) return
return new Promise((resolve, reject) => {
nvueAnimation.transition(ref, {
styles,
...config
}, res => {
resolve()
})
})
}
_nvueNextAnimate(animates, step = 0, fn) {
let obj = animates[step]
if (obj) {
let {
styles,
config
} = obj
this._animateRun(styles, config).then(() => {
step += 1
this._nvueNextAnimate(animates, step, fn)
})
} else {
this.currentStepAnimates = {}
typeof fn === 'function' && fn()
this.isEnd = true
}
}
step(config = {}) {
// #ifndef APP-NVUE
this.animation.step(config)
// #endif
// #ifdef APP-NVUE
this.currentStepAnimates[this.next].config = Object.assign({}, this.options, config)
this.currentStepAnimates[this.next].styles.transformOrigin = this.currentStepAnimates[this.next].config.transformOrigin
this.next++
// #endif
return this
}
run(fn) {
// #ifndef APP-NVUE
this.$.animationData = this.animation.export()
this.$.timer = setTimeout(() => {
typeof fn === 'function' && fn()
}, this.$.durationTime)
// #endif
// #ifdef APP-NVUE
this.isEnd = false
let ref = this.$.$refs['ani'] && this.$.$refs['ani'].ref
if(!ref) return
this._nvueNextAnimate(this.currentStepAnimates, 0, fn)
this.next = 0
// #endif
}
}
const animateTypes1 = ['matrix', 'matrix3d', 'rotate', 'rotate3d', 'rotateX', 'rotateY', 'rotateZ', 'scale', 'scale3d',
'scaleX', 'scaleY', 'scaleZ', 'skew', 'skewX', 'skewY', 'translate', 'translate3d', 'translateX', 'translateY',
'translateZ'
]
const animateTypes2 = ['opacity', 'backgroundColor']
const animateTypes3 = ['width', 'height', 'left', 'right', 'top', 'bottom']
animateTypes1.concat(animateTypes2, animateTypes3).forEach(type => {
MPAnimation.prototype[type] = function(...args) {
// #ifndef APP-NVUE
this.animation[type](...args)
// #endif
// #ifdef APP-NVUE
this._nvuePushAnimates(type, args)
// #endif
return this
}
})
export function createAnimation(option, _this) {
if(!_this) return
clearTimeout(_this.timer)
return new MPAnimation(option, _this)
}

View File

@ -0,0 +1,286 @@
<template>
<!-- #ifndef APP-NVUE -->
<view v-show="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<view v-if="isShow" ref="ani" :animation="animationData" :class="customClass" :style="transformStyles" @click="onClick"><slot></slot></view>
<!-- #endif -->
</template>
<script>
import { createAnimation } from './createAnimation'
/**
* Transition 过渡动画
* @description 简单过渡动画组件
* @tutorial https://ext.dcloud.net.cn/plugin?id=985
* @property {Boolean} show = [false|true] 控制组件显示或隐藏
* @property {Array|String} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
* @value fade 渐隐渐出过渡
* @value slide-top 由上至下过渡
* @value slide-right 由右至左过渡
* @value slide-bottom 由下至上过渡
* @value slide-left 由左至右过渡
* @value zoom-in 由小到大过渡
* @value zoom-out 由大到小过渡
* @property {Number} duration 过渡动画持续时间
* @property {Object} styles 组件样式 css 样式注意带-连接符的属性需要使用小驼峰写法如`backgroundColor:red`
*/
export default {
name: 'uniTransition',
emits:['click','change'],
props: {
show: {
type: Boolean,
default: false
},
modeClass: {
type: [Array, String],
default() {
return 'fade'
}
},
duration: {
type: Number,
default: 300
},
styles: {
type: Object,
default() {
return {}
}
},
customClass:{
type: String,
default: ''
},
onceRender:{
type:Boolean,
default:false
},
},
data() {
return {
isShow: false,
transform: '',
opacity: 1,
animationData: {},
durationTime: 300,
config: {}
}
},
watch: {
show: {
handler(newVal) {
if (newVal) {
this.open()
} else {
// close,
if (this.isShow) {
this.close()
}
}
},
immediate: true
}
},
computed: {
//
stylesObject() {
let styles = {
...this.styles,
'transition-duration': this.duration / 1000 + 's'
}
let transform = ''
for (let i in styles) {
let line = this.toLine(i)
transform += line + ':' + styles[i] + ';'
}
return transform
},
//
transformStyles() {
return 'transform:' + this.transform + ';' + 'opacity:' + this.opacity + ';' + this.stylesObject
}
},
created() {
//
this.config = {
duration: this.duration,
timingFunction: 'ease',
transformOrigin: '50% 50%',
delay: 0
}
this.durationTime = this.duration
},
methods: {
/**
* ref 触发 初始化动画
*/
init(obj = {}) {
if (obj.duration) {
this.durationTime = obj.duration
}
this.animation = createAnimation(Object.assign(this.config, obj),this)
},
/**
* 点击组件触发回调
*/
onClick() {
this.$emit('click', {
detail: this.isShow
})
},
/**
* ref 触发 动画分组
* @param {Object} obj
*/
step(obj, config = {}) {
if (!this.animation) return
for (let i in obj) {
try {
if(typeof obj[i] === 'object'){
this.animation[i](...obj[i])
}else{
this.animation[i](obj[i])
}
} catch (e) {
console.error(`方法 ${i} 不存在`)
}
}
this.animation.step(config)
return this
},
/**
* ref 触发 执行动画
*/
run(fn) {
if (!this.animation) return
this.animation.run(fn)
},
//
open() {
clearTimeout(this.timer)
this.transform = ''
this.isShow = true
let { opacity, transform } = this.styleInit(false)
if (typeof opacity !== 'undefined') {
this.opacity = opacity
}
this.transform = transform
// nextTick wx
this.$nextTick(() => {
// TODO
this.timer = setTimeout(() => {
this.animation = createAnimation(this.config, this)
this.tranfromInit(false).step()
this.animation.run()
this.$emit('change', {
detail: this.isShow
})
}, 20)
})
},
//
close(type) {
if (!this.animation) return
this.tranfromInit(true)
.step()
.run(() => {
this.isShow = false
this.animationData = null
this.animation = null
let { opacity, transform } = this.styleInit(false)
this.opacity = opacity || 1
this.transform = transform
this.$emit('change', {
detail: this.isShow
})
})
},
//
styleInit(type) {
let styles = {
transform: ''
}
let buildStyle = (type, mode) => {
if (mode === 'fade') {
styles.opacity = this.animationType(type)[mode]
} else {
styles.transform += this.animationType(type)[mode] + ' '
}
}
if (typeof this.modeClass === 'string') {
buildStyle(type, this.modeClass)
} else {
this.modeClass.forEach(mode => {
buildStyle(type, mode)
})
}
return styles
},
//
tranfromInit(type) {
let buildTranfrom = (type, mode) => {
let aniNum = null
if (mode === 'fade') {
aniNum = type ? 0 : 1
} else {
aniNum = type ? '-100%' : '0'
if (mode === 'zoom-in') {
aniNum = type ? 0.8 : 1
}
if (mode === 'zoom-out') {
aniNum = type ? 1.2 : 1
}
if (mode === 'slide-right') {
aniNum = type ? '100%' : '0'
}
if (mode === 'slide-bottom') {
aniNum = type ? '100%' : '0'
}
}
this.animation[this.animationMode()[mode]](aniNum)
}
if (typeof this.modeClass === 'string') {
buildTranfrom(type, this.modeClass)
} else {
this.modeClass.forEach(mode => {
buildTranfrom(type, mode)
})
}
return this.animation
},
animationType(type) {
return {
fade: type ? 0 : 1,
'slide-top': `translateY(${type ? '0' : '-100%'})`,
'slide-right': `translateX(${type ? '0' : '100%'})`,
'slide-bottom': `translateY(${type ? '0' : '100%'})`,
'slide-left': `translateX(${type ? '0' : '-100%'})`,
'zoom-in': `scaleX(${type ? 1 : 0.8}) scaleY(${type ? 1 : 0.8})`,
'zoom-out': `scaleX(${type ? 1 : 1.2}) scaleY(${type ? 1 : 1.2})`
}
},
//
animationMode() {
return {
fade: 'opacity',
'slide-top': 'translateY',
'slide-right': 'translateX',
'slide-bottom': 'translateY',
'slide-left': 'translateX',
'zoom-in': 'scale',
'zoom-out': 'scale'
}
},
// 线
toLine(name) {
return name.replace(/([A-Z])/g, '-$1').toLowerCase()
}
}
}
</script>
<style></style>

View File

@ -0,0 +1,85 @@
{
"id": "uni-transition",
"displayName": "uni-transition 过渡动画",
"version": "1.3.3",
"description": "元素的简单过渡动画",
"keywords": [
"uni-ui",
"uniui",
"动画",
"过渡",
"过渡动画"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui",
"type": "component-vue"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y",
"alipay": "n"
},
"client": {
"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"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

View File

@ -0,0 +1,11 @@
## Transition 过渡动画
> **组件名uni-transition**
> 代码块: `uTransition`
元素过渡动画
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-transition)
#### 如使用过程中有任何问题或者您对uni-ui有一些好的建议欢迎加入 uni-ui 交流群871950839