Skip to content

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

1

parent 721e47e5
Show whitespace changes
Inline Side-by-side
Showing with 1042 additions and 528 deletions
pages/MallMange/index.vue
View file @ e1398836
<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" />
<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" />
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png"
class="headimg"
/>
<view class="name1">饭粒汪</view>
</view>
<view style="
<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" />
"
>
<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" />
<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" />
<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" />
<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" />
<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" />
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/user.png"
mode=""
class="imgicon"
/>
<view class="iconname">用户管理</view>
</view>
</view>
......@@ -45,27 +77,47 @@
<view class="conditionOfBusiness">
<view class="title">经营状况</view>
<view class="day flex-center">
<!-- <view class="dayitem choose">今日</view>
<view class="dayitem">昨日</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
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 class="BusinessData">
<view class="dataitem">
<view class="dataNum">0</view>
<view class="dataNum">{{ salesData.OrderCount || 0 }}</view>
<view class="dataName">支付订单数</view>
</view>
<view class="dataitem">
<view class="dataNum">0.00</view>
<view class="dataNum">{{ salesData.Income || 0 }}</view>
<view class="dataName">支付金额(元)</view>
</view>
<view class="dataitem">
<view class="dataNum">2</view>
<view class="dataName">访客数</view>
<view class="dataNum">{{ salesData.UserCount || 0 }}</view>
<view class="dataName">支付人数</view>
</view>
<view class="dataitem">
<view class="dataNum">116</view>
<view class="dataName">访问量</view>
<view class="dataNum">{{ salesData.GoodCount || 0 }}</view>
<view class="dataName">支付件数</view>
</view>
</view>
</view>
......@@ -75,39 +127,80 @@
<view class="handleItem">
<view class="handleItemNum">0</view>
<view class="handleItemName">待发货订单</view>
<view class="handleItemBtn">立即发货 <u-icon name="arrow"></u-icon>
<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 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 }}
<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 }}
<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" @click="handleClickDate('first')" :class="{ choose: clickDate == 'first' }">7日</view>
<view class="dayitem" @click="handleClickDate('second')" :class="{ choose: clickDate == 'second' }">30日</view>
<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
canvas-id="canvasColumn"
id="canvasColumn"
class="charts"
disable-scroll="true"
@touchstart="touchColumn"
@touchmove="moveColumn"
@touchend="touchEndColumn"
>
</canvas>
</view>
<tabbar></tabbar>
......@@ -115,17 +208,18 @@
</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 {
import uCharts from "../school/components/u-charts/u-charts.min.js";
import tabbar from "./components/tabbar.vue";
let canvaColumn = null;
let _self;
export default {
components: {
tabbar,
},
data() {
return {
array: [{
array: [
{
name: "支付金额",
key: 1,
},
......@@ -143,7 +237,8 @@
},
],
payType: "",
array1: [{
array1: [
{
name: "全部",
key: 1,
},
......@@ -163,7 +258,7 @@
payType1: "",
//加载
loading: false,
clickDate: "first",
clickDate: "today",
dateStr: [], //日期
//查询数据
basicQMsg: {
......@@ -176,6 +271,9 @@
},
basicData: {}, //基础数据
salesData: {}, //销售数据
cWidth: "",
cHeight: "",
pixelRatio: 1,
};
},
methods: {
......@@ -189,7 +287,7 @@
canvaColumn = new uCharts({
$this: _self,
canvasId: canvasId,
type: "column",
type: "line",
fontSize: 11,
padding: [5, 15, 15, 15],
legend: {
......@@ -197,10 +295,6 @@
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,
......@@ -212,21 +306,22 @@
animation: true,
enableScroll: true,
xAxis: {
rotateLabel: true,
disableGrid: false,
type: "grid",
gridType: "dash",
itemCount: 4,
itemCount: 24,
scrollShow: true,
scrollAlign: "right",
dashLength: 8,
},
yAxis: {
//disabled:true
gridType: "dash",
splitNumber: 4,
min: 10,
splitNumber: 5,
min: 0,
max: 180,
format: (val) => {
return val.toFixed(0) + "元";
return val.toFixed(0.1);
}, //如不写此方法，Y轴刻度默认保留两位小数
},
width: _self.cWidth * _self.pixelRatio,
......@@ -234,7 +329,8 @@
extra: {
column: {
type: "group",
width: (_self.cWidth * _self.pixelRatio * 0.45) /
width:
(_self.cWidth * _self.pixelRatio * 0.45) /
chartData.categories.length,
},
},
......@@ -252,30 +348,34 @@
animation: true,
});
canvaColumn.showToolTip(e, {
format: function(item, category) {
format: function (item, category) {
return category + " " + item.name + ":" + item.data + "元";
},
});
},
//基础数据日期切换
//日期切换
handleClickDate(name) {
this.clickDate = name;
this.dateStr = [];
if (name == "today") {
this.basicQMsg.SalesTimeType = 0;
} else if (name == "yesterday") {
this.basicQMsg.SalesTimeType = 1;
}
//7日
if (name == "first") {
this.dateStr.push(this.$utils.AddDay("", -7));
this.basicQMsg.SalesTimeType = 7;
}
//30日
else if (name == "second") {
this.dateStr.push(this.$utils.AddDay("", -30));
}
this.dateStr.push(this.$utils.AddDay("", -0));
this.getBasicData();
},
//获取基础数据
getBasicData() {
this.loading = true;
console.log("adsfasdasf")
if (this.dateStr && this.dateStr.length > 0) {
this.basicQMsg.StartDate = this.dateStr[0];
this.basicQMsg.EndDate = this.dateStr[1];
......@@ -283,79 +383,92 @@
this.basicQMsg.StartDate = "";
this.basicQMsg.EndDate = "";
}
this.requestAdmin("/api/Tenant/MallIndexStatistics", this.basicQMsg, (res) => {
console.log("11111")
//this.loading = false;
if (res.data.resultCode == 1) {
this.requestAdmin(
"/api/Tenant/MallIndexStatistics",
this.basicQMsg,
(res) => {
console.log("11111", res);
this.loading = false;
if (res.resultCode == 1) {
//基础数据统计
this.basicData = res.data.data.basicData;
this.basicData = res.data.basicData;
console.log("基础数据统计", this.basicData);
//销售情况统计
this.salesData = res.data.data.salesData;
// //商品购买力TOP排行
// var saleGoodsArray = res.data.data.saleIncomeData;
// if (saleGoodsArray) {
// if (saleGoodsArray.length <= 2) {
// this.saleIncomeData = saleGoodsArray;
// } else {
// this.saleIncomeData = saleGoodsArray.slice(0, 15);
// }
// }
// //用户购买力TOP排行
// var saleUserArray = res.data.data.saleUserData;
// if (saleUserArray) {
// if (saleUserArray.length <= 2) {
// this.saleUserData = saleUserArray;
// } else {
// this.saleUserData = saleUserArray.slice(0, 15);
// }
// }
// this.initMap();
} else {
// this.Info(res.data.message);
}
this.salesData = res.data.salesData;
console.log("销售情况统计", this.salesData);
let xData = []; //x轴数据
let xDataList = [];
let orderArray = []; //订单数量
let orderIncome = []; //支付金额
let userArray = []; //支付人数
let goodArray = []; //商品件数
this.salesData.subList.forEach((item) => {
if (this.activeSell == "today") {
xData.push(nowDay + " " + item.TimeStr + "时");
}
if (this.activeSell == "first") {
xData.push(yesDay + " " + item.TimeStr + "时");
}
xDataList.push(item.TimeStr);
orderArray.push(item.OrderCount);
orderIncome.push(item.Income);
userArray.push(item.UserCount);
goodArray.push(item.GoodCount);
});
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()
this.getBasicData();
},
};
};
</script>
<style lang="scss" scoped>
.indexpage {
.indexpage {
min-height: 100vh;
background-color: #f7f7f7;
box-sizing: border-box;
padding-bottom: 100rpx;
}
}
.flex-center {
.flex-center {
display: flex;
justify-content: space-between;
align-items: center;
}
}
.topBox {
.topBox {
height: 350rpx;
position: relative;
margin-bottom: 20rpx;
}
}
.bg {
.bg {
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
}
.topinfo {
.topinfo {
height: 130rpx;
box-sizing: border-box;
padding: 0 50rpx 0 20rpx;
......@@ -367,31 +480,31 @@
top: 0;
left: 0;
z-index: 1;
}
}
.headimg {
.headimg {
width: 70rpx;
height: 70rpx;
border-radius: 50%;
}
}
.name1 {
.name1 {
margin-left: 24rpx;
font-size: 40rpx;
color: #fff;
}
}
.ewmimg {
.ewmimg {
width: 50rpx;
height: 50rpx;
}
}
.name2 {
.name2 {
font-size: 24rpx;
color: #fff;
}
}
.msgBox {
.msgBox {
box-sizing: border-box;
width: 700rpx;
height: 200rpx;
......@@ -438,10 +551,10 @@
font-size: 24rpx;
}
}
}
}
.conditionOfBusiness,
.echartsBox {
.conditionOfBusiness,
.echartsBox {
height: 480rpx;
width: 700rpx;
margin: 0 auto;
......@@ -452,7 +565,7 @@
margin-bottom: 40rpx;
.day {
width: 300rpx;
width: 600rpx;
height: 50rpx;
border-radius: 25rpx;
border: 2rpx solid #667cb8;
......@@ -495,14 +608,14 @@
}
}
}
}
}
.title {
.title {
font-size: 30rpx;
margin-bottom: 30rpx;
}
}
.fastHandle {
.fastHandle {
width: 700rpx;
// height: 300rpx;
margin: 0 auto;
......@@ -538,9 +651,9 @@
}
}
}
}
}
.echartsBox {
.echartsBox {
width: 700rpx;
height: auto;
margin: 0 auto;
......@@ -550,5 +663,13 @@
display: flex;
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>
pages/MallMange/order.vue
View file @ e1398836
......@@ -42,7 +42,7 @@
:value="value"
@change="bindChange"
class="picker-view"
:indicator-style="indicatorStyle"
indicator-style="height: 60rpx"
:indicator-class="activeClass"
>
<picker-view-column>
......
pages/MallMange/set.vue
View file @ e1398836
......@@ -91,14 +91,116 @@
</u-modal>
<view class="boxItem" v-if="businessKey == 2">
<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="flex-center">
<view class="weeek">{{ weekStr }}</view>
<view class="weeek">{{ timeArr.join("、") }}</view>
<u-icon name="arrow" style="margin-left: 10rpx"></u-icon
></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>
</view>
......@@ -114,9 +216,15 @@ export default {
showBox1: false,
username: "",
showBox2: false,
showBox3: false,
showBox4:false,
showBox5:false,
msg: {
business: false,
businessTime: 1,
delOrderTime: 0,
incomeDay:1,
afterSaleDay:1
},
businessTimeList: [
{
......@@ -167,6 +275,7 @@ export default {
},
],
weekStr: "",
timeArr: [],
};
},
methods: {
......@@ -182,11 +291,16 @@ export default {
.map((item) => item.name)
.join("、");
},
jumpPage(url){
jumpPage(url) {
uni.navigateTo({
url: url,
});
}
},
getTimeArr(arr) {
this.timeArr = arr;
this.$forceUpdate();
console.log(193, this.timeArr.join("、"));
},
},
onLoad() {
uni.setNavigationBarTitle({
......@@ -245,7 +359,7 @@ export default {
.boxGroup {
width: 700rpx;
padding: 0 30rpx;
margin: 10rpx auto;
margin: 20rpx auto;
background-color: #fff;
border-radius: 10rpx;
.boxItem {
......@@ -331,4 +445,16 @@ export default {
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>
\ No newline at end of file
pages/MallMange/timeQuantum.vue
View file @ e1398836
<template>
<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>
</template>
<script>
export default {
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() {
uni.setNavigationBarTitle({
title: "设置时间段",
});
let pages = getCurrentPages();
let page = pages[pages.length - 2];
this.timeArr = page.$vm.timeArr;
console.log(41, page.$vm.timeArr);
},
};
</script>
<style lang="scss" scoped>
.timepage{
.timepage {
min-height: 100vh;
background-color: #f7f7f7;
box-sizing: border-box;
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>
\ 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