This commit is contained in:
parent
67e7ff1e29
commit
f420935871
50
pages.json
50
pages.json
|
|
@ -39,41 +39,61 @@
|
|||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
],
|
||||
"subPackages": [
|
||||
{
|
||||
"path": "pages/order/order",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
"root": "pagesOrder",
|
||||
"pages": [
|
||||
{
|
||||
"path": "order/order",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的订单",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "detail/detail",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "",
|
||||
"enablePullDownRefresh" : false
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "购物",
|
||||
"navigationBarBackgroundColor": "#F8F8F8",
|
||||
"backgroundColor": "#F8F8F8"
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"backgroundColor": "#fff"
|
||||
},
|
||||
"tabBar": {
|
||||
"color": "#999999",
|
||||
"selectedColor": "#2b9939",
|
||||
"selectedColor": "#20b128",
|
||||
"borderStyle": "white",
|
||||
"backgroundColor": "#FFFFFF",
|
||||
// "iconWidth": "40px",
|
||||
"list": [{
|
||||
"pagePath": "pages/index/index",
|
||||
"text": "首页"
|
||||
// "iconPath": "static/main/index/sy.png",
|
||||
// "selectedIconPath": "static/main/index/sydj.png"
|
||||
"text": "首页",
|
||||
"iconPath": "static/tab/a.png",
|
||||
"selectedIconPath": "static/tab/aa.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/cart/cart",
|
||||
"text": "购物车"
|
||||
"text": "购物车",
|
||||
"iconPath": "static/tab/b.png",
|
||||
"selectedIconPath": "static/tab/ba.png"
|
||||
},
|
||||
|
||||
{
|
||||
"pagePath": "pages/my/my",
|
||||
"text": "我的"
|
||||
"text": "我的",
|
||||
"iconPath": "static/tab/c.png",
|
||||
"selectedIconPath": "static/tab/ca.png"
|
||||
}
|
||||
|
||||
]
|
||||
|
|
|
|||
|
|
@ -3,14 +3,14 @@
|
|||
<up-navbar placeholder>
|
||||
<template #left>
|
||||
<view style="display: flex;">
|
||||
<view class="tabs" :class="{'tabs-active': tabsActive==index}" v-for="(item, index) in list"
|
||||
<view class="tabs" :class="{'tabs-active': tabsActive==index}" v-for="(item, index) in list" :key="index"
|
||||
@click="changeTab(index)">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</up-navbar>
|
||||
|
||||
|
||||
<swiper class="swiper-box" :current="swiperCurrent" @animationfinish="animationfinish">
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
<view v-if="true">管理</view>
|
||||
<view v-else>完成</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<view v-if="true" class="list" style="margin-top: 80rpx;">
|
||||
<view class="shop-item" v-for="(item, index) in 20" :key="index">
|
||||
<view class="shop-check">
|
||||
<image v-if="index%3==0" src="@/static/icon/n-check.png"></image>
|
||||
|
|
@ -43,15 +43,70 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else style="margin-top: 100rpx;">
|
||||
<up-empty text="购物车空空如也"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box1">
|
||||
<view v-if="true" class="list">
|
||||
<view class="shop-item" v-for="(item, index) in 20" :key="index">
|
||||
<image class="shop-img" src="https://cdn.uviewui.com/uview/album/1.jpg"></image>
|
||||
<view class="shop-content" style="width: 490rpx;">
|
||||
<view class="title">
|
||||
<view class="name u-line-2">好吃的瓜果</view>
|
||||
<view class="tip u-line-1">香味辛辣|葱香味浓|调味增香香味辛辣|葱香味浓|调味增香</view>
|
||||
</view>
|
||||
<view class="price-btn">
|
||||
<view class="price">￥12.00</view>
|
||||
<view class="btn">
|
||||
<up-button size="small" plain color="#20b128" shape="circle">加入购物车</up-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else style="margin-top: 100rpx;">
|
||||
<up-empty text="没有常买的商品"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
<view class="cart-btn">
|
||||
|
||||
</view>
|
||||
|
||||
<up-transition :show="tabsActive==0">
|
||||
<view class="cart-btn">
|
||||
<view class="cart-check">
|
||||
<image v-if="false" src="@/static/icon/n-check.png"></image>
|
||||
<image v-else src="@/static/icon/check.png"></image>
|
||||
<text style="font-size: 24rpx;">全选</text>
|
||||
</view>
|
||||
<view v-if="false" class="btn-box">
|
||||
<view class="all-price">
|
||||
<view style="width: 80rpx;">合计:</view>
|
||||
<view class="price">
|
||||
<text style="font-size: 24rpx;">¥</text>
|
||||
<text style="font-size: 34rpx;">20</text>
|
||||
<text style="font-size: 24rpx;">.30</text>
|
||||
</view>
|
||||
</view>
|
||||
<up-button color="#20b128" shape="circle" disabled>去结算<text>(2)</text></up-button>
|
||||
</view>
|
||||
<view v-else class="btn-box">
|
||||
<view style="width: 100px;margin-right: 20rpx;"><up-button size="small" plain color="#989898" shape="circle">移入收藏夹</up-button></view>
|
||||
<view style="width: 80px;"><up-button size="small" plain color="#989898" shape="circle">删除</up-button></view>
|
||||
</view>
|
||||
</view>
|
||||
</up-transition>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
|
@ -59,11 +114,12 @@
|
|||
import { ref } from 'vue';
|
||||
|
||||
// 创建响应式数据
|
||||
const list = ref(['购物车', '常买', '收藏']);
|
||||
const list = ref(['购物车', '常买']);
|
||||
const tabsActive = ref(0)
|
||||
// 定义方法
|
||||
const changeTab = (e) => {
|
||||
tabsActive.value = e;
|
||||
swiperCurrent.value = e;
|
||||
}
|
||||
|
||||
const swiperCurrent = ref(0);
|
||||
|
|
@ -82,7 +138,7 @@
|
|||
|
||||
.tabs-active {
|
||||
color: #20B128;
|
||||
font-size: 34rpx;
|
||||
// font-size: 34rpx;
|
||||
transition: 300ms;
|
||||
}
|
||||
|
||||
|
|
@ -93,15 +149,16 @@
|
|||
height: calc(100vh - 96px);
|
||||
/* #endif */
|
||||
width: 100%;
|
||||
|
||||
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.page-box1{
|
||||
.page-box1 {
|
||||
position: relative;
|
||||
.total{
|
||||
|
||||
.total {
|
||||
padding: 0 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
|
@ -116,68 +173,69 @@
|
|||
font-size: 26rpx;
|
||||
color: #444;
|
||||
}
|
||||
.list{
|
||||
|
||||
.list {
|
||||
margin: 20rpx;
|
||||
margin-top: 80rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
|
||||
.shop-item {
|
||||
padding: 20rpx;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
|
||||
.shop-check{
|
||||
|
||||
.shop-check {
|
||||
width: 60rpx;
|
||||
height: 160rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
image{
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.shop-img {
|
||||
height: 160rpx;
|
||||
width: 160rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 14rpx;
|
||||
}
|
||||
|
||||
|
||||
.shop-content {
|
||||
width: 430rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
|
||||
.title {
|
||||
.name {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
|
||||
.tip {
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
margin: 12rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.price {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: #F55726;
|
||||
}
|
||||
|
||||
|
||||
.price-btn {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
|
||||
.num {
|
||||
width: 60rpx;
|
||||
text-align: center;
|
||||
|
|
@ -188,13 +246,48 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cart-btn{
|
||||
// width: 100%;
|
||||
// height: 50px;
|
||||
// background-color: pink;
|
||||
// position: fixed;
|
||||
// left: 0;
|
||||
// bottom: var(--window-bottom);
|
||||
|
||||
.cart-btn {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
box-sizing: border-box;
|
||||
background-color: pink;
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: var(--window-bottom);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20rpx;
|
||||
|
||||
.cart-check {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
display: flex;
|
||||
|
||||
.all-price {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 20rpx;
|
||||
|
||||
.price {
|
||||
color: #20B128;
|
||||
display: table-cell;
|
||||
vertical-align: bottom;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
227
pages/my/my.vue
227
pages/my/my.vue
|
|
@ -1,75 +1,168 @@
|
|||
<template>
|
||||
<view>
|
||||
<up-navbar :fixed="false" :is-back="false" title="个人中心" :border-bottom="false">
|
||||
<view class="u-flex u-row-right" style="width: 100%;">
|
||||
<view class="camera u-flex u-row-center">
|
||||
<up-icon name="camera-fill" color="#000000" size="48"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</up-navbar>
|
||||
<view class="u-flex u-flex-y-center u-flex-around user-box u-p-l-30 u-p-r-20 u-p-b-30">
|
||||
<view class="u-m-r-10">
|
||||
<up-avatar src="https://cdn.uviewui.com/uview/album/1.jpg" size="140"></up-avatar>
|
||||
</view>
|
||||
<view class="u-flex-1">
|
||||
<view class="u-font-18 u-p-b-20">uview plus</view>
|
||||
<view class="u-font-14 u-tips-color">微信号:test</view>
|
||||
</view>
|
||||
<view class="u-m-l-10 u-p-10">
|
||||
<up-icon name="scan" color="#969799" size="28"></up-icon>
|
||||
</view>
|
||||
<view class="u-m-l-10 u-p-10">
|
||||
<up-icon name="arrow-right" color="#969799" size="28"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-20">
|
||||
<up-cell-group>
|
||||
<up-cell icon="rmb-circle" title="支付"></up-cell>
|
||||
</up-cell-group>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-20">
|
||||
<up-cell-group>
|
||||
<up-cell icon="star" title="收藏"></up-cell>
|
||||
<up-cell icon="photo" title="相册"></up-cell>
|
||||
<up-cell icon="coupon" title="卡券"></up-cell>
|
||||
<up-cell icon="heart" title="关注"></up-cell>
|
||||
</up-cell-group>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-20">
|
||||
<up-cell-group>
|
||||
<up-cell icon="setting" title="设置"></up-cell>
|
||||
</up-cell-group>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<up-navbar title="我的" bgColor="rgba(0,0,0,0)">
|
||||
<template #left>
|
||||
<view></view>
|
||||
</template>
|
||||
</up-navbar>
|
||||
<view class="user-info">
|
||||
<image class="bg" src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/e3a7b202404261113002322.webp"
|
||||
mode="widthFix"></image>
|
||||
<view class="u-card">
|
||||
<up-avatar src="https://shop.lihaink.cn/static/images/f1.png" size="80"></up-avatar>
|
||||
<view class="content">
|
||||
<view class="u-phone">151****6699</view>
|
||||
<view class="u-id">ID: 6655</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="order-info-box">
|
||||
<view class="order-info">
|
||||
<view class="info-head">我的订单</view>
|
||||
<view class="info-list">
|
||||
<view class="list-item">
|
||||
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/f335a202404261401535608.png"></image>
|
||||
<view class="">待付款</view>
|
||||
</view>
|
||||
<view class="list-item">
|
||||
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/45241202404261403353935.png"></image>
|
||||
<view class="">待收货</view>
|
||||
</view>
|
||||
<view class="list-item">
|
||||
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/96915202404261403582769.png"></image>
|
||||
<view class="">售后/退款</view>
|
||||
</view>
|
||||
<view class="list-item" @click="navTo()">
|
||||
<image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/abdcd202404261406199643.png"></image>
|
||||
<view class="">全部订单</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="card">
|
||||
<up-cell-group>
|
||||
<up-cell title="我的地址" :isLink="true"></up-cell>
|
||||
</up-cell-group>
|
||||
</view>
|
||||
|
||||
<view class="card">
|
||||
<up-cell-group>
|
||||
<up-cell title="意见反馈" :isLink="true"></up-cell>
|
||||
<up-cell title="关于我们" :isLink="true"></up-cell>
|
||||
<up-cell title="设置" :isLink="true"></up-cell>
|
||||
</up-cell-group>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from "vue";
|
||||
|
||||
const pic = ref('');
|
||||
const show = ref(true)
|
||||
import { ref } from "vue";
|
||||
|
||||
const navTo = (type=0) => {
|
||||
uni.navigateTo({
|
||||
url: `/pagesOrder/order/order?type=${type}`
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page{
|
||||
background-color: #ededed;
|
||||
}
|
||||
.user-info {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
width: 750rpx;
|
||||
height: 450rpx;
|
||||
/* #ifdef H5 */
|
||||
height: 350rpx;
|
||||
/* #endif */
|
||||
|
||||
.camera{
|
||||
width: 54px;
|
||||
height: 44px;
|
||||
|
||||
&:active{
|
||||
background-color: #ededed;
|
||||
}
|
||||
}
|
||||
.user-box{
|
||||
background-color: #fff;
|
||||
}
|
||||
.u-cell-group {
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
||||
.bg {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.u-card {
|
||||
box-sizing: border-box;
|
||||
padding: 50rpx 0 50rpx 50rpx;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
bottom: 50rpx;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
|
||||
.content {
|
||||
width: 500rpx;
|
||||
padding-left: 30rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.u-phone {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.u-id {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-info-box {
|
||||
margin: 20rpx;
|
||||
height: 140rpx;
|
||||
position: relative;
|
||||
|
||||
.order-info {
|
||||
height: 220rpx;
|
||||
width: 710rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 14rpx;
|
||||
position: absolute;
|
||||
top: -80rpx;
|
||||
left: 0;
|
||||
z-index: 3;
|
||||
background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/def/a8863202404261349533191.png');
|
||||
background-size: 28% 100%;
|
||||
background-position: right;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
.info-head{
|
||||
margin-left: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.info-list{
|
||||
height: 110rpx;
|
||||
display: flex;
|
||||
font-size: 26rpx;
|
||||
|
||||
.list-item{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
image{
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card{
|
||||
margin: 20rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 14rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,507 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="wrap">
|
||||
<view class="u-tabs-box">
|
||||
<u-tabs activeColor="#f29100" ref="tabs" :list="list" :current="current" @change="change" :is-scroll="false" swiperWidth="750"></u-tabs>
|
||||
</view>
|
||||
<swiper class="swiper-box" :current="swiperCurrent" @transition="transition" @animationfinish="animationfinish">
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="reachBottom">
|
||||
<view class="page-box">
|
||||
<view class="order" v-for="(res, index) in orderList[0]" :key="res.id">
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<u-icon name="home" :size="30" color="rgb(94,94,94)"></u-icon>
|
||||
<view class="store">{{ res.store }}</view>
|
||||
<u-icon name="arrow-right" color="rgb(203,203,203)" :size="26"></u-icon>
|
||||
</view>
|
||||
<view class="right">{{ res.deal }}</view>
|
||||
</view>
|
||||
<view class="item" v-for="(item, index) in res.goodsList" :key="index">
|
||||
<view class="left"><image :src="item.goodsUrl" mode="aspectFill"></image></view>
|
||||
<view class="content">
|
||||
<view class="title u-line-2">{{ item.title }}</view>
|
||||
<view class="type">{{ item.type }}</view>
|
||||
<view class="delivery-time">发货时间 {{ item.deliveryTime }}</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="price">
|
||||
￥{{ priceInt(item.price) }}
|
||||
<text class="decimal">.{{ priceDecimal(item.price) }}</text>
|
||||
</view>
|
||||
<view class="number">x{{ item.number }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="total">
|
||||
共{{ totalNum(res.goodsList) }}件商品 合计:
|
||||
<text class="total-price">
|
||||
￥{{ priceInt(totalPrice(res.goodsList)) }}.
|
||||
<text class="decimal">{{ priceDecimal(totalPrice(res.goodsList)) }}</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="more"><u-icon name="more-dot-fill" color="rgb(203,203,203)"></u-icon></view>
|
||||
<view class="logistics btn">查看物流</view>
|
||||
<view class="exchange btn">卖了换钱</view>
|
||||
<view class="evaluate btn">评价</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-loadmore :status="loadStatus[0]" bgColor="#f2f2f2"></u-loadmore>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="reachBottom">
|
||||
<view class="page-box">
|
||||
<view class="order" v-for="(res, index) in orderList[1]" :key="res.id">
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<u-icon name="home" :size="30" color="rgb(94,94,94)"></u-icon>
|
||||
<view class="store">{{ res.store }}</view>
|
||||
<u-icon name="arrow-right" color="rgb(203,203,203)" :size="26"></u-icon>
|
||||
</view>
|
||||
<view class="right">{{ res.deal }}</view>
|
||||
</view>
|
||||
<view class="item" v-for="(item, index) in res.goodsList" :key="index">
|
||||
<view class="left"><image :src="item.goodsUrl" mode="aspectFill"></image></view>
|
||||
<view class="content">
|
||||
<view class="title u-line-2">{{ item.title }}</view>
|
||||
<view class="type">{{ item.type }}</view>
|
||||
<view class="delivery-time">发货时间 {{ item.deliveryTime }}</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="price">
|
||||
￥{{ priceInt(item.price) }}
|
||||
<text class="decimal">.{{ priceDecimal(item.price) }}</text>
|
||||
</view>
|
||||
<view class="number">x{{ item.number }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="total">
|
||||
共{{ totalNum(res.goodsList) }}件商品 合计:
|
||||
<text class="total-price">
|
||||
￥{{ priceInt(totalPrice(res.goodsList)) }}.
|
||||
<text class="decimal">{{ priceDecimal(totalPrice(res.goodsList)) }}</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="more"><u-icon name="more-dot-fill" color="rgb(203,203,203)"></u-icon></view>
|
||||
<view class="logistics btn">查看物流</view>
|
||||
<view class="exchange btn">卖了换钱</view>
|
||||
<view class="evaluate btn">评价</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-loadmore :status="loadStatus[1]" bgColor="#f2f2f2"></u-loadmore>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box">
|
||||
<view>
|
||||
<view class="centre">
|
||||
<image src="https://cdn.uviewui.com/uview/template/taobao-order.png" mode=""></image>
|
||||
<view class="explain">
|
||||
您还没有相关的订单
|
||||
<view class="tips">可以去看看有那些想买的</view>
|
||||
</view>
|
||||
<view class="btn">随便逛逛</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="reachBottom">
|
||||
<view class="page-box">
|
||||
<view class="order" v-for="(res, index) in orderList[3]" :key="res.id">
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<u-icon name="home" :size="30" color="rgb(94,94,94)"></u-icon>
|
||||
<view class="store">{{ res.store }}</view>
|
||||
<u-icon name="arrow-right" color="rgb(203,203,203)" :size="26"></u-icon>
|
||||
</view>
|
||||
<view class="right">{{ res.deal }}</view>
|
||||
</view>
|
||||
<view class="item" v-for="(item, index) in res.goodsList" :key="index">
|
||||
<view class="left"><image :src="item.goodsUrl" mode="aspectFill"></image></view>
|
||||
<view class="content">
|
||||
<view class="title u-line-2">{{ item.title }}</view>
|
||||
<view class="type">{{ item.type }}</view>
|
||||
<view class="delivery-time">发货时间 {{ item.deliveryTime }}</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="price">
|
||||
￥{{ priceInt(item.price) }}
|
||||
<text class="decimal">.{{ priceDecimal(item.price) }}</text>
|
||||
</view>
|
||||
<view class="number">x{{ item.number }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="total">
|
||||
共{{ totalNum(res.goodsList) }}件商品 合计:
|
||||
<text class="total-price">
|
||||
￥{{ priceInt(totalPrice(res.goodsList)) }}.
|
||||
<text class="decimal">{{ priceDecimal(totalPrice(res.goodsList)) }}</text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="more"><u-icon name="more-dot-fill" color="rgb(203,203,203)"></u-icon></view>
|
||||
<view class="logistics btn">查看物流</view>
|
||||
<view class="exchange btn">卖了换钱</view>
|
||||
<view class="evaluate btn">评价</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-loadmore :status="loadStatus[3]" bgColor="#f2f2f2"></u-loadmore>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderList: [[], [], [], []],
|
||||
dataList: [
|
||||
{
|
||||
id: 1,
|
||||
store: '夏日流星限定贩卖',
|
||||
deal: '交易成功',
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: '//img13.360buyimg.com/n7/jfs/t1/103005/7/17719/314825/5e8c19faEb7eed50d/5b81ae4b2f7f3bb7.jpg',
|
||||
title: '【冬日限定】现货 原创jk制服女2020冬装新款小清新宽松软糯毛衣外套女开衫短款百搭日系甜美风',
|
||||
type: '灰色;M',
|
||||
deliveryTime: '付款后30天内发货',
|
||||
price: '348.58',
|
||||
number: 2
|
||||
},
|
||||
{
|
||||
goodsUrl: '//img12.360buyimg.com/n7/jfs/t1/102191/19/9072/330688/5e0af7cfE17698872/c91c00d713bf729a.jpg',
|
||||
title: '【葡萄藤】现货 小清新学院风制服格裙百褶裙女短款百搭日系甜美风原创jk制服女2020新款',
|
||||
type: '45cm;S',
|
||||
deliveryTime: '付款后30天内发货',
|
||||
price: '135.00',
|
||||
number: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
store: '江南皮革厂',
|
||||
deal: '交易失败',
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: '//img14.360buyimg.com/n7/jfs/t1/60319/15/6105/406802/5d43f68aE9f00db8c/0affb7ac46c345e2.jpg',
|
||||
title: '【冬日限定】现货 原创jk制服女2020冬装新款小清新宽松软糯毛衣外套女开衫短款百搭日系甜美风',
|
||||
type: '粉色;M',
|
||||
deliveryTime: '付款后7天内发货',
|
||||
price: '128.05',
|
||||
number: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
store: '三星旗舰店',
|
||||
deal: '交易失败',
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: '//img11.360buyimg.com/n7/jfs/t1/94448/29/2734/524808/5dd4cc16E990dfb6b/59c256f85a8c3757.jpg',
|
||||
title: '三星（SAMSUNG）京品家电 UA65RUF70AJXXZ 65英寸4K超高清 HDR 京东微联 智能语音 教育资源液晶电视机',
|
||||
type: '4K，广色域',
|
||||
deliveryTime: '保质5年',
|
||||
price: '1998',
|
||||
number: 3
|
||||
},
|
||||
{
|
||||
goodsUrl: '//img14.360buyimg.com/n7/jfs/t6007/205/4099529191/294869/ae4e6d4f/595dcf19Ndce3227d.jpg!q90.jpg',
|
||||
title: '美的(Midea)639升 对开门冰箱 19分钟急速净味 一级能效冷藏双开门杀菌智能家用双变频节能 BCD-639WKPZM(E)',
|
||||
type: '容量大，速冻',
|
||||
deliveryTime: '保质5年',
|
||||
price: '2354',
|
||||
number: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
store: '三星旗舰店',
|
||||
deal: '交易失败',
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: '//img10.360buyimg.com/n7/jfs/t22300/31/1505958241/171936/9e201a89/5b2b12ffNe6dbb594.jpg!q90.jpg',
|
||||
title: '法国进口红酒 拉菲（LAFITE）传奇波尔多干红葡萄酒750ml*6整箱装',
|
||||
type: '4K，广色域',
|
||||
deliveryTime: '珍藏10年好酒',
|
||||
price: '1543',
|
||||
number: 3
|
||||
},
|
||||
{
|
||||
goodsUrl: '//img10.360buyimg.com/n7/jfs/t1/107598/17/3766/525060/5e143aacE9a94d43c/03573ae60b8bf0ee.jpg',
|
||||
title: '蓝妹（BLUE GIRL）酷爽啤酒 清啤 原装进口啤酒 罐装 500ml*9听 整箱装',
|
||||
type: '一打',
|
||||
deliveryTime: '口感好',
|
||||
price: '120',
|
||||
number: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
store: '三星旗舰店',
|
||||
deal: '交易成功',
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: '//img12.360buyimg.com/n7/jfs/t1/52408/35/3554/78293/5d12e9cfEfd118ba1/ba5995e62cbd747f.jpg!q90.jpg',
|
||||
title: '企业微信 中控人脸指纹识别考勤机刷脸机 无线签到异地多店打卡机WX108',
|
||||
type: '识别效率高',
|
||||
deliveryTime: '使用方便',
|
||||
price: '451',
|
||||
number: 9
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
list: [
|
||||
{
|
||||
name: '待付款'
|
||||
},
|
||||
{
|
||||
name: '待发货'
|
||||
},
|
||||
{
|
||||
name: '待收货'
|
||||
},
|
||||
{
|
||||
name: '待评价',
|
||||
count: 12
|
||||
}
|
||||
],
|
||||
current: 0,
|
||||
swiperCurrent: 0,
|
||||
tabsHeight: 0,
|
||||
dx: 0,
|
||||
loadStatus: ['loadmore','loadmore','loadmore','loadmore'],
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.getOrderList(0);
|
||||
this.getOrderList(1);
|
||||
this.getOrderList(3);
|
||||
},
|
||||
computed: {
|
||||
// 价格小数
|
||||
priceDecimal() {
|
||||
return val => {
|
||||
if (val !== parseInt(val)) return val.slice(-2);
|
||||
else return '00';
|
||||
};
|
||||
},
|
||||
// 价格整数
|
||||
priceInt() {
|
||||
return val => {
|
||||
if (val !== parseInt(val)) return val.split('.')[0];
|
||||
else return val;
|
||||
};
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
reachBottom() {
|
||||
// 此tab为空数据
|
||||
if(this.current != 2) {
|
||||
this.loadStatus.splice(this.current,1,"loading")
|
||||
setTimeout(() => {
|
||||
this.getOrderList(this.current);
|
||||
}, 1200);
|
||||
}
|
||||
},
|
||||
// 页面数据
|
||||
getOrderList(idx) {
|
||||
for(let i = 0; i < 5; i++) {
|
||||
let index = this.$u.random(0, this.dataList.length - 1);
|
||||
let data = JSON.parse(JSON.stringify(this.dataList[index]));
|
||||
data.id = this.$u.guid();
|
||||
this.orderList[idx].push(data);
|
||||
}
|
||||
this.loadStatus.splice(this.current,1,"loadmore")
|
||||
},
|
||||
// 总价
|
||||
totalPrice(item) {
|
||||
let price = 0;
|
||||
item.map(val => {
|
||||
price += parseFloat(val.price);
|
||||
});
|
||||
return price.toFixed(2);
|
||||
},
|
||||
// 总件数
|
||||
totalNum(item) {
|
||||
let num = 0;
|
||||
item.map(val => {
|
||||
num += val.number;
|
||||
});
|
||||
return num;
|
||||
},
|
||||
// tab栏切换
|
||||
change(e) {
|
||||
console.log(e)
|
||||
this.swiperCurrent = e.index;
|
||||
this.getOrderList(e.index);
|
||||
},
|
||||
transition({ detail: { dx } }) {
|
||||
// this.$refs.tabs.setDx(dx);
|
||||
},
|
||||
animationfinish({ detail: { current } }) {
|
||||
this.swiperCurrent = current;
|
||||
this.current = current;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* #ifndef H5 */
|
||||
page {
|
||||
height: 100%;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
/* #endif */
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.order {
|
||||
width: 710rpx;
|
||||
background-color: #ffffff;
|
||||
margin: 20rpx auto;
|
||||
border-radius: 20rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.store {
|
||||
margin: 0 10rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.right {
|
||||
color: $u-warning-dark;
|
||||
}
|
||||
}
|
||||
.item {
|
||||
display: flex;
|
||||
margin: 20rpx 0 0;
|
||||
.left {
|
||||
margin-right: 20rpx;
|
||||
image {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
.title {
|
||||
font-size: 28rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
.type {
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
color: $u-tips-color;
|
||||
}
|
||||
.delivery-time {
|
||||
color: #e5d001;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
.right {
|
||||
margin-left: 10rpx;
|
||||
padding-top: 20rpx;
|
||||
text-align: right;
|
||||
.decimal {
|
||||
font-size: 24rpx;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
.number {
|
||||
color: $u-tips-color;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.total {
|
||||
margin-top: 20rpx;
|
||||
text-align: right;
|
||||
font-size: 24rpx;
|
||||
.total-price {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
.bottom {
|
||||
display: flex;
|
||||
margin-top: 40rpx;
|
||||
padding: 0 10rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.btn {
|
||||
line-height: 52rpx;
|
||||
width: 160rpx;
|
||||
border-radius: 26rpx;
|
||||
border: 2rpx solid $u-border-color;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
color: $u-info-dark;
|
||||
}
|
||||
.evaluate {
|
||||
color: $u-warning-dark;
|
||||
border-color: $u-warning-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
.centre {
|
||||
text-align: center;
|
||||
margin: 200rpx auto;
|
||||
font-size: 32rpx;
|
||||
image {
|
||||
width: 164rpx;
|
||||
height: 164rpx;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.tips {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.btn {
|
||||
margin: 80rpx auto;
|
||||
width: 200rpx;
|
||||
border-radius: 32rpx;
|
||||
line-height: 64rpx;
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
background: linear-gradient(270deg, rgba(249, 116, 90, 1) 0%, rgba(255, 158, 1, 1) 100%);
|
||||
}
|
||||
}
|
||||
.wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh - var(--window-top));
|
||||
width: 100%;
|
||||
}
|
||||
.swiper-box {
|
||||
flex: 1;
|
||||
height: calc(100vh - var(--window-top));
|
||||
}
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,234 @@
|
|||
<template>
|
||||
<view class="">
|
||||
<view class="count_down">
|
||||
还剩<text>00:28:36</text>订单自动取消
|
||||
</view>
|
||||
<view class="m-card m-address">
|
||||
<view class="address-info">
|
||||
<view class="top">
|
||||
<up-icon name="map"></up-icon>
|
||||
<view class="t-name">小王</view>
|
||||
<view>155****9999</view>
|
||||
</view>
|
||||
<view class="bottom u-line-2">
|
||||
四川泸州市龙马潭区莲花池街道商业街1号
|
||||
</view>
|
||||
</view>
|
||||
<view class="address-btn">
|
||||
<view style="width: 80px;"><up-button size="small" shape="circle" color="#f6f6f6" :customStyle="{color:'#666666'}">修改</up-button></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card m-good">
|
||||
<image class="image" src="../../static/logo.png"></image>
|
||||
<view class="body-content">
|
||||
<view>
|
||||
<view class="title">
|
||||
<view>黄牛肉20kg</view>
|
||||
<view>¥10.00</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view>我不吃牛肉</view>
|
||||
<view>x5</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="time">
|
||||
预计48小时发货
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card good-info">
|
||||
<view class="row">
|
||||
<view>商品总价 <text>共计5件商品</text></view>
|
||||
<view><text>¥</text>50<text>.00</text></view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view>运费</view>
|
||||
<view><text>¥</text>0<text>.00</text></view>
|
||||
</view>
|
||||
<view class="row-need">
|
||||
<view style="margin-right: 10rpx;">需付款</view>
|
||||
<view><text>¥</text>50<text>.00</text></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="m-card good-info">
|
||||
<view class="head-title">订单信息</view>
|
||||
<view class="row">
|
||||
<view>订单编号</view>
|
||||
<view>wxo13546486484784555 | 复制</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view>下单时间</view>
|
||||
<view>2024-04-25 15:00:00</view>
|
||||
</view>
|
||||
<view class="row" style="margin-bottom: 0;">
|
||||
<view>支付状态</view>
|
||||
<view class="red">待支付</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
|
||||
<view class="btn-box">
|
||||
<view style="color: #777777;" @click="showCancel=true">取消订单</view>
|
||||
<view style="width: 450rpx;">
|
||||
<up-button color="#20B128" shape="circle">立即支付 ¥50.00</up-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<up-popup :show="showCancel" closeable round="10" @close="showCancel=false">
|
||||
<view class="cancle-popup">
|
||||
<view class="head-title">订单取消</view>
|
||||
<view>
|
||||
<view>不想要了</view>
|
||||
<!-- <image></image> -->
|
||||
</view>
|
||||
</view>
|
||||
</up-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onLoad } from "@dcloudio/uni-app";
|
||||
import { ref } from "vue";
|
||||
|
||||
const showCancel = ref(false)
|
||||
|
||||
onLoad((option)=>{
|
||||
uni.setNavigationBarTitle({
|
||||
title: option.type==1 ? '等待付款' : '订单详情'
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.count_down{
|
||||
padding: 20rpx 0;
|
||||
text-align: center;
|
||||
color: #444444;
|
||||
text{
|
||||
color: #F55726;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
}
|
||||
.m-card{
|
||||
width: 710rpx;
|
||||
margin: 0 auto;
|
||||
background-color: #fff;
|
||||
border-radius: 14rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.m-address{
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #999999;
|
||||
|
||||
.address-info{
|
||||
width: 510rpx;
|
||||
.top{
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
.t-name{
|
||||
color: #444;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
}
|
||||
.bottom{
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.m-good{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
.image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.body-content{
|
||||
width: 490rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
color: #989898;
|
||||
|
||||
.title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
color: #444;
|
||||
}
|
||||
.tips{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.time{
|
||||
background-color: #F6F6F6;
|
||||
padding: 5rpx 10rpx;
|
||||
font-size: 26rpx;
|
||||
color: #444;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.good-info{
|
||||
margin-bottom: 20rpx;
|
||||
.head-title{
|
||||
margin-bottom: 18rpx;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
.row{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 18rpx;
|
||||
|
||||
.red{
|
||||
color: #F55726;
|
||||
}
|
||||
}
|
||||
.row-need{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
color: #F55726;
|
||||
}
|
||||
text{
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box{
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 120rpx;
|
||||
height: calc(constant(safe-area-inset-bottom) + 120rpx); /* 适用于iOS设备 */
|
||||
height: calc(env(safe-area-inset-bottom) + 120rpx); /* 适用于Android设备 */
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
padding-bottom: calc(constant(safe-area-inset-bottom) + 20rpx); /* 适用于iOS设备 */
|
||||
padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx); /* 适用于Android设备 */
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cancle-popup{
|
||||
height: 500rpx;
|
||||
.head-title{
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,133 @@
|
|||
<template>
|
||||
<view class="shop-item">
|
||||
<view class="item-title" @click="navTo">
|
||||
<view>wxo12335656455532232666</view>
|
||||
<view>待付款</view>
|
||||
</view>
|
||||
<view class="item-body" @click="navTo">
|
||||
<image class="image" src="../../../static/logo.png"></image>
|
||||
<view class="body-content">
|
||||
<view>
|
||||
<view class="title">
|
||||
<view>黄牛肉20kg</view>
|
||||
<view>¥10.00</view>
|
||||
</view>
|
||||
<view class="tips">
|
||||
<view>我不吃牛肉</view>
|
||||
<view>x5</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="all">共5件商品, 总金额 <text>¥20.30</text> </view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="type==1" class="item-btn">
|
||||
<view style="width: 80px;"><up-button size="small" plain color="#989898" shape="circle">取消订单</up-button></view>
|
||||
<view style="width: 80px;"><up-button size="small" plain color="#20B128" shape="circle">立即支付</up-button></view>
|
||||
</view>
|
||||
<view v-if="type==2||type==0" class="item-btn">
|
||||
<view style="width: 80px;"><up-button size="small" plain color="#989898" shape="circle">申请售后</up-button></view>
|
||||
<view style="width: 80px;"><up-button size="small" plain color="#20B128" shape="circle">确认收货</up-button></view>
|
||||
<view style="width: 80px;"><up-button size="small" plain color="#20B128" shape="circle">再次购买</up-button></view>
|
||||
</view>
|
||||
<view v-if="type==3" class="item-close">
|
||||
<view class="title">
|
||||
<view class="type">退款申请中</view>
|
||||
<view>等待商家处理</view>
|
||||
</view>
|
||||
<up-icon name="arrow-right"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
type:{
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
})
|
||||
|
||||
const navTo = ()=>{
|
||||
uni.navigateTo({
|
||||
url: '/pagesOrder/detail/detail?type=1'
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
.shop-item{
|
||||
width: 710rpx;
|
||||
height: 340rpx;
|
||||
margin-bottom: 20rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 14rpx;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
.item-title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.item-body{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 20rpx 0;
|
||||
.image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.body-content{
|
||||
width: 490rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
color: #989898;
|
||||
|
||||
.title{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
color: #444;
|
||||
}
|
||||
.tips{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.all{
|
||||
align-self: flex-end;
|
||||
font-size: 26rpx;
|
||||
text{
|
||||
color: #F55726;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.item-btn{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
view{
|
||||
width: 80rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
.item-close{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #F6F6F6;
|
||||
padding: 15rpx;
|
||||
border-radius: 14rpx;
|
||||
|
||||
.title{
|
||||
display: flex;
|
||||
.type{
|
||||
font-weight: 600;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,129 @@
|
|||
<template>
|
||||
<view>
|
||||
|
||||
<up-sticky bgColor="#fff">
|
||||
<view style="padding: 10rpx 20rpx 0 20rpx;">
|
||||
<up-search shape="round" :actionStyle="{color: '#20b128'}" ></up-search>
|
||||
</view>
|
||||
<up-tabs :current="tabsActive" :list="tablist" lineColor="#20b128" :scrollable="false" :activeStyle=" { color: '#20b128', fontWeight: 'bold' }" @change="changeTab"></up-tabs>
|
||||
</up-sticky>
|
||||
|
||||
<swiper class="swiper-box" :current="swiperCurrent" @animationfinish="animationfinish">
|
||||
<!-- 全部 -->
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box">
|
||||
<view v-if="true" class="list">
|
||||
<good v-for="(item, index) in 10" :key="index" :type="0"></good>
|
||||
</view>
|
||||
<view v-else style="padding-top: 100rpx;">
|
||||
<up-empty text="订单空空如也"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<!-- 待付款 -->
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box">
|
||||
<view v-if="true" class="list">
|
||||
<good v-for="(item, index) in 10" :key="index" :type="1"></good>
|
||||
</view>
|
||||
<view v-else style="padding-top: 100rpx;">
|
||||
<up-empty text="订单空空如也"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<!-- 待收货 -->
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box">
|
||||
<view v-if="true" class="list">
|
||||
<good v-for="(item, index) in 10" :key="index" :type="2"></good>
|
||||
</view>
|
||||
<view v-else style="padding-top: 100rpx;">
|
||||
<up-empty text="订单空空如也"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
<!-- 退款/售后 -->
|
||||
<swiper-item class="swiper-item">
|
||||
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
||||
<view class="page-box">
|
||||
<view v-if="true" class="list">
|
||||
<good v-for="(item, index) in 10" :key="index" :type="3"></good>
|
||||
</view>
|
||||
<view v-else style="padding-top: 100rpx;">
|
||||
<up-empty text="订单空空如也"
|
||||
icon="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/29955202404260944367594.png">
|
||||
</up-empty>
|
||||
</view>
|
||||
<view style="width: 100%;height: 200rpx;"></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import good from "./component/good.vue";
|
||||
|
||||
// 创建响应式数据
|
||||
const list = ref(['购物车', '常买', '收藏']);
|
||||
const tabsActive = ref(0)
|
||||
// 定义方法
|
||||
const changeTab = ({index}) => {
|
||||
tabsActive.value = index;
|
||||
swiperCurrent.value = index;
|
||||
}
|
||||
|
||||
const tablist = ref([
|
||||
{ name: '全部' },
|
||||
{ name: '待付款' },
|
||||
{ name: '待收货' },
|
||||
{ name: '退款/售后' },
|
||||
]);
|
||||
|
||||
const swiperCurrent = ref(0);
|
||||
const animationfinish = ({ detail: { current } }) => {
|
||||
swiperCurrent.value = current;
|
||||
tabsActive.value = current;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.swiper-box {
|
||||
flex: 1;
|
||||
height: calc(100vh - var(--window-top) - 140rpx);
|
||||
/* #ifdef H5 */
|
||||
height: calc(100vh - 210rpx);
|
||||
/* #endif */
|
||||
width: 100%;
|
||||
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
// background-color: pink;
|
||||
}
|
||||
}
|
||||
|
||||
.page-box{
|
||||
margin: 20rpx;
|
||||
.list{
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 618 B |
Binary file not shown.
|
After Width: | Height: | Size: 657 B |
Binary file not shown.
|
After Width: | Height: | Size: 679 B |
Binary file not shown.
|
After Width: | Height: | Size: 723 B |
Binary file not shown.
|
After Width: | Height: | Size: 718 B |
Binary file not shown.
|
After Width: | Height: | Size: 745 B |
|
|
@ -122,7 +122,8 @@ if (!Math) {
|
|||
"./pages/login/login.js";
|
||||
"./pages/cart/cart.js";
|
||||
"./pages/my/my.js";
|
||||
"./pages/order/order.js";
|
||||
"./pagesOrder/order/order.js";
|
||||
"./pagesOrder/detail/detail.js";
|
||||
}
|
||||
const _sfc_main = {
|
||||
onLaunch: function() {
|
||||
|
|
|
|||
|
|
@ -3,32 +3,46 @@
|
|||
"pages/index/index",
|
||||
"pages/login/login",
|
||||
"pages/cart/cart",
|
||||
"pages/my/my",
|
||||
"pages/order/order"
|
||||
"pages/my/my"
|
||||
],
|
||||
"subPackages": [
|
||||
{
|
||||
"root": "pagesOrder",
|
||||
"pages": [
|
||||
"order/order",
|
||||
"detail/detail"
|
||||
]
|
||||
}
|
||||
],
|
||||
"window": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "购物",
|
||||
"navigationBarBackgroundColor": "#F8F8F8",
|
||||
"backgroundColor": "#F8F8F8"
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"backgroundColor": "#fff"
|
||||
},
|
||||
"tabBar": {
|
||||
"color": "#999999",
|
||||
"selectedColor": "#2b9939",
|
||||
"selectedColor": "#20b128",
|
||||
"borderStyle": "white",
|
||||
"backgroundColor": "#FFFFFF",
|
||||
"list": [
|
||||
{
|
||||
"pagePath": "pages/index/index",
|
||||
"text": "首页"
|
||||
"text": "首页",
|
||||
"iconPath": "static/tab/a.png",
|
||||
"selectedIconPath": "static/tab/aa.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/cart/cart",
|
||||
"text": "购物车"
|
||||
"text": "购物车",
|
||||
"iconPath": "static/tab/b.png",
|
||||
"selectedIconPath": "static/tab/ba.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/my/my",
|
||||
"text": "我的"
|
||||
"text": "我的",
|
||||
"iconPath": "static/tab/c.png",
|
||||
"selectedIconPath": "static/tab/ca.png"
|
||||
}
|
||||
]
|
||||
},
|
||||
|
|
|
|||
|
|
@ -3617,43 +3617,43 @@ function injectHook(type, hook, target = currentInstance, prepend = false) {
|
|||
warn(`${apiName} is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup().`);
|
||||
}
|
||||
}
|
||||
const createHook = (lifecycle) => (hook, target = currentInstance) => (
|
||||
const createHook$1 = (lifecycle) => (hook, target = currentInstance) => (
|
||||
// post-create lifecycle registrations are noops during SSR (except for serverPrefetch)
|
||||
(!isInSSRComponentSetup || lifecycle === "sp") && injectHook(lifecycle, (...args) => hook(...args), target)
|
||||
);
|
||||
const onBeforeMount = createHook(
|
||||
const onBeforeMount = createHook$1(
|
||||
"bm"
|
||||
/* LifecycleHooks.BEFORE_MOUNT */
|
||||
);
|
||||
const onMounted = createHook(
|
||||
const onMounted = createHook$1(
|
||||
"m"
|
||||
/* LifecycleHooks.MOUNTED */
|
||||
);
|
||||
const onBeforeUpdate = createHook(
|
||||
const onBeforeUpdate = createHook$1(
|
||||
"bu"
|
||||
/* LifecycleHooks.BEFORE_UPDATE */
|
||||
);
|
||||
const onUpdated = createHook(
|
||||
const onUpdated = createHook$1(
|
||||
"u"
|
||||
/* LifecycleHooks.UPDATED */
|
||||
);
|
||||
const onBeforeUnmount = createHook(
|
||||
const onBeforeUnmount = createHook$1(
|
||||
"bum"
|
||||
/* LifecycleHooks.BEFORE_UNMOUNT */
|
||||
);
|
||||
const onUnmounted = createHook(
|
||||
const onUnmounted = createHook$1(
|
||||
"um"
|
||||
/* LifecycleHooks.UNMOUNTED */
|
||||
);
|
||||
const onServerPrefetch = createHook(
|
||||
const onServerPrefetch = createHook$1(
|
||||
"sp"
|
||||
/* LifecycleHooks.SERVER_PREFETCH */
|
||||
);
|
||||
const onRenderTriggered = createHook(
|
||||
const onRenderTriggered = createHook$1(
|
||||
"rtg"
|
||||
/* LifecycleHooks.RENDER_TRIGGERED */
|
||||
);
|
||||
const onRenderTracked = createHook(
|
||||
const onRenderTracked = createHook$1(
|
||||
"rtc"
|
||||
/* LifecycleHooks.RENDER_TRACKED */
|
||||
);
|
||||
|
|
@ -6079,10 +6079,6 @@ function stringify(styles) {
|
|||
}
|
||||
return ret;
|
||||
}
|
||||
function setRef(ref2, id, opts = {}) {
|
||||
const { $templateRefs } = getCurrentInstance();
|
||||
$templateRefs.push({ i: id, r: ref2, k: opts.k, f: opts.f });
|
||||
}
|
||||
const o = (value, key) => vOn(value, key);
|
||||
const f = (source, renderItem) => vFor(source, renderItem);
|
||||
const s = (value) => stringifyStyle(value);
|
||||
|
|
@ -6090,7 +6086,6 @@ const e = (target, ...sources) => extend(target, ...sources);
|
|||
const n = (value) => normalizeClass(value);
|
||||
const t = (val) => toDisplayString(val);
|
||||
const p = (props) => renderProps(props);
|
||||
const sr = (ref2, id, opts) => setRef(ref2, id, opts);
|
||||
function createApp$1(rootComponent, rootProps = null) {
|
||||
rootComponent && (rootComponent.mpType = "app");
|
||||
return createVueApp(rootComponent, rootProps).use(plugin);
|
||||
|
|
@ -7693,6 +7688,10 @@ const Pinia = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePropert
|
|||
skipHydrate,
|
||||
storeToRefs
|
||||
}, Symbol.toStringTag, { value: "Module" }));
|
||||
const createHook = (lifecycle) => (hook, target = getCurrentInstance()) => {
|
||||
!isInSSRComponentSetup && injectHook(lifecycle, hook, target);
|
||||
};
|
||||
const onLoad = /* @__PURE__ */ createHook(ON_LOAD);
|
||||
exports.Pinia = Pinia;
|
||||
exports._export_sfc = _export_sfc;
|
||||
exports.createPinia = createPinia;
|
||||
|
|
@ -7702,10 +7701,11 @@ exports.e = e;
|
|||
exports.f = f;
|
||||
exports.index = index;
|
||||
exports.n = n;
|
||||
exports.nextTick$1 = nextTick$1;
|
||||
exports.o = o;
|
||||
exports.onLoad = onLoad;
|
||||
exports.p = p;
|
||||
exports.ref = ref;
|
||||
exports.resolveComponent = resolveComponent;
|
||||
exports.s = s;
|
||||
exports.sr = sr;
|
||||
exports.t = t;
|
||||
|
|
|
|||
|
|
@ -4,20 +4,27 @@ const common_assets = require("../../common/assets.js");
|
|||
if (!Array) {
|
||||
const _easycom_up_navbar2 = common_vendor.resolveComponent("up-navbar");
|
||||
const _easycom_u__icon2 = common_vendor.resolveComponent("u--icon");
|
||||
(_easycom_up_navbar2 + _easycom_u__icon2)();
|
||||
const _easycom_up_empty2 = common_vendor.resolveComponent("up-empty");
|
||||
const _easycom_up_button2 = common_vendor.resolveComponent("up-button");
|
||||
const _easycom_up_transition2 = common_vendor.resolveComponent("up-transition");
|
||||
(_easycom_up_navbar2 + _easycom_u__icon2 + _easycom_up_empty2 + _easycom_up_button2 + _easycom_up_transition2)();
|
||||
}
|
||||
const _easycom_up_navbar = () => "../../uni_modules/uview-plus/components/u-navbar/u-navbar.js";
|
||||
const _easycom_u__icon = () => "../../uni_modules/uview-plus/components/u-icon/u-icon.js";
|
||||
const _easycom_up_empty = () => "../../uni_modules/uview-plus/components/u-empty/u-empty.js";
|
||||
const _easycom_up_button = () => "../../uni_modules/uview-plus/components/u-button/u-button.js";
|
||||
const _easycom_up_transition = () => "../../uni_modules/uview-plus/components/u-transition/u-transition.js";
|
||||
if (!Math) {
|
||||
(_easycom_up_navbar + _easycom_u__icon)();
|
||||
(_easycom_up_navbar + _easycom_u__icon + _easycom_up_empty + _easycom_up_button + _easycom_up_transition)();
|
||||
}
|
||||
const _sfc_main = {
|
||||
__name: "cart",
|
||||
setup(__props) {
|
||||
const list = common_vendor.ref(["购物车", "常买", "收藏"]);
|
||||
const list = common_vendor.ref(["购物车", "常买"]);
|
||||
const tabsActive = common_vendor.ref(0);
|
||||
const changeTab = (e) => {
|
||||
tabsActive.value = e;
|
||||
swiperCurrent.value = e;
|
||||
};
|
||||
const swiperCurrent = common_vendor.ref(0);
|
||||
const animationfinish = ({ detail: { current } }) => {
|
||||
|
|
@ -30,7 +37,8 @@ const _sfc_main = {
|
|||
return {
|
||||
a: common_vendor.t(item),
|
||||
b: tabsActive.value == index ? 1 : "",
|
||||
c: common_vendor.o(($event) => changeTab(index))
|
||||
c: index,
|
||||
d: common_vendor.o(($event) => changeTab(index), index)
|
||||
};
|
||||
}),
|
||||
b: common_vendor.p({
|
||||
|
|
@ -60,9 +68,42 @@ const _sfc_main = {
|
|||
name: "plus-circle-fill",
|
||||
size: "20",
|
||||
color: "#20b128"
|
||||
})
|
||||
}, {
|
||||
h: common_vendor.f(20, (item, index, i0) => {
|
||||
return {
|
||||
a: "da603134-4-" + i0,
|
||||
b: index
|
||||
};
|
||||
}),
|
||||
g: swiperCurrent.value,
|
||||
h: common_vendor.o(animationfinish)
|
||||
i: common_vendor.p({
|
||||
size: "small",
|
||||
plain: true,
|
||||
color: "#20b128",
|
||||
shape: "circle"
|
||||
})
|
||||
}, {
|
||||
k: swiperCurrent.value,
|
||||
l: common_vendor.o(animationfinish)
|
||||
}, {
|
||||
n: common_assets._imports_1
|
||||
}, {
|
||||
p: common_vendor.p({
|
||||
size: "small",
|
||||
plain: true,
|
||||
color: "#989898",
|
||||
shape: "circle"
|
||||
}),
|
||||
q: common_vendor.p({
|
||||
size: "small",
|
||||
plain: true,
|
||||
color: "#989898",
|
||||
shape: "circle"
|
||||
})
|
||||
}, {
|
||||
r: common_vendor.p({
|
||||
show: tabsActive.value == 0
|
||||
})
|
||||
});
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,6 +4,9 @@
|
|||
"navigationStyle": "custom",
|
||||
"usingComponents": {
|
||||
"up-navbar": "../../uni_modules/uview-plus/components/u-navbar/u-navbar",
|
||||
"u--icon": "../../uni_modules/uview-plus/components/u-icon/u-icon"
|
||||
"u--icon": "../../uni_modules/uview-plus/components/u-icon/u-icon",
|
||||
"up-empty": "../../uni_modules/uview-plus/components/u-empty/u-empty",
|
||||
"up-button": "../../uni_modules/uview-plus/components/u-button/u-button",
|
||||
"up-transition": "../../uni_modules/uview-plus/components/u-transition/u-transition"
|
||||
}
|
||||
}
|
||||
|
|
@ -1 +1 @@
|
|||
<view><up-navbar wx:if="{{b}}" u-s="{{['left']}}" u-i="da603134-0" bind:__l="__l" u-p="{{b}}"><view style="display:flex" slot="left"><view wx:for="{{a}}" wx:for-item="item" class="{{['tabs', item.b && 'tabs-active']}}" bindtap="{{item.c}}">{{item.a}}</view></view></up-navbar><swiper class="swiper-box" current="{{g}}" bindanimationfinish="{{h}}"><swiper-item class="swiper-item"><scroll-view scroll-y style="height:100%;width:100%"><view class="page-box1"><view class="total"><view>共计<text style="color:#20B128">3</text>件</view><view wx:if="{{true}}">管理</view><view wx:else>完成</view></view><view class="list"><view wx:for="{{c}}" wx:for-item="item" wx:key="f" class="shop-item"><view class="shop-check"><image wx:if="{{item.a}}" src="{{item.b}}"></image><image wx:else src="{{item.c}}"></image></view><image class="shop-img" src="https://cdn.uviewui.com/uview/album/1.jpg"></image><view class="shop-content"><view class="title"><view class="name u-line-2">好吃的瓜果</view><view class="tip u-line-1">香味辛辣|葱香味浓|调味增香香味辛辣|葱香味浓|调味增香</view></view><view class="price-btn"><view class="price">￥12.00</view><view class="btn"><u--icon wx:if="{{d}}" u-i="{{item.d}}" bind:__l="__l" u-p="{{d}}"></u--icon><view class="num">{{e}}</view><u--icon wx:if="{{f}}" u-i="{{item.e}}" bind:__l="__l" u-p="{{f}}"></u--icon></view></view></view></view></view><view style="width:100%;height:200rpx"></view></view></scroll-view></swiper-item></swiper><view class="cart-btn"></view></view>
|
||||
<view><up-navbar wx:if="{{b}}" u-s="{{['left']}}" u-i="da603134-0" bind:__l="__l" u-p="{{b}}"><view style="display:flex" slot="left"><view wx:for="{{a}}" wx:for-item="item" wx:key="c" class="{{['tabs', item.b && 'tabs-active']}}" bindtap="{{item.d}}">{{item.a}}</view></view></up-navbar><swiper class="swiper-box" current="{{k}}" bindanimationfinish="{{l}}"><swiper-item class="swiper-item"><scroll-view scroll-y style="height:100%;width:100%"><view class="page-box1"><view class="total"><view>共计<text style="color:#20B128">3</text>件</view><view wx:if="{{true}}">管理</view><view wx:else>完成</view></view><view wx:if="{{true}}" class="list" style="margin-top:80rpx"><view wx:for="{{c}}" wx:for-item="item" wx:key="f" class="shop-item"><view class="shop-check"><image wx:if="{{item.a}}" src="{{item.b}}"></image><image wx:else src="{{item.c}}"></image></view><image class="shop-img" src="https://cdn.uviewui.com/uview/album/1.jpg"></image><view class="shop-content"><view class="title"><view class="name u-line-2">好吃的瓜果</view><view class="tip u-line-1">香味辛辣|葱香味浓|调味增香香味辛辣|葱香味浓|调味增香</view></view><view class="price-btn"><view class="price">￥12.00</view><view class="btn"><u--icon wx:if="{{d}}" u-i="{{item.d}}" bind:__l="__l" u-p="{{d}}"></u--icon><view class="num">{{e}}</view><u--icon wx:if="{{f}}" u-i="{{item.e}}" bind:__l="__l" u-p="{{f}}"></u--icon></view></view></view></view></view><view wx:else style="margin-top:100rpx"><up-empty wx:if="{{g}}" u-i="da603134-3" bind:__l="__l" u-p="{{g}}"></up-empty></view><view style="width:100%;height:200rpx"></view></view></scroll-view></swiper-item><swiper-item class="swiper-item"><scroll-view scroll-y style="height:100%;width:100%"><view class="page-box1"><view wx:if="{{true}}" class="list"><view wx:for="{{h}}" wx:for-item="item" wx:key="b" class="shop-item"><image class="shop-img" src="https://cdn.uviewui.com/uview/album/1.jpg"></image><view class="shop-content" style="width:490rpx"><view class="title"><view class="name u-line-2">好吃的瓜果</view><view class="tip u-line-1">香味辛辣|葱香味浓|调味增香香味辛辣|葱香味浓|调味增香</view></view><view class="price-btn"><view class="price">￥12.00</view><view class="btn"><up-button wx:if="{{i}}" u-s="{{['d']}}" u-i="{{item.a}}" bind:__l="__l" u-p="{{i}}">加入购物车</up-button></view></view></view></view></view><view wx:else style="margin-top:100rpx"><up-empty wx:if="{{j}}" u-i="da603134-5" bind:__l="__l" u-p="{{j}}"></up-empty></view><view style="width:100%;height:200rpx"></view></view></scroll-view></swiper-item></swiper><up-transition wx:if="{{r}}" u-s="{{['d']}}" u-i="da603134-6" bind:__l="__l" u-p="{{r}}"><view class="cart-btn"><view class="cart-check"><image wx:if="{{false}}" src="{{m}}"></image><image wx:else src="{{n}}"></image><text style="font-size:24rpx">全选</text></view><view wx:if="{{false}}" class="btn-box"><view class="all-price"><view style="width:80rpx">合计:</view><view class="price"><text style="font-size:24rpx">¥</text><text style="font-size:34rpx">20</text><text style="font-size:24rpx">.30</text></view></view><up-button wx:if="{{o}}" u-s="{{['d']}}" u-i="da603134-7,da603134-6" bind:__l="__l" u-p="{{o}}">去结算<text>(2)</text></up-button></view><view wx:else class="btn-box"><view style="width:100px;margin-right:20rpx"><up-button wx:if="{{p}}" u-s="{{['d']}}" u-i="da603134-8,da603134-6" bind:__l="__l" u-p="{{p}}">移入收藏夹</up-button></view><view style="width:80px"><up-button wx:if="{{q}}" u-s="{{['d']}}" u-i="da603134-9,da603134-6" bind:__l="__l" u-p="{{q}}">删除</up-button></view></view></view></up-transition></view>
|
||||
|
|
@ -30,7 +30,6 @@
|
|||
}
|
||||
.tabs-active {
|
||||
color: #20B128;
|
||||
font-size: 34rpx;
|
||||
transition: 300ms;
|
||||
}
|
||||
.swiper-box {
|
||||
|
|
@ -61,7 +60,6 @@
|
|||
}
|
||||
.page-box1 .list {
|
||||
margin: 20rpx;
|
||||
margin-top: 80rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
|
@ -117,4 +115,41 @@
|
|||
.page-box1 .list .shop-item .shop-content .price-btn .btn .num {
|
||||
width: 60rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.cart-btn {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
box-sizing: border-box;
|
||||
background-color: pink;
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: var(--window-bottom);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.cart-btn .cart-check {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.cart-btn .cart-check image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
.cart-btn .btn-box {
|
||||
display: flex;
|
||||
}
|
||||
.cart-btn .btn-box .all-price {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.cart-btn .btn-box .all-price .price {
|
||||
color: #20B128;
|
||||
display: table-cell;
|
||||
vertical-align: bottom;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
@ -1,76 +1,53 @@
|
|||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
if (!Array) {
|
||||
const _easycom_up_icon2 = common_vendor.resolveComponent("up-icon");
|
||||
const _easycom_up_navbar2 = common_vendor.resolveComponent("up-navbar");
|
||||
const _easycom_up_avatar2 = common_vendor.resolveComponent("up-avatar");
|
||||
const _easycom_up_cell2 = common_vendor.resolveComponent("up-cell");
|
||||
const _easycom_up_cell_group2 = common_vendor.resolveComponent("up-cell-group");
|
||||
(_easycom_up_icon2 + _easycom_up_navbar2 + _easycom_up_avatar2 + _easycom_up_cell2 + _easycom_up_cell_group2)();
|
||||
(_easycom_up_navbar2 + _easycom_up_avatar2 + _easycom_up_cell2 + _easycom_up_cell_group2)();
|
||||
}
|
||||
const _easycom_up_icon = () => "../../uni_modules/uview-plus/components/u-icon/u-icon.js";
|
||||
const _easycom_up_navbar = () => "../../uni_modules/uview-plus/components/u-navbar/u-navbar.js";
|
||||
const _easycom_up_avatar = () => "../../uni_modules/uview-plus/components/u-avatar/u-avatar.js";
|
||||
const _easycom_up_cell = () => "../../uni_modules/uview-plus/components/u-cell/u-cell.js";
|
||||
const _easycom_up_cell_group = () => "../../uni_modules/uview-plus/components/u-cell-group/u-cell-group.js";
|
||||
if (!Math) {
|
||||
(_easycom_up_icon + _easycom_up_navbar + _easycom_up_avatar + _easycom_up_cell + _easycom_up_cell_group)();
|
||||
(_easycom_up_navbar + _easycom_up_avatar + _easycom_up_cell + _easycom_up_cell_group)();
|
||||
}
|
||||
const _sfc_main = {
|
||||
__name: "my",
|
||||
setup(__props) {
|
||||
common_vendor.ref("");
|
||||
common_vendor.ref(true);
|
||||
const navTo = (type = 0) => {
|
||||
common_vendor.index.navigateTo({
|
||||
url: `/pagesOrder/order/order?type=${type}`
|
||||
});
|
||||
};
|
||||
return (_ctx, _cache) => {
|
||||
return {
|
||||
a: common_vendor.p({
|
||||
name: "camera-fill",
|
||||
color: "#000000",
|
||||
size: "48"
|
||||
title: "我的",
|
||||
bgColor: "rgba(0,0,0,0)"
|
||||
}),
|
||||
b: common_vendor.p({
|
||||
fixed: false,
|
||||
["is-back"]: false,
|
||||
title: "个人中心",
|
||||
["border-bottom"]: false
|
||||
}),
|
||||
c: common_vendor.p({
|
||||
src: "https://cdn.uviewui.com/uview/album/1.jpg",
|
||||
size: "140"
|
||||
src: "https://shop.lihaink.cn/static/images/f1.png",
|
||||
size: "80"
|
||||
}),
|
||||
c: common_vendor.o(($event) => navTo()),
|
||||
d: common_vendor.p({
|
||||
name: "scan",
|
||||
color: "#969799",
|
||||
size: "28"
|
||||
title: "我的地址",
|
||||
isLink: true
|
||||
}),
|
||||
e: common_vendor.p({
|
||||
name: "arrow-right",
|
||||
color: "#969799",
|
||||
size: "28"
|
||||
title: "意见反馈",
|
||||
isLink: true
|
||||
}),
|
||||
f: common_vendor.p({
|
||||
icon: "rmb-circle",
|
||||
title: "支付"
|
||||
title: "关于我们",
|
||||
isLink: true
|
||||
}),
|
||||
g: common_vendor.p({
|
||||
icon: "star",
|
||||
title: "收藏"
|
||||
}),
|
||||
h: common_vendor.p({
|
||||
icon: "photo",
|
||||
title: "相册"
|
||||
}),
|
||||
i: common_vendor.p({
|
||||
icon: "coupon",
|
||||
title: "卡券"
|
||||
}),
|
||||
j: common_vendor.p({
|
||||
icon: "heart",
|
||||
title: "关注"
|
||||
}),
|
||||
k: common_vendor.p({
|
||||
icon: "setting",
|
||||
title: "设置"
|
||||
title: "设置",
|
||||
isLink: true
|
||||
})
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@
|
|||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom",
|
||||
"usingComponents": {
|
||||
"up-icon": "../../uni_modules/uview-plus/components/u-icon/u-icon",
|
||||
"up-navbar": "../../uni_modules/uview-plus/components/u-navbar/u-navbar",
|
||||
"up-avatar": "../../uni_modules/uview-plus/components/u-avatar/u-avatar",
|
||||
"up-cell": "../../uni_modules/uview-plus/components/u-cell/u-cell",
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
<view><up-navbar wx:if="{{b}}" u-s="{{['d']}}" u-i="39cfeb26-0" bind:__l="__l" u-p="{{b}}"><view class="u-flex u-row-right" style="width:100%"><view class="camera u-flex u-row-center"><up-icon wx:if="{{a}}" u-i="39cfeb26-1,39cfeb26-0" bind:__l="__l" u-p="{{a}}"></up-icon></view></view></up-navbar><view class="u-flex u-flex-y-center u-flex-around user-box u-p-l-30 u-p-r-20 u-p-b-30"><view class="u-m-r-10"><up-avatar wx:if="{{c}}" u-i="39cfeb26-2" bind:__l="__l" u-p="{{c}}"></up-avatar></view><view class="u-flex-1"><view class="u-font-18 u-p-b-20">uview plus</view><view class="u-font-14 u-tips-color">微信号:test</view></view><view class="u-m-l-10 u-p-10"><up-icon wx:if="{{d}}" u-i="39cfeb26-3" bind:__l="__l" u-p="{{d}}"></up-icon></view><view class="u-m-l-10 u-p-10"><up-icon wx:if="{{e}}" u-i="39cfeb26-4" bind:__l="__l" u-p="{{e}}"></up-icon></view></view><view class="u-m-t-20"><up-cell-group u-s="{{['d']}}" u-i="39cfeb26-5" bind:__l="__l"><up-cell wx:if="{{f}}" u-i="39cfeb26-6,39cfeb26-5" bind:__l="__l" u-p="{{f}}"></up-cell></up-cell-group></view><view class="u-m-t-20"><up-cell-group u-s="{{['d']}}" u-i="39cfeb26-7" bind:__l="__l"><up-cell wx:if="{{g}}" u-i="39cfeb26-8,39cfeb26-7" bind:__l="__l" u-p="{{g}}"></up-cell><up-cell wx:if="{{h}}" u-i="39cfeb26-9,39cfeb26-7" bind:__l="__l" u-p="{{h}}"></up-cell><up-cell wx:if="{{i}}" u-i="39cfeb26-10,39cfeb26-7" bind:__l="__l" u-p="{{i}}"></up-cell><up-cell wx:if="{{j}}" u-i="39cfeb26-11,39cfeb26-7" bind:__l="__l" u-p="{{j}}"></up-cell></up-cell-group></view><view class="u-m-t-20"><up-cell-group u-s="{{['d']}}" u-i="39cfeb26-12" bind:__l="__l"><up-cell wx:if="{{k}}" u-i="39cfeb26-13,39cfeb26-12" bind:__l="__l" u-p="{{k}}"></up-cell></up-cell-group></view></view>
|
||||
<view><up-navbar wx:if="{{a}}" u-s="{{['left']}}" u-i="39cfeb26-0" bind:__l="__l" u-p="{{a}}"><view slot="left"></view></up-navbar><view class="user-info"><image class="bg" src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/e3a7b202404261113002322.webp" mode="widthFix"></image><view class="u-card"><up-avatar wx:if="{{b}}" u-i="39cfeb26-1" bind:__l="__l" u-p="{{b}}"></up-avatar><view class="content"><view class="u-phone">151****6699</view><view class="u-id">ID: 6655</view></view></view></view><view class="order-info-box"><view class="order-info"><view class="info-head">我的订单</view><view class="info-list"><view class="list-item"><image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/f335a202404261401535608.png"></image><view class="">待付款</view></view><view class="list-item"><image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/45241202404261403353935.png"></image><view class="">待收货</view></view><view class="list-item"><image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/96915202404261403582769.png"></image><view class="">售后/退款</view></view><view class="list-item" bindtap="{{c}}"><image src="https://lihai001.oss-cn-chengdu.aliyuncs.com/def/abdcd202404261406199643.png"></image><view class="">全部订单</view></view></view></view></view><view class="card"><up-cell-group u-s="{{['d']}}" u-i="39cfeb26-2" bind:__l="__l"><up-cell wx:if="{{d}}" u-i="39cfeb26-3,39cfeb26-2" bind:__l="__l" u-p="{{d}}"></up-cell></up-cell-group></view><view class="card"><up-cell-group u-s="{{['d']}}" u-i="39cfeb26-4" bind:__l="__l"><up-cell wx:if="{{e}}" u-i="39cfeb26-5,39cfeb26-4" bind:__l="__l" u-p="{{e}}"></up-cell><up-cell wx:if="{{f}}" u-i="39cfeb26-6,39cfeb26-4" bind:__l="__l" u-p="{{f}}"></up-cell><up-cell wx:if="{{g}}" u-i="39cfeb26-7,39cfeb26-4" bind:__l="__l" u-p="{{g}}"></up-cell></up-cell-group></view></view>
|
||||
|
|
@ -23,19 +23,86 @@
|
|||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
page {
|
||||
background-color: #ededed;
|
||||
.user-info {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
width: 750rpx;
|
||||
height: 450rpx;
|
||||
}
|
||||
.camera {
|
||||
width: 54px;
|
||||
height: 44px;
|
||||
.user-info .bg {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
.camera:active {
|
||||
background-color: #ededed;
|
||||
.user-info .u-card {
|
||||
box-sizing: border-box;
|
||||
padding: 50rpx 0 50rpx 50rpx;
|
||||
display: flex;
|
||||
position: absolute;
|
||||
bottom: 50rpx;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
.user-box {
|
||||
.user-info .u-card .content {
|
||||
width: 500rpx;
|
||||
padding-left: 30rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
.user-info .u-card .content .u-phone {
|
||||
font-size: 32rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
.user-info .u-card .content .u-id {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.order-info-box {
|
||||
margin: 20rpx;
|
||||
height: 140rpx;
|
||||
position: relative;
|
||||
}
|
||||
.order-info-box .order-info {
|
||||
height: 220rpx;
|
||||
width: 710rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 14rpx;
|
||||
position: absolute;
|
||||
top: -80rpx;
|
||||
left: 0;
|
||||
z-index: 3;
|
||||
background-image: url("https://lihai001.oss-cn-chengdu.aliyuncs.com/def/a8863202404261349533191.png");
|
||||
background-size: 28% 100%;
|
||||
background-position: right;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.u-cell-group {
|
||||
.order-info-box .order-info .info-head {
|
||||
margin-left: 20rpx;
|
||||
margin-top: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.order-info-box .order-info .info-list {
|
||||
height: 110rpx;
|
||||
display: flex;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.order-info-box .order-info .info-list .list-item {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.order-info-box .order-info .info-list .list-item image {
|
||||
width: 64rpx;
|
||||
height: 64rpx;
|
||||
}
|
||||
.card {
|
||||
margin: 20rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 14rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
|
@ -1,365 +0,0 @@
|
|||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
const _sfc_main = {
|
||||
data() {
|
||||
return {
|
||||
orderList: [[], [], [], []],
|
||||
dataList: [
|
||||
{
|
||||
id: 1,
|
||||
store: "夏日流星限定贩卖",
|
||||
deal: "交易成功",
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: "//img13.360buyimg.com/n7/jfs/t1/103005/7/17719/314825/5e8c19faEb7eed50d/5b81ae4b2f7f3bb7.jpg",
|
||||
title: "【冬日限定】现货 原创jk制服女2020冬装新款小清新宽松软糯毛衣外套女开衫短款百搭日系甜美风",
|
||||
type: "灰色;M",
|
||||
deliveryTime: "付款后30天内发货",
|
||||
price: "348.58",
|
||||
number: 2
|
||||
},
|
||||
{
|
||||
goodsUrl: "//img12.360buyimg.com/n7/jfs/t1/102191/19/9072/330688/5e0af7cfE17698872/c91c00d713bf729a.jpg",
|
||||
title: "【葡萄藤】现货 小清新学院风制服格裙百褶裙女短款百搭日系甜美风原创jk制服女2020新款",
|
||||
type: "45cm;S",
|
||||
deliveryTime: "付款后30天内发货",
|
||||
price: "135.00",
|
||||
number: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
store: "江南皮革厂",
|
||||
deal: "交易失败",
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: "//img14.360buyimg.com/n7/jfs/t1/60319/15/6105/406802/5d43f68aE9f00db8c/0affb7ac46c345e2.jpg",
|
||||
title: "【冬日限定】现货 原创jk制服女2020冬装新款小清新宽松软糯毛衣外套女开衫短款百搭日系甜美风",
|
||||
type: "粉色;M",
|
||||
deliveryTime: "付款后7天内发货",
|
||||
price: "128.05",
|
||||
number: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
store: "三星旗舰店",
|
||||
deal: "交易失败",
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: "//img11.360buyimg.com/n7/jfs/t1/94448/29/2734/524808/5dd4cc16E990dfb6b/59c256f85a8c3757.jpg",
|
||||
title: "三星（SAMSUNG）京品家电 UA65RUF70AJXXZ 65英寸4K超高清 HDR 京东微联 智能语音 教育资源液晶电视机",
|
||||
type: "4K，广色域",
|
||||
deliveryTime: "保质5年",
|
||||
price: "1998",
|
||||
number: 3
|
||||
},
|
||||
{
|
||||
goodsUrl: "//img14.360buyimg.com/n7/jfs/t6007/205/4099529191/294869/ae4e6d4f/595dcf19Ndce3227d.jpg!q90.jpg",
|
||||
title: "美的(Midea)639升 对开门冰箱 19分钟急速净味 一级能效冷藏双开门杀菌智能家用双变频节能 BCD-639WKPZM(E)",
|
||||
type: "容量大，速冻",
|
||||
deliveryTime: "保质5年",
|
||||
price: "2354",
|
||||
number: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
store: "三星旗舰店",
|
||||
deal: "交易失败",
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: "//img10.360buyimg.com/n7/jfs/t22300/31/1505958241/171936/9e201a89/5b2b12ffNe6dbb594.jpg!q90.jpg",
|
||||
title: "法国进口红酒 拉菲（LAFITE）传奇波尔多干红葡萄酒750ml*6整箱装",
|
||||
type: "4K，广色域",
|
||||
deliveryTime: "珍藏10年好酒",
|
||||
price: "1543",
|
||||
number: 3
|
||||
},
|
||||
{
|
||||
goodsUrl: "//img10.360buyimg.com/n7/jfs/t1/107598/17/3766/525060/5e143aacE9a94d43c/03573ae60b8bf0ee.jpg",
|
||||
title: "蓝妹（BLUE GIRL）酷爽啤酒 清啤 原装进口啤酒 罐装 500ml*9听 整箱装",
|
||||
type: "一打",
|
||||
deliveryTime: "口感好",
|
||||
price: "120",
|
||||
number: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
store: "三星旗舰店",
|
||||
deal: "交易成功",
|
||||
goodsList: [
|
||||
{
|
||||
goodsUrl: "//img12.360buyimg.com/n7/jfs/t1/52408/35/3554/78293/5d12e9cfEfd118ba1/ba5995e62cbd747f.jpg!q90.jpg",
|
||||
title: "企业微信 中控人脸指纹识别考勤机刷脸机 无线签到异地多店打卡机WX108",
|
||||
type: "识别效率高",
|
||||
deliveryTime: "使用方便",
|
||||
price: "451",
|
||||
number: 9
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
list: [
|
||||
{
|
||||
name: "待付款"
|
||||
},
|
||||
{
|
||||
name: "待发货"
|
||||
},
|
||||
{
|
||||
name: "待收货"
|
||||
},
|
||||
{
|
||||
name: "待评价",
|
||||
count: 12
|
||||
}
|
||||
],
|
||||
current: 0,
|
||||
swiperCurrent: 0,
|
||||
tabsHeight: 0,
|
||||
dx: 0,
|
||||
loadStatus: ["loadmore", "loadmore", "loadmore", "loadmore"]
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
this.getOrderList(0);
|
||||
this.getOrderList(1);
|
||||
this.getOrderList(3);
|
||||
},
|
||||
computed: {
|
||||
// 价格小数
|
||||
priceDecimal() {
|
||||
return (val) => {
|
||||
if (val !== parseInt(val))
|
||||
return val.slice(-2);
|
||||
else
|
||||
return "00";
|
||||
};
|
||||
},
|
||||
// 价格整数
|
||||
priceInt() {
|
||||
return (val) => {
|
||||
if (val !== parseInt(val))
|
||||
return val.split(".")[0];
|
||||
else
|
||||
return val;
|
||||
};
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
reachBottom() {
|
||||
if (this.current != 2) {
|
||||
this.loadStatus.splice(this.current, 1, "loading");
|
||||
setTimeout(() => {
|
||||
this.getOrderList(this.current);
|
||||
}, 1200);
|
||||
}
|
||||
},
|
||||
// 页面数据
|
||||
getOrderList(idx) {
|
||||
for (let i = 0; i < 5; i++) {
|
||||
let index = this.$u.random(0, this.dataList.length - 1);
|
||||
let data = JSON.parse(JSON.stringify(this.dataList[index]));
|
||||
data.id = this.$u.guid();
|
||||
this.orderList[idx].push(data);
|
||||
}
|
||||
this.loadStatus.splice(this.current, 1, "loadmore");
|
||||
},
|
||||
// 总价
|
||||
totalPrice(item) {
|
||||
let price = 0;
|
||||
item.map((val) => {
|
||||
price += parseFloat(val.price);
|
||||
});
|
||||
return price.toFixed(2);
|
||||
},
|
||||
// 总件数
|
||||
totalNum(item) {
|
||||
let num = 0;
|
||||
item.map((val) => {
|
||||
num += val.number;
|
||||
});
|
||||
return num;
|
||||
},
|
||||
// tab栏切换
|
||||
change(e) {
|
||||
console.log(e);
|
||||
this.swiperCurrent = e.index;
|
||||
this.getOrderList(e.index);
|
||||
},
|
||||
transition({ detail: { dx } }) {
|
||||
},
|
||||
animationfinish({ detail: { current } }) {
|
||||
this.swiperCurrent = current;
|
||||
this.current = current;
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!Array) {
|
||||
const _easycom_u_tabs2 = common_vendor.resolveComponent("u-tabs");
|
||||
const _easycom_u_icon2 = common_vendor.resolveComponent("u-icon");
|
||||
const _easycom_u_loadmore2 = common_vendor.resolveComponent("u-loadmore");
|
||||
(_easycom_u_tabs2 + _easycom_u_icon2 + _easycom_u_loadmore2)();
|
||||
}
|
||||
const _easycom_u_tabs = () => "../../uni_modules/uview-plus/components/u-tabs/u-tabs.js";
|
||||
const _easycom_u_icon = () => "../../uni_modules/uview-plus/components/u-icon/u-icon.js";
|
||||
const _easycom_u_loadmore = () => "../../uni_modules/uview-plus/components/u-loadmore/u-loadmore.js";
|
||||
if (!Math) {
|
||||
(_easycom_u_tabs + _easycom_u_icon + _easycom_u_loadmore)();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return {
|
||||
a: common_vendor.sr("tabs", "93207a4f-0"),
|
||||
b: common_vendor.o($options.change),
|
||||
c: common_vendor.p({
|
||||
activeColor: "#f29100",
|
||||
list: $data.list,
|
||||
current: $data.current,
|
||||
["is-scroll"]: false,
|
||||
swiperWidth: "750"
|
||||
}),
|
||||
d: common_vendor.f($data.orderList[0], (res, index, i0) => {
|
||||
return {
|
||||
a: "93207a4f-1-" + i0,
|
||||
b: common_vendor.t(res.store),
|
||||
c: "93207a4f-2-" + i0,
|
||||
d: common_vendor.t(res.deal),
|
||||
e: common_vendor.f(res.goodsList, (item, index2, i1) => {
|
||||
return {
|
||||
a: item.goodsUrl,
|
||||
b: common_vendor.t(item.title),
|
||||
c: common_vendor.t(item.type),
|
||||
d: common_vendor.t(item.deliveryTime),
|
||||
e: common_vendor.t($options.priceInt(item.price)),
|
||||
f: common_vendor.t($options.priceDecimal(item.price)),
|
||||
g: common_vendor.t(item.number),
|
||||
h: index2
|
||||
};
|
||||
}),
|
||||
f: common_vendor.t($options.totalNum(res.goodsList)),
|
||||
g: common_vendor.t($options.priceInt($options.totalPrice(res.goodsList))),
|
||||
h: common_vendor.t($options.priceDecimal($options.totalPrice(res.goodsList))),
|
||||
i: "93207a4f-3-" + i0,
|
||||
j: res.id
|
||||
};
|
||||
}),
|
||||
e: common_vendor.p({
|
||||
name: "home",
|
||||
size: 30,
|
||||
color: "rgb(94,94,94)"
|
||||
}),
|
||||
f: common_vendor.p({
|
||||
name: "arrow-right",
|
||||
color: "rgb(203,203,203)",
|
||||
size: 26
|
||||
}),
|
||||
g: common_vendor.p({
|
||||
name: "more-dot-fill",
|
||||
color: "rgb(203,203,203)"
|
||||
}),
|
||||
h: common_vendor.p({
|
||||
status: $data.loadStatus[0],
|
||||
bgColor: "#f2f2f2"
|
||||
}),
|
||||
i: common_vendor.o((...args) => $options.reachBottom && $options.reachBottom(...args)),
|
||||
j: common_vendor.f($data.orderList[1], (res, index, i0) => {
|
||||
return {
|
||||
a: "93207a4f-5-" + i0,
|
||||
b: common_vendor.t(res.store),
|
||||
c: "93207a4f-6-" + i0,
|
||||
d: common_vendor.t(res.deal),
|
||||
e: common_vendor.f(res.goodsList, (item, index2, i1) => {
|
||||
return {
|
||||
a: item.goodsUrl,
|
||||
b: common_vendor.t(item.title),
|
||||
c: common_vendor.t(item.type),
|
||||
d: common_vendor.t(item.deliveryTime),
|
||||
e: common_vendor.t($options.priceInt(item.price)),
|
||||
f: common_vendor.t($options.priceDecimal(item.price)),
|
||||
g: common_vendor.t(item.number),
|
||||
h: index2
|
||||
};
|
||||
}),
|
||||
f: common_vendor.t($options.totalNum(res.goodsList)),
|
||||
g: common_vendor.t($options.priceInt($options.totalPrice(res.goodsList))),
|
||||
h: common_vendor.t($options.priceDecimal($options.totalPrice(res.goodsList))),
|
||||
i: "93207a4f-7-" + i0,
|
||||
j: res.id
|
||||
};
|
||||
}),
|
||||
k: common_vendor.p({
|
||||
name: "home",
|
||||
size: 30,
|
||||
color: "rgb(94,94,94)"
|
||||
}),
|
||||
l: common_vendor.p({
|
||||
name: "arrow-right",
|
||||
color: "rgb(203,203,203)",
|
||||
size: 26
|
||||
}),
|
||||
m: common_vendor.p({
|
||||
name: "more-dot-fill",
|
||||
color: "rgb(203,203,203)"
|
||||
}),
|
||||
n: common_vendor.p({
|
||||
status: $data.loadStatus[1],
|
||||
bgColor: "#f2f2f2"
|
||||
}),
|
||||
o: common_vendor.o((...args) => $options.reachBottom && $options.reachBottom(...args)),
|
||||
p: common_vendor.f($data.orderList[3], (res, index, i0) => {
|
||||
return {
|
||||
a: "93207a4f-9-" + i0,
|
||||
b: common_vendor.t(res.store),
|
||||
c: "93207a4f-10-" + i0,
|
||||
d: common_vendor.t(res.deal),
|
||||
e: common_vendor.f(res.goodsList, (item, index2, i1) => {
|
||||
return {
|
||||
a: item.goodsUrl,
|
||||
b: common_vendor.t(item.title),
|
||||
c: common_vendor.t(item.type),
|
||||
d: common_vendor.t(item.deliveryTime),
|
||||
e: common_vendor.t($options.priceInt(item.price)),
|
||||
f: common_vendor.t($options.priceDecimal(item.price)),
|
||||
g: common_vendor.t(item.number),
|
||||
h: index2
|
||||
};
|
||||
}),
|
||||
f: common_vendor.t($options.totalNum(res.goodsList)),
|
||||
g: common_vendor.t($options.priceInt($options.totalPrice(res.goodsList))),
|
||||
h: common_vendor.t($options.priceDecimal($options.totalPrice(res.goodsList))),
|
||||
i: "93207a4f-11-" + i0,
|
||||
j: res.id
|
||||
};
|
||||
}),
|
||||
q: common_vendor.p({
|
||||
name: "home",
|
||||
size: 30,
|
||||
color: "rgb(94,94,94)"
|
||||
}),
|
||||
r: common_vendor.p({
|
||||
name: "arrow-right",
|
||||
color: "rgb(203,203,203)",
|
||||
size: 26
|
||||
}),
|
||||
s: common_vendor.p({
|
||||
name: "more-dot-fill",
|
||||
color: "rgb(203,203,203)"
|
||||
}),
|
||||
t: common_vendor.p({
|
||||
status: $data.loadStatus[3],
|
||||
bgColor: "#f2f2f2"
|
||||
}),
|
||||
v: common_vendor.o((...args) => $options.reachBottom && $options.reachBottom(...args)),
|
||||
w: $data.swiperCurrent,
|
||||
x: common_vendor.o((...args) => $options.transition && $options.transition(...args)),
|
||||
y: common_vendor.o((...args) => $options.animationfinish && $options.animationfinish(...args))
|
||||
};
|
||||
}
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-93207a4f"], ["__file", "D:/里海数字乡村/purchase-let/pages/order/order.vue"]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
{
|
||||
"navigationBarTitleText": "订单",
|
||||
"enablePullDownRefresh": false,
|
||||
"usingComponents": {
|
||||
"u-tabs": "../../uni_modules/uview-plus/components/u-tabs/u-tabs",
|
||||
"u-icon": "../../uni_modules/uview-plus/components/u-icon/u-icon",
|
||||
"u-loadmore": "../../uni_modules/uview-plus/components/u-loadmore/u-loadmore"
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,161 +0,0 @@
|
|||
|
||||
page {
|
||||
height: 100%;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.order.data-v-93207a4f {
|
||||
width: 710rpx;
|
||||
background-color: #ffffff;
|
||||
margin: 20rpx auto;
|
||||
border-radius: 20rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.order .top.data-v-93207a4f {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.order .top .left.data-v-93207a4f {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.order .top .left .store.data-v-93207a4f {
|
||||
margin: 0 10rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.order .top .right.data-v-93207a4f {
|
||||
color: #f1a532;
|
||||
}
|
||||
.order .item.data-v-93207a4f {
|
||||
display: flex;
|
||||
margin: 20rpx 0 0;
|
||||
}
|
||||
.order .item .left.data-v-93207a4f {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.order .item .left image.data-v-93207a4f {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.order .item .content .title.data-v-93207a4f {
|
||||
font-size: 28rpx;
|
||||
line-height: 50rpx;
|
||||
}
|
||||
.order .item .content .type.data-v-93207a4f {
|
||||
margin: 10rpx 0;
|
||||
font-size: 24rpx;
|
||||
color: #909193;
|
||||
}
|
||||
.order .item .content .delivery-time.data-v-93207a4f {
|
||||
color: #e5d001;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.order .item .right.data-v-93207a4f {
|
||||
margin-left: 10rpx;
|
||||
padding-top: 20rpx;
|
||||
text-align: right;
|
||||
}
|
||||
.order .item .right .decimal.data-v-93207a4f {
|
||||
font-size: 24rpx;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
.order .item .right .number.data-v-93207a4f {
|
||||
color: #909193;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.order .total.data-v-93207a4f {
|
||||
margin-top: 20rpx;
|
||||
text-align: right;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.order .total .total-price.data-v-93207a4f {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.order .bottom.data-v-93207a4f {
|
||||
display: flex;
|
||||
margin-top: 40rpx;
|
||||
padding: 0 10rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.order .bottom .btn.data-v-93207a4f {
|
||||
line-height: 52rpx;
|
||||
width: 160rpx;
|
||||
border-radius: 26rpx;
|
||||
border: 2rpx solid #dadbde;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
color: #767a82;
|
||||
}
|
||||
.order .bottom .evaluate.data-v-93207a4f {
|
||||
color: #f1a532;
|
||||
border-color: #f1a532;
|
||||
}
|
||||
.centre.data-v-93207a4f {
|
||||
text-align: center;
|
||||
margin: 200rpx auto;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.centre image.data-v-93207a4f {
|
||||
width: 164rpx;
|
||||
height: 164rpx;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.centre .tips.data-v-93207a4f {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.centre .btn.data-v-93207a4f {
|
||||
margin: 80rpx auto;
|
||||
width: 200rpx;
|
||||
border-radius: 32rpx;
|
||||
line-height: 64rpx;
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
background: linear-gradient(270deg, #f9745a 0%, #ff9e01 100%);
|
||||
}
|
||||
.wrap.data-v-93207a4f {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh - var(--window-top));
|
||||
width: 100%;
|
||||
}
|
||||
.swiper-box.data-v-93207a4f {
|
||||
flex: 1;
|
||||
height: calc(100vh - var(--window-top));
|
||||
}
|
||||
.swiper-item.data-v-93207a4f {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
if (!Array) {
|
||||
const _easycom_up_icon2 = common_vendor.resolveComponent("up-icon");
|
||||
const _easycom_up_button2 = common_vendor.resolveComponent("up-button");
|
||||
const _easycom_up_popup2 = common_vendor.resolveComponent("up-popup");
|
||||
(_easycom_up_icon2 + _easycom_up_button2 + _easycom_up_popup2)();
|
||||
}
|
||||
const _easycom_up_icon = () => "../../uni_modules/uview-plus/components/u-icon/u-icon.js";
|
||||
const _easycom_up_button = () => "../../uni_modules/uview-plus/components/u-button/u-button.js";
|
||||
const _easycom_up_popup = () => "../../uni_modules/uview-plus/components/u-popup/u-popup.js";
|
||||
if (!Math) {
|
||||
(_easycom_up_icon + _easycom_up_button + _easycom_up_popup)();
|
||||
}
|
||||
const _sfc_main = {
|
||||
__name: "detail",
|
||||
setup(__props) {
|
||||
const showCancel = common_vendor.ref(false);
|
||||
common_vendor.onLoad((option) => {
|
||||
common_vendor.index.setNavigationBarTitle({
|
||||
title: option.type == 1 ? "等待付款" : "订单详情"
|
||||
});
|
||||
});
|
||||
return (_ctx, _cache) => {
|
||||
return {
|
||||
a: common_vendor.p({
|
||||
name: "map"
|
||||
}),
|
||||
b: common_vendor.p({
|
||||
size: "small",
|
||||
shape: "circle",
|
||||
color: "#f6f6f6",
|
||||
customStyle: {
|
||||
color: "#666666"
|
||||
}
|
||||
}),
|
||||
c: common_vendor.o(($event) => showCancel.value = true),
|
||||
d: common_vendor.p({
|
||||
color: "#20B128",
|
||||
shape: "circle"
|
||||
}),
|
||||
e: common_vendor.o(($event) => showCancel.value = false),
|
||||
f: common_vendor.p({
|
||||
show: showCancel.value,
|
||||
closeable: true,
|
||||
round: "10"
|
||||
})
|
||||
};
|
||||
};
|
||||
}
|
||||
};
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__file", "D:/里海数字乡村/purchase-let/pagesOrder/detail/detail.vue"]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
{
|
||||
"navigationBarTitleText": "",
|
||||
"enablePullDownRefresh": false,
|
||||
"usingComponents": {
|
||||
"up-icon": "../../uni_modules/uview-plus/components/u-icon/u-icon",
|
||||
"up-button": "../../uni_modules/uview-plus/components/u-button/u-button",
|
||||
"up-popup": "../../uni_modules/uview-plus/components/u-popup/u-popup"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<view class=""><view class="count_down"> 还剩<text>00:28:36</text>订单自动取消 </view><view class="m-card m-address"><view class="address-info"><view class="top"><up-icon wx:if="{{a}}" u-i="666b5ad0-0" bind:__l="__l" u-p="{{a}}"></up-icon><view class="t-name">小王</view><view>155****9999</view></view><view class="bottom u-line-2"> 四川泸州市龙马潭区莲花池街道商业街1号 </view></view><view class="address-btn"><view style="width:80px"><up-button wx:if="{{b}}" u-s="{{['d']}}" u-i="666b5ad0-1" bind:__l="__l" u-p="{{b}}">修改</up-button></view></view></view><view class="m-card m-good"><image class="image" src="/static/logo.png"></image><view class="body-content"><view><view class="title"><view>黄牛肉20kg</view><view>¥10.00</view></view><view class="tips"><view>我不吃牛肉</view><view>x5</view></view></view><view class="time"> 预计48小时发货 </view></view></view><view class="m-card good-info"><view class="row"><view>商品总价 <text>共计5件商品</text></view><view><text>¥</text>50<text>.00</text></view></view><view class="row"><view>运费</view><view><text>¥</text>0<text>.00</text></view></view><view class="row-need"><view style="margin-right:10rpx">需付款</view><view><text>¥</text>50<text>.00</text></view></view></view><view class="m-card good-info"><view class="head-title">订单信息</view><view class="row"><view>订单编号</view><view>wxo13546486484784555 | 复制</view></view><view class="row"><view>下单时间</view><view>2024-04-25 15:00:00</view></view><view class="row" style="margin-bottom:0"><view>支付状态</view><view class="red">待支付</view></view></view><view style="width:100%;height:200rpx"></view><view class="btn-box"><view style="color:#777777" bindtap="{{c}}">取消订单</view><view style="width:450rpx"><up-button wx:if="{{d}}" u-s="{{['d']}}" u-i="666b5ad0-2" bind:__l="__l" u-p="{{d}}">立即支付 ¥50.00</up-button></view></view><up-popup wx:if="{{f}}" u-s="{{['d']}}" bindclose="{{e}}" u-i="666b5ad0-3" bind:__l="__l" u-p="{{f}}"><view class="cancle-popup"><view class="head-title">订单取消</view><view><view>不想要了</view></view></view></up-popup></view>
|
||||
|
|
@ -0,0 +1,153 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.count_down {
|
||||
padding: 20rpx 0;
|
||||
text-align: center;
|
||||
color: #444444;
|
||||
}
|
||||
.count_down text {
|
||||
color: #F55726;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
.m-card {
|
||||
width: 710rpx;
|
||||
margin: 0 auto;
|
||||
background-color: #fff;
|
||||
border-radius: 14rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.m-address {
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: #999999;
|
||||
}
|
||||
.m-address .address-info {
|
||||
width: 510rpx;
|
||||
}
|
||||
.m-address .address-info .top {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.m-address .address-info .top .t-name {
|
||||
color: #444;
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
.m-address .address-info .bottom {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.m-good {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.m-good .image {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.m-good .body-content {
|
||||
width: 490rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
color: #989898;
|
||||
}
|
||||
.m-good .body-content .title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
color: #444;
|
||||
}
|
||||
.m-good .body-content .tips {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.m-good .body-content .time {
|
||||
background-color: #F6F6F6;
|
||||
padding: 5rpx 10rpx;
|
||||
font-size: 26rpx;
|
||||
color: #444;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.good-info {
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.good-info .head-title {
|
||||
margin-bottom: 18rpx;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
.good-info .row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 18rpx;
|
||||
}
|
||||
.good-info .row .red {
|
||||
color: #F55726;
|
||||
}
|
||||
.good-info .row-need {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
color: #F55726;
|
||||
}
|
||||
.good-info text {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
.btn-box {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 120rpx;
|
||||
height: calc(constant(safe-area-inset-bottom) + 120rpx);
|
||||
/* 适用于iOS设备 */
|
||||
height: calc(env(safe-area-inset-bottom) + 120rpx);
|
||||
/* 适用于Android设备 */
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
padding-bottom: calc(constant(safe-area-inset-bottom) + 20rpx);
|
||||
/* 适用于iOS设备 */
|
||||
padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
|
||||
/* 适用于Android设备 */
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.cancle-popup {
|
||||
height: 500rpx;
|
||||
}
|
||||
.cancle-popup .head-title {
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,77 @@
|
|||
"use strict";
|
||||
const common_vendor = require("../../../common/vendor.js");
|
||||
if (!Array) {
|
||||
const _easycom_up_button2 = common_vendor.resolveComponent("up-button");
|
||||
const _easycom_up_icon2 = common_vendor.resolveComponent("up-icon");
|
||||
(_easycom_up_button2 + _easycom_up_icon2)();
|
||||
}
|
||||
const _easycom_up_button = () => "../../../uni_modules/uview-plus/components/u-button/u-button.js";
|
||||
const _easycom_up_icon = () => "../../../uni_modules/uview-plus/components/u-icon/u-icon.js";
|
||||
if (!Math) {
|
||||
(_easycom_up_button + _easycom_up_icon)();
|
||||
}
|
||||
const _sfc_main = {
|
||||
__name: "good",
|
||||
props: {
|
||||
type: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
setup(__props) {
|
||||
const navTo = () => {
|
||||
common_vendor.index.navigateTo({
|
||||
url: "/pagesOrder/detail/detail?type=1"
|
||||
});
|
||||
};
|
||||
return (_ctx, _cache) => {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.o(navTo),
|
||||
b: common_vendor.o(navTo),
|
||||
c: __props.type == 1
|
||||
}, __props.type == 1 ? {
|
||||
d: common_vendor.p({
|
||||
size: "small",
|
||||
plain: true,
|
||||
color: "#989898",
|
||||
shape: "circle"
|
||||
}),
|
||||
e: common_vendor.p({
|
||||
size: "small",
|
||||
plain: true,
|
||||
color: "#20B128",
|
||||
shape: "circle"
|
||||
})
|
||||
} : {}, {
|
||||
f: __props.type == 2 || __props.type == 0
|
||||
}, __props.type == 2 || __props.type == 0 ? {
|
||||
g: common_vendor.p({
|
||||
size: "small",
|
||||
plain: true,
|
||||
color: "#989898",
|
||||
shape: "circle"
|
||||
}),
|
||||
h: common_vendor.p({
|
||||
size: "small",
|
||||
plain: true,
|
||||
color: "#20B128",
|
||||
shape: "circle"
|
||||
}),
|
||||
i: common_vendor.p({
|
||||
size: "small",
|
||||
plain: true,
|
||||
color: "#20B128",
|
||||
shape: "circle"
|
||||
})
|
||||
} : {}, {
|
||||
j: __props.type == 3
|
||||
}, __props.type == 3 ? {
|
||||
k: common_vendor.p({
|
||||
name: "arrow-right"
|
||||
})
|
||||
} : {});
|
||||
};
|
||||
}
|
||||
};
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__file", "D:/里海数字乡村/purchase-let/pagesOrder/order/component/good.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"up-button": "../../../uni_modules/uview-plus/components/u-button/u-button",
|
||||
"up-icon": "../../../uni_modules/uview-plus/components/u-icon/u-icon"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<view class="shop-item"><view class="item-title" bindtap="{{a}}"><view>wxo12335656455532232666</view><view>待付款</view></view><view class="item-body" bindtap="{{b}}"><image class="image" src="/static/logo.png"></image><view class="body-content"><view><view class="title"><view>黄牛肉20kg</view><view>¥10.00</view></view><view class="tips"><view>我不吃牛肉</view><view>x5</view></view></view><view class="all">共5件商品, 总金额 <text>¥20.30</text></view></view></view><view wx:if="{{c}}" class="item-btn"><view style="width:80px"><up-button wx:if="{{d}}" u-s="{{['d']}}" u-i="e1c5d592-0" bind:__l="__l" u-p="{{d}}">取消订单</up-button></view><view style="width:80px"><up-button wx:if="{{e}}" u-s="{{['d']}}" u-i="e1c5d592-1" bind:__l="__l" u-p="{{e}}">立即支付</up-button></view></view><view wx:if="{{f}}" class="item-btn"><view style="width:80px"><up-button wx:if="{{g}}" u-s="{{['d']}}" u-i="e1c5d592-2" bind:__l="__l" u-p="{{g}}">申请售后</up-button></view><view style="width:80px"><up-button wx:if="{{h}}" u-s="{{['d']}}" u-i="e1c5d592-3" bind:__l="__l" u-p="{{h}}">确认收货</up-button></view><view style="width:80px"><up-button wx:if="{{i}}" u-s="{{['d']}}" u-i="e1c5d592-4" bind:__l="__l" u-p="{{i}}">再次购买</up-button></view></view><view wx:if="{{j}}" class="item-close"><view class="title"><view class="type">退款申请中</view><view>等待商家处理</view></view><up-icon wx:if="{{k}}" u-i="e1c5d592-5" bind:__l="__l" u-p="{{k}}"></up-icon></view></view>
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.shop-item {
|
||||
width: 710rpx;
|
||||
height: 340rpx;
|
||||
margin-bottom: 20rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 14rpx;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.shop-item .item-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.shop-item .item-body {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
.shop-item .item-body .image {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
.shop-item .item-body .body-content {
|
||||
width: 490rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
color: #989898;
|
||||
}
|
||||
.shop-item .item-body .body-content .title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
color: #444;
|
||||
}
|
||||
.shop-item .item-body .body-content .tips {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.shop-item .item-body .body-content .all {
|
||||
align-self: flex-end;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.shop-item .item-body .body-content .all text {
|
||||
color: #F55726;
|
||||
}
|
||||
.shop-item .item-btn {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.shop-item .item-btn view {
|
||||
width: 80rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
.shop-item .item-close {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #F6F6F6;
|
||||
padding: 15rpx;
|
||||
border-radius: 14rpx;
|
||||
}
|
||||
.shop-item .item-close .title {
|
||||
display: flex;
|
||||
}
|
||||
.shop-item .item-close .title .type {
|
||||
font-weight: 600;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
"use strict";
|
||||
const common_vendor = require("../../common/vendor.js");
|
||||
if (!Array) {
|
||||
const _easycom_up_search2 = common_vendor.resolveComponent("up-search");
|
||||
const _easycom_up_tabs2 = common_vendor.resolveComponent("up-tabs");
|
||||
const _easycom_up_sticky2 = common_vendor.resolveComponent("up-sticky");
|
||||
const _easycom_up_empty2 = common_vendor.resolveComponent("up-empty");
|
||||
(_easycom_up_search2 + _easycom_up_tabs2 + _easycom_up_sticky2 + _easycom_up_empty2)();
|
||||
}
|
||||
const _easycom_up_search = () => "../../uni_modules/uview-plus/components/u-search/u-search.js";
|
||||
const _easycom_up_tabs = () => "../../uni_modules/uview-plus/components/u-tabs/u-tabs.js";
|
||||
const _easycom_up_sticky = () => "../../uni_modules/uview-plus/components/u-sticky/u-sticky.js";
|
||||
const _easycom_up_empty = () => "../../uni_modules/uview-plus/components/u-empty/u-empty.js";
|
||||
if (!Math) {
|
||||
(_easycom_up_search + _easycom_up_tabs + _easycom_up_sticky + good + _easycom_up_empty)();
|
||||
}
|
||||
const good = () => "./component/good.js";
|
||||
const _sfc_main = {
|
||||
__name: "order",
|
||||
setup(__props) {
|
||||
common_vendor.ref(["购物车", "常买", "收藏"]);
|
||||
const tabsActive = common_vendor.ref(0);
|
||||
const changeTab = ({ index }) => {
|
||||
tabsActive.value = index;
|
||||
swiperCurrent.value = index;
|
||||
};
|
||||
const tablist = common_vendor.ref([
|
||||
{ name: "全部" },
|
||||
{ name: "待付款" },
|
||||
{ name: "待收货" },
|
||||
{ name: "退款/售后" }
|
||||
]);
|
||||
const swiperCurrent = common_vendor.ref(0);
|
||||
const animationfinish = ({ detail: { current } }) => {
|
||||
swiperCurrent.value = current;
|
||||
tabsActive.value = current;
|
||||
};
|
||||
return (_ctx, _cache) => {
|
||||
return common_vendor.e({
|
||||
a: common_vendor.p({
|
||||
shape: "round",
|
||||
actionStyle: {
|
||||
color: "#20b128"
|
||||
}
|
||||
}),
|
||||
b: common_vendor.o(changeTab),
|
||||
c: common_vendor.p({
|
||||
current: tabsActive.value,
|
||||
list: tablist.value,
|
||||
lineColor: "#20b128",
|
||||
scrollable: false,
|
||||
activeStyle: {
|
||||
color: "#20b128",
|
||||
fontWeight: "bold"
|
||||
}
|
||||
}),
|
||||
d: common_vendor.p({
|
||||
bgColor: "#fff"
|
||||
})
|
||||
}, {
|
||||
e: common_vendor.f(10, (item, index, i0) => {
|
||||
return {
|
||||
a: index,
|
||||
b: "aea1ad54-3-" + i0
|
||||
};
|
||||
}),
|
||||
f: common_vendor.p({
|
||||
type: 0
|
||||
})
|
||||
}, {
|
||||
h: common_vendor.f(10, (item, index, i0) => {
|
||||
return {
|
||||
a: index,
|
||||
b: "aea1ad54-5-" + i0
|
||||
};
|
||||
}),
|
||||
i: common_vendor.p({
|
||||
type: 1
|
||||
})
|
||||
}, {
|
||||
k: common_vendor.f(10, (item, index, i0) => {
|
||||
return {
|
||||
a: index,
|
||||
b: "aea1ad54-7-" + i0
|
||||
};
|
||||
}),
|
||||
l: common_vendor.p({
|
||||
type: 2
|
||||
})
|
||||
}, {
|
||||
n: common_vendor.f(10, (item, index, i0) => {
|
||||
return {
|
||||
a: index,
|
||||
b: "aea1ad54-9-" + i0
|
||||
};
|
||||
}),
|
||||
o: common_vendor.p({
|
||||
type: 3
|
||||
})
|
||||
}, {
|
||||
q: swiperCurrent.value,
|
||||
r: common_vendor.o(animationfinish)
|
||||
});
|
||||
};
|
||||
}
|
||||
};
|
||||
const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__file", "D:/里海数字乡村/purchase-let/pagesOrder/order/order.vue"]]);
|
||||
wx.createPage(MiniProgramPage);
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"navigationBarTitleText": "我的订单",
|
||||
"enablePullDownRefresh": false,
|
||||
"usingComponents": {
|
||||
"up-search": "../../uni_modules/uview-plus/components/u-search/u-search",
|
||||
"up-tabs": "../../uni_modules/uview-plus/components/u-tabs/u-tabs",
|
||||
"up-sticky": "../../uni_modules/uview-plus/components/u-sticky/u-sticky",
|
||||
"up-empty": "../../uni_modules/uview-plus/components/u-empty/u-empty",
|
||||
"good": "./component/good"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<view><up-sticky wx:if="{{d}}" u-s="{{['d']}}" u-i="aea1ad54-0" bind:__l="__l" u-p="{{d}}"><view style="padding:10rpx 20rpx 0 20rpx"><up-search wx:if="{{a}}" u-i="aea1ad54-1,aea1ad54-0" bind:__l="__l" u-p="{{a}}"></up-search></view><up-tabs wx:if="{{c}}" bindchange="{{b}}" u-i="aea1ad54-2,aea1ad54-0" bind:__l="__l" u-p="{{c}}"></up-tabs></up-sticky><swiper class="swiper-box" current="{{q}}" bindanimationfinish="{{r}}"><swiper-item class="swiper-item"><scroll-view scroll-y style="height:100%;width:100%"><view class="page-box"><view wx:if="{{true}}" class="list"><good wx:for="{{e}}" wx:for-item="item" wx:key="a" u-i="{{item.b}}" bind:__l="__l" u-p="{{f}}"></good></view><view wx:else style="padding-top:100rpx"><up-empty wx:if="{{g}}" u-i="aea1ad54-4" bind:__l="__l" u-p="{{g}}"></up-empty></view><view style="width:100%;height:200rpx"></view></view></scroll-view></swiper-item><swiper-item class="swiper-item"><scroll-view scroll-y style="height:100%;width:100%"><view class="page-box"><view wx:if="{{true}}" class="list"><good wx:for="{{h}}" wx:for-item="item" wx:key="a" u-i="{{item.b}}" bind:__l="__l" u-p="{{i}}"></good></view><view wx:else style="padding-top:100rpx"><up-empty wx:if="{{j}}" u-i="aea1ad54-6" bind:__l="__l" u-p="{{j}}"></up-empty></view><view style="width:100%;height:200rpx"></view></view></scroll-view></swiper-item><swiper-item class="swiper-item"><scroll-view scroll-y style="height:100%;width:100%"><view class="page-box"><view wx:if="{{true}}" class="list"><good wx:for="{{k}}" wx:for-item="item" wx:key="a" u-i="{{item.b}}" bind:__l="__l" u-p="{{l}}"></good></view><view wx:else style="padding-top:100rpx"><up-empty wx:if="{{m}}" u-i="aea1ad54-8" bind:__l="__l" u-p="{{m}}"></up-empty></view><view style="width:100%;height:200rpx"></view></view></scroll-view></swiper-item><swiper-item class="swiper-item"><scroll-view scroll-y style="height:100%;width:100%"><view class="page-box"><view wx:if="{{true}}" class="list"><good wx:for="{{n}}" wx:for-item="item" wx:key="a" u-i="{{item.b}}" bind:__l="__l" u-p="{{o}}"></good></view><view wx:else style="padding-top:100rpx"><up-empty wx:if="{{p}}" u-i="aea1ad54-10" bind:__l="__l" u-p="{{p}}"></up-empty></view><view style="width:100%;height:200rpx"></view></view></scroll-view></swiper-item></swiper></view>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.swiper-box {
|
||||
flex: 1;
|
||||
height: calc(100vh - var(--window-top) - 140rpx);
|
||||
width: 100%;
|
||||
}
|
||||
.swiper-box .swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
.page-box {
|
||||
margin: 20rpx;
|
||||
}
|
||||
|
|
@ -23,7 +23,24 @@
|
|||
"libVersion": "3.3.4",
|
||||
"appid": "touristappid",
|
||||
"projectname": "purchase-let",
|
||||
"condition": {},
|
||||
"condition": {
|
||||
"search": {
|
||||
"current": -1,
|
||||
"list": []
|
||||
},
|
||||
"conversation": {
|
||||
"current": -1,
|
||||
"list": []
|
||||
},
|
||||
"game": {
|
||||
"current": -1,
|
||||
"list": []
|
||||
},
|
||||
"miniprogram": {
|
||||
"current": -1,
|
||||
"list": []
|
||||
}
|
||||
},
|
||||
"editorSetting": {
|
||||
"tabIndent": "insertSpaces",
|
||||
"tabSize": 2
|
||||
|
|
|
|||
|
|
@ -3,5 +3,18 @@
|
|||
"projectname": "purchase-let",
|
||||
"setting": {
|
||||
"compileHotReLoad": true
|
||||
},
|
||||
"condition": {
|
||||
"miniprogram": {
|
||||
"list": [
|
||||
{
|
||||
"name": "",
|
||||
"pathName": "pagesOrder/detail/detail",
|
||||
"query": "",
|
||||
"launchMode": "default",
|
||||
"scene": null
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 618 B |
Binary file not shown.
|
After Width: | Height: | Size: 657 B |
Binary file not shown.
|
After Width: | Height: | Size: 679 B |
Binary file not shown.
|
After Width: | Height: | Size: 723 B |
Binary file not shown.
|
After Width: | Height: | Size: 718 B |
Binary file not shown.
|
After Width: | Height: | Size: 745 B |
155
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/props.js
vendored
Normal file
155
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/props.js
vendored
Normal file
|
|
@ -0,0 +1,155 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_libs_config_props = require("../../libs/config/props.js");
|
||||
const props = {
|
||||
props: {
|
||||
// 是否细边框
|
||||
hairline: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.hairline
|
||||
},
|
||||
// 按钮的预置样式，info，primary，error，warning，success
|
||||
type: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.type
|
||||
},
|
||||
// 按钮尺寸，large，normal，small，mini
|
||||
size: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.size
|
||||
},
|
||||
// 按钮形状，circle（两边为半圆），square（带圆角）
|
||||
shape: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.shape
|
||||
},
|
||||
// 按钮是否镂空
|
||||
plain: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.plain
|
||||
},
|
||||
// 是否禁止状态
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.disabled
|
||||
},
|
||||
// 是否加载中
|
||||
loading: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.loading
|
||||
},
|
||||
// 加载中提示文字
|
||||
loadingText: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.loadingText
|
||||
},
|
||||
// 加载状态图标类型
|
||||
loadingMode: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.loadingMode
|
||||
},
|
||||
// 加载图标大小
|
||||
loadingSize: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.loadingSize
|
||||
},
|
||||
// 开放能力，具体请看uniapp稳定关于button组件部分说明
|
||||
// https://uniapp.dcloud.io/component/button
|
||||
openType: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.openType
|
||||
},
|
||||
// 用于 <form> 组件，点击分别会触发 <form> 组件的 submit/reset 事件
|
||||
// 取值为submit（提交表单），reset（重置表单）
|
||||
formType: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.formType
|
||||
},
|
||||
// 打开 APP 时，向 APP 传递的参数，open-type=launchApp时有效
|
||||
// 只微信小程序、QQ小程序有效
|
||||
appParameter: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.appParameter
|
||||
},
|
||||
// 指定是否阻止本节点的祖先节点出现点击态，微信小程序有效
|
||||
hoverStopPropagation: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.hoverStopPropagation
|
||||
},
|
||||
// 指定返回用户信息的语言，zh_CN 简体中文，zh_TW 繁体中文，en 英文。只微信小程序有效
|
||||
lang: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.lang
|
||||
},
|
||||
// 会话来源，open-type="contact"时有效。只微信小程序有效
|
||||
sessionFrom: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.sessionFrom
|
||||
},
|
||||
// 会话内消息卡片标题，open-type="contact"时有效
|
||||
// 默认当前标题，只微信小程序有效
|
||||
sendMessageTitle: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.sendMessageTitle
|
||||
},
|
||||
// 会话内消息卡片点击跳转小程序路径，open-type="contact"时有效
|
||||
// 默认当前分享路径，只微信小程序有效
|
||||
sendMessagePath: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.sendMessagePath
|
||||
},
|
||||
// 会话内消息卡片图片，open-type="contact"时有效
|
||||
// 默认当前页面截图，只微信小程序有效
|
||||
sendMessageImg: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.sendMessageImg
|
||||
},
|
||||
// 是否显示会话内消息卡片，设置此参数为 true，用户进入客服会话会在右下角显示"可能要发送的小程序"提示，
|
||||
// 用户点击后可以快速发送小程序消息，open-type="contact"时有效
|
||||
showMessageCard: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.showMessageCard
|
||||
},
|
||||
// 额外传参参数，用于小程序的data-xxx属性，通过target.dataset.name获取
|
||||
dataName: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.dataName
|
||||
},
|
||||
// 节流，一定时间内只能触发一次
|
||||
throttleTime: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.throttleTime
|
||||
},
|
||||
// 按住后多久出现点击态，单位毫秒
|
||||
hoverStartTime: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.hoverStartTime
|
||||
},
|
||||
// 手指松开后点击态保留时间，单位毫秒
|
||||
hoverStayTime: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.hoverStayTime
|
||||
},
|
||||
// 按钮文字，之所以通过props传入，是因为slot传入的话
|
||||
// nvue中无法控制文字的样式
|
||||
text: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.text
|
||||
},
|
||||
// 按钮图标
|
||||
icon: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.icon
|
||||
},
|
||||
// 按钮图标
|
||||
iconColor: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.icon
|
||||
},
|
||||
// 按钮颜色，支持传入linear-gradient渐变色
|
||||
color: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.button.color
|
||||
}
|
||||
}
|
||||
};
|
||||
exports.props = props;
|
||||
300
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/u-button.js
vendored
Normal file
300
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/u-button.js
vendored
Normal file
|
|
@ -0,0 +1,300 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_libs_mixin_button = require("../../libs/mixin/button.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_openType = require("../../libs/mixin/openType.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mpMixin = require("../../libs/mixin/mpMixin.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mixin = require("../../libs/mixin/mixin.js");
|
||||
const uni_modules_uviewPlus_components_uButton_props = require("./props.js");
|
||||
const uni_modules_uviewPlus_libs_function_index = require("../../libs/function/index.js");
|
||||
const uni_modules_uviewPlus_libs_function_throttle = require("../../libs/function/throttle.js");
|
||||
const uni_modules_uviewPlus_libs_config_color = require("../../libs/config/color.js");
|
||||
const common_vendor = require("../../../../common/vendor.js");
|
||||
require("../../libs/function/test.js");
|
||||
require("../../libs/util/route.js");
|
||||
require("../../libs/config/props.js");
|
||||
require("../../libs/config/config.js");
|
||||
require("../../libs/config/props/actionSheet.js");
|
||||
require("../../libs/config/props/album.js");
|
||||
require("../../libs/config/props/alert.js");
|
||||
require("../../libs/config/props/avatar.js");
|
||||
require("../../libs/config/props/avatarGroup.js");
|
||||
require("../../libs/config/props/backtop.js");
|
||||
require("../../libs/config/props/badge.js");
|
||||
require("../../libs/config/props/button.js");
|
||||
require("../../libs/config/props/calendar.js");
|
||||
require("../../libs/config/props/carKeyboard.js");
|
||||
require("../../libs/config/props/cell.js");
|
||||
require("../../libs/config/props/cellGroup.js");
|
||||
require("../../libs/config/props/checkbox.js");
|
||||
require("../../libs/config/props/checkboxGroup.js");
|
||||
require("../../libs/config/props/circleProgress.js");
|
||||
require("../../libs/config/props/code.js");
|
||||
require("../../libs/config/props/codeInput.js");
|
||||
require("../../libs/config/props/col.js");
|
||||
require("../../libs/config/props/collapse.js");
|
||||
require("../../libs/config/props/collapseItem.js");
|
||||
require("../../libs/config/props/columnNotice.js");
|
||||
require("../../libs/config/props/countDown.js");
|
||||
require("../../libs/config/props/countTo.js");
|
||||
require("../../libs/config/props/datetimePicker.js");
|
||||
require("../../libs/config/props/divider.js");
|
||||
require("../../libs/config/props/empty.js");
|
||||
require("../../libs/config/props/form.js");
|
||||
require("../../libs/config/props/formItem.js");
|
||||
require("../../libs/config/props/gap.js");
|
||||
require("../../libs/config/props/grid.js");
|
||||
require("../../libs/config/props/gridItem.js");
|
||||
require("../../libs/config/props/icon.js");
|
||||
require("../../libs/config/props/image.js");
|
||||
require("../../libs/config/props/indexAnchor.js");
|
||||
require("../../libs/config/props/indexList.js");
|
||||
require("../../libs/config/props/input.js");
|
||||
require("../../libs/config/props/keyboard.js");
|
||||
require("../../libs/config/props/line.js");
|
||||
require("../../libs/config/props/lineProgress.js");
|
||||
require("../../libs/config/props/link.js");
|
||||
require("../../libs/config/props/list.js");
|
||||
require("../../libs/config/props/listItem.js");
|
||||
require("../../libs/config/props/loadingIcon.js");
|
||||
require("../../libs/config/props/loadingPage.js");
|
||||
require("../../libs/config/props/loadmore.js");
|
||||
require("../../libs/config/props/modal.js");
|
||||
require("../../libs/config/props/navbar.js");
|
||||
require("../../libs/config/props/noNetwork.js");
|
||||
require("../../libs/config/props/noticeBar.js");
|
||||
require("../../libs/config/props/notify.js");
|
||||
require("../../libs/config/props/numberBox.js");
|
||||
require("../../libs/config/props/numberKeyboard.js");
|
||||
require("../../libs/config/props/overlay.js");
|
||||
require("../../libs/config/props/parse.js");
|
||||
require("../../libs/config/props/picker.js");
|
||||
require("../../libs/config/props/popup.js");
|
||||
require("../../libs/config/props/radio.js");
|
||||
require("../../libs/config/props/radioGroup.js");
|
||||
require("../../libs/config/props/rate.js");
|
||||
require("../../libs/config/props/readMore.js");
|
||||
require("../../libs/config/props/row.js");
|
||||
require("../../libs/config/props/rowNotice.js");
|
||||
require("../../libs/config/props/scrollList.js");
|
||||
require("../../libs/config/props/search.js");
|
||||
require("../../libs/config/props/section.js");
|
||||
require("../../libs/config/props/skeleton.js");
|
||||
require("../../libs/config/props/slider.js");
|
||||
require("../../libs/config/props/statusBar.js");
|
||||
require("../../libs/config/props/steps.js");
|
||||
require("../../libs/config/props/stepsItem.js");
|
||||
require("../../libs/config/props/sticky.js");
|
||||
require("../../libs/config/props/subsection.js");
|
||||
require("../../libs/config/props/swipeAction.js");
|
||||
require("../../libs/config/props/swipeActionItem.js");
|
||||
require("../../libs/config/props/swiper.js");
|
||||
require("../../libs/config/props/swipterIndicator.js");
|
||||
require("../../libs/config/props/switch.js");
|
||||
require("../../libs/config/props/tabbar.js");
|
||||
require("../../libs/config/props/tabbarItem.js");
|
||||
require("../../libs/config/props/tabs.js");
|
||||
require("../../libs/config/props/tag.js");
|
||||
require("../../libs/config/props/text.js");
|
||||
require("../../libs/config/props/textarea.js");
|
||||
require("../../libs/config/props/toast.js");
|
||||
require("../../libs/config/props/toolbar.js");
|
||||
require("../../libs/config/props/tooltip.js");
|
||||
require("../../libs/config/props/transition.js");
|
||||
require("../../libs/config/props/upload.js");
|
||||
require("../../libs/function/digit.js");
|
||||
const _sfc_main = {
|
||||
name: "u-button",
|
||||
mixins: [uni_modules_uviewPlus_libs_mixin_mpMixin.mpMixin, uni_modules_uviewPlus_libs_mixin_mixin.mixin, uni_modules_uviewPlus_libs_mixin_button.button, uni_modules_uviewPlus_libs_mixin_openType.openType, uni_modules_uviewPlus_components_uButton_props.props],
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
computed: {
|
||||
// 生成bem风格的类名
|
||||
bemClass() {
|
||||
if (!this.color) {
|
||||
return this.bem(
|
||||
"button",
|
||||
["type", "shape", "size"],
|
||||
["disabled", "plain", "hairline"]
|
||||
);
|
||||
} else {
|
||||
return this.bem(
|
||||
"button",
|
||||
["shape", "size"],
|
||||
["disabled", "plain", "hairline"]
|
||||
);
|
||||
}
|
||||
},
|
||||
loadingColor() {
|
||||
if (this.plain) {
|
||||
return this.color ? this.color : uni_modules_uviewPlus_libs_config_color.color[`u-${this.type}`];
|
||||
}
|
||||
if (this.type === "info") {
|
||||
return "#c9c9c9";
|
||||
}
|
||||
return "rgb(200, 200, 200)";
|
||||
},
|
||||
iconColorCom() {
|
||||
if (this.iconColor)
|
||||
return this.iconColor;
|
||||
if (this.plain) {
|
||||
return this.color ? this.color : this.type;
|
||||
} else {
|
||||
return this.type === "info" ? "#000000" : "#ffffff";
|
||||
}
|
||||
},
|
||||
baseColor() {
|
||||
let style = {};
|
||||
if (this.color) {
|
||||
style.color = this.plain ? this.color : "white";
|
||||
if (!this.plain) {
|
||||
style["background-color"] = this.color;
|
||||
}
|
||||
if (this.color.indexOf("gradient") !== -1) {
|
||||
style.borderTopWidth = 0;
|
||||
style.borderRightWidth = 0;
|
||||
style.borderBottomWidth = 0;
|
||||
style.borderLeftWidth = 0;
|
||||
if (!this.plain) {
|
||||
style.backgroundImage = this.color;
|
||||
}
|
||||
} else {
|
||||
style.borderColor = this.color;
|
||||
style.borderWidth = "1px";
|
||||
style.borderStyle = "solid";
|
||||
}
|
||||
}
|
||||
return style;
|
||||
},
|
||||
// nvue版本按钮的字体不会继承父组件的颜色，需要对每一个text组件进行单独的设置
|
||||
nvueTextStyle() {
|
||||
let style = {};
|
||||
if (this.type === "info") {
|
||||
style.color = "#323233";
|
||||
}
|
||||
if (this.color) {
|
||||
style.color = this.plain ? this.color : "white";
|
||||
}
|
||||
style.fontSize = this.textSize + "px";
|
||||
return style;
|
||||
},
|
||||
// 字体大小
|
||||
textSize() {
|
||||
let fontSize = 14, { size } = this;
|
||||
if (size === "large")
|
||||
fontSize = 16;
|
||||
if (size === "normal")
|
||||
fontSize = 14;
|
||||
if (size === "small")
|
||||
fontSize = 12;
|
||||
if (size === "mini")
|
||||
fontSize = 10;
|
||||
return fontSize;
|
||||
}
|
||||
},
|
||||
emits: [
|
||||
"click",
|
||||
"getphonenumber",
|
||||
"getuserinfo",
|
||||
"error",
|
||||
"opensetting",
|
||||
"launchapp",
|
||||
"agreeprivacyauthorization"
|
||||
],
|
||||
methods: {
|
||||
addStyle: uni_modules_uviewPlus_libs_function_index.addStyle,
|
||||
clickHandler() {
|
||||
if (!this.disabled && !this.loading) {
|
||||
uni_modules_uviewPlus_libs_function_throttle.throttle(() => {
|
||||
this.$emit("click");
|
||||
}, this.throttleTime);
|
||||
}
|
||||
},
|
||||
// 下面为对接uniapp官方按钮开放能力事件回调的对接
|
||||
getphonenumber(res) {
|
||||
this.$emit("getphonenumber", res);
|
||||
},
|
||||
getuserinfo(res) {
|
||||
this.$emit("getuserinfo", res);
|
||||
},
|
||||
error(res) {
|
||||
this.$emit("error", res);
|
||||
},
|
||||
opensetting(res) {
|
||||
this.$emit("opensetting", res);
|
||||
},
|
||||
launchapp(res) {
|
||||
this.$emit("launchapp", res);
|
||||
},
|
||||
agreeprivacyauthorization(res) {
|
||||
this.$emit("agreeprivacyauthorization", res);
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!Array) {
|
||||
const _easycom_u_loading_icon2 = common_vendor.resolveComponent("u-loading-icon");
|
||||
const _easycom_u_icon2 = common_vendor.resolveComponent("u-icon");
|
||||
(_easycom_u_loading_icon2 + _easycom_u_icon2)();
|
||||
}
|
||||
const _easycom_u_loading_icon = () => "../u-loading-icon/u-loading-icon.js";
|
||||
const _easycom_u_icon = () => "../u-icon/u-icon.js";
|
||||
if (!Math) {
|
||||
(_easycom_u_loading_icon + _easycom_u_icon)();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: _ctx.loading
|
||||
}, _ctx.loading ? {
|
||||
b: common_vendor.p({
|
||||
mode: _ctx.loadingMode,
|
||||
size: _ctx.loadingSize * 1.15,
|
||||
color: $options.loadingColor
|
||||
}),
|
||||
c: common_vendor.t(_ctx.loadingText || _ctx.text),
|
||||
d: common_vendor.s({
|
||||
fontSize: $options.textSize + "px"
|
||||
})
|
||||
} : common_vendor.e({
|
||||
e: _ctx.icon
|
||||
}, _ctx.icon ? {
|
||||
f: common_vendor.p({
|
||||
name: _ctx.icon,
|
||||
color: $options.iconColorCom,
|
||||
size: $options.textSize * 1.35,
|
||||
customStyle: {
|
||||
marginRight: "2px"
|
||||
}
|
||||
})
|
||||
} : {}, {
|
||||
g: common_vendor.t(_ctx.text),
|
||||
h: common_vendor.s({
|
||||
fontSize: $options.textSize + "px"
|
||||
})
|
||||
}), {
|
||||
i: Number(_ctx.hoverStartTime),
|
||||
j: Number(_ctx.hoverStayTime),
|
||||
k: _ctx.formType,
|
||||
l: _ctx.openType,
|
||||
m: _ctx.appParameter,
|
||||
n: _ctx.hoverStopPropagation,
|
||||
o: _ctx.sendMessageTitle,
|
||||
p: _ctx.sendMessagePath,
|
||||
q: _ctx.lang,
|
||||
r: _ctx.dataName,
|
||||
s: _ctx.sessionFrom,
|
||||
t: _ctx.sendMessageImg,
|
||||
v: _ctx.showMessageCard,
|
||||
w: common_vendor.o((...args) => $options.getphonenumber && $options.getphonenumber(...args)),
|
||||
x: common_vendor.o((...args) => $options.getuserinfo && $options.getuserinfo(...args)),
|
||||
y: common_vendor.o((...args) => $options.error && $options.error(...args)),
|
||||
z: common_vendor.o((...args) => $options.opensetting && $options.opensetting(...args)),
|
||||
A: common_vendor.o((...args) => $options.launchapp && $options.launchapp(...args)),
|
||||
B: common_vendor.o((...args) => $options.agreeprivacyauthorization && $options.agreeprivacyauthorization(...args)),
|
||||
C: !_ctx.disabled && !_ctx.loading ? "u-button--active" : "",
|
||||
D: common_vendor.s($options.baseColor),
|
||||
E: common_vendor.s($options.addStyle(_ctx.customStyle)),
|
||||
F: common_vendor.o((...args) => $options.clickHandler && $options.clickHandler(...args)),
|
||||
G: common_vendor.n($options.bemClass)
|
||||
});
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-5ce41ee6"], ["__file", "D:/里海数字乡村/purchase-let/uni_modules/uview-plus/components/u-button/u-button.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
7
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/u-button.json
vendored
Normal file
7
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/u-button.json
vendored
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"u-loading-icon": "../u-loading-icon/u-loading-icon",
|
||||
"u-icon": "../u-icon/u-icon"
|
||||
}
|
||||
}
|
||||
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/u-button.wxml
vendored
Normal file
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/u-button.wxml
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
<button hover-start-time="{{i}}" hover-stay-time="{{j}}" form-type="{{k}}" open-type="{{l}}" app-parameter="{{m}}" hover-stop-propagation="{{n}}" send-message-title="{{o}}" send-message-path="{{p}}" lang="{{q}}" data-name="{{r}}" session-from="{{s}}" send-message-img="{{t}}" show-message-card="{{v}}" bindgetphonenumber="{{w}}" bindgetuserinfo="{{x}}" binderror="{{y}}" bindopensetting="{{z}}" bindlaunchapp="{{A}}" bindagreeprivacyauthorization="{{B}}" hover-class="{{C}}" style="{{D + ';' + E}}" bindtap="{{F}}" class="{{['u-button', 'u-reset-button', 'data-v-5ce41ee6', G]}}"><block wx:if="{{a}}"><u-loading-icon wx:if="{{b}}" class="data-v-5ce41ee6" u-i="5ce41ee6-0" bind:__l="__l" u-p="{{b}}"></u-loading-icon><text class="u-button__loading-text data-v-5ce41ee6" style="{{d}}">{{c}}</text></block><block wx:else><u-icon wx:if="{{e}}" class="data-v-5ce41ee6" u-i="5ce41ee6-1" bind:__l="__l" u-p="{{f}}"></u-icon><block wx:if="{{$slots.d}}"><slot></slot></block><block wx:else><text class="u-button__text data-v-5ce41ee6" style="{{h}}">{{g}}</text></block></block></button>
|
||||
188
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/u-button.wxss
vendored
Normal file
188
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-button/u-button.wxss
vendored
Normal file
|
|
@ -0,0 +1,188 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.u-empty.data-v-5ce41ee6,
|
||||
.u-empty__wrap.data-v-5ce41ee6,
|
||||
.u-tabs.data-v-5ce41ee6,
|
||||
.u-tabs__wrapper.data-v-5ce41ee6,
|
||||
.u-tabs__wrapper__scroll-view-wrapper.data-v-5ce41ee6,
|
||||
.u-tabs__wrapper__scroll-view.data-v-5ce41ee6,
|
||||
.u-tabs__wrapper__nav.data-v-5ce41ee6,
|
||||
.u-tabs__wrapper__nav__line.data-v-5ce41ee6 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
flex-basis: auto;
|
||||
align-items: stretch;
|
||||
align-content: flex-start;
|
||||
}
|
||||
.u-button.data-v-5ce41ee6 {
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.u-button__text.data-v-5ce41ee6 {
|
||||
white-space: nowrap;
|
||||
line-height: 1;
|
||||
}
|
||||
.u-button.data-v-5ce41ee6:before {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: inherit;
|
||||
border-radius: inherit;
|
||||
transform: translate(-50%, -50%);
|
||||
opacity: 0;
|
||||
content: " ";
|
||||
background-color: #000;
|
||||
border-color: #000;
|
||||
}
|
||||
.u-button--active.data-v-5ce41ee6:before {
|
||||
opacity: 0.15;
|
||||
}
|
||||
.u-button__icon + .u-button__text.data-v-5ce41ee6:not(:empty), .u-button__loading-text.data-v-5ce41ee6 {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.u-button--plain.u-button--primary.data-v-5ce41ee6 {
|
||||
color: #3c9cff;
|
||||
}
|
||||
.u-button--plain.u-button--info.data-v-5ce41ee6 {
|
||||
color: #909399;
|
||||
}
|
||||
.u-button--plain.u-button--success.data-v-5ce41ee6 {
|
||||
color: #5ac725;
|
||||
}
|
||||
.u-button--plain.u-button--error.data-v-5ce41ee6 {
|
||||
color: #f56c6c;
|
||||
}
|
||||
.u-button--plain.u-button--warning.data-v-5ce41ee6 {
|
||||
color: #f56c6c;
|
||||
}
|
||||
.u-button.data-v-5ce41ee6 {
|
||||
height: 40px;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
box-sizing: border-box;
|
||||
flex-direction: row;
|
||||
}
|
||||
.u-button__text.data-v-5ce41ee6 {
|
||||
font-size: 15px;
|
||||
}
|
||||
.u-button__loading-text.data-v-5ce41ee6 {
|
||||
font-size: 15px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
.u-button--large.data-v-5ce41ee6 {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
padding: 0 15px;
|
||||
}
|
||||
.u-button--normal.data-v-5ce41ee6 {
|
||||
padding: 0 12px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.u-button--small.data-v-5ce41ee6 {
|
||||
min-width: 60px;
|
||||
height: 30px;
|
||||
padding: 0px 8px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.u-button--mini.data-v-5ce41ee6 {
|
||||
height: 22px;
|
||||
font-size: 10px;
|
||||
min-width: 50px;
|
||||
padding: 0px 8px;
|
||||
}
|
||||
.u-button--disabled.data-v-5ce41ee6 {
|
||||
opacity: 0.5;
|
||||
}
|
||||
.u-button--info.data-v-5ce41ee6 {
|
||||
color: #323233;
|
||||
background-color: #fff;
|
||||
border-color: #ebedf0;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
.u-button--success.data-v-5ce41ee6 {
|
||||
color: #fff;
|
||||
background-color: #5ac725;
|
||||
border-color: #5ac725;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
.u-button--primary.data-v-5ce41ee6 {
|
||||
color: #fff;
|
||||
background-color: #3c9cff;
|
||||
border-color: #3c9cff;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
.u-button--error.data-v-5ce41ee6 {
|
||||
color: #fff;
|
||||
background-color: #f56c6c;
|
||||
border-color: #f56c6c;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
.u-button--warning.data-v-5ce41ee6 {
|
||||
color: #fff;
|
||||
background-color: #f9ae3d;
|
||||
border-color: #f9ae3d;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
.u-button--block.data-v-5ce41ee6 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
}
|
||||
.u-button--circle.data-v-5ce41ee6 {
|
||||
border-top-right-radius: 100px;
|
||||
border-top-left-radius: 100px;
|
||||
border-bottom-left-radius: 100px;
|
||||
border-bottom-right-radius: 100px;
|
||||
}
|
||||
.u-button--square.data-v-5ce41ee6 {
|
||||
border-bottom-left-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
border-top-left-radius: 3px;
|
||||
border-top-right-radius: 3px;
|
||||
}
|
||||
.u-button__icon.data-v-5ce41ee6 {
|
||||
min-width: 1em;
|
||||
line-height: inherit !important;
|
||||
vertical-align: top;
|
||||
}
|
||||
.u-button--plain.data-v-5ce41ee6 {
|
||||
background-color: #fff;
|
||||
}
|
||||
.u-button--hairline.data-v-5ce41ee6 {
|
||||
border-width: 0.5px !important;
|
||||
}
|
||||
62
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-empty/props.js
vendored
Normal file
62
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-empty/props.js
vendored
Normal file
|
|
@ -0,0 +1,62 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_libs_config_props = require("../../libs/config/props.js");
|
||||
const props = {
|
||||
props: {
|
||||
// 内置图标名称，或图片路径，建议绝对路径
|
||||
icon: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.icon
|
||||
},
|
||||
// 提示文字
|
||||
text: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.text
|
||||
},
|
||||
// 文字颜色
|
||||
textColor: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.textColor
|
||||
},
|
||||
// 文字大小
|
||||
textSize: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.textSize
|
||||
},
|
||||
// 图标的颜色
|
||||
iconColor: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.iconColor
|
||||
},
|
||||
// 图标的大小
|
||||
iconSize: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.iconSize
|
||||
},
|
||||
// 选择预置的图标类型
|
||||
mode: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.mode
|
||||
},
|
||||
// 图标宽度，单位px
|
||||
width: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.width
|
||||
},
|
||||
// 图标高度，单位px
|
||||
height: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.height
|
||||
},
|
||||
// 是否显示组件
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.show
|
||||
},
|
||||
// 组件距离上一个元素之间的距离，默认px单位
|
||||
marginTop: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.empty.marginTop
|
||||
}
|
||||
}
|
||||
};
|
||||
exports.props = props;
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_components_uLoadmore_props = require("./props.js");
|
||||
const uni_modules_uviewPlus_components_uEmpty_props = require("./props.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mpMixin = require("../../libs/mixin/mpMixin.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mixin = require("../../libs/mixin/mixin.js");
|
||||
const uni_modules_uviewPlus_libs_function_index = require("../../libs/function/index.js");
|
||||
|
|
@ -99,99 +99,83 @@ require("../../libs/function/test.js");
|
|||
require("../../libs/util/route.js");
|
||||
require("../../libs/function/digit.js");
|
||||
const _sfc_main = {
|
||||
name: "u-loadmore",
|
||||
mixins: [uni_modules_uviewPlus_libs_mixin_mpMixin.mpMixin, uni_modules_uviewPlus_libs_mixin_mixin.mixin, uni_modules_uviewPlus_components_uLoadmore_props.props],
|
||||
name: "u-empty",
|
||||
mixins: [uni_modules_uviewPlus_libs_mixin_mpMixin.mpMixin, uni_modules_uviewPlus_libs_mixin_mixin.mixin, uni_modules_uviewPlus_components_uEmpty_props.props],
|
||||
data() {
|
||||
return {
|
||||
// 粗点
|
||||
dotText: "●"
|
||||
icons: {
|
||||
car: "购物车为空",
|
||||
page: "页面不存在",
|
||||
search: "没有搜索结果",
|
||||
address: "没有收货地址",
|
||||
wifi: "没有WiFi",
|
||||
order: "订单为空",
|
||||
coupon: "没有优惠券",
|
||||
favor: "暂无收藏",
|
||||
permission: "无权限",
|
||||
history: "无历史记录",
|
||||
news: "无新闻列表",
|
||||
message: "消息列表为空",
|
||||
list: "列表为空",
|
||||
data: "数据为空",
|
||||
comment: "暂无评论"
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
// 加载的文字显示的样式
|
||||
loadTextStyle() {
|
||||
return {
|
||||
color: this.color,
|
||||
fontSize: uni_modules_uviewPlus_libs_function_index.addUnit(this.fontSize),
|
||||
lineHeight: uni_modules_uviewPlus_libs_function_index.addUnit(this.fontSize),
|
||||
backgroundColor: this.bgColor
|
||||
};
|
||||
// 组件样式
|
||||
emptyStyle() {
|
||||
const style = {};
|
||||
style.marginTop = uni_modules_uviewPlus_libs_function_index.addUnit(this.marginTop);
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(uni_modules_uviewPlus_libs_function_index.addStyle(this.customStyle), style);
|
||||
},
|
||||
// 显示的提示文字
|
||||
showText() {
|
||||
let text = "";
|
||||
if (this.status == "loadmore")
|
||||
text = this.loadmoreText;
|
||||
else if (this.status == "loading")
|
||||
text = this.loadingText;
|
||||
else if (this.status == "nomore" && this.isDot)
|
||||
text = this.dotText;
|
||||
else
|
||||
text = this.nomoreText;
|
||||
return text;
|
||||
// 文本样式
|
||||
textStyle() {
|
||||
const style = {};
|
||||
style.color = this.textColor;
|
||||
style.fontSize = uni_modules_uviewPlus_libs_function_index.addUnit(this.textSize);
|
||||
return style;
|
||||
},
|
||||
// 判断icon是否图片路径
|
||||
isSrc() {
|
||||
return this.icon.indexOf("/") >= 0;
|
||||
}
|
||||
},
|
||||
emits: ["loadmore"],
|
||||
methods: {
|
||||
addStyle: uni_modules_uviewPlus_libs_function_index.addStyle,
|
||||
addUnit: uni_modules_uviewPlus_libs_function_index.addUnit,
|
||||
loadMore() {
|
||||
if (this.status == "loadmore")
|
||||
this.$emit("loadmore");
|
||||
}
|
||||
addUnit: uni_modules_uviewPlus_libs_function_index.addUnit
|
||||
}
|
||||
};
|
||||
if (!Array) {
|
||||
const _easycom_u_line2 = common_vendor.resolveComponent("u-line");
|
||||
const _easycom_u_loading_icon2 = common_vendor.resolveComponent("u-loading-icon");
|
||||
(_easycom_u_line2 + _easycom_u_loading_icon2)();
|
||||
const _easycom_u_icon2 = common_vendor.resolveComponent("u-icon");
|
||||
_easycom_u_icon2();
|
||||
}
|
||||
const _easycom_u_line = () => "../u-line/u-line.js";
|
||||
const _easycom_u_loading_icon = () => "../u-loading-icon/u-loading-icon.js";
|
||||
const _easycom_u_icon = () => "../u-icon/u-icon.js";
|
||||
if (!Math) {
|
||||
(_easycom_u_line + _easycom_u_loading_icon)();
|
||||
_easycom_u_icon();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: _ctx.line
|
||||
}, _ctx.line ? {
|
||||
b: common_vendor.p({
|
||||
length: "140rpx",
|
||||
color: _ctx.lineColor,
|
||||
hairline: false,
|
||||
dashed: _ctx.dashed
|
||||
})
|
||||
} : {}, {
|
||||
c: _ctx.status === "loading" && _ctx.icon
|
||||
}, _ctx.status === "loading" && _ctx.icon ? {
|
||||
d: common_vendor.p({
|
||||
color: _ctx.iconColor,
|
||||
a: _ctx.show
|
||||
}, _ctx.show ? common_vendor.e({
|
||||
b: !$options.isSrc
|
||||
}, !$options.isSrc ? {
|
||||
c: common_vendor.p({
|
||||
name: _ctx.mode === "message" ? "chat" : `empty-${_ctx.mode}`,
|
||||
size: _ctx.iconSize,
|
||||
mode: _ctx.loadingIcon
|
||||
color: _ctx.iconColor,
|
||||
["margin-top"]: "14"
|
||||
})
|
||||
} : {}, {
|
||||
e: common_vendor.t($options.showText),
|
||||
f: common_vendor.s($options.loadTextStyle),
|
||||
g: common_vendor.n(_ctx.status == "nomore" && _ctx.isDot == true ? "u-loadmore__content__dot-text" : "u-loadmore__content__text"),
|
||||
h: common_vendor.o((...args) => $options.loadMore && $options.loadMore(...args)),
|
||||
i: common_vendor.n(_ctx.status == "loadmore" || _ctx.status == "nomore" ? "u-more" : ""),
|
||||
j: _ctx.line
|
||||
}, _ctx.line ? {
|
||||
k: common_vendor.p({
|
||||
length: "140rpx",
|
||||
color: _ctx.lineColor,
|
||||
hairline: false,
|
||||
dashed: _ctx.dashed
|
||||
})
|
||||
} : {}, {
|
||||
l: common_vendor.s($options.addStyle(_ctx.customStyle)),
|
||||
m: common_vendor.s({
|
||||
backgroundColor: _ctx.bgColor,
|
||||
marginBottom: $options.addUnit(_ctx.marginBottom),
|
||||
marginTop: $options.addUnit(_ctx.marginTop),
|
||||
height: $options.addUnit(_ctx.height)
|
||||
})
|
||||
});
|
||||
} : {
|
||||
d: $options.addUnit(_ctx.width),
|
||||
e: $options.addUnit(_ctx.height),
|
||||
f: _ctx.icon
|
||||
}, {
|
||||
g: common_vendor.t(_ctx.text ? _ctx.text : $data.icons[_ctx.mode]),
|
||||
h: common_vendor.s($options.textStyle),
|
||||
i: _ctx.$slots.default || _ctx.$slots.$default
|
||||
}, _ctx.$slots.default || _ctx.$slots.$default ? {} : {}, {
|
||||
j: common_vendor.s($options.emptyStyle)
|
||||
}) : {});
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-4ccc1478"], ["__file", "D:/里海数字乡村/purchase-let/uni_modules/uview-plus/components/u-loadmore/u-loadmore.vue"]]);
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-8dd5928e"], ["__file", "D:/里海数字乡村/purchase-let/uni_modules/uview-plus/components/u-empty/u-empty.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
6
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-empty/u-empty.json
vendored
Normal file
6
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-empty/u-empty.json
vendored
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"u-icon": "../u-icon/u-icon"
|
||||
}
|
||||
}
|
||||
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-empty/u-empty.wxml
vendored
Normal file
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-empty/u-empty.wxml
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
<view wx:if="{{a}}" class="u-empty data-v-8dd5928e" style="{{j}}"><u-icon wx:if="{{b}}" class="data-v-8dd5928e" u-i="8dd5928e-0" bind:__l="__l" u-p="{{c}}"></u-icon><image wx:else class="data-v-8dd5928e" style="{{'width:' + d + ';' + ('height:' + e)}}" src="{{f}}" mode="widthFix"></image><text class="u-empty__text data-v-8dd5928e" style="{{h}}">{{g}}</text><view wx:if="{{i}}" class="u-empty__wrap data-v-8dd5928e"><slot/></view></view>
|
||||
|
|
@ -23,14 +23,14 @@
|
|||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.u-empty.data-v-4ccc1478,
|
||||
.u-empty__wrap.data-v-4ccc1478,
|
||||
.u-tabs.data-v-4ccc1478,
|
||||
.u-tabs__wrapper.data-v-4ccc1478,
|
||||
.u-tabs__wrapper__scroll-view-wrapper.data-v-4ccc1478,
|
||||
.u-tabs__wrapper__scroll-view.data-v-4ccc1478,
|
||||
.u-tabs__wrapper__nav.data-v-4ccc1478,
|
||||
.u-tabs__wrapper__nav__line.data-v-4ccc1478 {
|
||||
.u-empty.data-v-8dd5928e,
|
||||
.u-empty__wrap.data-v-8dd5928e,
|
||||
.u-tabs.data-v-8dd5928e,
|
||||
.u-tabs__wrapper.data-v-8dd5928e,
|
||||
.u-tabs__wrapper__scroll-view-wrapper.data-v-8dd5928e,
|
||||
.u-tabs__wrapper__scroll-view.data-v-8dd5928e,
|
||||
.u-tabs__wrapper__nav.data-v-8dd5928e,
|
||||
.u-tabs__wrapper__nav__line.data-v-8dd5928e {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
|
|
@ -39,28 +39,24 @@
|
|||
align-items: stretch;
|
||||
align-content: flex-start;
|
||||
}
|
||||
.u-loadmore.data-v-4ccc1478 {
|
||||
.u-empty.data-v-8dd5928e {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
}
|
||||
.u-loadmore__content.data-v-4ccc1478 {
|
||||
margin: 0 15px;
|
||||
.u-empty__text.data-v-8dd5928e {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.u-loadmore__content__icon-wrap.data-v-4ccc1478 {
|
||||
margin-right: 8px;
|
||||
}
|
||||
.u-loadmore__content__text.data-v-4ccc1478 {
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
}
|
||||
.u-loadmore__content__dot-text.data-v-4ccc1478 {
|
||||
font-size: 15px;
|
||||
color: #909193;
|
||||
.u-slot-wrap.data-v-8dd5928e {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
|
@ -1,97 +0,0 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_libs_config_props = require("../../libs/config/props.js");
|
||||
const props = {
|
||||
props: {
|
||||
// 组件状态，loadmore-加载前的状态，loading-加载中的状态，nomore-没有更多的状态
|
||||
status: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.status
|
||||
},
|
||||
// 组件背景色
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.bgColor
|
||||
},
|
||||
// 是否显示加载中的图标
|
||||
icon: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.icon
|
||||
},
|
||||
// 字体大小
|
||||
fontSize: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.fontSize
|
||||
},
|
||||
// 图标大小
|
||||
iconSize: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.iconSize
|
||||
},
|
||||
// 字体颜色
|
||||
color: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.color
|
||||
},
|
||||
// 加载中状态的图标，spinner-花朵状图标，circle-圆圈状，semicircle-半圆
|
||||
loadingIcon: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.loadingIcon
|
||||
},
|
||||
// 加载前的提示语
|
||||
loadmoreText: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.loadmoreText
|
||||
},
|
||||
// 加载中提示语
|
||||
loadingText: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.loadingText
|
||||
},
|
||||
// 没有更多的提示语
|
||||
nomoreText: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.nomoreText
|
||||
},
|
||||
// 在“没有更多”状态下，是否显示粗点
|
||||
isDot: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.isDot
|
||||
},
|
||||
// 加载中图标的颜色
|
||||
iconColor: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.iconColor
|
||||
},
|
||||
// 上边距
|
||||
marginTop: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.marginTop
|
||||
},
|
||||
// 下边距
|
||||
marginBottom: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.marginBottom
|
||||
},
|
||||
// 高度，单位px
|
||||
height: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.height
|
||||
},
|
||||
// 是否显示左边分割线
|
||||
line: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.line
|
||||
},
|
||||
// 线条颜色
|
||||
lineColor: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.lineColor
|
||||
},
|
||||
// 是否虚线，true-虚线，false-实线
|
||||
dashed: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.loadmore.dashed
|
||||
}
|
||||
}
|
||||
};
|
||||
exports.props = props;
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"u-line": "../u-line/u-line",
|
||||
"u-loading-icon": "../u-loading-icon/u-loading-icon"
|
||||
}
|
||||
}
|
||||
|
|
@ -1 +0,0 @@
|
|||
<view class="u-loadmore data-v-4ccc1478" style="{{l + ';' + m}}"><u-line wx:if="{{a}}" class="data-v-4ccc1478" u-i="4ccc1478-0" bind:__l="__l" u-p="{{b}}"></u-line><view class="{{[i, 'u-loadmore__content', 'data-v-4ccc1478']}}"><view wx:if="{{c}}" class="u-loadmore__content__icon-wrap data-v-4ccc1478"><u-loading-icon wx:if="{{d}}" class="data-v-4ccc1478" u-i="4ccc1478-1" bind:__l="__l" u-p="{{d}}"></u-loading-icon></view><text style="{{f}}" class="{{['u-line-1', 'data-v-4ccc1478', g]}}" bindtap="{{h}}">{{e}}</text></view><u-line wx:if="{{j}}" class="data-v-4ccc1478" u-i="4ccc1478-2" bind:__l="__l" u-p="{{k}}"></u-line></view>
|
||||
27
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/props.js
vendored
Normal file
27
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/props.js
vendored
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_libs_config_props = require("../../libs/config/props.js");
|
||||
const props = {
|
||||
props: {
|
||||
// 是否显示遮罩
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.overlay.show
|
||||
},
|
||||
// 层级z-index
|
||||
zIndex: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.overlay.zIndex
|
||||
},
|
||||
// 遮罩的过渡时间，单位为ms
|
||||
duration: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.overlay.duration
|
||||
},
|
||||
// 不透明度值，当做rgba的第四个参数
|
||||
opacity: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.overlay.opacity
|
||||
}
|
||||
}
|
||||
};
|
||||
exports.props = props;
|
||||
145
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/u-overlay.js
vendored
Normal file
145
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/u-overlay.js
vendored
Normal file
|
|
@ -0,0 +1,145 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_components_uOverlay_props = require("./props.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mpMixin = require("../../libs/mixin/mpMixin.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mixin = require("../../libs/mixin/mixin.js");
|
||||
const uni_modules_uviewPlus_libs_function_index = require("../../libs/function/index.js");
|
||||
const common_vendor = require("../../../../common/vendor.js");
|
||||
require("../../libs/config/props.js");
|
||||
require("../../libs/config/config.js");
|
||||
require("../../libs/config/props/actionSheet.js");
|
||||
require("../../libs/config/props/album.js");
|
||||
require("../../libs/config/props/alert.js");
|
||||
require("../../libs/config/props/avatar.js");
|
||||
require("../../libs/config/props/avatarGroup.js");
|
||||
require("../../libs/config/props/backtop.js");
|
||||
require("../../libs/config/props/badge.js");
|
||||
require("../../libs/config/props/button.js");
|
||||
require("../../libs/config/props/calendar.js");
|
||||
require("../../libs/config/props/carKeyboard.js");
|
||||
require("../../libs/config/props/cell.js");
|
||||
require("../../libs/config/props/cellGroup.js");
|
||||
require("../../libs/config/props/checkbox.js");
|
||||
require("../../libs/config/props/checkboxGroup.js");
|
||||
require("../../libs/config/props/circleProgress.js");
|
||||
require("../../libs/config/props/code.js");
|
||||
require("../../libs/config/props/codeInput.js");
|
||||
require("../../libs/config/props/col.js");
|
||||
require("../../libs/config/props/collapse.js");
|
||||
require("../../libs/config/props/collapseItem.js");
|
||||
require("../../libs/config/props/columnNotice.js");
|
||||
require("../../libs/config/props/countDown.js");
|
||||
require("../../libs/config/props/countTo.js");
|
||||
require("../../libs/config/props/datetimePicker.js");
|
||||
require("../../libs/config/props/divider.js");
|
||||
require("../../libs/config/props/empty.js");
|
||||
require("../../libs/config/props/form.js");
|
||||
require("../../libs/config/props/formItem.js");
|
||||
require("../../libs/config/props/gap.js");
|
||||
require("../../libs/config/props/grid.js");
|
||||
require("../../libs/config/props/gridItem.js");
|
||||
require("../../libs/config/props/icon.js");
|
||||
require("../../libs/config/props/image.js");
|
||||
require("../../libs/config/props/indexAnchor.js");
|
||||
require("../../libs/config/props/indexList.js");
|
||||
require("../../libs/config/props/input.js");
|
||||
require("../../libs/config/props/keyboard.js");
|
||||
require("../../libs/config/props/line.js");
|
||||
require("../../libs/config/props/lineProgress.js");
|
||||
require("../../libs/config/props/link.js");
|
||||
require("../../libs/config/props/list.js");
|
||||
require("../../libs/config/props/listItem.js");
|
||||
require("../../libs/config/props/loadingIcon.js");
|
||||
require("../../libs/config/props/loadingPage.js");
|
||||
require("../../libs/config/props/loadmore.js");
|
||||
require("../../libs/config/props/modal.js");
|
||||
require("../../libs/config/props/navbar.js");
|
||||
require("../../libs/config/color.js");
|
||||
require("../../libs/config/props/noNetwork.js");
|
||||
require("../../libs/config/props/noticeBar.js");
|
||||
require("../../libs/config/props/notify.js");
|
||||
require("../../libs/config/props/numberBox.js");
|
||||
require("../../libs/config/props/numberKeyboard.js");
|
||||
require("../../libs/config/props/overlay.js");
|
||||
require("../../libs/config/props/parse.js");
|
||||
require("../../libs/config/props/picker.js");
|
||||
require("../../libs/config/props/popup.js");
|
||||
require("../../libs/config/props/radio.js");
|
||||
require("../../libs/config/props/radioGroup.js");
|
||||
require("../../libs/config/props/rate.js");
|
||||
require("../../libs/config/props/readMore.js");
|
||||
require("../../libs/config/props/row.js");
|
||||
require("../../libs/config/props/rowNotice.js");
|
||||
require("../../libs/config/props/scrollList.js");
|
||||
require("../../libs/config/props/search.js");
|
||||
require("../../libs/config/props/section.js");
|
||||
require("../../libs/config/props/skeleton.js");
|
||||
require("../../libs/config/props/slider.js");
|
||||
require("../../libs/config/props/statusBar.js");
|
||||
require("../../libs/config/props/steps.js");
|
||||
require("../../libs/config/props/stepsItem.js");
|
||||
require("../../libs/config/props/sticky.js");
|
||||
require("../../libs/config/props/subsection.js");
|
||||
require("../../libs/config/props/swipeAction.js");
|
||||
require("../../libs/config/props/swipeActionItem.js");
|
||||
require("../../libs/config/props/swiper.js");
|
||||
require("../../libs/config/props/swipterIndicator.js");
|
||||
require("../../libs/config/props/switch.js");
|
||||
require("../../libs/config/props/tabbar.js");
|
||||
require("../../libs/config/props/tabbarItem.js");
|
||||
require("../../libs/config/props/tabs.js");
|
||||
require("../../libs/config/props/tag.js");
|
||||
require("../../libs/config/props/text.js");
|
||||
require("../../libs/config/props/textarea.js");
|
||||
require("../../libs/config/props/toast.js");
|
||||
require("../../libs/config/props/toolbar.js");
|
||||
require("../../libs/config/props/tooltip.js");
|
||||
require("../../libs/config/props/transition.js");
|
||||
require("../../libs/config/props/upload.js");
|
||||
require("../../libs/function/test.js");
|
||||
require("../../libs/util/route.js");
|
||||
require("../../libs/function/digit.js");
|
||||
const _sfc_main = {
|
||||
name: "u-overlay",
|
||||
mixins: [uni_modules_uviewPlus_libs_mixin_mpMixin.mpMixin, uni_modules_uviewPlus_libs_mixin_mixin.mixin, uni_modules_uviewPlus_components_uOverlay_props.props],
|
||||
computed: {
|
||||
overlayStyle() {
|
||||
const style = {
|
||||
position: "fixed",
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
zIndex: this.zIndex,
|
||||
bottom: 0,
|
||||
"background-color": `rgba(0, 0, 0, ${this.opacity})`
|
||||
};
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(style, uni_modules_uviewPlus_libs_function_index.addStyle(this.customStyle));
|
||||
}
|
||||
},
|
||||
emits: ["click"],
|
||||
methods: {
|
||||
clickHandler() {
|
||||
this.$emit("click");
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!Array) {
|
||||
const _easycom_u_transition2 = common_vendor.resolveComponent("u-transition");
|
||||
_easycom_u_transition2();
|
||||
}
|
||||
const _easycom_u_transition = () => "../u-transition/u-transition.js";
|
||||
if (!Math) {
|
||||
_easycom_u_transition();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return {
|
||||
a: common_vendor.o($options.clickHandler),
|
||||
b: common_vendor.p({
|
||||
show: _ctx.show,
|
||||
["custom-class"]: "u-overlay",
|
||||
duration: _ctx.duration,
|
||||
["custom-style"]: $options.overlayStyle
|
||||
})
|
||||
};
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-9112bed9"], ["__file", "D:/里海数字乡村/purchase-let/uni_modules/uview-plus/components/u-overlay/u-overlay.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
6
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/u-overlay.json
vendored
Normal file
6
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/u-overlay.json
vendored
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"u-transition": "../u-transition/u-transition"
|
||||
}
|
||||
}
|
||||
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/u-overlay.wxml
vendored
Normal file
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/u-overlay.wxml
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
<u-transition wx:if="{{b}}" class="data-v-9112bed9" u-s="{{['d']}}" bindclick="{{a}}" u-i="9112bed9-0" bind:__l="__l" u-p="{{b}}"><slot/></u-transition>
|
||||
49
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/u-overlay.wxss
vendored
Normal file
49
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-overlay/u-overlay.wxss
vendored
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.u-empty.data-v-9112bed9,
|
||||
.u-empty__wrap.data-v-9112bed9,
|
||||
.u-tabs.data-v-9112bed9,
|
||||
.u-tabs__wrapper.data-v-9112bed9,
|
||||
.u-tabs__wrapper__scroll-view-wrapper.data-v-9112bed9,
|
||||
.u-tabs__wrapper__scroll-view.data-v-9112bed9,
|
||||
.u-tabs__wrapper__nav.data-v-9112bed9,
|
||||
.u-tabs__wrapper__nav__line.data-v-9112bed9 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
flex-basis: auto;
|
||||
align-items: stretch;
|
||||
align-content: flex-start;
|
||||
}
|
||||
.u-overlay.data-v-9112bed9 {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
82
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/props.js
vendored
Normal file
82
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/props.js
vendored
Normal file
|
|
@ -0,0 +1,82 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_libs_config_props = require("../../libs/config/props.js");
|
||||
const props = {
|
||||
props: {
|
||||
// 是否展示弹窗
|
||||
show: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.show
|
||||
},
|
||||
// 是否显示遮罩
|
||||
overlay: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.overlay
|
||||
},
|
||||
// 弹出的方向，可选值为 top bottom right left center
|
||||
mode: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.mode
|
||||
},
|
||||
// 动画时长，单位ms
|
||||
duration: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.duration
|
||||
},
|
||||
// 是否显示关闭图标
|
||||
closeable: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.closeable
|
||||
},
|
||||
// 自定义遮罩的样式
|
||||
overlayStyle: {
|
||||
type: [Object, String],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.overlayStyle
|
||||
},
|
||||
// 点击遮罩是否关闭弹窗
|
||||
closeOnClickOverlay: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.closeOnClickOverlay
|
||||
},
|
||||
// 层级
|
||||
zIndex: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.zIndex
|
||||
},
|
||||
// 是否为iPhoneX留出底部安全距离
|
||||
safeAreaInsetBottom: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.safeAreaInsetBottom
|
||||
},
|
||||
// 是否留出顶部安全距离（状态栏高度）
|
||||
safeAreaInsetTop: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.safeAreaInsetTop
|
||||
},
|
||||
// 自定义关闭图标位置，top-left为左上角，top-right为右上角，bottom-left为左下角，bottom-right为右下角
|
||||
closeIconPos: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.closeIconPos
|
||||
},
|
||||
// 是否显示圆角
|
||||
round: {
|
||||
type: [Boolean, String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.round
|
||||
},
|
||||
// mode=center，也即中部弹出时，是否使用缩放模式
|
||||
zoom: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.zoom
|
||||
},
|
||||
// 弹窗背景色，设置为transparent可去除白色背景
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.bgColor
|
||||
},
|
||||
// 遮罩的透明度，0-1之间
|
||||
overlayOpacity: {
|
||||
type: [Number, String],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.popup.overlayOpacity
|
||||
}
|
||||
}
|
||||
};
|
||||
exports.props = props;
|
||||
313
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/u-popup.js
vendored
Normal file
313
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/u-popup.js
vendored
Normal file
|
|
@ -0,0 +1,313 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_components_uPopup_props = require("./props.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mpMixin = require("../../libs/mixin/mpMixin.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mixin = require("../../libs/mixin/mixin.js");
|
||||
const uni_modules_uviewPlus_libs_function_index = require("../../libs/function/index.js");
|
||||
const common_vendor = require("../../../../common/vendor.js");
|
||||
require("../../libs/config/props.js");
|
||||
require("../../libs/config/config.js");
|
||||
require("../../libs/config/props/actionSheet.js");
|
||||
require("../../libs/config/props/album.js");
|
||||
require("../../libs/config/props/alert.js");
|
||||
require("../../libs/config/props/avatar.js");
|
||||
require("../../libs/config/props/avatarGroup.js");
|
||||
require("../../libs/config/props/backtop.js");
|
||||
require("../../libs/config/props/badge.js");
|
||||
require("../../libs/config/props/button.js");
|
||||
require("../../libs/config/props/calendar.js");
|
||||
require("../../libs/config/props/carKeyboard.js");
|
||||
require("../../libs/config/props/cell.js");
|
||||
require("../../libs/config/props/cellGroup.js");
|
||||
require("../../libs/config/props/checkbox.js");
|
||||
require("../../libs/config/props/checkboxGroup.js");
|
||||
require("../../libs/config/props/circleProgress.js");
|
||||
require("../../libs/config/props/code.js");
|
||||
require("../../libs/config/props/codeInput.js");
|
||||
require("../../libs/config/props/col.js");
|
||||
require("../../libs/config/props/collapse.js");
|
||||
require("../../libs/config/props/collapseItem.js");
|
||||
require("../../libs/config/props/columnNotice.js");
|
||||
require("../../libs/config/props/countDown.js");
|
||||
require("../../libs/config/props/countTo.js");
|
||||
require("../../libs/config/props/datetimePicker.js");
|
||||
require("../../libs/config/props/divider.js");
|
||||
require("../../libs/config/props/empty.js");
|
||||
require("../../libs/config/props/form.js");
|
||||
require("../../libs/config/props/formItem.js");
|
||||
require("../../libs/config/props/gap.js");
|
||||
require("../../libs/config/props/grid.js");
|
||||
require("../../libs/config/props/gridItem.js");
|
||||
require("../../libs/config/props/icon.js");
|
||||
require("../../libs/config/props/image.js");
|
||||
require("../../libs/config/props/indexAnchor.js");
|
||||
require("../../libs/config/props/indexList.js");
|
||||
require("../../libs/config/props/input.js");
|
||||
require("../../libs/config/props/keyboard.js");
|
||||
require("../../libs/config/props/line.js");
|
||||
require("../../libs/config/props/lineProgress.js");
|
||||
require("../../libs/config/props/link.js");
|
||||
require("../../libs/config/props/list.js");
|
||||
require("../../libs/config/props/listItem.js");
|
||||
require("../../libs/config/props/loadingIcon.js");
|
||||
require("../../libs/config/props/loadingPage.js");
|
||||
require("../../libs/config/props/loadmore.js");
|
||||
require("../../libs/config/props/modal.js");
|
||||
require("../../libs/config/props/navbar.js");
|
||||
require("../../libs/config/color.js");
|
||||
require("../../libs/config/props/noNetwork.js");
|
||||
require("../../libs/config/props/noticeBar.js");
|
||||
require("../../libs/config/props/notify.js");
|
||||
require("../../libs/config/props/numberBox.js");
|
||||
require("../../libs/config/props/numberKeyboard.js");
|
||||
require("../../libs/config/props/overlay.js");
|
||||
require("../../libs/config/props/parse.js");
|
||||
require("../../libs/config/props/picker.js");
|
||||
require("../../libs/config/props/popup.js");
|
||||
require("../../libs/config/props/radio.js");
|
||||
require("../../libs/config/props/radioGroup.js");
|
||||
require("../../libs/config/props/rate.js");
|
||||
require("../../libs/config/props/readMore.js");
|
||||
require("../../libs/config/props/row.js");
|
||||
require("../../libs/config/props/rowNotice.js");
|
||||
require("../../libs/config/props/scrollList.js");
|
||||
require("../../libs/config/props/search.js");
|
||||
require("../../libs/config/props/section.js");
|
||||
require("../../libs/config/props/skeleton.js");
|
||||
require("../../libs/config/props/slider.js");
|
||||
require("../../libs/config/props/statusBar.js");
|
||||
require("../../libs/config/props/steps.js");
|
||||
require("../../libs/config/props/stepsItem.js");
|
||||
require("../../libs/config/props/sticky.js");
|
||||
require("../../libs/config/props/subsection.js");
|
||||
require("../../libs/config/props/swipeAction.js");
|
||||
require("../../libs/config/props/swipeActionItem.js");
|
||||
require("../../libs/config/props/swiper.js");
|
||||
require("../../libs/config/props/swipterIndicator.js");
|
||||
require("../../libs/config/props/switch.js");
|
||||
require("../../libs/config/props/tabbar.js");
|
||||
require("../../libs/config/props/tabbarItem.js");
|
||||
require("../../libs/config/props/tabs.js");
|
||||
require("../../libs/config/props/tag.js");
|
||||
require("../../libs/config/props/text.js");
|
||||
require("../../libs/config/props/textarea.js");
|
||||
require("../../libs/config/props/toast.js");
|
||||
require("../../libs/config/props/toolbar.js");
|
||||
require("../../libs/config/props/tooltip.js");
|
||||
require("../../libs/config/props/transition.js");
|
||||
require("../../libs/config/props/upload.js");
|
||||
require("../../libs/function/test.js");
|
||||
require("../../libs/util/route.js");
|
||||
require("../../libs/function/digit.js");
|
||||
const _sfc_main = {
|
||||
name: "u-popup",
|
||||
mixins: [uni_modules_uviewPlus_libs_mixin_mpMixin.mpMixin, uni_modules_uviewPlus_libs_mixin_mixin.mixin, uni_modules_uviewPlus_components_uPopup_props.props],
|
||||
data() {
|
||||
return {
|
||||
overlayDuration: this.duration + 50
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
show(newValue, oldValue) {
|
||||
if (newValue === true) {
|
||||
const children = this.$children;
|
||||
this.retryComputedComponentRect(children);
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
transitionStyle() {
|
||||
const style = {
|
||||
zIndex: this.zIndex,
|
||||
position: "fixed",
|
||||
display: "flex"
|
||||
};
|
||||
style[this.mode] = 0;
|
||||
if (this.mode === "left") {
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(style, {
|
||||
bottom: 0,
|
||||
top: 0
|
||||
});
|
||||
} else if (this.mode === "right") {
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(style, {
|
||||
bottom: 0,
|
||||
top: 0
|
||||
});
|
||||
} else if (this.mode === "top") {
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(style, {
|
||||
left: 0,
|
||||
right: 0
|
||||
});
|
||||
} else if (this.mode === "bottom") {
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(style, {
|
||||
left: 0,
|
||||
right: 0
|
||||
});
|
||||
} else if (this.mode === "center") {
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(style, {
|
||||
alignItems: "center",
|
||||
"justify-content": "center",
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
bottom: 0
|
||||
});
|
||||
}
|
||||
},
|
||||
contentStyle() {
|
||||
const style = {};
|
||||
uni_modules_uviewPlus_libs_function_index.sys();
|
||||
if (this.mode !== "center") {
|
||||
style.flex = 1;
|
||||
}
|
||||
if (this.bgColor) {
|
||||
style.backgroundColor = this.bgColor;
|
||||
}
|
||||
if (this.round) {
|
||||
const value = uni_modules_uviewPlus_libs_function_index.addUnit(this.round);
|
||||
if (this.mode === "top") {
|
||||
style.borderBottomLeftRadius = value;
|
||||
style.borderBottomRightRadius = value;
|
||||
} else if (this.mode === "bottom") {
|
||||
style.borderTopLeftRadius = value;
|
||||
style.borderTopRightRadius = value;
|
||||
} else if (this.mode === "center") {
|
||||
style.borderRadius = value;
|
||||
}
|
||||
}
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(style, uni_modules_uviewPlus_libs_function_index.addStyle(this.customStyle));
|
||||
},
|
||||
position() {
|
||||
if (this.mode === "center") {
|
||||
return this.zoom ? "fade-zoom" : "fade";
|
||||
}
|
||||
if (this.mode === "left") {
|
||||
return "slide-left";
|
||||
}
|
||||
if (this.mode === "right") {
|
||||
return "slide-right";
|
||||
}
|
||||
if (this.mode === "bottom") {
|
||||
return "slide-up";
|
||||
}
|
||||
if (this.mode === "top") {
|
||||
return "slide-down";
|
||||
}
|
||||
}
|
||||
},
|
||||
emits: ["open", "close", "click"],
|
||||
methods: {
|
||||
// 点击遮罩
|
||||
overlayClick() {
|
||||
if (this.closeOnClickOverlay) {
|
||||
this.$emit("close");
|
||||
}
|
||||
},
|
||||
close(e) {
|
||||
this.$emit("close");
|
||||
},
|
||||
afterEnter() {
|
||||
this.$emit("open");
|
||||
},
|
||||
clickHandler() {
|
||||
if (this.mode === "center") {
|
||||
this.overlayClick();
|
||||
}
|
||||
this.$emit("click");
|
||||
},
|
||||
retryComputedComponentRect(children) {
|
||||
const names = [
|
||||
"u-calendar-month",
|
||||
"u-album",
|
||||
"u-collapse-item",
|
||||
"u-dropdown",
|
||||
"u-index-item",
|
||||
"u-index-list",
|
||||
"u-line-progress",
|
||||
"u-list-item",
|
||||
"u-rate",
|
||||
"u-read-more",
|
||||
"u-row",
|
||||
"u-row-notice",
|
||||
"u-scroll-list",
|
||||
"u-skeleton",
|
||||
"u-slider",
|
||||
"u-steps-item",
|
||||
"u-sticky",
|
||||
"u-subsection",
|
||||
"u-swipe-action-item",
|
||||
"u-tabbar",
|
||||
"u-tabs",
|
||||
"u-tooltip"
|
||||
];
|
||||
for (let i = 0; i < children.length; i++) {
|
||||
const child = children[i];
|
||||
const grandChild = child.$children;
|
||||
if (names.includes(child.$options.name) && typeof (child == null ? void 0 : child.init) === "function") {
|
||||
uni_modules_uviewPlus_libs_function_index.sleep(50).then(() => {
|
||||
child.init();
|
||||
});
|
||||
}
|
||||
if (grandChild.length) {
|
||||
this.retryComputedComponentRect(grandChild);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
if (!Array) {
|
||||
const _easycom_u_overlay2 = common_vendor.resolveComponent("u-overlay");
|
||||
const _easycom_u_status_bar2 = common_vendor.resolveComponent("u-status-bar");
|
||||
const _easycom_u_icon2 = common_vendor.resolveComponent("u-icon");
|
||||
const _easycom_u_safe_bottom2 = common_vendor.resolveComponent("u-safe-bottom");
|
||||
const _easycom_u_transition2 = common_vendor.resolveComponent("u-transition");
|
||||
(_easycom_u_overlay2 + _easycom_u_status_bar2 + _easycom_u_icon2 + _easycom_u_safe_bottom2 + _easycom_u_transition2)();
|
||||
}
|
||||
const _easycom_u_overlay = () => "../u-overlay/u-overlay.js";
|
||||
const _easycom_u_status_bar = () => "../u-status-bar/u-status-bar.js";
|
||||
const _easycom_u_icon = () => "../u-icon/u-icon.js";
|
||||
const _easycom_u_safe_bottom = () => "../u-safe-bottom/u-safe-bottom.js";
|
||||
const _easycom_u_transition = () => "../u-transition/u-transition.js";
|
||||
if (!Math) {
|
||||
(_easycom_u_overlay + _easycom_u_status_bar + _easycom_u_icon + _easycom_u_safe_bottom + _easycom_u_transition)();
|
||||
}
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return common_vendor.e({
|
||||
a: _ctx.overlay
|
||||
}, _ctx.overlay ? {
|
||||
b: common_vendor.o($options.overlayClick),
|
||||
c: common_vendor.p({
|
||||
show: _ctx.show,
|
||||
duration: $data.overlayDuration,
|
||||
customStyle: _ctx.overlayStyle,
|
||||
opacity: _ctx.overlayOpacity
|
||||
})
|
||||
} : {}, {
|
||||
d: _ctx.safeAreaInsetTop
|
||||
}, _ctx.safeAreaInsetTop ? {} : {}, {
|
||||
e: _ctx.closeable
|
||||
}, _ctx.closeable ? {
|
||||
f: common_vendor.p({
|
||||
name: "close",
|
||||
color: "#909399",
|
||||
size: "18",
|
||||
bold: true
|
||||
}),
|
||||
g: common_vendor.o((...args) => $options.close && $options.close(...args)),
|
||||
h: common_vendor.n("u-popup__content__close--" + _ctx.closeIconPos)
|
||||
} : {}, {
|
||||
i: _ctx.safeAreaInsetBottom
|
||||
}, _ctx.safeAreaInsetBottom ? {} : {}, {
|
||||
j: common_vendor.s($options.contentStyle),
|
||||
k: common_vendor.o((...args) => _ctx.noop && _ctx.noop(...args)),
|
||||
l: common_vendor.o($options.afterEnter),
|
||||
m: common_vendor.o($options.clickHandler),
|
||||
n: common_vendor.p({
|
||||
show: _ctx.show,
|
||||
customStyle: $options.transitionStyle,
|
||||
mode: $options.position,
|
||||
duration: _ctx.duration
|
||||
})
|
||||
});
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-05c24e9b"], ["__file", "D:/里海数字乡村/purchase-let/uni_modules/uview-plus/components/u-popup/u-popup.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
10
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/u-popup.json
vendored
Normal file
10
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/u-popup.json
vendored
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"u-overlay": "../u-overlay/u-overlay",
|
||||
"u-status-bar": "../u-status-bar/u-status-bar",
|
||||
"u-icon": "../u-icon/u-icon",
|
||||
"u-safe-bottom": "../u-safe-bottom/u-safe-bottom",
|
||||
"u-transition": "../u-transition/u-transition"
|
||||
}
|
||||
}
|
||||
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/u-popup.wxml
vendored
Normal file
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/u-popup.wxml
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
<view class="u-popup data-v-05c24e9b"><u-overlay wx:if="{{a}}" class="data-v-05c24e9b" bindclick="{{b}}" u-i="05c24e9b-0" bind:__l="__l" u-p="{{c}}"></u-overlay><u-transition wx:if="{{n}}" class="data-v-05c24e9b" u-s="{{['d']}}" bindafterEnter="{{l}}" bindclick="{{m}}" u-i="05c24e9b-1" bind:__l="__l" u-p="{{n}}"><view class="u-popup__content data-v-05c24e9b" style="{{j}}" catchtap="{{k}}"><u-status-bar wx:if="{{d}}" class="data-v-05c24e9b" u-i="05c24e9b-2,05c24e9b-1" bind:__l="__l"></u-status-bar><slot></slot><view wx:if="{{e}}" catchtap="{{g}}" class="{{['u-popup__content__close', 'data-v-05c24e9b', h]}}" hover-class="u-popup__content__close--hover" hover-stay-time="150"><u-icon wx:if="{{f}}" class="data-v-05c24e9b" u-i="05c24e9b-3,05c24e9b-1" bind:__l="__l" u-p="{{f}}"></u-icon></view><u-safe-bottom wx:if="{{i}}" class="data-v-05c24e9b" u-i="05c24e9b-4,05c24e9b-1" bind:__l="__l"></u-safe-bottom></view></u-transition></view>
|
||||
100
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/u-popup.wxss
vendored
Normal file
100
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-popup/u-popup.wxss
vendored
Normal file
|
|
@ -0,0 +1,100 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.u-empty.data-v-05c24e9b,
|
||||
.u-empty__wrap.data-v-05c24e9b,
|
||||
.u-tabs.data-v-05c24e9b,
|
||||
.u-tabs__wrapper.data-v-05c24e9b,
|
||||
.u-tabs__wrapper__scroll-view-wrapper.data-v-05c24e9b,
|
||||
.u-tabs__wrapper__scroll-view.data-v-05c24e9b,
|
||||
.u-tabs__wrapper__nav.data-v-05c24e9b,
|
||||
.u-tabs__wrapper__nav__line.data-v-05c24e9b {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-shrink: 0;
|
||||
flex-grow: 0;
|
||||
flex-basis: auto;
|
||||
align-items: stretch;
|
||||
align-content: flex-start;
|
||||
}
|
||||
.u-popup.data-v-05c24e9b {
|
||||
flex: 1;
|
||||
}
|
||||
.u-popup__content.data-v-05c24e9b {
|
||||
background-color: #fff;
|
||||
position: relative;
|
||||
}
|
||||
.u-popup__content--round-top.data-v-05c24e9b {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
}
|
||||
.u-popup__content--round-left.data-v-05c24e9b {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 10px;
|
||||
}
|
||||
.u-popup__content--round-right.data-v-05c24e9b {
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: 10px;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
.u-popup__content--round-bottom.data-v-05c24e9b {
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
.u-popup__content--round-center.data-v-05c24e9b {
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-left-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
}
|
||||
.u-popup__content__close.data-v-05c24e9b {
|
||||
position: absolute;
|
||||
}
|
||||
.u-popup__content__close--hover.data-v-05c24e9b {
|
||||
opacity: 0.4;
|
||||
}
|
||||
.u-popup__content__close--top-left.data-v-05c24e9b {
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
}
|
||||
.u-popup__content__close--top-right.data-v-05c24e9b {
|
||||
top: 15px;
|
||||
right: 15px;
|
||||
}
|
||||
.u-popup__content__close--bottom-left.data-v-05c24e9b {
|
||||
bottom: 15px;
|
||||
left: 15px;
|
||||
}
|
||||
.u-popup__content__close--bottom-right.data-v-05c24e9b {
|
||||
right: 15px;
|
||||
bottom: 15px;
|
||||
}
|
||||
5
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-safe-bottom/props.js
vendored
Normal file
5
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-safe-bottom/props.js
vendored
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
"use strict";
|
||||
const props = {
|
||||
props: {}
|
||||
};
|
||||
exports.props = props;
|
||||
36
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-safe-bottom/u-safe-bottom.js
vendored
Normal file
36
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-safe-bottom/u-safe-bottom.js
vendored
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_components_uSafeBottom_props = require("./props.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mpMixin = require("../../libs/mixin/mpMixin.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mixin = require("../../libs/mixin/mixin.js");
|
||||
const uni_modules_uviewPlus_libs_function_index = require("../../libs/function/index.js");
|
||||
const common_vendor = require("../../../../common/vendor.js");
|
||||
require("../../libs/function/test.js");
|
||||
require("../../libs/util/route.js");
|
||||
require("../../libs/function/digit.js");
|
||||
require("../../libs/config/config.js");
|
||||
const _sfc_main = {
|
||||
name: "u-safe-bottom",
|
||||
mixins: [uni_modules_uviewPlus_libs_mixin_mpMixin.mpMixin, uni_modules_uviewPlus_libs_mixin_mixin.mixin, uni_modules_uviewPlus_components_uSafeBottom_props.props],
|
||||
data() {
|
||||
return {
|
||||
safeAreaBottomHeight: 0,
|
||||
isNvue: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
style() {
|
||||
const style = {};
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(style, uni_modules_uviewPlus_libs_function_index.addStyle(this.customStyle));
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
}
|
||||
};
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return {
|
||||
a: common_vendor.s($options.style),
|
||||
b: common_vendor.n(!$data.isNvue && "u-safe-area-inset-bottom")
|
||||
};
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-f3d22cfe"], ["__file", "D:/里海数字乡村/purchase-let/uni_modules/uview-plus/components/u-safe-bottom/u-safe-bottom.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<view style="{{a}}" class="{{['u-safe-bottom', 'data-v-f3d22cfe', b]}}"></view>
|
||||
28
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-safe-bottom/u-safe-bottom.wxss
vendored
Normal file
28
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-safe-bottom/u-safe-bottom.wxss
vendored
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.u-safe-bottom.data-v-f3d22cfe {
|
||||
width: 100%;
|
||||
}
|
||||
37
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/props.js
vendored
Normal file
37
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/props.js
vendored
Normal file
|
|
@ -0,0 +1,37 @@
|
|||
"use strict";
|
||||
const uni_modules_uviewPlus_libs_config_props = require("../../libs/config/props.js");
|
||||
const props = {
|
||||
props: {
|
||||
// 吸顶容器到顶部某个距离的时候，进行吸顶，在H5平台，NavigationBar为44px
|
||||
offsetTop: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.sticky.offsetTop
|
||||
},
|
||||
// 自定义导航栏的高度
|
||||
customNavHeight: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.sticky.customNavHeight
|
||||
},
|
||||
// 是否开启吸顶功能
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.sticky.disabled
|
||||
},
|
||||
// 吸顶区域的背景颜色
|
||||
bgColor: {
|
||||
type: String,
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.sticky.bgColor
|
||||
},
|
||||
// z-index值
|
||||
zIndex: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.sticky.zIndex
|
||||
},
|
||||
// 列表中的索引值
|
||||
index: {
|
||||
type: [String, Number],
|
||||
default: () => uni_modules_uviewPlus_libs_config_props.defProps.sticky.index
|
||||
}
|
||||
}
|
||||
};
|
||||
exports.props = props;
|
||||
235
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/u-sticky.js
vendored
Normal file
235
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/u-sticky.js
vendored
Normal file
|
|
@ -0,0 +1,235 @@
|
|||
"use strict";
|
||||
const common_vendor = require("../../../../common/vendor.js");
|
||||
const uni_modules_uviewPlus_components_uSticky_props = require("./props.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mpMixin = require("../../libs/mixin/mpMixin.js");
|
||||
const uni_modules_uviewPlus_libs_mixin_mixin = require("../../libs/mixin/mixin.js");
|
||||
const uni_modules_uviewPlus_libs_function_index = require("../../libs/function/index.js");
|
||||
const uni_modules_uviewPlus_libs_config_zIndex = require("../../libs/config/zIndex.js");
|
||||
require("../../libs/config/props.js");
|
||||
require("../../libs/config/config.js");
|
||||
require("../../libs/config/props/actionSheet.js");
|
||||
require("../../libs/config/props/album.js");
|
||||
require("../../libs/config/props/alert.js");
|
||||
require("../../libs/config/props/avatar.js");
|
||||
require("../../libs/config/props/avatarGroup.js");
|
||||
require("../../libs/config/props/backtop.js");
|
||||
require("../../libs/config/props/badge.js");
|
||||
require("../../libs/config/props/button.js");
|
||||
require("../../libs/config/props/calendar.js");
|
||||
require("../../libs/config/props/carKeyboard.js");
|
||||
require("../../libs/config/props/cell.js");
|
||||
require("../../libs/config/props/cellGroup.js");
|
||||
require("../../libs/config/props/checkbox.js");
|
||||
require("../../libs/config/props/checkboxGroup.js");
|
||||
require("../../libs/config/props/circleProgress.js");
|
||||
require("../../libs/config/props/code.js");
|
||||
require("../../libs/config/props/codeInput.js");
|
||||
require("../../libs/config/props/col.js");
|
||||
require("../../libs/config/props/collapse.js");
|
||||
require("../../libs/config/props/collapseItem.js");
|
||||
require("../../libs/config/props/columnNotice.js");
|
||||
require("../../libs/config/props/countDown.js");
|
||||
require("../../libs/config/props/countTo.js");
|
||||
require("../../libs/config/props/datetimePicker.js");
|
||||
require("../../libs/config/props/divider.js");
|
||||
require("../../libs/config/props/empty.js");
|
||||
require("../../libs/config/props/form.js");
|
||||
require("../../libs/config/props/formItem.js");
|
||||
require("../../libs/config/props/gap.js");
|
||||
require("../../libs/config/props/grid.js");
|
||||
require("../../libs/config/props/gridItem.js");
|
||||
require("../../libs/config/props/icon.js");
|
||||
require("../../libs/config/props/image.js");
|
||||
require("../../libs/config/props/indexAnchor.js");
|
||||
require("../../libs/config/props/indexList.js");
|
||||
require("../../libs/config/props/input.js");
|
||||
require("../../libs/config/props/keyboard.js");
|
||||
require("../../libs/config/props/line.js");
|
||||
require("../../libs/config/props/lineProgress.js");
|
||||
require("../../libs/config/props/link.js");
|
||||
require("../../libs/config/props/list.js");
|
||||
require("../../libs/config/props/listItem.js");
|
||||
require("../../libs/config/props/loadingIcon.js");
|
||||
require("../../libs/config/props/loadingPage.js");
|
||||
require("../../libs/config/props/loadmore.js");
|
||||
require("../../libs/config/props/modal.js");
|
||||
require("../../libs/config/props/navbar.js");
|
||||
require("../../libs/config/color.js");
|
||||
require("../../libs/config/props/noNetwork.js");
|
||||
require("../../libs/config/props/noticeBar.js");
|
||||
require("../../libs/config/props/notify.js");
|
||||
require("../../libs/config/props/numberBox.js");
|
||||
require("../../libs/config/props/numberKeyboard.js");
|
||||
require("../../libs/config/props/overlay.js");
|
||||
require("../../libs/config/props/parse.js");
|
||||
require("../../libs/config/props/picker.js");
|
||||
require("../../libs/config/props/popup.js");
|
||||
require("../../libs/config/props/radio.js");
|
||||
require("../../libs/config/props/radioGroup.js");
|
||||
require("../../libs/config/props/rate.js");
|
||||
require("../../libs/config/props/readMore.js");
|
||||
require("../../libs/config/props/row.js");
|
||||
require("../../libs/config/props/rowNotice.js");
|
||||
require("../../libs/config/props/scrollList.js");
|
||||
require("../../libs/config/props/search.js");
|
||||
require("../../libs/config/props/section.js");
|
||||
require("../../libs/config/props/skeleton.js");
|
||||
require("../../libs/config/props/slider.js");
|
||||
require("../../libs/config/props/statusBar.js");
|
||||
require("../../libs/config/props/steps.js");
|
||||
require("../../libs/config/props/stepsItem.js");
|
||||
require("../../libs/config/props/sticky.js");
|
||||
require("../../libs/config/props/subsection.js");
|
||||
require("../../libs/config/props/swipeAction.js");
|
||||
require("../../libs/config/props/swipeActionItem.js");
|
||||
require("../../libs/config/props/swiper.js");
|
||||
require("../../libs/config/props/swipterIndicator.js");
|
||||
require("../../libs/config/props/switch.js");
|
||||
require("../../libs/config/props/tabbar.js");
|
||||
require("../../libs/config/props/tabbarItem.js");
|
||||
require("../../libs/config/props/tabs.js");
|
||||
require("../../libs/config/props/tag.js");
|
||||
require("../../libs/config/props/text.js");
|
||||
require("../../libs/config/props/textarea.js");
|
||||
require("../../libs/config/props/toast.js");
|
||||
require("../../libs/config/props/toolbar.js");
|
||||
require("../../libs/config/props/tooltip.js");
|
||||
require("../../libs/config/props/transition.js");
|
||||
require("../../libs/config/props/upload.js");
|
||||
require("../../libs/function/test.js");
|
||||
require("../../libs/util/route.js");
|
||||
require("../../libs/function/digit.js");
|
||||
const _sfc_main = {
|
||||
name: "u-sticky",
|
||||
mixins: [uni_modules_uviewPlus_libs_mixin_mpMixin.mpMixin, uni_modules_uviewPlus_libs_mixin_mixin.mixin, uni_modules_uviewPlus_components_uSticky_props.props],
|
||||
data() {
|
||||
return {
|
||||
cssSticky: false,
|
||||
// 是否使用css的sticky实现
|
||||
stickyTop: 0,
|
||||
// 吸顶的top值，因为可能受自定义导航栏影响，最终的吸顶值非offsetTop值
|
||||
elId: uni_modules_uviewPlus_libs_function_index.guid(),
|
||||
left: 0,
|
||||
// js模式时，吸顶的内容因为处于postition: fixed模式，为了和原来保持一致的样式，需要记录并重新设置它的left，height，width属性
|
||||
width: "auto",
|
||||
height: "auto",
|
||||
fixed: false
|
||||
// js模式时，是否处于吸顶模式
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
style() {
|
||||
const style = {};
|
||||
if (!this.disabled) {
|
||||
if (this.cssSticky) {
|
||||
style.position = "sticky";
|
||||
style.zIndex = this.uZindex;
|
||||
style.top = uni_modules_uviewPlus_libs_function_index.addUnit(this.stickyTop);
|
||||
} else {
|
||||
style.height = this.fixed ? this.height + "px" : "auto";
|
||||
}
|
||||
} else {
|
||||
style.position = "static";
|
||||
}
|
||||
style.backgroundColor = this.bgColor;
|
||||
return uni_modules_uviewPlus_libs_function_index.deepMerge(uni_modules_uviewPlus_libs_function_index.addStyle(this.customStyle), style);
|
||||
},
|
||||
// 吸顶内容的样式
|
||||
stickyContent() {
|
||||
const style = {};
|
||||
if (!this.cssSticky) {
|
||||
style.position = this.fixed ? "fixed" : "static";
|
||||
style.top = this.stickyTop + "px";
|
||||
style.left = this.left + "px";
|
||||
style.width = this.width == "auto" ? "auto" : this.width + "px";
|
||||
style.zIndex = this.uZindex;
|
||||
}
|
||||
return style;
|
||||
},
|
||||
uZindex() {
|
||||
return this.zIndex ? this.zIndex : uni_modules_uviewPlus_libs_config_zIndex.zIndex.sticky;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.getStickyTop();
|
||||
this.checkSupportCssSticky();
|
||||
if (!this.cssSticky) {
|
||||
!this.disabled && this.initObserveContent();
|
||||
}
|
||||
},
|
||||
initObserveContent() {
|
||||
this.$uGetRect("#" + this.elId).then((res) => {
|
||||
this.height = res.height;
|
||||
this.left = res.left;
|
||||
this.width = res.width;
|
||||
this.$nextTick(() => {
|
||||
this.observeContent();
|
||||
});
|
||||
});
|
||||
},
|
||||
observeContent() {
|
||||
this.disconnectObserver("contentObserver");
|
||||
const contentObserver = common_vendor.index.createIntersectionObserver({
|
||||
// 检测的区间范围
|
||||
thresholds: [0.95, 0.98, 1]
|
||||
});
|
||||
contentObserver.relativeToViewport({
|
||||
top: -this.stickyTop
|
||||
});
|
||||
contentObserver.observe(`#${this.elId}`, (res) => {
|
||||
this.setFixed(res.boundingClientRect.top);
|
||||
});
|
||||
this.contentObserver = contentObserver;
|
||||
},
|
||||
setFixed(top) {
|
||||
const fixed = top <= this.stickyTop;
|
||||
this.fixed = fixed;
|
||||
},
|
||||
disconnectObserver(observerName) {
|
||||
const observer = this[observerName];
|
||||
observer && observer.disconnect();
|
||||
},
|
||||
getStickyTop() {
|
||||
this.stickyTop = uni_modules_uviewPlus_libs_function_index.getPx(this.offsetTop) + uni_modules_uviewPlus_libs_function_index.getPx(this.customNavHeight);
|
||||
},
|
||||
async checkSupportCssSticky() {
|
||||
if (uni_modules_uviewPlus_libs_function_index.os() === "android" && Number(uni_modules_uviewPlus_libs_function_index.sys().system) > 8) {
|
||||
this.cssSticky = true;
|
||||
}
|
||||
this.cssSticky = await this.checkComputedStyle();
|
||||
if (uni_modules_uviewPlus_libs_function_index.os() === "ios") {
|
||||
this.cssSticky = true;
|
||||
}
|
||||
},
|
||||
// 在APP和微信小程序上，通过uni.createSelectorQuery可以判断是否支持css sticky
|
||||
checkComputedStyle() {
|
||||
return new Promise((resolve) => {
|
||||
common_vendor.index.createSelectorQuery().in(this).select(".u-sticky").fields({
|
||||
computedStyle: ["position"]
|
||||
}).exec((e) => {
|
||||
resolve("sticky" === e[0].position);
|
||||
});
|
||||
});
|
||||
},
|
||||
// H5通过创建元素的形式嗅探是否支持css sticky
|
||||
// 判断浏览器是否支持sticky属性
|
||||
checkCssStickyForH5() {
|
||||
}
|
||||
},
|
||||
beforeUnmount() {
|
||||
this.disconnectObserver("contentObserver");
|
||||
}
|
||||
};
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
return {
|
||||
a: common_vendor.s($options.stickyContent),
|
||||
b: $data.elId,
|
||||
c: common_vendor.s($options.style)
|
||||
};
|
||||
}
|
||||
const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-8b303089"], ["__file", "D:/里海数字乡村/purchase-let/uni_modules/uview-plus/components/u-sticky/u-sticky.vue"]]);
|
||||
wx.createComponent(Component);
|
||||
4
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/u-sticky.json
vendored
Normal file
4
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/u-sticky.json
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/u-sticky.wxml
vendored
Normal file
1
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/u-sticky.wxml
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
<view class="u-sticky data-v-8b303089" id="{{b}}" style="{{c}}"><view style="{{a}}" class="u-sticky__content data-v-8b303089"><slot/></view></view>
|
||||
29
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/u-sticky.wxss
vendored
Normal file
29
unpackage/dist/dev/mp-weixin/uni_modules/uview-plus/components/u-sticky/u-sticky.wxss
vendored
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
/**
|
||||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
|
||||
*/
|
||||
/* 颜色变量 */
|
||||
/* 行为相关颜色 */
|
||||
/* 文字基本颜色 */
|
||||
/* 背景颜色 */
|
||||
/* 边框颜色 */
|
||||
/* 尺寸变量 */
|
||||
/* 文字尺寸 */
|
||||
/* 图片尺寸 */
|
||||
/* Border Radius */
|
||||
/* 水平间距 */
|
||||
/* 垂直间距 */
|
||||
/* 透明度 */
|
||||
/* 文章场景相关 */
|
||||
.u-sticky.data-v-8b303089 {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
}
|
||||
|
|
@ -495,7 +495,9 @@ exports.addUnit = addUnit;
|
|||
exports.deepMerge = deepMerge;
|
||||
exports.error = error;
|
||||
exports.getPx = getPx;
|
||||
exports.guid = guid;
|
||||
exports.index = index;
|
||||
exports.os = os;
|
||||
exports.page = page;
|
||||
exports.priceFormat = priceFormat;
|
||||
exports.queryParams = queryParams;
|
||||
|
|
|
|||
Loading…
Reference in New Issue