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

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>