Commit 804aa513 authored by 罗超's avatar 罗超

1

parent 4189281c
...@@ -801,6 +801,8 @@ ...@@ -801,6 +801,8 @@
"path": "goods" "path": "goods"
},{ },{
"path": "set" "path": "set"
},{
"path": "timeQuantum"
} }
] ]
} }
......
<template>
<view class="goodsItem flex-between">
<view class="imgbox">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/user.png"
mode="aspectFill"
class="img"
/>
</view>
<view class="goodsInfoBox">
<view class="goodsName"
>测试商品ssadfdsdddddddddddddddddddddddddddddddddddddddddddddddddd啛啛喳喳吃错错错错错错错错错错错dd</view
>
<view class="price">¥0.01</view>
<view class="flex-between surplus">
<text>库存:999</text>
<u-icon name="ellipsis" :size="40" @click="changeShow"></u-icon>
</view>
<view class="operationBox flex-between" v-if="showOperationBox">
<view class="btn">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/edit.png"
mode=""
style="width: 40rpx; height: 40rpx"
/>
编辑
</view>
<view class="btn">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/xiajia.png"
mode=""
style="width: 40rpx; height: 40rpx"
/>
下架
</view>
<view class="btn">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/delete.png"
mode=""
style="width: 40rpx; height: 40rpx"
/>
删除
</view>
<view class="sanjiaoxing"></view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
showOperationBox: false,
};
},
methods: {
changeShow() {
this.showOperationBox = !this.showOperationBox;
},
},
};
</script>
<style lang="scss" scoped>
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
}
.goodsItem {
width: 700rpx;
height: 200rpx;
margin: 10rpx auto;
box-sizing: border-box;
padding: 20rpx;
border-radius: 6rpx;
background-color: #fff;
.imgbox {
width: 150rpx;
height: 150rpx;
border-radius: 6rpx;
overflow: hidden;
margin-right: 20rpx;
box-shadow: 0rpx 0rpx 10rpx 0px rgba(36, 36, 36, 0.2);
.img {
width: 100%;
height: 100%;
border-radius: 10rpx;
}
}
.goodsInfoBox {
width: 490rpx;
font-size: 24rpx;
color: #333;
height: 150rpx;
position: relative;
.goodsName {
height: 50%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
font-size: 28rpx;
word-break: break-all;
}
.price {
font-size: 28rpx;
color: #f00;
}
.surplus {
font-size: 24rpx;
}
.operationBox {
width: 260rpx;
height: 100rpx;
border-radius: 10rpx;
background-color: #404040;
position: absolute;
top: 0rpx;
right: 0rpx;
padding: 0 20rpx;
.btn {
width: 55rpx;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
font-size: 26rpx;
color: #fff;
}
}
.sanjiaoxing {
width: 0;
height: 0;
border-left: 10rpx solid transparent;
border-right: 10rpx solid transparent;
border-top: 10rpx solid #404040;
position: absolute;
top: 100rpx;
right: 16rpx;
}
}
}
</style>
\ No newline at end of file
...@@ -4,9 +4,7 @@ ...@@ -4,9 +4,7 @@
<text>订单号:20211018154423824347</text> <text>订单号:20211018154423824347</text>
<text style="color: #446dfc">待退款</text> <text style="color: #446dfc">待退款</text>
</view> </view>
<view class="flex-between remarks"> <view class="flex-between remarks"> 商家备注:20211018154423824347 </view>
商家备注:20211018154423824347
</view>
<view class="consigneeInfo"> <view class="consigneeInfo">
<text style="margin-right: 40rpx">信息</text> <text style="margin-right: 40rpx">信息</text>
<text style="margin-right: 20rpx">13312341234</text> <text style="margin-right: 20rpx">13312341234</text>
...@@ -70,10 +68,10 @@ export default { ...@@ -70,10 +68,10 @@ export default {
color: #333; color: #333;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.remarks{ .remarks {
font-size: 26rpx; font-size: 26rpx;
color: #333; color: #333;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.consigneeInfo { .consigneeInfo {
width: 100%; width: 100%;
...@@ -103,8 +101,8 @@ export default { ...@@ -103,8 +101,8 @@ export default {
} }
} }
.goodsBox { .goodsBox {
width: 480rpx;
height: 160rpx; height: 160rpx;
flex-grow: 1;
font-size: 24rpx; font-size: 24rpx;
color: #333; color: #333;
.goodsName { .goodsName {
...@@ -114,6 +112,7 @@ export default { ...@@ -114,6 +112,7 @@ export default {
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
word-break: break-all;
} }
.weight { .weight {
height: 35%; height: 35%;
...@@ -130,8 +129,8 @@ export default { ...@@ -130,8 +129,8 @@ export default {
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
.btn { .btn {
// width: 90rpx; // width: 90rpx;
// height: 50rpx; // height: 50rpx;
border-radius: 30rpx; border-radius: 30rpx;
border: 2rpx solid #f7f7f7; border: 2rpx solid #f7f7f7;
margin: 0 0 0 30rpx; margin: 0 0 0 30rpx;
......
...@@ -15,13 +15,33 @@ ...@@ -15,13 +15,33 @@
@change="change" @change="change"
></u-tabs> ></u-tabs>
</view> </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%' }"
>
<goodsItem />
</scroll-view>
</view>
<tabbar></tabbar> <tabbar></tabbar>
</view> </view>
</template> </template>
<script> <script>
import tabbar from "./components/tabbar.vue"; import tabbar from "./components/tabbar.vue";
import goodsItem from "./components/goodsItem.vue";
export default { export default {
components: { components: {
goodsItem,
tabbar, tabbar,
}, },
data() { data() {
...@@ -36,12 +56,32 @@ export default { ...@@ -36,12 +56,32 @@ export default {
}, },
], ],
current: 0, current: 0,
msg: {
pageIndex: 1,
pageSize: 15,
OrderId: 0,
OrderType: 0,
DeliveryMethod: 0,
StartTime: "",
EndTime: "",
OrderStatus: 0,
OrderNo: "",
},
}; };
}, },
methods: { methods: {
change(index) { change(index) {
this.current = index; this.current = index;
}, },
lower(e) {
if (this.msg.pageIndex < this.page_count) {
this.msg.pageIndex++;
this.status = "loading";
this.init();
} else {
this.status = "nomore";
}
},
}, },
onLoad() { onLoad() {
uni.setNavigationBarTitle({ uni.setNavigationBarTitle({
...@@ -88,6 +128,6 @@ export default { ...@@ -88,6 +128,6 @@ export default {
} }
} }
.tabbox { .tabbox {
height: 100rpx; margin-bottom: 10rpx;
} }
</style> </style>
\ No newline at end of file
<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" <image
class="bg" /> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/bg.png"
<view class="topinfo"> mode="widthFix"
<view class="flex-center"> class="bg"
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png" />
class="headimg" /> <view class="topinfo">
<view class="name1">饭粒汪</view> <view class="flex-center">
</view> <image
<view style="display:flex;flex-wrap:wrap;justify-content:center;width:100rpx"> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png"
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/qr_code.png" class="headimg"
class="ewmimg" mode="aspectFill" /> />
<view class="name2">收款码</view> <view class="name1">饭粒汪</view>
</view> </view>
</view> <view
<view class="msgBox flex-center"> style="
<view class="itemBox"> display: flex;
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/order.png" flex-wrap: wrap;
mode="" class="imgicon" /> justify-content: center;
<view class="iconname">订单消息</view> width: 100rpx;
<view class="tipNum">1</view> "
</view> >
<view class="itemBox"> <image
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/msg.png" mode="" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/qr_code.png"
class="imgicon" /> class="ewmimg"
<view class="iconname">审核消息</view> mode="aspectFill"
</view> />
<view class="itemBox"> <view class="name2">收款码</view>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png" </view>
mode="" class="imgicon" /> </view>
<view class="iconname">提现申请</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/comment.png" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/order.png"
mode="" class="imgicon" /> mode=""
<view class="iconname">评论管理</view> class="imgicon"
</view> />
<view class="itemBox"> <view class="iconname">订单消息</view>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/user.png" <view class="tipNum">1</view>
mode="" class="imgicon" /> </view>
<view class="iconname">用户管理</view> <view class="itemBox">
</view> <image
</view> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/msg.png"
</view> mode=""
<view class="conditionOfBusiness"> class="imgicon"
<view class="title">经营状况</view> />
<view class="day flex-center"> <view class="iconname">审核消息</view>
<view class="dayitem choose">今日</view> </view>
<view class="dayitem">昨日</view> <view class="itemBox">
<view class="dayitem choose">7日</view> <image
<view class="dayitem">30日</view> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/cash.png"
</view> mode=""
<view class="BusinessData"> class="imgicon"
<view class="dataitem"> />
<view class="dataNum">0</view> <view class="iconname">提现申请</view>
<view class="dataName">支付订单数</view> </view>
</view> <view class="itemBox">
<view class="dataitem"> <image
<view class="dataNum">0.00</view> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/comment.png"
<view class="dataName">支付金额(元)</view> mode=""
</view> class="imgicon"
<view class="dataitem"> />
<view class="dataNum">2</view> <view class="iconname">评论管理</view>
<view class="dataName">访客数</view> </view>
</view> <view class="itemBox">
<view class="dataitem"> <image
<view class="dataNum">116</view> src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/user.png"
<view class="dataName">访问量</view> mode=""
</view> class="imgicon"
</view> />
</view> <view class="iconname">用户管理</view>
<view class="fastHandle"> </view>
<view class="title">快速处理</view> </view>
<view class="flex-center HandleBox"> </view>
<view class="handleItem"> <view class="conditionOfBusiness">
<view class="handleItemNum">0</view> <view class="title">经营状况</view>
<view class="handleItemName">待发货订单</view> <view class="day flex-center">
<view class="handleItemBtn">立即发货 <u-icon name="arrow"></u-icon> <!-- <view class="dayitem choose">今日</view>
</view> <view class="dayitem">昨日</view> -->
</view> <view
<view class="handleItem"> class="dayitem"
<view class="handleItemNum">0</view> @click="handleClickDate('first')"
<view class="handleItemName">维权订单</view> :class="{ choose: clickDate == 'first' }"
<view class="handleItemBtn">立即处理 <u-icon name="arrow"></u-icon> >7日</view
</view> >
</view> <view
</view> class="dayitem"
</view> @click="handleClickDate('second')"
<view class="echartsBox"> :class="{ choose: clickDate == 'second' }"
<view class="title flex-center"> >30日</view
<picker @change="bindPickerChange" :value="key" :range="array" range-key="name"> >
<view class="payType">{{ payType }} </view>
<u-icon name="arrow-down"></u-icon> <view class="BusinessData">
</view> <view class="dataitem">
</picker> <view class="dataNum">0</view>
<picker @change="bindPickerChange1" :value="key" :range="array1" range-key="name"> <view class="dataName">支付订单数</view>
<view class="payType">{{ payType1 }} </view>
<u-icon name="arrow-down"></u-icon> <view class="dataitem">
</view> <view class="dataNum">0.00</view>
</picker> <view class="dataName">支付金额(元)</view>
</view> </view>
<view class="day flex-center"> <view class="dataitem">
<view class="dayitem choose">今日</view> <view class="dataNum">2</view>
<view class="dayitem">昨日</view> <view class="dataName">访客数</view>
<view class="dayitem choose">7日</view> </view>
<view class="dayitem">30日</view> <view class="dataitem">
</view> <view class="dataNum">116</view>
<view style="height:100rpx;"></view> <view class="dataName">访问量</view>
<canvas canvas-id="canvasColumn" id="canvasColumn" class="charts" disable-scroll="true" </view>
@touchstart="touchColumn" @touchmove="moveColumn" @touchend="touchEndColumn"> </view>
</canvas> </view>
</view> <view class="fastHandle">
<tabbar></tabbar> <view class="title">快速处理</view>
</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"
@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; var canvaColumn = null;
var _self; var _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: "", },
}; ],
}, payType1: "",
methods: { //加载
bindPickerChange(e) { loading: false,
this.payType = this.array[e.detail.value].name; clickDate: "first",
}, dateStr: [], //日期
bindPickerChange1(e) { //查询数据
this.payType1 = this.array1[e.detail.value].name; basicQMsg: {
}, Source: 0, //来源
showColumn(canvasId, chartData) { StartDate: "", //开始时间
canvaColumn = new uCharts({ EndDate: "", //结束时间
$this: _self, SalesTimeType: 0, //默认今日
canvasId: canvasId, OrderBy: "",
type: "column", UserType: -1, //0-普通用户,1-领队导游
fontSize: 11, },
padding: [5, 15, 15, 15], basicData: {}, //基础数据
legend: { salesData: {}, //销售数据
show: true, };
position: "top", },
float: "center", methods: {
itemGap: 30, bindPickerChange(e) {
padding: 5, this.payType = this.array[e.detail.value].name;
margin: 5, },
//backgroundColor:'rgba(41,198,90,0.2)', bindPickerChange1(e) {
//borderColor :'rgba(41,198,90,0.5)', this.payType1 = this.array1[e.detail.value].name;
borderWidth: 1, },
}, showColumn(canvasId, chartData) {
dataLabel: true, canvaColumn = new uCharts({
dataPointShape: true, $this: _self,
background: "#FFFFFF", canvasId: canvasId,
pixelRatio: _self.pixelRatio, type: "column",
categories: chartData.categories, fontSize: 11,
series: chartData.series, padding: [5, 15, 15, 15],
animation: true, legend: {
enableScroll: true, show: true,
xAxis: { position: "top",
disableGrid: false, float: "center",
type: "grid", itemGap: 30,
gridType: "dash", padding: 5,
itemCount: 4, margin: 5,
scrollShow: true, //backgroundColor:'rgba(41,198,90,0.2)',
scrollAlign: "right", //borderColor :'rgba(41,198,90,0.5)',
}, borderWidth: 1,
yAxis: { },
//disabled:true dataLabel: true,
gridType: "dash", dataPointShape: true,
splitNumber: 4, background: "#FFFFFF",
min: 10, pixelRatio: _self.pixelRatio,
max: 180, categories: chartData.categories,
format: (val) => { series: chartData.series,
return val.toFixed(0) + "元"; animation: true,
}, //如不写此方法,Y轴刻度默认保留两位小数 enableScroll: true,
}, xAxis: {
width: _self.cWidth * _self.pixelRatio, disableGrid: false,
height: _self.cHeight * _self.pixelRatio, type: "grid",
extra: { gridType: "dash",
column: { itemCount: 4,
type: "group", scrollShow: true,
width: (_self.cWidth * _self.pixelRatio * 0.45) / scrollAlign: "right",
chartData.categories.length, },
}, yAxis: {
}, //disabled:true
}); gridType: "dash",
}, splitNumber: 4,
touchColumn(e) { min: 10,
canvaColumn.scrollStart(e); max: 180,
}, format: (val) => {
moveColumn(e) { return val.toFixed(0) + "元";
canvaColumn.scroll(e); }, //如不写此方法,Y轴刻度默认保留两位小数
}, },
touchEndColumn(e) { width: _self.cWidth * _self.pixelRatio,
canvaColumn.scrollEnd(e); height: _self.cHeight * _self.pixelRatio,
canvaColumn.touchLegend(e, { extra: {
animation: true, column: {
}); type: "group",
canvaColumn.showToolTip(e, { width:
format: function(item, category) { (_self.cWidth * _self.pixelRatio * 0.45) /
return category + " " + item.name + ":" + item.data + "元"; chartData.categories.length,
}, },
}); },
}, });
}, },
onLoad() { touchColumn(e) {
this.payType = this.array[0].name; canvaColumn.scrollStart(e);
this.payType1 = this.array1[0].name; },
uni.setNavigationBarTitle({ moveColumn(e) {
title: "商城管理", 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 + "元";
},
});
},
//基础数据日期切换
handleClickDate(name) {
this.clickDate = name;
this.dateStr = [];
//7日
if (name == "first") {
this.dateStr.push(this.$utils.AddDay("", -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;
if (this.dateStr && this.dateStr.length > 0) {
this.basicQMsg.StartDate = this.dateStr[0];
this.basicQMsg.EndDate = this.dateStr[1];
} else {
this.basicQMsg.StartDate = "";
this.basicQMsg.EndDate = "";
}
this.apipost("/api/Tenant/MallIndexStatistics", this.basicQMsg, (res) => {
this.loading = false;
if (res.data.resultCode == 1) {
//基础数据统计
this.basicData = res.data.data.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);
}
});
},
},
onLoad() {
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: 590rpx; width: 300rpx;
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;
.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;
} }
} }
</style> </style>
<template> <template>
<view> <view class="setPage">
<tabbar></tabbar> <view class="topBox">
<image
src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mallManage/bg.png"
mode="widthFix"
class="bg"
/>
<view class="headImgBox"></view>
<view class="nameBox"
>饭粒汪
<u-icon
name="edit"
style="margin-left: 10rpx"
@click="showBox1 = true"
></u-icon>
</view>
<u-modal
v-model="showBox1"
:show-cancel-button="true"
title="修改商城名称"
contentSlot
@confirm="showBox1 = false"
>
<input type="text" v-model="username" class="nameInput" />
</u-modal>
</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/shop.png"
mode="widthFix"
style="width: 100%"
/>
</view>
<view class="rightBox">
<view class="name">营业状态</view>
<u-switch v-model="msg.business"></u-switch>
</view>
</view>
<view class="boxItem">
<view class="leftBox"></view>
<view
class="rightBox"
:style="businessKey == 1 ? 'border:none' : ''"
></view>
<u-radio-group
v-model="msg.businessTime"
@change="radioGroupChange"
class="radioGroup"
>
<u-radio
v-for="(item, index) in businessTimeList"
:key="index"
:name="item.key"
shape="circle"
>
{{ item.name }}
</u-radio>
</u-radio-group>
</view>
<view class="boxItem" v-if="businessKey == 2">
<view class="leftBox"></view>
<view class="rightBox" @click="showBox2 = true">
<view class="name">选择日期</view>
<view class="flex-center">
<view class="weeek">{{ weekStr }}</view>
<u-icon name="arrow" style="margin-left: 10rpx"></u-icon
></view>
</view>
</view>
<u-modal
v-model="showBox2"
:show-cancel-button="true"
title="选择日期"
contentSlot
@confirm="showBox2 = false"
>
<view class="modelBox2">
<view
v-for="(item, index) in weekArr"
:key="index"
class="modelBox2Item"
:class="item.choose ? 'modelBox2ItemActive' : ''"
@click="chooseWeek(item)"
>
{{ item.name }}
</view>
</view>
</u-modal>
<view class="boxItem" v-if="businessKey == 2">
<view class="leftBox"></view>
<view class="rightBox" style="border: none">
<view class="name">选择时间段</view>
<view class="flex-center">
<view class="weeek">{{ weekStr }}</view>
<u-icon name="arrow" style="margin-left: 10rpx"></u-icon
></view>
</view>
</view>
</view>
<tabbar></tabbar>
</view>
</template> </template>
<script> <script>
import tabbar from "./components/tabbar.vue"; import tabbar from "./components/tabbar.vue";
export default { export default {
components:{ components: {
tabbar tabbar,
},
data() {
return {
showBox1: false,
username: "",
showBox2: false,
msg: {
business: false,
businessTime: 1,
},
businessTimeList: [
{
name: "全天24小时",
key: 1,
},
{
name: "自定义营业时间",
key: 2,
},
],
businessKey: 1,
weekArr: [
{
name: "周一",
key: 1,
choose: false,
},
{
name: "周二",
key: 2,
choose: false,
},
{
name: "周三",
key: 3,
choose: false,
},
{
name: "周四",
key: 4,
choose: false,
},
{
name: "周五",
key: 5,
choose: false,
},
{
name: "周六",
key: 6,
choose: false,
},
{
name: "周日",
key: 7,
choose: false,
},
],
weekStr: "",
};
},
methods: {
radioGroupChange(e) {
this.businessKey = e;
}, },
} chooseWeek(e) {
e.choose = !e.choose;
this.weekStr = this.weekArr
.filter((item) => {
return item.choose;
})
.map((item) => item.name)
.join("、");
},
jumpPage(url){
uni.navigateTo({
url: url,
});
}
},
onLoad() {
uni.setNavigationBarTitle({
title: "商城设置",
});
},
};
</script> </script>
<style lang="scss"> <style lang="scss" scoped>
.flex-center{ .flex-center {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
}
.setPage {
min-height: 100vh;
background-color: #f7f7f7;
box-sizing: border-box;
padding-bottom: 100rpx;
}
.topBox {
position: relative;
margin-bottom: 20rpx;
.bg {
width: 100%;
}
.headImgBox {
position: absolute;
top: 30rpx;
left: 50%;
transform: translateX(-50%);
z-index: 2;
width: 140rpx;
height: 140rpx;
border-radius: 50%;
border: 4rpx solid #fff;
overflow: hidden;
background-color: #f00;
}
.nameBox {
width: 700rpx;
height: 200rpx;
border-radius: 10rpx;
position: absolute;
top: 110rpx;
left: 50%;
transform: translateX(-50%);
z-index: 1;
background-color: #fff;
font-size: 28rpx;
display: flex;
justify-content: center;
align-items: center;
}
}
.boxGroup {
width: 700rpx;
padding: 0 30rpx;
margin: 10rpx auto;
background-color: #fff;
border-radius: 10rpx;
.boxItem {
height: 100rpx;
display: flex;
align-items: center;
position: relative;
.leftBox {
width: 50rpx;
margin-right: 20rpx;
}
.rightBox {
width: 560rpx;
height: 100rpx;
border-bottom: 2rpx solid #ccced5;
display: flex;
justify-content: space-between;
align-items: center;
.name {
font-size: 28rpx;
color: #606266;
}
} }
.radioGroup {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
}
}
/deep/.u-radio {
margin-right: 60rpx;
}
/deep/.u-radio__icon-wrap {
margin-right: 20rpx;
}
/deep/.u-model {
border-radius: 10rpx;
}
.weeek {
max-width: 300rpx;
white-space: nowrap;
overflow: hidden;
font-size: 28rpx;
color: #606266;
}
.nameInput {
width: 560rpx;
height: 70rpx;
border-radius: 10rpx;
margin: 20rpx auto;
box-sizing: border-box;
padding: 0 20rpx;
background-color: #f7f7f7;
}
.modelBox2 {
width: 560rpx;
border-radius: 10rpx;
margin: 20rpx auto;
box-sizing: border-box;
padding: 0 20rpx;
background-color: #fff;
display: flex;
flex-wrap: wrap;
.modelBox2Item {
width: 160rpx;
height: 60rpx;
border-radius: 30rpx;
border: 2rpx solid #dfdfdf;
font-size: 30rpx;
color: #a4a4a4;
display: flex;
justify-content: center;
align-items: center;
margin: 10rpx 20rpx 10rpx 0;
}
& .modelBox2Item:nth-child(3n) {
margin-right: 0;
}
.modelBox2ItemActive {
border-color: #111 !important;
color: #111;
}
}
</style> </style>
\ No newline at end of file
<template>
<view class="timepage">
</view>
</template>
<script>
export default {
data() {
return {};
},
onLoad() {
uni.setNavigationBarTitle({
title: "设置时间段",
});
},
};
</script>
<style lang="scss" scoped>
.timepage{
min-height: 100vh;
background-color: #f7f7f7;
box-sizing: border-box;
padding-bottom: var(safe-area-inset-bottom);
}
</style>
\ No newline at end of file
function calcContentHeight(chaliang) { function calcContentHeight(chaliang) {
let contentHeight = 0 let contentHeight = 0
uni.getSystemInfo({ uni.getSystemInfo({
success(res) { success(res) {
contentHeight = res.windowHeight - 40 - chaliang contentHeight = res.windowHeight - 40 - chaliang
} }
}) })
return contentHeight return contentHeight
} }
function SystemInfo(){//获取屏幕宽高 function SystemInfo() {//获取屏幕宽高
let SystemInfo = {} let SystemInfo = {}
uni.getSystemInfo({ uni.getSystemInfo({
success(res) { success(res) {
...@@ -17,22 +17,45 @@ function SystemInfo(){//获取屏幕宽高 ...@@ -17,22 +17,45 @@ function SystemInfo(){//获取屏幕宽高
}) })
return SystemInfo return SystemInfo
} }
function getRect(selector){//获取元素的信息 function getRect(selector) {//获取元素的信息
return new Promise((resolve) => { return new Promise((resolve) => {
let view = uni.createSelectorQuery().select(selector); let view = uni.createSelectorQuery().select(selector);
view.fields({ view.fields({
size: true, size: true,
rect: true, rect: true,
scrollOffset:true scrollOffset: true
}, (res) => { }, (res) => {
resolve(res); resolve(res);
}).exec(); }).exec();
}) })
} }
function AddDay(date, day) {
let myDate = "";
if (date) {
myDate = new Date(date);
} else {
myDate = new Date();
}
myDate = myDate.setDate(myDate.getDate() + day);
myDate = new Date(myDate);
const seperator1 = "-";
let year = myDate.getFullYear();
let month = myDate.getMonth() + 1;
let strDate = myDate.getDate();
if (month >= 1 && month <= 9) {
month = "0" + month;
}
if (strDate >= 0 && strDate <= 9) {
strDate = "0" + strDate;
}
let currentdate = year + seperator1 + month + seperator1 + strDate;
return currentdate;
}
export default { export default {
calcContentHeight, calcContentHeight,
SystemInfo, SystemInfo,
getRect getRect,
AddDay
} }
\ 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