Skip to content

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

1

parent 721e47e5
Hide whitespace changes
Inline Side-by-side
Showing with 1042 additions and 528 deletions
pages/MallMange/index.vue
View file @ e1398836
<template> <template>
<view class="indexpage"> <view class="indexpage">
<view class="topBox"> <view class="topBox">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/bg.png" mode="widthFix" class="bg" /> <image
<view class="topinfo"> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/bg.png"
<view class="flex-center"> mode="widthFix"
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png" class="headimg" /> class="bg"
<view class="name1">饭粒汪</view> />
</view> <view class="topinfo">
<view style=" <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; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
width: 100rpx; width: 100rpx;
"> "
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/qr_code.png" class="ewmimg" >
mode="aspectFill" /> <image
<view class="name2">收款码</view> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/qr_code.png"
</view> class="ewmimg"
</view> mode="aspectFill"
<view class="msgBox flex-center"> />
<view class="itemBox"> <view class="name2">收款码</view>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/order.png" mode="" class="imgicon" /> </view>
<view class="iconname">订单消息</view> </view>
<view class="tipNum">1</view> <view class="msgBox flex-center">
</view> <view class="itemBox">
<view class="itemBox"> <image
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/msg.png" mode="" class="imgicon" /> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/order.png"
<view class="iconname">审核消息</view> mode=""
</view> class="imgicon"
<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 class="iconname">提现申请</view> <view class="tipNum">1</view>
</view> </view>
<view class="itemBox"> <view class="itemBox">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/comment.png" mode="" class="imgicon" /> <image
<view class="iconname">评论管理</view> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/msg.png"
</view> mode=""
<view class="itemBox"> class="imgicon"
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/user.png" mode="" class="imgicon" /> />
<view class="iconname">用户管理</view> <view class="iconname">审核消息</view>
</view> </view>
</view> <view class="itemBox">
</view> <image
<view class="conditionOfBusiness"> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png"
<view class="title">经营状况</view> mode=""
<view class="day flex-center"> class="imgicon"
<!-- <view class="dayitem choose">今日</view> />
<view class="dayitem">昨日</view> --> <view class="iconname">提现申请</view>
<view class="dayitem" @click="handleClickDate('first')" :class="{ choose: clickDate == 'first' }">7日</view> </view>
<view class="dayitem" @click="handleClickDate('second')" :class="{ choose: clickDate == 'second' }">30日</view> <view class="itemBox">
</view> <image
<view class="BusinessData"> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/comment.png"
<view class="dataitem"> mode=""
<view class="dataNum">0</view> class="imgicon"
<view class="dataName">支付订单数</view> />
</view> <view class="iconname">评论管理</view>
<view class="dataitem"> </view>
<view class="dataNum">0.00</view> <view class="itemBox">
<view class="dataName">支付金额(元)</view> <image
</view> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/user.png"
<view class="dataitem"> mode=""
<view class="dataNum">2</view> class="imgicon"
<view class="dataName">访客数</view> />
</view> <view class="iconname">用户管理</view>
<view class="dataitem"> </view>
<view class="dataNum">116</view> </view>
<view class="dataName">访问量</view> </view>
</view> <view class="conditionOfBusiness">
</view> <view class="title">经营状况</view>
</view> <view class="day flex-center">
<view class="fastHandle"> <view
<view class="title">快速处理</view> class="dayitem"
<view class="flex-center HandleBox"> @click="handleClickDate('today')"
<view class="handleItem"> :class="{ choose: clickDate == 'today' }"
<view class="handleItemNum">0</view> >今日</view
<view class="handleItemName">待发货订单</view> >
<view class="handleItemBtn">立即发货 <u-icon name="arrow"></u-icon> <view
</view> class="dayitem"
</view> @click="handleClickDate('yesterday')"
<view class="handleItem"> :class="{ choose: clickDate == 'yesterday' }"
<view class="handleItemNum">0</view> >昨日</view
<view class="handleItemName">维权订单</view> >
<view class="handleItemBtn">立即处理 <u-icon name="arrow"></u-icon> <view
</view> class="dayitem"
</view> @click="handleClickDate('first')"
</view> :class="{ choose: clickDate == 'first' }"
</view> >7日</view
<view class="echartsBox"> >
<view class="title flex-center"> <view
<picker @change="bindPickerChange" :value="key" :range="array" range-key="name"> class="dayitem"
<view class="payType">{{ payType }} @click="handleClickDate('second')"
<u-icon name="arrow-down"></u-icon> :class="{ choose: clickDate == 'second' }"
</view> >30日</view
</picker> >
<picker @change="bindPickerChange1" :value="key" :range="array1" range-key="name"> </view>
<view class="payType">{{ payType1 }} <view class="BusinessData">
<u-icon name="arrow-down"></u-icon> <view class="dataitem">
</view> <view class="dataNum">{{ salesData.OrderCount || 0 }}</view>
</picker> <view class="dataName">支付订单数</view>
</view> </view>
<view class="day flex-center"> <view class="dataitem">
<!-- <view class="dayitem choose">今日</view> <view class="dataNum">{{ salesData.Income || 0 }}</view>
<view class="dayitem">昨日</view> --> <view class="dataName">支付金额(元)</view>
<view class="dayitem" @click="handleClickDate('first')" :class="{ choose: clickDate == 'first' }">7日</view> </view>
<view class="dayitem" @click="handleClickDate('second')" :class="{ choose: clickDate == 'second' }">30日</view> <view class="dataitem">
</view> <view class="dataNum">{{ salesData.UserCount || 0 }}</view>
<view style="height: 100rpx"></view> <view class="dataName">支付人数</view>
<canvas canvas-id="canvasColumn" id="canvasColumn" class="charts" disable-scroll="true" @touchstart="touchColumn" </view>
@touchmove="moveColumn" @touchend="touchEndColumn"> <view class="dataitem">
</canvas> <view class="dataNum">{{ salesData.GoodCount || 0 }}</view>
</view> <view class="dataName">支付件数</view>
<tabbar></tabbar> </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"
@click="handleClickDate('today')"
:class="{ choose: clickDate == 'today' }"
>今日</view
>
<view
class="dayitem"
@click="handleClickDate('yesterday')"
:class="{ choose: clickDate == 'yesterday' }"
>昨日</view
>
<view
class="dayitem"
@click="handleClickDate('first')"
:class="{ choose: clickDate == 'first' }"
>7日</view
>
<view
class="dayitem"
@click="handleClickDate('second')"
:class="{ choose: clickDate == 'second' }"
>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> </template>
<script> <script>
import uCharts from "../school/components/u-charts/u-charts.min.js"; import uCharts from "../school/components/u-charts/u-charts.min.js";
import tabbar from "./components/tabbar.vue"; import tabbar from "./components/tabbar.vue";
var canvaColumn = null; let canvaColumn = null;
var _self; let _self;
export default { export default {
components: { components: {
tabbar, tabbar,
}, },
data() { data() {
return { return {
array: [{ array: [
name: "支付金额", {
key: 1, name: "支付金额",
}, key: 1,
{ },
name: "支付订单数", {
key: 2, name: "支付订单数",
}, key: 2,
{ },
name: "支付人数", {
key: 3, name: "支付人数",
}, key: 3,
{ },
name: "支付件数", {
key: 4, name: "支付件数",
}, key: 4,
], },
payType: "", ],
array1: [{ payType: "",
name: "全部", array1: [
key: 1, {
}, name: "全部",
{ key: 1,
name: "商城", },
key: 2, {
}, name: "商城",
{ key: 2,
name: "拼团", },
key: 3, {
}, name: "拼团",
{ key: 3,
name: "积分", },
key: 4, {
}, name: "积分",
], key: 4,
payType1: "", },
//加载 ],
loading: false, payType1: "",
clickDate: "first", //加载
dateStr: [], //日期 loading: false,
//查询数据 clickDate: "today",
basicQMsg: { dateStr: [], //日期
Source: 0, //来源 //查询数据
StartDate: "", //开始时间 basicQMsg: {
EndDate: "", //结束时间 Source: 0, //来源
SalesTimeType: 0, //默认今日 StartDate: "", //开始时间
OrderBy: "", EndDate: "", //结束时间
UserType: -1, //0-普通用户,1-领队导游 SalesTimeType: 0, //默认今日
}, OrderBy: "",
basicData: {}, //基础数据 UserType: -1, //0-普通用户,1-领队导游
salesData: {}, //销售数据 },
}; basicData: {}, //基础数据
}, salesData: {}, //销售数据
methods: { cWidth: "",
bindPickerChange(e) { cHeight: "",
this.payType = this.array[e.detail.value].name; pixelRatio: 1,
}, };
bindPickerChange1(e) { },
this.payType1 = this.array1[e.detail.value].name; methods: {
}, bindPickerChange(e) {
showColumn(canvasId, chartData) { this.payType = this.array[e.detail.value].name;
canvaColumn = new uCharts({ },
$this: _self, bindPickerChange1(e) {
canvasId: canvasId, this.payType1 = this.array1[e.detail.value].name;
type: "column", },
fontSize: 11, showColumn(canvasId, chartData) {
padding: [5, 15, 15, 15], canvaColumn = new uCharts({
legend: { $this: _self,
show: true, canvasId: canvasId,
position: "top", type: "line",
float: "center", fontSize: 11,
itemGap: 30, padding: [5, 15, 15, 15],
padding: 5, legend: {
margin: 5, show: true,
//backgroundColor:'rgba(41,198,90,0.2)', position: "top",
//borderColor :'rgba(41,198,90,0.5)', float: "center",
borderWidth: 1, itemGap: 30,
}, borderWidth: 1,
dataLabel: true, },
dataPointShape: true, dataLabel: true,
background: "#FFFFFF", dataPointShape: true,
pixelRatio: _self.pixelRatio, background: "#FFFFFF",
categories: chartData.categories, pixelRatio: _self.pixelRatio,
series: chartData.series, categories: chartData.categories,
animation: true, series: chartData.series,
enableScroll: true, animation: true,
xAxis: { enableScroll: true,
disableGrid: false, xAxis: {
type: "grid", rotateLabel: true,
gridType: "dash", disableGrid: false,
itemCount: 4, type: "grid",
scrollShow: true, gridType: "dash",
scrollAlign: "right", itemCount: 24,
}, scrollShow: true,
yAxis: { scrollAlign: "right",
//disabled:true dashLength: 8,
gridType: "dash", },
splitNumber: 4, yAxis: {
min: 10, gridType: "dash",
max: 180, splitNumber: 5,
format: (val) => { min: 0,
return val.toFixed(0) + "元"; max: 180,
}, //如不写此方法，Y轴刻度默认保留两位小数 format: (val) => {
}, return val.toFixed(0.1);
width: _self.cWidth * _self.pixelRatio, }, //如不写此方法，Y轴刻度默认保留两位小数
height: _self.cHeight * _self.pixelRatio, },
extra: { width: _self.cWidth * _self.pixelRatio,
column: { height: _self.cHeight * _self.pixelRatio,
type: "group", extra: {
width: (_self.cWidth * _self.pixelRatio * 0.45) / column: {
chartData.categories.length, type: "group",
}, width:
}, (_self.cWidth * _self.pixelRatio * 0.45) /
}); chartData.categories.length,
}, },
touchColumn(e) { },
canvaColumn.scrollStart(e); });
}, },
moveColumn(e) { touchColumn(e) {
canvaColumn.scroll(e); canvaColumn.scrollStart(e);
}, },
touchEndColumn(e) { moveColumn(e) {
canvaColumn.scrollEnd(e); canvaColumn.scroll(e);
canvaColumn.touchLegend(e, { },
animation: true, touchEndColumn(e) {
}); canvaColumn.scrollEnd(e);
canvaColumn.showToolTip(e, { canvaColumn.touchLegend(e, {
format: function(item, category) { animation: true,
return category + " " + item.name + ":" + item.data + "元"; });
}, canvaColumn.showToolTip(e, {
}); format: function (item, category) {
}, return category + " " + item.name + ":" + item.data + "元";
//基础数据日期切换 },
handleClickDate(name) { });
this.clickDate = name; },
this.dateStr = []; //日期切换
//7日 handleClickDate(name) {
if (name == "first") { this.clickDate = name;
this.dateStr.push(this.$utils.AddDay("", -7)); this.dateStr = [];
} if (name == "today") {
//30日 this.basicQMsg.SalesTimeType = 0;
else if (name == "second") { } else if (name == "yesterday") {
this.dateStr.push(this.$utils.AddDay("", -30)); this.basicQMsg.SalesTimeType = 1;
} }
this.dateStr.push(this.$utils.AddDay("", -0)); //7日
this.getBasicData(); if (name == "first") {
}, this.dateStr.push(this.$utils.AddDay("", -7));
//获取基础数据 this.basicQMsg.SalesTimeType = 7;
getBasicData() { }
this.loading = true; //30日
console.log("adsfasdasf") else if (name == "second") {
if (this.dateStr && this.dateStr.length > 0) { this.dateStr.push(this.$utils.AddDay("", -30));
this.basicQMsg.StartDate = this.dateStr[0]; }
this.basicQMsg.EndDate = this.dateStr[1]; this.getBasicData();
} else { },
this.basicQMsg.StartDate = ""; //获取基础数据
this.basicQMsg.EndDate = ""; getBasicData() {
} this.loading = true;
this.requestAdmin("/api/Tenant/MallIndexStatistics", this.basicQMsg, (res) => { if (this.dateStr && this.dateStr.length > 0) {
console.log("11111") this.basicQMsg.StartDate = this.dateStr[0];
//this.loading = false; this.basicQMsg.EndDate = this.dateStr[1];
if (res.data.resultCode == 1) { } else {
//基础数据统计 this.basicQMsg.StartDate = "";
this.basicData = res.data.data.basicData; this.basicQMsg.EndDate = "";
//销售情况统计 }
this.salesData = res.data.data.salesData; this.requestAdmin(
// //商品购买力TOP排行 "/api/Tenant/MallIndexStatistics",
// var saleGoodsArray = res.data.data.saleIncomeData; this.basicQMsg,
// if (saleGoodsArray) { (res) => {
// if (saleGoodsArray.length <= 2) { console.log("11111", res);
// this.saleIncomeData = saleGoodsArray; this.loading = false;
// } else { if (res.resultCode == 1) {
// this.saleIncomeData = saleGoodsArray.slice(0, 15); //基础数据统计
// } this.basicData = res.data.basicData;
// } console.log("基础数据统计", this.basicData);
// //用户购买力TOP排行 //销售情况统计
// var saleUserArray = res.data.data.saleUserData; this.salesData = res.data.salesData;
// if (saleUserArray) { console.log("销售情况统计", this.salesData);
// if (saleUserArray.length <= 2) { let xData = []; //x轴数据
// this.saleUserData = saleUserArray; let xDataList = [];
// } else { let orderArray = []; //订单数量
// this.saleUserData = saleUserArray.slice(0, 15); let orderIncome = []; //支付金额
// } let userArray = []; //支付人数
// } let goodArray = []; //商品件数
// this.initMap(); this.salesData.subList.forEach((item) => {
} else { if (this.activeSell == "today") {
// this.Info(res.data.message); xData.push(nowDay + " " + item.TimeStr + "时");
} }
}); if (this.activeSell == "first") {
}, xData.push(yesDay + " " + item.TimeStr + "时");
}, }
onLoad() { xDataList.push(item.TimeStr);
this.payType = this.array[0].name; orderArray.push(item.OrderCount);
this.payType1 = this.array1[0].name; orderIncome.push(item.Income);
uni.setNavigationBarTitle({ userArray.push(item.UserCount);
title: "商城管理", goodArray.push(item.GoodCount);
}); });
this.getBasicData() console.log(418,xData)
}, let chartsData = {
}; categories: [],
series: [{ data: xData, name: "销售情况", textColor: "#FFF" }],
};
this.showColumn("canvasColumn", chartsData);
}
}
);
},
},
onLoad() {
_self = this;
this.cWidth = uni.upx2px(600);
this.cHeight = uni.upx2px(400);
this.payType = this.array[0].name;
this.payType1 = this.array1[0].name;
uni.setNavigationBarTitle({
title: "商城管理",
});
this.getBasicData();
},
};
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.indexpage { .indexpage {
min-height: 100vh; min-height: 100vh;
background-color: #f7f7f7; background-color: #f7f7f7;
box-sizing: border-box; box-sizing: border-box;
padding-bottom: 100rpx; padding-bottom: 100rpx;
} }
.flex-center { .flex-center {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.topBox { .topBox {
height: 350rpx; height: 350rpx;
position: relative; position: relative;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.bg { .bg {
width: 100%; width: 100%;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 0; z-index: 0;
} }
.topinfo { .topinfo {
height: 130rpx; height: 130rpx;
box-sizing: border-box; box-sizing: border-box;
padding: 0 50rpx 0 20rpx; padding: 0 50rpx 0 20rpx;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
width: 100%; width: 100%;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 1; z-index: 1;
} }
.headimg { .headimg {
width: 70rpx; width: 70rpx;
height: 70rpx; height: 70rpx;
border-radius: 50%; border-radius: 50%;
} }
.name1 { .name1 {
margin-left: 24rpx; margin-left: 24rpx;
font-size: 40rpx; font-size: 40rpx;
color: #fff; color: #fff;
} }
.ewmimg { .ewmimg {
width: 50rpx; width: 50rpx;
height: 50rpx; height: 50rpx;
} }
.name2 { .name2 {
font-size: 24rpx; font-size: 24rpx;
color: #fff; color: #fff;
} }
.msgBox { .msgBox {
box-sizing: border-box; box-sizing: border-box;
width: 700rpx; width: 700rpx;
height: 200rpx; height: 200rpx;
border-radius: 12rpx; border-radius: 12rpx;
background-color: #fff; background-color: #fff;
z-index: 5; z-index: 5;
position: absolute; position: absolute;
top: 130rpx; top: 130rpx;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
z-index: 1; z-index: 1;
padding: 0 30rpx; padding: 0 30rpx;
.itemBox { .itemBox {
width: 100rpx; width: 100rpx;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
position: relative; position: relative;
.imgicon { .imgicon {
width: 90rpx; width: 90rpx;
height: 90rpx; height: 90rpx;
border-radius: 50%; border-radius: 50%;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.tipNum { .tipNum {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
z-index: 2; z-index: 2;
width: 30rpx; width: 30rpx;
height: 30rpx; height: 30rpx;
border-radius: 50%; border-radius: 50%;
background-color: #f00; background-color: #f00;
text-align: center; text-align: center;
line-height: 28rpx; line-height: 28rpx;
color: #fff; color: #fff;
font-size: 20rpx; font-size: 20rpx;
} }
.iconname { .iconname {
font-size: 24rpx; font-size: 24rpx;
} }
} }
} }
.conditionOfBusiness, .conditionOfBusiness,
.echartsBox { .echartsBox {
height: 480rpx; height: 480rpx;
width: 700rpx; width: 700rpx;
margin: 0 auto; margin: 0 auto;
border-radius: 12rpx; border-radius: 12rpx;
background-color: #fff; background-color: #fff;
box-sizing: border-box; box-sizing: border-box;
padding: 30rpx 50rpx; padding: 30rpx 50rpx;
margin-bottom: 40rpx; margin-bottom: 40rpx;
.day { .day {
width: 300rpx; width: 600rpx;
height: 50rpx; height: 50rpx;
border-radius: 25rpx; border-radius: 25rpx;
border: 2rpx solid #667cb8; border: 2rpx solid #667cb8;
overflow: hidden; overflow: hidden;
margin: 0 auto; margin: 0 auto;
.dayitem { .dayitem {
width: 150rpx; width: 150rpx;
height: 100%; height: 100%;
font-size: 24rpx; font-size: 24rpx;
text-align: center; text-align: center;
line-height: 48rpx; line-height: 48rpx;
} }
} }
.choose { .choose {
background-color: #446dfc; background-color: #446dfc;
} }
.BusinessData { .BusinessData {
width: 590rpx; width: 590rpx;
height: 280rpx; height: 280rpx;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
.dataitem { .dataitem {
width: 50%; width: 50%;
height: 50%; height: 50%;
padding-top: 50rpx; padding-top: 50rpx;
padding-left: 30rpx; padding-left: 30rpx;
.dataNum { .dataNum {
font-size: 40rpx; font-size: 40rpx;
color: #446dfc; color: #446dfc;
margin-bottom: 2rpx; margin-bottom: 2rpx;
} }
.dataName { .dataName {
font-size: 24rpx; font-size: 24rpx;
} }
} }
} }
} }
.title { .title {
font-size: 30rpx; font-size: 30rpx;
margin-bottom: 30rpx; margin-bottom: 30rpx;
} }
.fastHandle { .fastHandle {
width: 700rpx; width: 700rpx;
// height: 300rpx; // height: 300rpx;
margin: 0 auto; margin: 0 auto;
margin-bottom: 40rpx; margin-bottom: 40rpx;
border-radius: 12rpx; border-radius: 12rpx;
background-color: #fff; background-color: #fff;
padding: 40rpx; padding: 40rpx;
.HandleBox { .HandleBox {
.handleItem { .handleItem {
width: 300rpx; width: 300rpx;
height: 180rpx; height: 180rpx;
border-radius: 12rpx; border-radius: 12rpx;
box-shadow: 0rpx 0rpx 10rpx 0px rgba(36, 36, 36, 0.2); box-shadow: 0rpx 0rpx 10rpx 0px rgba(36, 36, 36, 0.2);
padding: 10rpx 20rpx; padding: 10rpx 20rpx;
.handleItemNum { .handleItemNum {
font-size: 40rpx; font-size: 40rpx;
margin-bottom: 10rpx; margin-bottom: 10rpx;
} }
.handleItemName { .handleItemName {
font-size: 26rpx; font-size: 26rpx;
margin-bottom: 15rpx; margin-bottom: 15rpx;
color: #9b9b9b; color: #9b9b9b;
} }
.handleItemBtn { .handleItemBtn {
font-size: 26rpx; font-size: 26rpx;
color: #9b9b9b; color: #9b9b9b;
display: flex; display: flex;
align-items: center; align-items: center;
} }
} }
} }
} }
.echartsBox { .echartsBox {
width: 700rpx; width: 700rpx;
height: auto; height: auto;
margin: 0 auto; margin: 0 auto;
margin-bottom: 40rpx; margin-bottom: 40rpx;
.payType { .payType {
display: flex; display: flex;
font-size: 30rpx; font-size: 30rpx;
} }
} }
.charts {
width: 100%;
height: 400rpx;
background-color: #ff5fff !important;
background-image: url("https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mystudybg.png");
background-repeat: no-repeat;
background-size: cover;
}
</style> </style>
pages/MallMange/order.vue
View file @ e1398836
...@@ -42,7 +42,7 @@ ...@@ -42,7 +42,7 @@
:value="value" :value="value"
@change="bindChange" @change="bindChange"
class="picker-view" class="picker-view"
:indicator-style="indicatorStyle" indicator-style="height: 60rpx"
:indicator-class="activeClass" :indicator-class="activeClass"
> >
<picker-view-column> <picker-view-column>
......
pages/MallMange/set.vue
View file @ e1398836
...@@ -91,15 +91,117 @@ ...@@ -91,15 +91,117 @@
</u-modal> </u-modal>
<view class="boxItem" v-if="businessKey == 2"> <view class="boxItem" v-if="businessKey == 2">
<view class="leftBox"></view> <view class="leftBox"></view>
<view class="rightBox" style="border: none"> <view
class="rightBox"
style="border: none"
@click="jumpPage('/pages/MallMange/timeQuantum')"
>
<view class="name">选择时间段</view> <view class="name">选择时间段</view>
<view class="flex-center"> <view class="flex-center">
<view class="weeek">{{ weekStr }}</view> <view class="weeek">{{ timeArr.join("、") }}</view>
<u-icon name="arrow" style="margin-left: 10rpx"></u-icon <u-icon name="arrow" style="margin-left: 10rpx"></u-icon
></view> ></view>
</view> </view>
</view> </view>
</view> </view>
<view class="boxGroup">
<view class="boxItem">
<view class="leftBox flex-center">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/shortmsg.png"
mode="widthFix"
style="width: 100%"
/>
</view>
<view class="rightBox" style="border: none">
<view class="name">短信通知</view>
<u-switch v-model="msg.business"></u-switch>
</view>
</view>
</view>
<view class="boxGroup">
<view class="boxItem">
<view class="leftBox flex-center">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/shortmsg.png"
mode="widthFix"
style="width: 100%"
/>
</view>
<view class="rightBox" @click="showBox3 = true">
<view class="name">删除未支付订单限时</view>
<view class="flex-center">
{{ msg.delOrderTime }}分
<u-icon name="arrow" style="margin-left: 10rpx"></u-icon
></view>
</view>
</view>
<view class="boxItem">
<view class="leftBox flex-center">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/shortmsg.png"
mode="widthFix"
style="width: 100%"
/>
</view>
<view class="rightBox" @click="showBox4 = true">
<view class="name">自动确认收货时间</view>
<view class="flex-center">
{{msg.incomeDay}}天
<u-icon name="arrow" style="margin-left: 10rpx"></u-icon
></view>
</view>
</view>
<view class="boxItem">
<view class="leftBox flex-center">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/shortmsg.png"
mode="widthFix"
style="width: 100%"
/>
</view>
<view class="rightBox" style="border: none" @click="showBox5 = true">
<view class="name">可申请售后时间</view>
<view class="flex-center">
{{msg.afterSaleDay}}天
<u-icon name="arrow" style="margin-left: 10rpx"></u-icon
></view>
</view>
</view>
<u-modal
v-model="showBox3"
:show-cancel-button="true"
title="删除未支付订单限时"
contentSlot
@confirm="showBox3 = false"
>
<view class="modelBox3 flex-center">
<input type="number" class="input3" v-model="msg.delOrderTime" />分钟
</view>
</u-modal>
<u-modal
v-model="showBox4"
:show-cancel-button="true"
title="自动确认收货时间"
contentSlot
@confirm="showBox4 = false"
>
<view class="modelBox3 flex-center">
<input type="number" class="input3" v-model="msg.incomeDay" />天
</view>
</u-modal>
<u-modal
v-model="showBox5"
:show-cancel-button="true"
title="可申请售后时间"
contentSlot
@confirm="showBox5 = false"
>
<view class="modelBox3 flex-center">
<input type="number" class="input3" v-model="msg.afterSaleDay" />天
</view>
</u-modal>
</view>
<tabbar></tabbar> <tabbar></tabbar>
</view> </view>
</template> </template>
...@@ -114,9 +216,15 @@ export default { ...@@ -114,9 +216,15 @@ export default {
showBox1: false, showBox1: false,
username: "", username: "",
showBox2: false, showBox2: false,
showBox3: false,
showBox4:false,
showBox5:false,
msg: { msg: {
business: false, business: false,
businessTime: 1, businessTime: 1,
delOrderTime: 0,
incomeDay:1,
afterSaleDay:1
}, },
businessTimeList: [ businessTimeList: [
{ {
...@@ -167,6 +275,7 @@ export default { ...@@ -167,6 +275,7 @@ export default {
}, },
], ],
weekStr: "", weekStr: "",
timeArr: [],
}; };
}, },
methods: { methods: {
...@@ -182,11 +291,16 @@ export default { ...@@ -182,11 +291,16 @@ export default {
.map((item) => item.name) .map((item) => item.name)
.join("、"); .join("、");
}, },
jumpPage(url){ jumpPage(url) {
uni.navigateTo({ uni.navigateTo({
url: url, url: url,
}); });
} },
getTimeArr(arr) {
this.timeArr = arr;
this.$forceUpdate();
console.log(193, this.timeArr.join("、"));
},
}, },
onLoad() { onLoad() {
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
...@@ -245,7 +359,7 @@ export default { ...@@ -245,7 +359,7 @@ export default {
.boxGroup { .boxGroup {
width: 700rpx; width: 700rpx;
padding: 0 30rpx; padding: 0 30rpx;
margin: 10rpx auto; margin: 20rpx auto;
background-color: #fff; background-color: #fff;
border-radius: 10rpx; border-radius: 10rpx;
.boxItem { .boxItem {
...@@ -331,4 +445,16 @@ export default { ...@@ -331,4 +445,16 @@ export default {
color: #111; color: #111;
} }
} }
.modelBox3 {
margin: 40rpx auto;
font-size: 26rpx;
.input3 {
width: 280rpx;
height: 80rpx;
border-radius: 10rpx;
background-color: #f7f7f7;
padding: 0 30rpx;
font-size: 26rpx;
}
}
</style> </style>
\ No newline at end of file
pages/MallMange/timeQuantum.vue
View file @ e1398836
<template> <template>
<view class="timepage"> <view class="timepage">
<view class="timeBox">
<view v-for="(item, index) in timeArr" :key="index" class="timeItem">
<u-icon
name="clear"
color="#FF5C5C"
:size="40"
class="left"
@click="delTime(index)"
></u-icon>
<view class="right" @click="handleTime(index)">
<text v-if="item">{{ item }}</text>
<text v-else style="opacity: 0.5">请选择时间段</text>
<u-icon name="arrow" :size="30"></u-icon>
</view>
</view>
</view>
<view class="addBox" v-if="timeArr.length < 3">
<view class="addBtn" @click="addTime">
<u-icon name="add-o" :size="40" style="margin-right: 10rpx"></u-icon>
新增时间段
</view>
</view>
<view class="saveBox">
<view class="saveBtn" @click="save">保存</view>
</view>
<u-modal
v-model="showModel"
@confirm="confirm"
:show-cancel-button="true"
title="筛选时间"
contentSlot
width="85%"
>
<view class="contentSlot">
<view class="timeTitle">开始时间</view>
<view class="time-picker">
<picker-view
:value="valueS"
@change="bindChangeS"
class="picker-view"
indicator-style="height: 60rpx"
:indicator-class="activeClass"
>
<picker-view-column>
<view
class="picker-item flex-center"
v-for="(item, index) in h"
: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 m"
: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 s"
: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="valueE"
@change="bindChangeE"
class="picker-view"
indicator-style="height: 60rpx"
indicator-class="activeClass"
>
<picker-view-column>
<view
class="picker-item flex-center"
v-for="(item, index) in h"
: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 m"
: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 s"
:key="index"
>{{ item }}</view
>
</picker-view-column>
<view style="line-height: 180rpx">秒</view>
</picker-view>
</view>
</view>
</u-modal>
</view> </view>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return {}; let h = []; //时
let m = []; //分
let s = []; //秒
for (let i = 0; i <= 23; i++) {
let n = i;
h.push(n < 10 ? "0" + n : n);
}
for (let i = 0; i <= 59; i++) {
let n = i;
m.push(n < 10 ? "0" + n : n);
s.push(n < 10 ? "0" + n : n);
}
return {
timeArr: [],
h,
m,
s,
showModel: false,
valueS: [0, 0, 0],
valueE: [0, 0, 0],
curIndex: 0,
StartStr: "00:00:00",
EndStr: "00:00:00",
};
},
methods: {
addTime() {
this.timeArr.push("");
},
handleTime(index) {
this.showModel = true;
this.curIndex = index;
},
delTime(index) {
this.timeArr.splice(index, 1);
},
// 开始时间
bindChangeS(e) {
const val = e.detail.value;
let H = this.h[val[0]];
let M = this.m[val[1]];
let S = this.s[val[2]];
this.StartStr = H + ":" + M + ":" + S;
},
// 结束时间
bindChangeE(e) {
const val = e.detail.value;
let H = this.h[val[0]];
let M = this.m[val[1]];
let S = this.s[val[2]];
this.EndStr = H + ":" + M + ":" + S;
},
confirm() {
this.timeArr[this.curIndex] = this.StartStr + "-" + this.EndStr;
console.log(159, this.StartStr, this.EndStr);
},
save() {
let pages = getCurrentPages();
let page = pages[pages.length - 2];
page.$vm.getTimeArr(this.timeArr);
uni.navigateBack({
delta: 1
});
},
}, },
onLoad() { onLoad() {
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
title: "设置时间段", title: "设置时间段",
}); });
let pages = getCurrentPages();
let page = pages[pages.length - 2];
this.timeArr = page.$vm.timeArr;
console.log(41, page.$vm.timeArr);
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.timepage{ .timepage {
min-height: 100vh; min-height: 100vh;
background-color: #f7f7f7; background-color: #f7f7f7;
box-sizing: border-box; box-sizing: border-box;
padding-bottom: var(–safe-area-inset-bottom); padding-bottom: var(–safe-area-inset-bottom);
}
.timeBox {
margin-bottom: 20rpx;
.timeItem {
height: 90rpx;
display: flex;
align-items: center;
background-color: #fff;
padding: 0 20rpx;
.left {
width: 40rpx;
margin-right: 20rpx;
}
.right {
width: 640rpx;
height: 90rpx;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 2rpx solid #ccced5;
font-size: 30rpx;
} }
}
}
.addBox {
height: 110rpx;
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
.addBtn {
width: 320rpx;
height: 80rpx;
border-radius: 40rpx;
border: 2rpx solid #446dfc;
color: #446dfc;
font-size: 30rpx;
display: flex;
justify-content: center;
align-items: center;
}
}
.contentSlot {
background-color: #fff;
box-sizing: border-box;
padding: 40rpx;
border-radius: 20rpx;
.timeTitle {
margin: 20rpx 0;
font-size: 30rpx;
}
}
.picker-view {
width: 100%;
height: 180rpx;
margin-top: 20rpx;
.picker-item {
height: 100rpx;
}
}
.flex-center {
display: flex;
justify-content: center;
align-items: center;
}
.saveBox {
width: 750rpx;
height: 120rpx;
background-color: #fff;
display: flex;
justify-content: center;
align-items: center;
position: fixed;
left: 0;
bottom: 0;
.saveBtn {
width: 700rpx;
height: 80rpx;
border-radius: 40rpx;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
background-color: #446dfc;
color: #fff;
font-size: 36rpx;
}
}
</style> </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