wangxiaowei/jianbing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

制作订单详情页面

Browse Source
This commit is contained in:
wangxiaowei
2025-04-26 14:38:04 +08:00
parent 5297bc0034
commit 6ae3444ed9
138 changed files with 2484 additions and 645 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
components/cate-one/cate-one.vue
View File

@ -21,7 +21,7 @@
<view class="u-margin-top-32 bold-600">{{cateName}}</view>
<view class="u-margin-top-32">
<view class="bg-white br16 row u-col-top u-margin-bottom-24" v-for="(item, index) in 10" :key="index">
<view class="bg-white br16 row u-col-top u-margin-bottom-24" v-for="(item, index) in 10" :key="index" @click="toShop()">
<view>
<u-image :src="cloudPath + 'img/banner.png'" width="136" height="136" border-radius="16"></u-image>
</view>
@ -59,6 +59,7 @@
<view class="text-999">去结算</view>
</view>
<!-- 购物车 -->
<u-popup v-model="showCart" mode="bottom" :border-radius="16">
<view style="max-height: 800rpx;">
<view class="px20 text-999 mt20">
@ -66,7 +67,7 @@
</view>
<view>
<scroll-view style="height: 700rpx;" scroll-y="true" scroll-with-animation="true">
<view class="row-start u-row-between u-padding-top-20 u-padding-bottom-20 px20" v-for="(item, index) in 20">
<view class="row-start u-row-between u-padding-top-20 u-padding-bottom-20 px20" v-for="(item, index) in 20" :key="index">
<view class="row-start">
<view>
<u-image :src="cloudPath + 'img/banner.png'" width="136" height="136" border-radius="16"></u-image>
@ -91,6 +92,7 @@
</view>
</view>
</u-popup>
<shop-spec v-model="showSpec" @close="showSpec = false"></shop-spec>
</view>
</template>
@ -108,8 +110,9 @@
selectIndex: 0,
cateList: [],
cateName: '',
showCart: true,
numberVal: 1
numberVal: 1,
showCart: false,
showSpec: false,
}
},
methods: {
@ -148,6 +151,13 @@
changeNumber() {
},
// 跳转商品详情页
toShop() {
uni.navigateTo({
url: '/pages/shop/shop'
})
}
},
watch: {
@ -239,4 +249,5 @@
height: 100rpx;
background-color: #212526;
}
</style>

3
components/mobile-login/mobile-login.vue
View File

@ -34,9 +34,6 @@
</template>
<script>
import {
uploadFile
} from "@/utils/tools";
export default {
name: "mobile-login",
props: {

123
components/shop-spec/shop-spec.vue Normal file
View File

@ -0,0 +1,123 @@
<template>
<view>
<u-popup v-model="showPop" mode="center" :border-radius="16" @close="close">
<view class="bg-white spec">
<view class="shop-title bold-600 u-padding-left-40 w-full">商品标题</view>
<view class="u-margin-left-40">
<scroll-view scroll-y="true" scroll-with-animation="true" style="height: 500rpx;">
<view>
<view class="attr nr u-margin-top-20 u-margin-bottom-20">口味</view>
<view class="row wrap">
<view class="attr-list active">要葱</view>
<view class="attr-list">要香菜</view>
<view class="attr-list">葱和香菜多要</view>
<view class="attr-list">葱和香菜不要</view>
</view>
</view>
<view>
<view class="attr nr u-margin-top-20 u-margin-bottom-20">口味</view>
<view class="row wrap">
<view class="attr-list">要葱</view>
<view class="attr-list">要香菜</view>
<view class="attr-list">葱和香菜多要</view>
<view class="attr-list">葱和香菜不要</view>
</view>
</view>
<view>
<view class="attr nr u-margin-top-20 u-margin-bottom-20">口味</view>
<view class="row wrap">
<view class="attr-list">要葱</view>
<view class="attr-list">要香菜</view>
<view class="attr-list">葱和香菜多要</view>
<view class="attr-list">葱和香菜不要</view>
</view>
</view>
</scroll-view>
</view>
<view class="mt20">
<view class="u-margin-left-40">已选规格：</view>
<view class="row u-row-center mt20">
<view class="w-40 mr10">
<u-button @click="mobileLogin" hover-class="none" :customStyle="{color: themeColor, border: '1px solid ' + themeColor, padding: '16rpx 0'}" :plain="true" :hair-line="false" shape="circle">取消</u-button>
</view>
<view class="w-40 ml10">
<u-button @click="mpLogin" hover-class="none" :customStyle="{backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0'}" :hair-line="false" shape="circle">确定</u-button>
</view>
</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
export default {
name: "shop-spec",
props: {
value: {
type: Boolean,
required: true
}
},
data() {
return {
mobile: ''
};
},
methods: {
close() {
this.showPop = false
this.$emit('close')
}
},
computed: {
showPop: {
get() {
return this.value
},
set(val) {
this.$emit('input', val)
}
}
}
};
</script>
<style lang="scss">
.spec {
width: 600rpx;
height: 800rpx;
.shop-title {
height: 90rpx;
line-height: 90rpx;
font-size: 36rpx;
background-color: #FAFAFA;
}
.attr {
color: #212425;
}
.attr-list {
color: #37393B;
background-color: #F9F9F9;
margin: 0 10rpx 10rpx 0;
border-radius: 16rpx;
border: 2rpx solid #F6F6F7;
padding: 20rpx;
}
.active {
border: 2rpx solid #254062;
color: #254062;
}
.w-40 {
width: 40%;
}
}
</style>