Skip to content

M
mallapp
Commit a7bbc37c authored by 罗超's avatar 罗超
Browse files
Options

商城管理新增部分页面

parent f842199e
Hide whitespace changes
Inline Side-by-side
Showing with 1345 additions and 1 deletion
pages/MallMange/components/orderItem.vue 0 → 100644
View file @ a7bbc37c
<template>
<view class="item">
<view class="flex-between orderNum">
<text>订单号：20211018154423824347</text>
<text style="color: #446dfc">待退款</text>
</view>
<view class="flex-between remarks">
商家备注：20211018154423824347
</view>
<view class="consigneeInfo">
<text style="margin-right: 40rpx">信息</text>
<text style="margin-right: 20rpx">13312341234</text>
<view class="flex-between" style="color: #446dfc">
<u-icon name="phone-circle-o" style="margin-right: 10rpx"></u-icon>
联系收货人
</view>
</view>
<view class="flex-between goodsInfo">
<view class="goodsImg">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/user.png"
mode="aspectFill"
class="img"
/>
</view>
<view class="goodsBox">
<view class="goodsName">测试商品</view>
<view class="weight">重量：</view>
<view class="flex-between">
<text>x1</text>
<text>￥0.01</text>
</view>
</view>
</view>
<view class="priceBox">
<text>合计：</text>
<text style="color: #111">￥0.01</text>
<text>（含运费￥0.01）</text>
</view>
<view class="btnBox">
<button class="btn">备注</button>
<button class="btn">拒绝</button>
<button class="btn">同意</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {};
},
};
</script>
<style lang="scss" scoped>
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
}
.item {
width: 700rpx;
// height: 480rpx;
background-color: #fff;
box-sizing: border-box;
padding: 20rpx;
border-radius: 10rpx;
margin: 10rpx auto;
.orderNum {
font-size: 26rpx;
color: #333;
margin-bottom: 20rpx;
}
.remarks{
font-size: 26rpx;
color: #333;
margin-bottom: 20rpx;
}
.consigneeInfo {
width: 100%;
height: 70rpx;
display: flex;
align-items: center;
padding: 0 30rpx;
background-color: #f7f7f7;
font-size: 24rpx;
border-radius: 6rpx;
margin-bottom: 20rpx;
}
.goodsInfo {
margin-bottom: 30rpx;
}
.goodsImg {
width: 160rpx;
height: 160rpx;
border-radius: 6rpx;
overflow: hidden;
box-shadow: 0rpx 0rpx 10rpx 0px rgba(36, 36, 36, 0.2);
margin-right: 20rpx;
.img {
width: 100%;
height: 100%;
border-radius: 6rpx;
}
}
.goodsBox {
height: 160rpx;
flex-grow: 1;
font-size: 24rpx;
color: #333;
.goodsName {
height: 45%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.weight {
height: 35%;
}
}
.priceBox {
text-align: right;
color: #808080;
font-size: 24rpx;
margin-bottom: 30rpx;
}
.btnBox {
display: flex;
justify-content: flex-end;
align-items: center;
.btn {
// width: 90rpx;
// height: 50rpx;
border-radius: 30rpx;
border: 2rpx solid #f7f7f7;
margin: 0 0 0 30rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 22rpx;
color: #111;
}
}
}
</style>
\ No newline at end of file
pages/MallMange/components/tabbar.vue 0 → 100644
View file @ a7bbc37c
<style scoped>
.tabbarMain {
height: 100upx;
position: fixed;
z-index: 50;
flex: 1;
bottom: 0;
left: 0;
right: 0;
z-index: 99999999;
border-top: 1upx solid #ddd;
padding-top: 96rpx;
background: #fff;
}
.tabbarMainIphone {
height: 156upx;
padding-bottom: 64upx;
}
.tabBtnMina {
width: 750upx;
height: 88upx;
position: absolute;
z-index: 2;
bottom: 0;
flex-direction: row;
/* #ifndef */
padding-bottom: constant(safe-area-inset-top);
padding-bottom: env(safe-area-inset-top);
/* #endif */
display: flex;
left: 0;
right: 0;
z-index: 99999999;
}
.tabBtnMinaIphone {
height: 156upx;
padding-bottom: 64upx;
}
.imgse {
/* width: 48upx; */
height: 48upx;
width: auto;
}
.txtBtn {
font-size: 24upx;
color: #666666;
}
.txtBtnSel {
font-size: 24upx;
color: #333333;
}
.itmMain {
/* width: 250upx; */
width: 150upx;
flex: 1;
justify-content: center;
align-items: center;
display: flex;
flex-direction: column;
}
.imgseTs {
width: 150upx;
height: 140upx;
margin-bottom: 90upx;
position: relative;
z-index: 1;
bottom: 0upx;
}
.btnfixMin {
width: 750upx;
height: 178upx;
position: absolute;
z-index: 1;
bottom: 0;
}
.btnfixMinIphone {
bottom: 64upx;
}
.fixTpm {
width: 150upx;
height: 140upx;
flex-direction: row;
justify-content: center;
align-items: center;
position: relative;
z-index: 0;
}
.imgseTsAnds {
width: 150upx;
height: 150upx;
position: fixed;
z-index: 1;
bottom: 10upx;
border-radius: 150upx;
}
</style>
<template>
<view>
<view>
<view
class="tabbarMain"
:class="[flagTypeInfo ? 'tabbarMainIphone' : '']"
v-if="navs && navs.length > 0"
>
<view
class="tabBtnMina"
:class="[flagTypeInfo ? 'tabBtnMinaIphone' : '']"
mode=""
>
<view
class="itmMain"
v-for="(x, i) in navs"
:key="i"
@click.stop="goUrl(x.url)"
>
<image
class="imgse"
:fade-show="false"
v-if="active != i"
mode="heightFix"
:src="x.icon"
></image>
<image
class="imgse"
:fade-show="false"
v-if="active === i"
mode="heightFix"
:src="x.active_icon"
></image>
<text
class="txtBtn"
:style="{ color: active == i ? x.active_color : x.color }"
>{{ x.text }}</text
>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
active: 0,
platforms: "",
leftWidth: 0,
flagTypeInfo: false,
crtPath: "",
isShowIcon: 1,
navs:[{
url:"/pages/MallMange/index",
icon:"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/home2.png",
active_icon:"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/home.png",
color:"#CCCED5",
active_color:"#446dfc",
text:"首页",
},{
url:"/pages/MallMange/order",
icon:"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/order_fill2.png",
active_icon:"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/order_fill.png",
color:"#CCCED5",
active_color:"#446dfc",
text:"订单",
},{
url:"/pages/MallMange/goods",
icon:"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/goods2.png",
active_icon:"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/goods.png",
color:"#CCCED5",
active_color:"#446dfc",
text:"商品",
},{
url:"/pages/MallMange/set",
icon:"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/setup-fill2.png",
active_icon:"https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/setup-fill.png",
color:"#CCCED5",
active_color:"#446dfc",
text:"设置",
}]
};
},
mounted() {
console.log("B join...");
this.flagTypeInfo = this.$uiConfig.is_bang;
let tempSystem = uni.getSystemInfoSync();
this.platforms = tempSystem.platform;
this.$nextTick(() => {
// #ifdef APP-NVUE || APP-PLUS || APP-PLUS-NVUE ||APP-VUE
if (this.platforms == "android") {
let temp = this.$refs.leftWidth;
this.leftWidth = tempSystem.screenWidth / 2;
}
// #endif
});
this.activeHandler();
},
// activated(){
// if(uni.getStorageSync("navs")){
// this.navs = uni.getStorageSync("navs")??[];
// }else{
// setTimeout(()=>{
// this.navs = uni.getStorageSync("navs")??[];
// this.activeHandler();
// },3000)
// }
// this.activeHandler();
// },
methods: {
activeHandler() {
let t = getCurrentPages();
let query = t[t.length - 1].__displayReporter.query;
let queryString = "";
for (var k in query) {
queryString += `&${k}=${query[k]}`;
}
if (queryString != "") {
queryString = "?" + queryString.substring(1, queryString.length);
}
this.crtPath = "/" + t[t.length - 1].route + queryString;
console.log(23,this.crtPath);
this.navs.forEach((x, i) => {
if (x.url == this.crtPath) {
this.active = i;
}
});
},
goUrl(url) {
if (this.crtPath != url) {
uni.redirectTo({
url: url,
});
} else {
uni.reLaunch({
url: url,
});
}
},
},
};
</script>
pages/MallMange/goods.vue 0 → 100644
View file @ a7bbc37c
<template>
<view class="goodsPage">
<view class="searchBox flex-between">
<input type="text" class="input" placeholder="请输入商品名称搜索" />
<view class="addBox">
<u-icon name="add-o" style="margin-right: 10rpx"></u-icon>
添加商品
</view>
</view>
<view class="tabbox">
<u-tabs
:list="list"
:is-scroll="false"
:current="current"
@change="change"
></u-tabs>
</view>
<tabbar></tabbar>
</view>
</template>
<script>
import tabbar from "./components/tabbar.vue";
export default {
components: {
tabbar,
},
data() {
return {
list: [
{
name: "出售中",
},
{
name: "下架中",
count: 5,
},
],
current: 0,
};
},
methods: {
change(index) {
this.current = index;
},
},
onLoad() {
uni.setNavigationBarTitle({
title: "商品管理",
});
},
};
</script>
<style lang="scss" scoped>
.goodsPage {
min-height: 100vh;
background-color: #f7f7f7;
box-sizing: border-box;
padding-bottom: 100rpx;
}
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
}
.searchBox {
width: 100%;
height: 80rpx;
padding: 0 40rpx;
.input {
width: 420rpx;
height: 60rpx;
border-radius: 30rpx;
background-color: #fff;
padding: 0 20rpx;
font-size: 26rpx;
}
.addBox {
width: 180rpx;
height: 58rpx;
border-radius: 29rpx;
background-color: #fff;
border: 2rpx solid #446dfc;
color: #446dfc;
display: flex;
justify-content: center;
align-items: center;
font-size: 24rpx;
}
}
.tabbox {
height: 100rpx;
}
</style>
\ No newline at end of file
pages/MallMange/index.vue
View file @ a7bbc37c
<template>
<view class="indexpage">
<view class="topBox">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/bg.png" mode="widthFix"
class="bg" />
<view class="topinfo">
<view class="flex-center">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png"
class="headimg" />
<view class="name1">饭粒汪</view>
</view>
<view style="display:flex;flex-wrap:wrap;justify-content:center;width:100rpx">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/qr_code.png"
class="ewmimg" mode="aspectFill" />
<view class="name2">收款码</view>
</view>
</view>
<view class="msgBox flex-center">
<view class="itemBox">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/order.png"
mode="" class="imgicon" />
<view class="iconname">订单消息</view>
<view class="tipNum">1</view>
</view>
<view class="itemBox">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/msg.png" mode=""
class="imgicon" />
<view class="iconname">审核消息</view>
</view>
<view class="itemBox">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png"
mode="" class="imgicon" />
<view class="iconname">提现申请</view>
</view>
<view class="itemBox">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/comment.png"
mode="" class="imgicon" />
<view class="iconname">评论管理</view>
</view>
<view class="itemBox">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/user.png"
mode="" class="imgicon" />
<view class="iconname">用户管理</view>
</view>
</view>
</view>
<view class="conditionOfBusiness">
<view class="title">经营状况</view>
<view class="day flex-center">
<view class="dayitem choose">今日</view>
<view class="dayitem">昨日</view>
<view class="dayitem choose">7日</view>
<view class="dayitem">30日</view>
</view>
<view class="BusinessData">
<view class="dataitem">
<view class="dataNum">0</view>
<view class="dataName">支付订单数</view>
</view>
<view class="dataitem">
<view class="dataNum">0.00</view>
<view class="dataName">支付金额(元)</view>
</view>
<view class="dataitem">
<view class="dataNum">2</view>
<view class="dataName">访客数</view>
</view>
<view class="dataitem">
<view class="dataNum">116</view>
<view class="dataName">访问量</view>
</view>
</view>
</view>
<view class="fastHandle">
<view class="title">快速处理</view>
<view class="flex-center HandleBox">
<view class="handleItem">
<view class="handleItemNum">0</view>
<view class="handleItemName">待发货订单</view>
<view class="handleItemBtn">立即发货 <u-icon name="arrow"></u-icon>
</view>
</view>
<view class="handleItem">
<view class="handleItemNum">0</view>
<view class="handleItemName">维权订单</view>
<view class="handleItemBtn">立即处理 <u-icon name="arrow"></u-icon>
</view>
</view>
</view>
</view>
<view class="echartsBox">
<view class="title flex-center">
<picker @change="bindPickerChange" :value="key" :range="array" range-key="name">
<view class="payType">{{ payType }}
<u-icon name="arrow-down"></u-icon>
</view>
</picker>
<picker @change="bindPickerChange1" :value="key" :range="array1" range-key="name">
<view class="payType">{{ payType1 }}
<u-icon name="arrow-down"></u-icon>
</view>
</picker>
</view>
<view class="day flex-center">
<view class="dayitem choose">今日</view>
<view class="dayitem">昨日</view>
<view class="dayitem choose">7日</view>
<view class="dayitem">30日</view>
</view>
<view style="height:100rpx;"></view>
<canvas canvas-id="canvasColumn" id="canvasColumn" class="charts" disable-scroll="true"
@touchstart="touchColumn" @touchmove="moveColumn" @touchend="touchEndColumn">
</canvas>
</view>
<tabbar></tabbar>
</view>
</template>
<script>
import uCharts from "../school/components/u-charts/u-charts.min.js";
import tabbar from "./components/tabbar.vue"
var canvaColumn = null;
var _self;
export default {
components: {
tabbar
},
data() {
return {
array: [{
name: "支付金额",
key: 1,
},
{
name: "支付订单数",
key: 2,
},
{
name: "支付人数",
key: 3,
},
{
name: "支付件数",
key: 4,
},
],
payType: "",
array1: [{
name: "全部",
key: 1,
},
{
name: "商城",
key: 2,
},
{
name: "拼团",
key: 3,
},
{
name: "积分",
key: 4,
},
],
payType1: "",
};
},
methods: {
bindPickerChange(e) {
this.payType = this.array[e.detail.value].name;
},
bindPickerChange1(e) {
this.payType1 = this.array1[e.detail.value].name;
},
showColumn(canvasId, chartData) {
canvaColumn = new uCharts({
$this: _self,
canvasId: canvasId,
type: "column",
fontSize: 11,
padding: [5, 15, 15, 15],
legend: {
show: true,
position: "top",
float: "center",
itemGap: 30,
padding: 5,
margin: 5,
//backgroundColor:'rgba(41,198,90,0.2)',
//borderColor :'rgba(41,198,90,0.5)',
borderWidth: 1,
},
dataLabel: true,
dataPointShape: true,
background: "#FFFFFF",
pixelRatio: _self.pixelRatio,
categories: chartData.categories,
series: chartData.series,
animation: true,
enableScroll: true,
xAxis: {
disableGrid: false,
type: "grid",
gridType: "dash",
itemCount: 4,
scrollShow: true,
scrollAlign: "right",
},
yAxis: {
//disabled:true
gridType: "dash",
splitNumber: 4,
min: 10,
max: 180,
format: (val) => {
return val.toFixed(0) + "元";
}, //如不写此方法，Y轴刻度默认保留两位小数
},
width: _self.cWidth * _self.pixelRatio,
height: _self.cHeight * _self.pixelRatio,
extra: {
column: {
type: "group",
width: (_self.cWidth * _self.pixelRatio * 0.45) /
chartData.categories.length,
},
},
});
},
touchColumn(e) {
canvaColumn.scrollStart(e);
},
moveColumn(e) {
canvaColumn.scroll(e);
},
touchEndColumn(e) {
canvaColumn.scrollEnd(e);
canvaColumn.touchLegend(e, {
animation: true,
});
canvaColumn.showToolTip(e, {
format: function(item, category) {
return category + " " + item.name + ":" + item.data + "元";
},
});
},
},
onLoad() {
this.payType = this.array[0].name;
this.payType1 = this.array1[0].name;
uni.setNavigationBarTitle({
title: "商城管理",
});
},
};
</script>
<style>
<style lang="scss" scoped>
.indexpage {
min-height: 100vh;
background-color: #f7f7f7;
box-sizing: border-box;
padding-bottom: 100rpx;
}
.flex-center {
display: flex;
justify-content: space-between;
align-items: center;
}
.topBox {
height: 350rpx;
position: relative;
margin-bottom: 20rpx;
}
.bg {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
.topinfo {
height: 130rpx;
box-sizing: border-box;
padding: 0 50rpx 0 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
.headimg {
width: 70rpx;
height: 70rpx;
border-radius: 50%;
}
.name1 {
margin-left: 24rpx;
font-size: 40rpx;
color: #fff;
}
.ewmimg {
width: 50rpx;
height: 50rpx;
}
.name2 {
font-size: 24rpx;
color: #fff;
}
.msgBox {
box-sizing: border-box;
width: 700rpx;
height: 200rpx;
border-radius: 12rpx;
background-color: #fff;
z-index: 5;
position: absolute;
top: 130rpx;
left: 50%;
transform: translateX(-50%);
z-index: 1;
padding: 0 30rpx;
.itemBox {
width: 100rpx;
display: flex;
flex-wrap: wrap;
justify-content: center;
position: relative;
.imgicon {
width: 90rpx;
height: 90rpx;
border-radius: 50%;
margin-bottom: 20rpx;
}
.tipNum {
position: absolute;
top: 0;
right: 0;
z-index: 2;
width: 30rpx;
height: 30rpx;
border-radius: 50%;
background-color: #f00;
text-align: center;
line-height: 28rpx;
color: #fff;
font-size: 20rpx;
}
.iconname {
font-size: 24rpx;
}
}
}
.conditionOfBusiness,
.echartsBox {
height: 480rpx;
width: 700rpx;
margin: 0 auto;
border-radius: 12rpx;
background-color: #fff;
box-sizing: border-box;
padding: 30rpx 50rpx;
margin-bottom: 40rpx;
.day {
width: 590rpx;
height: 50rpx;
border-radius: 25rpx;
border: 2rpx solid #667cb8;
overflow: hidden;
.dayitem {
width: 150rpx;
height: 100%;
font-size: 24rpx;
text-align: center;
line-height: 48rpx;
}
}
.choose {
background-color: #446dfc;
}
.BusinessData {
width: 590rpx;
height: 280rpx;
display: flex;
flex-wrap: wrap;
.dataitem {
width: 50%;
height: 50%;
padding-top: 50rpx;
padding-left: 30rpx;
.dataNum {
font-size: 40rpx;
color: #446dfc;
margin-bottom: 2rpx;
}
.dataName {
font-size: 24rpx;
}
}
}
}
.title {
font-size: 30rpx;
margin-bottom: 30rpx;
}
.fastHandle {
width: 700rpx;
// height: 300rpx;
margin: 0 auto;
margin-bottom: 40rpx;
border-radius: 12rpx;
background-color: #fff;
padding: 40rpx;
.HandleBox {
.handleItem {
width: 300rpx;
height: 180rpx;
border-radius: 12rpx;
box-shadow: 0rpx 0rpx 10rpx 0px rgba(36, 36, 36, 0.2);
padding: 10rpx 20rpx;
.handleItemNum {
font-size: 40rpx;
margin-bottom: 10rpx;
}
.handleItemName {
font-size: 26rpx;
margin-bottom: 15rpx;
color: #9b9b9b;
}
.handleItemBtn {
font-size: 26rpx;
color: #9b9b9b;
display: flex;
align-items: center;
}
}
}
}
.echartsBox {
width: 700rpx;
height: auto;
margin: 0 auto;
margin-bottom: 40rpx;
.payType {
display: flex;
font-size: 30rpx;
}
}
</style>
pages/MallMange/order.vue 0 → 100644
View file @ a7bbc37c
<template>
<view class="orderpage">
<view class="typebox flex-center">
<view class="typeItem flex-center">
<view class="typeItem1 flex-center activeType">普通订单</view>
<view class="typeItem1 flex-center">维权订单</view>
</view>
</view>
<view class="searchBox flex-between">
<view class="search flex-center">
<!-- <input type="text"> -->
<u-icon name="search"></u-icon>
<view>搜索</view>
</view>
<view class="flex-center" @click="showModel = true">
{{ timeStr }} <u-icon name="arrow-down"></u-icon
></view>
<u-modal
v-model="showModel"
@confirm="confirm"
:show-cancel-button="true"
title="筛选时间"
contentSlot
width="85%"
>
<view class="contentSlot">
<view class="flex-wrap">
<view
v-for="(item, index) in timeArr"
:key="index"
class="timeItem flex-center"
:class="index === curIndex ? 'timeItemActive' : ''"
@click="changeTime(item, index)"
>
{{ item.name }}
</view>
</view>
<view v-if="curIndex == 4">
<view class="timeTitle">开始时间</view>
<view class="time-picker">
<picker-view
:value="value"
@change="bindChange"
class="picker-view"
:indicator-style="indicatorStyle"
:indicator-class="activeClass"
>
<picker-view-column>
<view
class="picker-item flex-center"
v-for="(item, index) in years"
:key="index"
>{{ item }}</view
>
</picker-view-column>
<view style="line-height: 180rpx">年</view>
<picker-view-column>
<view
class="picker-item flex-center"
v-for="(item, index) in months"
:key="index"
>{{ item }}</view
>
</picker-view-column>
<view style="line-height: 180rpx">月</view>
<picker-view-column>
<view
class="picker-item flex-center"
v-for="(item, index) in days"
:key="index"
>{{ item }}</view
>
</picker-view-column>
<view style="line-height: 180rpx">日</view>
</picker-view>
</view>
<view class="timeTitle">结束时间</view>
<view class="time-picker">
<picker-view
:value="value"
@change="bindChange"
class="picker-view"
indicator-style="height: 60rpx"
indicator-class="activeClass"
>
<picker-view-column>
<view
class="picker-item flex-center"
v-for="(item, index) in years"
:key="index"
>{{ item }}</view
>
</picker-view-column>
<view style="line-height: 180rpx">年</view>
<picker-view-column>
<view
class="picker-item flex-center"
v-for="(item, index) in months"
:key="index"
>{{ item }}</view
>
</picker-view-column>
<view style="line-height: 180rpx">月</view>
<picker-view-column>
<view
class="picker-item flex-center"
v-for="(item, index) in days"
:key="index"
>{{ item }}</view
>
</picker-view-column>
<view style="line-height: 180rpx">日</view>
</picker-view>
</view>
</view>
</view>
</u-modal>
</view>
<view class="tabbox">
<u-tabs
:list="list"
:is-scroll="false"
:current="currentTab"
@change="changeTab"
></u-tabs>
</view>
<view
style="
height: calc(100vh - 50px);
width: calc(100vw);
overflow: hidden;
padding-bottom: 20px;
"
>
<scroll-view
:scroll-y="true"
:enable-back-to-top="true"
:enable-flex="true"
@scrolltolower="lower"
:style="{ height: '100%' }"
>
<orderItem />
</scroll-view>
</view>
<tabbar></tabbar>
</view>
</template>
<script>
import tabbar from "./components/tabbar.vue";
import orderItem from "./components/orderItem.vue";
export default {
components: {
tabbar,
orderItem,
},
data() {
const date = new Date();
const years = [];
const year = date.getFullYear();
const months = [];
const month = date.getMonth() + 1;
const days = [];
const day = date.getDate();
for (let i = year - 4; i <= date.getFullYear(); i++) {
years.push(i);
}
for (let i = 1; i <= 12; i++) {
months.push(i);
}
for (let i = 1; i <= 31; i++) {
days.push(i);
}
return {
showModel: false,
timeStr: "",
curIndex: 0,
timeArr: [
{
name: "汇总",
key: 1,
},
{
name: "今日",
key: 2,
},
{
name: "昨日",
key: 3,
},
{
name: "7日",
key: 4,
},
{
name: "自定义",
key: 5,
},
],
years,
year,
months,
month,
days,
day,
value: [9999, month - 1, day - 1],
list: [
{
name: "全部",
},
{
name: "待收货",
},
{
name: "待付款",
},
{
name: "待评价",
count: 5,
},
],
currentTab: 0,
msg: {
pageIndex: 1,
pageSize: 15,
OrderId: 0,
OrderType: 0,
DeliveryMethod: 0,
StartTime: "",
EndTime: "",
OrderStatus: 0,
OrderNo: "",
},
};
},
methods: {
confirm() {
console.log(1);
},
changeTime(e, i) {
this.curIndex = i;
this.timeStr = e.name;
},
bindChange(e) {
const val = e.detail.value;
this.year = this.years[val[0]];
this.month = this.months[val[1]];
this.day = this.days[val[2]];
this.value = val;
},
changeTab(index) {
this.currentTab = index;
},
lower(e) {
if (this.msg.pageIndex < this.page_count) {
this.msg.pageIndex++;
this.status = "loading";
this.init();
} else {
this.status = "nomore";
}
},
},
onLoad() {
this.timeStr = this.timeArr[0].name;
uni.setNavigationBarTitle({
title: "订单管理",
});
},
};
</script>
<style lang="scss" scoped>
.orderpage {
min-height: 100vh;
background-color: #f7f7f7;
box-sizing: border-box;
padding-bottom: 100rpx;
/deep/.u-model {
border-radius: 20rpx;
}
}
.typebox {
width: 100%;
height: 100rpx;
background-color: #fff;
.typeItem {
width: 320rpx;
height: 58rpx;
color: #ccced5;
border-radius: 30rpx;
border: 2rpx solid #446dfc;
font-size: 26rpx;
overflow: hidden;
.typeItem1 {
width: 50%;
height: 100%;
}
.activeType {
color: #fff;
background-color: #446dfc;
}
}
}
.flex-center {
display: flex;
justify-content: center;
align-items: center;
}
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
}
.flex-wrap {
display: flex;
flex-wrap: wrap;
}
.searchBox {
height: 90rpx;
background-color: #efeff4;
padding: 0 40rpx 0 20rpx;
.search {
width: 520rpx;
height: 50rpx;
background-color: #fff;
border-radius: 25rpx;
}
}
.contentSlot {
background-color: #fff;
box-sizing: border-box;
padding: 40rpx;
border-radius: 20rpx;
.timeItem {
width: 160rpx;
height: 70rpx;
font-size: 30rpx;
border-radius: 35rpx;
border: 2rpx solid #e5e5e5;
margin-right: 20rpx;
margin-bottom: 10rpx;
}
& .timeItem:nth-child(3n) {
margin-right: 0rpx;
}
.timeItemActive {
color: #446dfc;
border-color: #446dfc;
}
.timeTitle {
margin: 20rpx 0;
font-size: 30rpx;
}
}
.picker-view {
width: 100%;
height: 180rpx;
margin-top: 20rpx;
.picker-item {
height: 100rpx;
}
}
/deep/ .activeClass {
color: #446dfc !important;
}
.tabbox {
margin-bottom: 10rpx;
}
</style>
\ No newline at end of file
pages/MallMange/set.vue 0 → 100644
View file @ a7bbc37c
<template>
<view>
<tabbar></tabbar>
</view>
</template>
<script>
import tabbar from "./components/tabbar.vue";
export default {
components:{
tabbar
},
}
</script>
<style lang="scss">
.flex-center{
display: flex;
justify-content: center;
align-items: center;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment