xinyin025/smart-admin
1
0
Fork 0
mirror of https://github.com/1024-lab/smart-admin.git synced 2026-07-23 03:26:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

【smart-app】 更新beta版本

Browse Source
This commit is contained in:
zhuoda
2024-03-17 22:57:18 +08:00
parent dd43d6e9da
commit de915358cc
304 changed files with 44899 additions and 5992 deletions
Download Patch File Download Diff File Expand all files Collapse all files
smart-app/src/pages/order-detail/components/detail-model-path.vue
+118
View File
@@ -0,0 +1,118 @@
<template>
<view class="smart-detail-card">
<view class="smart-detail-card-title"> 物流信息</view>
<view class="view-item">
<view class="title">
<view class="title-icon-text" type="default"> 提 </view>
<view class="title-content"> 河南省洛阳市洛龙区龙门石窟</view>
</view>
<view class="sub-title"> 河南省洛阳市洛龙区开元大道1024号1024大厦10层1024室 </view>
<view class="sub-title"> 2023-11-23 12:12:12，快递员：刘备（188123123123）</view>
</view>
<view class="view-item">
<view class="title">
<view class="title-icon-text" type="warning"> 装 </view>
<view class="title-content"> 山东省济南市高新区齐鲁软件园 </view>
</view>
<view class="sub-title"> 山东省济南市高新区六边形大楼10层</view>
<view class="sub-title"> 快递员：卓大 188123123123</view>
</view>
<view class="view-item">
<view class="title">
<view class="title-icon-text" type="error"> 卸 </view>
<view class="title-content"> 河南省郑州市郑东新区龙子湖大厦 </view>
</view>
<view class="sub-title"> 河南省郑州市郑东新区高铁路120号 </view>
</view>
<view class="view-item">
<view class="title">
<view class="title-icon-text" type="success"> 还 </view>
<view class="title-content"> 河南省洛阳市洛龙区白马寺 （胡克） </view>
</view>
<view class="sub-title"> 河南省洛阳市洛龙区119号 </view>
</view>
</view>
</template>
<script setup></script>
<style lang="scss" scoped>
.line {
position: absolute;
height: 100px;
border-left: 1rpx dashed #444;
z-index: 0;
top: 40rpx;
}
.view-item {
margin-top: 20px;
position: relative;
z-index: 1;
:before {
content: '';
position: absolute;
left: 20rpx;
right: 0;
top: 44rpx;
height: 100%;
width: 1px;
background: #eeeeee;
}
.sub-title {
font-size: 28rpx;
color: #777777;
margin-left: 58rpx;
margin-top: 10px;
}
.title {
display: flex;
align-items: center;
}
.title-content {
font-size: 32rpx;
color: #444;
font-weight: bold;
padding-bottom: 5rpx;
flex: 1;
}
.title-icon-text {
width: 40rpx;
height: 40rpx;
border-radius: 12rpx;
text-align: center;
line-height: 40rpx;
color: #fff;
font-size: 26rpx;
margin-right: 18rpx;
&[type='default'] {
background: #1a9aff;
}
&[type='warning'] {
background: #f3c35b;
}
&[type='error'] {
background: #ff6c00;
}
&[type='success'] {
background: #6ec98a;
}
&:last-child {
margin-bottom: 0;
}
}
}
.view-item:last-child {
:before {
content: '';
position: absolute;
left: 20rpx;
right: 0;
top: 44rpx;
height: 100%;
width: 0;
}
}
</style>
smart-app/src/pages/order-detail/components/order-detail-base-info.vue
+32
View File
@@ -0,0 +1,32 @@
<template>
<view class="smart-detail-card smart-margin-top60">
<view class="smart-detail-card-title"> 商品</view>
<view class="smart-detail-card-cell">
<view class="smart-detail-card-label"> 商品名称 </view>
<view class="smart-detail-card-value"> 华为MateBook 14</view>
</view>
<view class="smart-detail-card-cell">
<view class="smart-detail-card-label"> 价格 </view>
<view class="smart-detail-card-value uni-error">12,345元 </view>
</view>
<view class="smart-detail-card-cell">
<view class="smart-detail-card-label"> 颜色/产地 </view>
<view class="smart-detail-card-value">玫瑰金/中国·洛阳 </view>
</view>
<view class="smart-detail-card-cell">
<view class="smart-detail-card-label"> 材质/电压 </view>
<view class="smart-detail-card-value">金属/220V </view>
</view>
</view>
</template>
<script setup>
const props = defineProps({
List: {
type: Array,
default: [],
},
});
</script>
<style lang="scss" scoped></style>
smart-app/src/pages/order-detail/components/order-detail-settle.vue
+102
View File
@@ -0,0 +1,102 @@
<template>
<view class="smart-detail-card">
<view class="smart-detail-card-title"> 结算信息 </view>
<view class="view-item">
<view class="item-left"> 订单号： </view>
<view class="item-right"> TYD2023080979 </view>
</view>
<view class="view-item">
<view class="item-left"> 付款状态： </view>
<view class="item-right">
<view class="success"> 已审核 </view>
</view>
</view>
<view class="view-item">
<view class="item-left"> 应付金额： </view>
<view class="item-right"> 500 </view>
</view>
<view class="view-item">
<view class="item-left"> 已付金额： </view>
<view class="item-right"> 200 </view>
</view>
<view class="view-item">
<view class="item-left"> 收款账户： </view>
<view class="item-right"> 项羽/61248348910384 </view>
</view>
</view>
</template>
<script setup></script>
<style lang="scss" scoped>
.view {
width: 94%;
background: #fff;
border-radius: 16rpx;
box-sizing: border-box;
padding: 0 30rpx 24rpx;
margin: 0 auto 24rpx;
}
.view-title {
height: 84rpx;
display: flex;
align-items: center;
margin-bottom: 16rpx;
.title-left-bg {
height: 28rpx;
width: 6rpx;
background: #1a9aff;
border-radius: 4rpx;
margin-right: 14rpx;
}
.title-text {
font-size: 32rpx;
color: #323333;
font-weight: bold;
}
.sub-title {
flex: 1;
display: flex;
justify-content: flex-end;
view {
height: 42rpx;
width: 112rpx;
text-align: center;
line-height: 42rpx;
font-size: 24rpx;
margin-left: 24rpx;
}
.success {
background: #e5f8e9;
color: #1ce36d;
}
.warning {
background: #fff0ed;
color: #ff6c00;
}
}
}
.view-item {
display: flex;
height: 40rpx;
align-items: center;
margin-bottom: 16rpx;
&:last-child {
margin-bottom: 0;
}
.item-left {
width: 180rpx;
margin-right: 20rpx;
font-size: 28rpx;
color: #777777;
}
.item-right {
font-size: 30rpx;
color: #323333;
font-weight: bold;
font-size: 28rpx;
}
}
</style>
smart-app/src/pages/order-detail/order-detail.vue
+52
View File
@@ -0,0 +1,52 @@
<template>
<view class="container">
<smart-detail-tabs :tabsList="tabsList" v-model="active" :fixed="true" @change="scrollTo" />
<view class="smart-detail">
<OrderDetailBaseInfo id="detail0" />
<DetailModelPath id="detail1" />
<OrderDetailSettle id="detail2" />
</view>
</view>
</template>
<script setup>
import { ref } from 'vue';
import SmartDetailTabs from '/@/components/smart-detail-tabs/index.vue';
import OrderDetailBaseInfo from './components/order-detail-base-info.vue';
import DetailModelPath from './components/detail-model-path.vue';
import OrderDetailSettle from './components/order-detail-settle.vue';
const tabsList = [
{
label: '基本信息',
value: 0,
},
{
label: '物流信息',
value: 1,
},
{
label: '结算信息',
value: 2,
},
];
const active = ref(0);
function scrollTo(tab) {
uni.pageScrollTo({
selector: '#detail' + tab,
duration: 300,
success: console.log,
fail: console.log,
});
}
</script>
<style lang="scss" scoped>
.container {
background-color: #f4f4f4;
height: 100vh;
overflow-y: scroll;
}
</style>