作者 xiaoqiu

首次提交

要显示太多修改。

为保证性能只显示 46 of 46+ 个文件。

不能预览此文件类型
{ // launch.json 配置了启动调试时相关设置,configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
// launchtype项可配置值为local或remote, local代表前端连本地云函数,remote代表前端连云端云函数
"version": "0.0",
"configurations": [{
"default" :
{
"launchtype" : "local"
},
"mp-weixin" :
{
"launchtype" : "local"
},
"type" : "uniCloud"
}
]
}
... ...
<script>
export default {
onLaunch: function() {
},
onShow: function() {
},
onHide: function() {
}
}
</script>
<style lang="scss">
/*每个页面公共css */
@import "@/uni_modules/uview-ui/index.scss";
/* 项目基础样式 */
@import "./app.scss";
@font-face {
font-family: 'HelveticaNeue-Medium';
src: url('@/static/fonts/HelveticaNeue-Medium.otf') format('truetype');
}
</style>
... ...
const http = uni.$u.http
/**
* 创建订单
* @param {
groundId: "场地ID",
orderDate: "订单日期",
hourList: {
startHour: "",
endHour: ""
}
}
*@@return {
orderId: "订单id",
orderNo: "订单编号",
belongGym: "所属球馆",
groundNum: "场地号",
orderTime: "下单时间",
appointmentStartTime: "预约开始时间",
appointmentEndTime : "预约结束时间",
payAmount: "支付金额",
peopleNum: "参与人数",
serviceCharge: "手续费",
commission: "抽佣",
orderType: "0整租1约球",
state: "0待确定1已确定2取消3不满足开场条件取消",
businessId: "商家id",
clientId: "客户id"
}
*/
export const createOrde = (data, config= {}) => http.post('/ground-business/ground/createOrder', data, {custom: {auth: true}})
/**
* 确定订单
* @param {
orderId: "订单ID"
}
*/
export const confirmOrder = (data) => http.get('/ground-business/ground/confirmOrder', { params: data, custom: {auth: true}})
/**
* 商户取消订单
* @param {
orderId: "订单ID",
type: "0取消订单1不满足开场条件取消"
}
*/
export const cancelOrder = (data) => http.post('/ground-business/ground/businessCancelOrder', data, {custom: {auth: true}})
/**
* 查询实时订单列表
* @return {
orderId: "订单ID",
orderNo: "",
belongGym: "附属球馆",
groundNum: "场地号",
orderTime: "下单时间",
appointmentStartTime: "预约开始时间",
appointmentEndTime : "预约结束时间",
payAmount: "支付金额",
peopleNum: "参与人数",
serviceCharge: "手续费",
commission: "抽佣",
orderType: "0整租1约球",
state: "0待确定1已确定2取消3不满足开场条件取消",
businessId: "商家id",
clientId: "客户id"
}
*/
export const getOrderList = (data) => http.get('/ground-order/order/list', {params: data, custom: {auth: true}})
/**
* 商家查询退款订单列表
* @param {
businessId: "商家ID",
pageNum: "页码",
pageSize: "页数"
}
*/
export const getAftersalesOrder = (data) => http.get('/ground-order/aftersales/list', { params: data, custom: {auth: true}})
/**
* 商家查询订单评价列表
* @param {
businessId: "商家ID",
pageNum: "页码",
pageSize: "页数"
}
*/
export const getCommentOrder = (data) => http.get('/ground-order/comment/list', { params: data, custom: {auth: true}})
/**
* 获取订单状态
*/
export const getOrderState = (data) => http.get('/system/dict/data/type/order_state', { params: data, custom: {auth: true}})
/**
* 获取退货订单状态
*/
export const getRefundState = (data) => http.get('/system/dict/data/type/aftersales_state', { params: data, custom: {auth: true}})
/**
* 获取订单评价状态
*/
export const getCommentState = (data) => http.get('/system/dict/data/type/order_comment_state', { params: data, custom: {auth: true}})
/**
* 商家审核申请退款
* @param {
salesId: "售后ID",
state: "0拒绝退款1退全款2发起人退50%其余退全款"
}
*/
export const businessLookRefund = (data) => http.post('/ground-order/myOrder/approveAfterSale', data, { custom: {auth: true}})
/**
* 商家回复评价
* @param {
commentId: "评论ID",
reply: "回复内容"
}
*/
export const businessReply = (data) => http.post('/ground-order/comment/replyComment', data, { custom: {auth: true}})
/**
* 商家申诉恶意评价
* @param {
commentId: "评论ID",
appealReason: "申诉原因"
}
*/
export const businessAppealReason = (data) => http.post('/ground-order/comment/appealComment', data, { custom: {auth: true}})
... ...
const http = uni.$u.http
/**
* 获取运动类型
* @param {
pageNum: 1
pageSize: 10
}
*/
export const getSportList = (data) => http.get('/system/sports/list', {params: data, custom: {auth: true} })
/**
* 获取营业周次和单价
*/
export const getPriods = () => http.get('/system/dict/data/type/periods', {custom: {auth: true} })
/**
* 新增场地
* @param {
groundCode: "场地码",
groundNum: "场地号",
isOutdoor: "是否为户外",
address: "地址",
sportsRange: "球类",
weekday: "周时间",
orderHours: "订单时长",
discount: "折扣",
longitude: "经度(用于定位)",
latitude: "纬度(用于定位)",
groundPicture: "场地图片",
weekdayList: [
{
weekday: 星期,
hourList: [
{
startHour: "开始时间",
endHour: "结束时间",
price: "价格"
}
]
}
]
}
*/
export const addGround = (data, config= {}) => http.post('/ground-business/ground', data, {custom: {auth: true}})
/**
* 根据ID获取场地详情
* @@return {
groundId: "场地ID",
belongGym: "附属球馆",
groundCode: "场地码",
groundNum: "场地号",
isOutdoor: "是否为户外",
address: "地址",
sportsRange: "球类",
weekday: "周时间",
orderHours: "订单时长",
discount: "折扣",
longitude: "经度(用于定位)",
latitude: "纬度(用于定位)",
groundPicture: "场地图片",
hourList: {
hourId: "时长ID",
startHour: "开始时间",
endHour: "结束时间",
price: "价格",
groundId: "场地ID",
isLocked: "是否上锁"
}
}
*/
export const getGroundDetail = (groundId) => http.get(`/ground-business/ground/${groundId}`, {custom: {auth: true}})
/**
* 更新场地信息
* @param {
groundCode: "场地码",
groundNum: "场地号",
isOutdoor: "是否为户外",
address: "地址",
sportsRange: "球类",
weekday: "周时间",
orderHours: "订单时长",
discount: "折扣",
longitude: "经度(用于定位)",
latitude: "纬度(用于定位)",
groundPicture: "场地图片",
weekdayList: {
weekday: 1,
hourList: {
startHour: "开始时间",
endHour: "结束时间",
price: "价格"
}
}
}
*/
export const updateGroundInfo = (data, config= {}) => http.put('/ground-business/ground', data, {custom: {auth: true}})
/**
* 删除场地列表
*/
export const delGroundInfo = (groundId) => http.delete(`/ground-business/ground/${groundId}`, {}, {custom: {auth: true}})
/**
* 锁定场地
* @param {
groundId: "场地id",
orderDate: "锁定日期",
hourList: {
startHour: "开始时间",
endHour: "结束时间",
isLocked: "0解锁1锁定"
}
}
*/
export const lockGround = (data) => http.post('/ground-business/ground/lockGround', data, {custom: {auth: true}})
/**
* 营业时间列表查询
* @param {
currentDate: "时间范围",
groundId: "场地ID不传就是查全部"
}
*@return {
endHour: "结束时间",
startHour: "开始时间",
lockDate: "锁定日期",
groundId: "场地id",
groundCode: 场地编号,
lockby: "操作人",
operateTime: "操作时间",
isLocked: "0未锁定1已锁"
}
*/
export const businessTimeList = (data) => http.post('/ground-business/ground/businessHourList', data, {custom: {auth: true}})
/**
* 查询场地列表
*@return {
groundId: "场地ID",
belongGym: "附属球馆",
groundCode: "场地码",
groundNum: "场地号",
isOutdoor: "是否为户外",
address: "地址",
sportsRange: "球类",
weekday: "周时间",
businessId: "球馆ID"
orderHours: "订单时长",
discount: "折扣",
longitude: "经度(用于定位)",
latitude: "纬度(用于定位)",
groundPhotos: "场地图片",
distance: "距离千米"
}
*/
export const getGroundList = (data) => http.get('/ground-business/ground/list', {params: data, custom: {auth: true}})
/**
* 查询球馆列表
* @param {
longitude: "经度",
latitude: "纬度"
}
*@return {
groundId: "场地ID"
businessName: "商家名称",
businessLicenseNo: "社会统一码",
gymName: "球馆名称",
contacts: "联系人",
contactsPhone: "联系人电话",
province: "省",
city: "市",
county: "县",
address: "地址",
gymPicture: "球馆图片"
gymNum: "球馆号",
serviceCharge: "服务费",
commission: "佣金",
username: "用户名"
businessLicensePicture: "商家许可证照片"
belongGym: "附属球馆"
groundCode: "场地码",
groundNum: "场地号",
isOutdoor: "是否为户外",
sportsRange: "球类",
rank: "评分",
price: "平均价格",
businessTime: "营业时间"
businessId: "球馆ID"
longitude: "经度(用于定位)",
latitude: "纬度(用于定位)",
distance: "距离千米"
}
*/
export const getBusinessList = (data, config= {}) => http.get('/ground-business/business/list', {params: data, custom: {auth: true}})
/**
* 选择时间段页面营业时间列表
* @param {
groundId: "场地id",
currentDate: "选择日期",
}
* @return {
discountHours: "连续x小时打折",
discount: "打折",
data: [
{
startHour: "开始时间",
endHour: "结束时间",
price: "价格"
}
]
}
*/
export const getOrderHourList = (data, config= {}) => http.post('/ground-business/ground/orderHourList', data, config)
/**
* 发起约球
* @param {
groundId: "场地id",
peopleNum: "参与人数(不包括发起人)",
orderDate: "订场日期",
hourList: [
{
startHour: "开始时间",
endHour: "结束时间",
}
]
}
* @return {
orderId: "订单id",
orderNo: "订单编号",
belongGym: "所属球馆",
groundNum: "场地号",
orderTime: "下单时间",
appointmentStartTime: "预约开始时间",
appointmentEndTime : "预约结束时间",
payAmount: "支付金额",
peopleNum: "参与人数",
serviceCharge: "手续费",
commission: "抽佣",
orderType: "0整租1约球",
state: "0待确定1已确定2取消3不满足开场条件取消",
businessId: "商家id",
clientId: "客户id"
groundId: "场地ID"
}
*/
export const sendBooking = (data, config= {}) => http.post('/ground-business/ground/createDateOrder', data, config)
/**
* 待拼场场地列表
* @return {
orderId: "订单id",
orderNo: "订单编号",
belongGym: "球馆名称",
groundNum: "场地号",
address: "地址",
orderTime: "下单时间",
appointmentStartTime: "拼场时间段-开始时间",
appointmentEndTime : "拼场时间段-结束时间",
price: "价格",
peopleNum: "需求人数",
rank: "整体评分",
envRank: "环境评分",
serviceRank: "服务评分",
priceRank : "性价比评分",
organizer: "发起人",
joinPeopleNum: "已拼场人数",
clientList: [
{
createTime: "参与时间",
clientId: "客户id",
clientName: "客户名称"
}
]
}
*/
export const selectDateGroundList = (data, config= {}) => http.post('/ground-business/ground/selectDateGroundList', data, config)
... ...
const http = uni.$u.http
/**
* 登录
* @param {
account: 用户名,
password: 密码
}
*/
export const userLogin = (data, config= {}) => http.post('/login', data, config)
/**
* 注册
* @param {
account: 用户名,
password: 密码
}
*/
export const userReg = (data, config= {}) => http.post('/users/register', data, config)
/**
* 微信登陆授权
* @param {
returnUrl: 请求地址
}
*/
export const userWXLogin = (data) => http.get('/weChatLogin/authorize', {params: data })
/**
* 通过openid登陆
* @param {
openid: 前端传入用户openid
type: 0公众号授权1小程序授权
}
*/
export const userOpenIdLogin = (data) => http.get('/weChatLogin/authorize', {params: data })
/**
* 获取用户信息
*/
export const getUserInfo = () => http.get('/system/user/profile', {custom: {auth: true}})
/**
* 修改用户信息
*/
export const updateUserInfo = (data) => http.put('/system/user/profile', data, {custom: {auth: true}})
/**
* 修改用户密码
*/
export const updateUserPwd = (data) => http.put('/system/user/profile/updatePwd', {}, {params: data, custom: {auth: true}})
/**
* 商家注册
* @param {
username: "用户名",
password: "密码",
businessName: "商家名称",
businessLicenseNo: "统一社会信用代码",
gymName: "球馆名称",
contacts: "联系人",
contactsPhone: "联系人电话",
province: "省",
city: "市",
county: "县",
address: "地址",
gymPicture: "球馆图片"
}
*/
export const businessReg = (data, config={}) => http.post('/ground-business/business/register',data, config)
/**
* 查询可提现金额
* * @returns 返回信息对象:{msg, code, data}
*/
export const getAmount = (data, config= {}) => http.get('/ground-business/cash/cashAvaliable', {params: data, custom: {auth: true} })
/**
* 申请提现
* * @param {
cashoutAmount: 提现金额
}
*/
export const cashAmout = (data) => http.post('/ground-business/cash/cashApply', data, {custom: {auth: true}})
/**
* 添加提现账户
* * @param {
account: "卡号",
accountName: "开户名称",
accountBank: "开户行"
}
*/
export const addBank = (data) => http.post('/ground-business/account', data, {custom: {auth: true} })
/**
* 修改提现账户
* * @param {
account: "卡号",
accountName: "开户名称",
accountBank: "开户行"
}
*/
export const updateBank = (data) => http.put('/ground-business/account', data, {custom: {auth: true} })
/**
* 删除提现账户(解除绑定银行卡)
* * @param {
account: "卡号",
accountName: "开户名称",
accountBank: "开户行"
}
*/
export const deleteBank = (accountIds) => http.delete(`/ground-business/account/${accountIds}`,{}, {custom: {auth: true} })
/**
* 根据businessId获取商家提现账户信息
* * @param {
businessId: "商家ID"
}
*/
export const getBank = (businessId) => http.get(`/ground-business/account/${businessId}`, {custom: {auth: true} })
/**
* 查询当前用户钱包余额
* @returns 返回信息对象:{msg, code, data: {walletId, money: '金额', username: '用户名'}}
*/
export const getUserAmout = () => http.get('/ground-business/wallet/balance', {custom: {auth: true} })
/**
* 钱包充值
* @param {
amount:充值金额,
type: 0公众号1小程序
}
* @returns 返回信息对象:{appId, nonceStr, paySign, signType, prepayId, timeStamp, packageValue }
*/
export const recharge = (data) => http.get('/ground-business/wallet/charge', {params: data, custom: {auth: true} })
/**
* 获取当前商家
* @returns 返回信息对象:{
businessId: "商家ID",
businessName: "商家名称",
businessLicenseNo: "统一社会信用代码",
gymName: "球馆名称",
contacts: "联系人",
contactsPhone: "联系人电话",
province: "省",
city: "市",
county: "县",
address: "地址",
gymNum: "球馆号",
serviceCharge: "支付手续费",
commission: "佣金",
username: "用户名",
businessLicensePicture: "商家许可证照片"
gymPicture: "球馆图片",
latitude: null
longitude: null
order: null
orderDate: null
orderEndTime: null
orderStartTime: null
params: {}
province: "广西壮族自治区"
remark: null
searchValue: null
serviceCharge: 0
sportsRange: "篮球,足球"
updateBy: null
updateTime: null
username: "我是测试"
* }
*/
export const getBusinessInfo = (data) => http.get('/ground-business/business/currentBusiness', {params: data, custom: {auth: true} })
/**
* 修改当前商家信息
* @param {
businessId: "商家ID",
businessName: "商家名称",
businessLicenseNo: "统一社会信用代码",
gymName: "球馆名称",
contacts: "联系人",
contactsPhone: "联系人电话",
province: "省",
city: "市",
county: "县",
address: "地址",
gymNum: "球馆号",
serviceCharge: "支付手续费",
commission: "佣金",
username: "用户名",
businessLicensePicture: "商家许可证照片"
gymPicture: "球馆图片",
latitude: null
longitude: null
order: null
orderDate: null
orderEndTime: null
orderStartTime: null
params: {}
province: "广西壮族自治区"
remark: null
searchValue: null
serviceCharge: 0
sportsRange: "篮球,足球"
updateBy: null
updateTime: null
username: "我是测试"
}
*/
export const updateBusinessInfo = (data) => http.put('/ground-business/business', data, {custom: {auth: true} })
\ No newline at end of file
... ...
/* utils.scss */
@import "/utils/utils.scss";
page {
background: #fafafa;
}
@keyframes rotate {
0% {
transform: rotate(0deg) scale(1);
}
100% {
transform: rotate(360deg) scale(1);
}
}
/* #ifdef H5*/
uni-page {
box-shadow: 0 1rpx 44rpx rgba(169, 169, 169, .3);
}
.uni-app--showlayout+uni-tabbar.uni-tabbar-bottom,
.uni-app--showlayout+uni-tabbar.uni-tabbar-bottom .uni-tabbar,
.uni-app--showlayout+uni-tabbar.uni-tabbar-top,
.uni-app--showlayout+uni-tabbar.uni-tabbar-top .uni-tabbar {
left: var(--window-left);
right: var(--window-right);
}
.footer-fixed {
left: var(--window-left) !important;
right: var(--window-right) !important;
}
.u-mask,.u-drawer {
left: var(--window-left) !important;
right: var(--window-right) !important;
}
/* #endif */
... ...
<template>
<view class="comment_card" :class="{isPadding: isPadding}">
<CommentRate></CommentRate>
<view class="comment_content u-line-2">
不错不错,这个地方环境非常好,水饮料种类也很多,非常推荐过来,尤其是附近的小伙伴一定要过来看看
</view>
<!-- 评价图片 -->
<u-album :urls="urls2" :rowCount="4"></u-album>
</view>
</template>
<script>
import CommentRate from './commentRate.vue'
export default{
components: { CommentRate },
props: {
isPadding: {
type: Boolean,
default: false
}
},
data(){
return {
urls2: [
'https://cdn.uviewui.com/uview/album/1.jpg',
'https://cdn.uviewui.com/uview/album/2.jpg',
'https://cdn.uviewui.com/uview/album/3.jpg',
'https://cdn.uviewui.com/uview/album/4.jpg',
'https://cdn.uviewui.com/uview/album/5.jpg',
'https://cdn.uviewui.com/uview/album/6.jpg',
'https://cdn.uviewui.com/uview/album/7.jpg',
'https://cdn.uviewui.com/uview/album/8.jpg',
'https://cdn.uviewui.com/uview/album/9.jpg',
'https://cdn.uviewui.com/uview/album/10.jpg'
]
}
}
}
</script>
<style scoped lang="scss">
.comment_card{
margin-bottom: 40rpx;
background-color: #fff;
}
.isPadding{
border-radius: 16rpx;
padding: 30rpx 24rpx 40rpx;
}
.comment_content{
color: #333;
font-size: 24rpx;
line-height: 40rpx;
margin: 24rpx 0 18rpx 0;
}
.album {
@include flex;
align-items: flex-start;
&__avatar {
background-color: $u-bg-color;
padding: 5px;
border-radius: 3px;
}
&__content {
margin-left: 10px;
flex: 1;
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="commentRate">
<view class="left">
<image class="avatar" src="https://cdn.uviewui.com/uview/album/2.jpg" mode="widthFix"></image>
</view>
<view class="right">
<view class="info">
<view class="top">
<text class="name">CLOOL</text>
<text class="arenaNum">预订场号:3号场</text>
</view>
<u-rate :count="count" active-color="#FF9900" size="20" inactiveColor="#CDCDCD" v-model="value"></u-rate>
</view>
<view class="comment_time">2022-12-26</view>
</view>
</view>
</template>
<script>
export default{
data(){
return {
count: 5,
value: 2
}
}
}
</script>
<style lang="scss" scoped>
.commentRate{
display: flex;
align-items: center;
justify-content: space-between;
font-size: 24rpx;
line-height: 32rpx;
color: #999;
.left{
width: 64rpx;
height: 64rpx;
border-radius: 50%;
overflow: hidden;
margin-right: 16rpx;
.avatar{
width: 100%;
height: 100%;
}
}
.right{
display: flex;
justify-content: space-between;
flex: 1;
height: 100%;
.top {
margin-bottom: 8rpx;
.name{
color: #333;
margin-right: 10rpx;
}
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<u-tabbar
:value="tabbarValue"
:fixed="true"
:border="false"
:placeholder="true"
:safeAreaInsetBottom="true"
activeColor="#333"
inactiveColor="#999"
:zIndex="9999"
>
<u-tabbar-item name="home" text="首页" @click="navRouter('/pages/home/home')">
<image
style="width: 48rpx;height: 48rpx;"
slot="active-icon"
src="@/static/tabbarIcon/home_active.png"
mode="widthFix"
></image>
<image
style="width: 48rpx;height: 48rpx;"
slot="inactive-icon"
src="@/static/tabbarIcon/home.png"
mode="widthFix"
></image>
</u-tabbar-item>
<u-tabbar-item name="mall" text="商城" @click="navRouter('/pages/mall/mall')">
<image
style="width: 48rpx;height: 48rpx;"
slot="active-icon"
src="@/static/tabbarIcon/mall_active.png"
mode="widthFix"
></image>
<image
style="width: 48rpx;height: 48rpx;"
slot="inactive-icon"
src="@/static/tabbarIcon/mall.png"
mode="widthFix"
></image>
</u-tabbar-item>
<u-tabbar-item name="order" text="订单" @click="navRouter('/pages/order/order')">
<image
style="width: 48rpx;height: 48rpx;"
slot="active-icon"
src="@/static/tabbarIcon/order_active.png"
mode="widthFix"
></image>
<image
style="width: 48rpx;height: 48rpx;"
slot="inactive-icon"
src="@/static/tabbarIcon/order.png"
mode="widthFix"
></image>
</u-tabbar-item>
<u-tabbar-item name="data" text="数据" @click="navRouter('/pages/data/data')">
<image
style="width: 48rpx;height: 48rpx;"
slot="active-icon"
src="@/static/tabbarIcon/data_active.png"
mode="widthFix"
></image>
<image
style="width: 48rpx;height: 48rpx;"
slot="inactive-icon"
src="@/static/tabbarIcon/data.png"
mode="widthFix"
></image>
</u-tabbar-item>
<u-tabbar-item name="my" text="我的" @click="navRouter('/pages/my/my')">
<image
style="width: 48rpx;height: 48rpx;"
slot="active-icon"
src="@/static/tabbarIcon/my_active.png"
mode="widthFix"
></image>
<image
style="width: 48rpx;height: 48rpx;"
slot="inactive-icon"
src="@/static/tabbarIcon/my.png"
mode="widthFix"
></image>
</u-tabbar-item>
</u-tabbar>
</template>
<script>
export default {
props: {
tabbarValue: {
type: String,
default: 'home'
}
},
name:"commonTabbar",
methods: {
navRouter(path, name){
uni.redirectTo({
url: path
})
}
}
}
</script>
<style lang="scss" scoped>
.u-page__item__slot-icon{
width: 48rpx;
}
</style>
\ No newline at end of file
... ...
<template>
<view>
<view class="dis-flex flex-y-center flex-x-between">
<text class="title_common">今日实时数据</text>
<text class="col-9 f-24">04-15 17:20</text>
</view>
<view class="dis-flex flex-y-center flex-x-between">
<view class="box active">
<text class="f-24">预计收入</text>
<view class="f-36 f-w-600">{{ formatPrice[0] }}<text class="f-24 f-w-500">{{ '.' + formatPrice[1] }}</text></view>
</view>
<view class="box">
<text class="f-24">有效订单</text>
<view class="f-36 f-w-600">50</view>
</view>
</view>
</view>
</template>
<script>
export default {
name:"dataCard",
props: {
title: {
type: String,
default: ''
},
time: {
type: String,
default: ''
},
orderNum: {
type: Number,
default: 0
},
proReveenue: {
type: String,
default: ''
}
},
computed: {
formatPrice(){
return this.proReveenue.split('.')
}
}
}
</script>
<style lang="scss" scoped>
.box{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10rpx;
width: 320rpx;
height: 130rpx;
background: #F6F7FB;
border-radius: 12rpx;
color: #3d3d3d;
margin-top: 44rpx;
&.active{
background: #FFE8DA;
border: 2rpx solid #FFB336;
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="pro_income" :style="{marginTop: marginTop + 'px' }">
<view v-show="showTitle" class="f-32 l-h-38 col-3d f-w-500 mb-20">预计收入</view>
<view class="computed" :style="{backgroundColor: bgColor}">
<view class="cell">
<text class="col-9 f-24 l-h-32 f-w-400">预计收入</text>
<text>487.50</text>
</view>
<text class="string">=</text>
<view class="cell">
<text class="col-9 f-24 l-h-32 f-w-400">今日已完单</text>
<text>458.41</text>
</view>
<text class="string">+</text>
<view class="cell">
<text class="col-9 f-24 l-h-32 f-w-400">今日下单进行中</text>
<text>29.09</text>
</view>
</view>
</view>
</template>
<script>
export default {
name:"dataComputed",
props: {
showTitle: {
type: Boolean,
default: true
},
bgColor: {
type: String,
default: '#F6F7FB'
},
marginTop: {
type: Number,
default: 40
}
}
}
</script>
<style lang="scss" scoped>
.pro_income{
.computed{
display: flex;
align-items: center;
padding: 0 20rpx;
height: 120rpx;
background: #F6F7FB;
border-radius: 12rpx;
.cell{
font-weight: 500;
color: #3d3d3d;
font-size: 32rpx;
line-height: 42rpx;
}
.string{
color: #3d3d3d;
font-size: 36rpx;
line-height: 48rpx;
font-weight: 600;
margin: 0 30rpx;
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="detail_content">
<!-- 时间列表 -->
<view class="time_list">
<view
v-for="item in timeList"
:key="item.id"
class="time_item"
:class="{active: current === item.id}"
@click="current = item.id"
>
{{ item.text }}
</view>
</view>
<!-- 收入列表 -->
<view class="revenue">
<DataComputed v-show="current === 0" :showTitle="false" bgColor="transparent" :marginTop="0" />
<view v-show="current === 3" class="month">
4<text class="f-36 l-h-48">月</text>
</view>
<view v-show="current !== 0">
<view class="dis-flex flex-dir-column flex-y-center">
<text class="f-w-600 col-3d f-48 l-h-64">123456</text>
<text class="f-28 col-9 l-h-38 m-top10">总收入</text>
</view>
</view>
</view>
<view class="px-20" style="background-color: #fff;">
<RevenueCard v-for="item in 5" :key="item" />
</view>
</view>
</template>
<script>
import DataComputed from '@/components/data/dataComputed.vue'
import RevenueCard from '@/components/data/revenueCard.vue'
export default {
name:"dataDetail",
components: { DataComputed, RevenueCard },
data() {
return {
current: 0,
timeList: [
{ id: 0, text: '今日', time: new Date() },
{ id: 1, text: '近7日', time: '' },
{ id: 2, text: '近30日', time: '' },
{ id: 3, text: '近1年', time: '' }
]
}
}
}
</script>
<style lang="scss" scoped>
.detail_content{
padding: 20rpx 30rpx 0;
.time_list{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 68rpx;
.time_item{
width: 160rpx;
height: 60rpx;
background: #FFF0C3;
color: #666;
font-size: 28rpx;
line-height: 60rpx;
border-radius: 12rpx;
text-align: center;
&.active{
color: #333;
background: linear-gradient( 45deg, #FEE14D 0%, #FFC24D 100%);
}
}
}
.revenue{
position: relative;
display: flex;
align-items: center;
justify-content: center;
height: 200rpx;
background: radial-gradient(ellipse at 10% 20%, #e186ff33 0%, #86fbff33 90%);
border-radius: 12rpx 12rpx 0rpx 0rpx;
.month{
position: absolute;
top: -44rpx;
left: 40rpx;
color: #3d3d3d;
font-size: 72rpx;
font-weight: 500;
line-height: 96rpx;
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="data_content">
<!-- 今日数据 -->
<view class="today_data">
<view class="px-20">
<DataCard title="今日实时数据" time="04-15 17:20" :orderNum="50" proReveenue="487.50" />
<DataComputed />
</view>
<view class="echarts_box">
<Echarts :option="lineOption" />
</view>
</view>
<!-- 时间范围内数据 -->
<view class="time_data">
<view class="time_list">
<view class="time_item active">近7日</view>
<view class="time_item">近30日</view>
<view class="time_item">近1年</view>
</view>
<view class="bg-fff px-20 py-38" style="border-radius: 12rpx;">
<DataCard title="近7日数据" time="04.08-04.14" :orderNum="379" proReveenue="4580.50" />
<view class="echarts_box">
<Echarts :option="barOption" />
</view>
</view>
</view>
</view>
</template>
<script>
import DataComputed from '@/components/data/dataComputed.vue'
import DataCard from '@/components/data/dataCard.vue'
import Echarts from '@/components/echarts.vue'
export default {
name:"dataPandect",
components: { DataCard, DataComputed, Echarts },
data() {
return {
// 一周内柱状图表
barOption:{
title: {
text: '收入数据图',
textStyle: {
fontSize: '16px',
color: '#3d3d3d',
fontWeight: 500
}
},
color: ['#FFB336'],
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
name: '日期',
nameLocation: 'start',
nameTextStyle: {
padding: [0, 10, 0, 0],
color: '#999999'
},
axisLabel: {
textStyle: {
color: '#999'
}
},
type: 'category',
data: ['04.08', '04.09', '04.10', '04.11', '04.12', '04.13', '04.14'],
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
name: '单位:元',
nameTextStyle: {
padding: [0, 40, 0, 0],
color: '#999999'
},
axisLabel: {
textStyle: {
color: '#999'
}
},
type: 'value'
}
],
series: [
{
name: 'Direct',
type: 'bar',
barWidth: '30%',
data: [800, 3300, 1800, 950, 2756, 925, 1920]
}
]
},
// 今日数据图标
lineOption: {
tooltip: {
trigger: 'axis'
},
legend: {
data: ['今日预计收入', '昨日收入']
},
grid: {
left: '6%',
right: '4%',
bottom: '9%',
containLabel: true
},
xAxis: {
nameLocation: 'start',
nameGap: 30,
type: 'category',
boundaryGap: false,
data: [1, 4, 7, 10, 13, 16, 19, 22],
name: '时段'
},
yAxis: {
nameLocation: 'end',
type: 'value',
name: '单位:元',
minInterval: 0.1, //分割刻度
interval: 200,
},
series: [
{
name: '今日预计收入',
data: [0, 0, 0, 58, 210, 380, 450, 800],
type: 'line',
itemStyle: {
normal: {
color: '#0472FB',
lineStyle: {
color: '#0472FB'
}
}
},
areaStyle: {
color: 'rgba(4,114,251,0.3)'
}
},
{
name: '昨日收入',
data: [0, 0, 0, 110, 180, 480, 530, 900],
type: 'line',
itemStyle: {
normal: {
color: '#FFB336',
lineStyle: {
color: '#FFB336'
}
}
},
areaStyle: {
opacity: 0
}
}
]
},
// 长时间图表
longTimeOption: {
title: {
text: 'Stacked Area Chart'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#6a7985'
}
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: ['2024.03.14', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', '2024.04.14'],
axisLabel: {
interval:5
}
}
],
yAxis: [
{
show: false,
type: 'value'
}
],
series: [
{
name: 'Email',
type: 'line',
stack: 'Total',
areaStyle: {},
smooth:true,
itemStyle: {
normal: {
color: "#FFB336", //改变折线点的颜色
lineStyle: {
color: "#FFB336", //改变折线颜色
},
}
},
areaStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{
offset: 0.6,
color: '#FFCB74'
},
{
offset: 1,
color: '#fff'
}
]
}
},
data: [120, 132, 101, 134, 90, 230, 210]
}
]
}
}
}
}
</script>
<style lang="scss" scoped>
.data_content{
padding: 20rpx 30rpx 0;
.echarts_box{
height: 580rpx;
margin-top: 40rpx;
}
.today_data{
padding: 38rpx 0;
background: #FFFFFF;
border-radius: 12rpx;
}
.time_data{
margin-top: 40rpx;
.time_list{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 40rpx;
.time_item{
width: 200rpx;
height: 60rpx;
background: #FFF0C3;
color: #666;
font-size: 28rpx;
line-height: 60rpx;
border-radius: 12rpx;
text-align: center;
&.active{
color: #333;
background: linear-gradient( 45deg, #FEE14D 0%, #FFC24D 100%);
}
}
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="revenueCard">
<view class="f-24 l-h-32 mb-10">
<text class="col-3 ">10:31</text>
<text class="col-9 m-l-20">订单流水号:000026</text>
</view>
<view class="dis-flex flex-y-center flex-x-between">
<view class="left dis-flex flex-dir-column">
<text class="col-3d f-28 l-h-38">今麦郎熟水凉白开饮用水</text>
<text class="col-9 f-24 l-h-32">500ml</text>
</view>
<view class="right dis-flex flex-dir-column col-primary">
<text class="f-w-500 f-28 l-h-38 t-r">+2</text>
<text class="f-24 l-h-32">下单进行中</text>
</view>
</view>
</view>
</template>
<script>
export default {
}
</script>
<style lang="scss" scoped>
.revenueCard{
background-color: #fff;
padding: 40rpx 0;
border-bottom: 2rpx solid #EEEEEE;
}
</style>
\ No newline at end of file
... ...
<template>
<view>
<l-echart ref="chartRef" @finished="init"></l-echart>
</view>
</template>
<script>
import * as echarts from '@/pages_data/static/echarts.min.js'
export default {
props: {
option: {
type: Object,
require: true
}
},
// 组件能被调用必须是组件的节点已经被渲染到页面上
methods: {
async init() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef.init(echarts);
chart.setOption(this.option)
}
}
}
</script>
<style>
</style>
\ No newline at end of file
... ...
<template>
<view v-show="goodsList.length > 0" class="cate-right-cont">
<view class="cate-two-box">
<view class="cate-cont-box">
<view class="w-full" v-for="(item, idx) in goodsList" :key="idx" @click="goodDetail(item.id)">
<view class="cate-img-padding">
<view class="content-left">
<image class="image" mode="widthFix" :src="item.pic"></image>
</view>
<view class="content-right">
<view class="title u-line-2">
{{ item.name }}
</view>
<u-icon name="arrow-right-double"></u-icon>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
name:"goodsCard",
props: {
goodsList: {
type: Array,
require: true
}
},
methods: {
goodDetail(goodsID){
uni.navigateTo({
url: '/pages_mall/goodsDetail/goodsDetail?goods_id=' + goodsID
})
}
}
}
</script>
<style lang="scss" scoped>
// 右侧二级分类
.cate-cont-box {
margin-bottom: 30rpx;
padding-bottom: 10rpx;
background: #fff;
overflow: hidden;
.cate-img-padding{
display: flex;
align-items: center;
.content-left{
width: 120rpx;
height: 120rpx;
.image{
width: 100%;
}
}
.content-right{
display: flex;
align-items: center;
justify-content: center;
flex: 1;
height: 120rpx;
padding: 5rpx 30rpx;
.title{
color: #333;
font-size: 26rpx;
font-weight: 500;
margin-bottom: 10rpx;
}
.content-title{
display: inline-block;
color: #999;
font-size: 22rpx;
margin: 15rpx 0 15rpx 0;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.tip{
font-size: 24rpx;
margin-bottom: 12rpx;
.delivery{
width: 80rpx;
height: 24rpx;
margin-left: 10rpx;
border: 1px solid #40AE36;
border-radius: 4rpx;
padding: 3rpx;
color: #40AE36;
}
}
.price{
position: relative;
font-size: 22rpx;
color: #999;
margin-top: 10rpx;
.price-detail{
width: 116rpx;
height: 27rpx;
font-size: 32rpx;
font-family: PingFangSC;
font-weight: 500;
color: #F55726;
}
.price-old{
width: 90rpx;
height: 21rpx;
font-size: 22rpx;
font-family: PingFangSC;
font-weight: 400;
color: #CCCCCC;
margin-left: 6rpx;
}
.addCart{
position: absolute;
top: -8rpx;
right: 6rpx;
width: 46rpx;
height: 46rpx;
background-color: #40AE36;
border-radius: 50%;
text-align: center;
line-height: 44rpx;
}
}
}
}
.name {
display: block;
padding-bottom: 30rpx;
text-align: center;
font-size: 26rpx;
color: #444444;
}
.cate-img-padding {
padding: 16rpx 16rpx 4rpx 16rpx;
}
.cate-img {
position: relative;
width: 100%;
padding-top: 100%;
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="access">
<view class="access_head">
<text class="col-3d f-w-500 f-32 m-r-10">近30天</text>数据更新时间06/13
</view>
<view class="access_body">
<view class="access_item">
<text>访问人数</text>
<text class="number f-w-500 f-36 l-h-48 m-top10">0</text>
</view>
<view class="access_item">
<text>订单数 ></text>
<text class="number f-w-500 f-36 l-h-48 m-top10">0</text>
</view>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
// 访问量
.access{
width: 100%;
height: 240rpx;
background-color: #fff;
border-radius: 12rpx;
padding: 20rpx;
box-sizing: border-box;
.access_head{
color: #999;
font-size: 20rpx;
}
.access_body{
display: flex;
align-items: center;
justify-content: space-around;
.access_item{
display: flex;
flex-direction: column;
align-items: center;
color: #3d3d3d;
font-size: 24rpx;
line-height: 32rpx;
margin-top: 40rpx;
.number{
font-family: 'HelveticaNeue-Medium';
}
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="existing_bureau">
<view v-for="item in 3" :key="item" class="bureau_item" @click="goRouter">
<view class="left">
<image class="cover_img" src="@/static/homeImg/bgimg.webp" mode=""></image>
</view>
<view class="right">
<text class="f-w-500 f-28 l-h-38 mb-10">北宋奇案·汴京</text>
<view class="line-2">
<text>1号包间</text>
<text class="m-l-20">¥99/人</text>
</view>
<text class="col-3d">06月03日 今天19:30</text>
<text class="detail">详情</text>
<view class="avatar_group">
<u-avatar-group
:urls="urls"
size="15"
maxCount="4"
gap="0.4"
/>
<text class="col-3d">等7人</text>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data(){
return {
urls: [
'https://cdn.uviewui.com/uview/album/1.jpg',
'https://cdn.uviewui.com/uview/album/2.jpg',
'https://cdn.uviewui.com/uview/album/3.jpg',
'https://cdn.uviewui.com/uview/album/4.jpg',
'https://cdn.uviewui.com/uview/album/7.jpg',
'https://cdn.uviewui.com/uview/album/6.jpg',
'https://cdn.uviewui.com/uview/album/5.jpg'
]
}
},
methods: {
goRouter(){
uni.navigateTo({
url: '/pages/bureauDetail/bureauDetail'
})
}
}
}
</script>
<style scoped lang="scss">
.existing_bureau{
padding: 0 14rpx;
.bureau_item{
display: flex;
align-items: center;
border-bottom: 1px solid #eee;
padding: 30rpx 0;
&:last-child{
border-bottom: 0;
}
.left{
width: 120rpx;
height: 120rpx;
border-radius: 12rpx;
overflow: hidden;
margin-right: 20rpx;
.cover_img{
width: 100%;
height: 100%;
}
}
.right{
position: relative;
flex: 1;
display: flex;
flex-direction: column;
font-size: 24rpx;
line-height: 32rpx;
.line-2{
color: #FFD900;
margin-bottom: 8rpx;
}
.detail {
position: absolute;
top: 0;
right: 40rpx;
color: #FFD900;
&::after{
position: absolute;
top: 50%;
right: -22rpx;
transform: translateY(-50%);
content: '';
width: 0;
height: 0;
border-top: 6rpx solid transparent;
border-bottom: 6rpx solid transparent;
border-left: 12rpx solid #FFD900;
}
}
.avatar_group{
position: absolute;
bottom: -8rpx;
right: 36rpx;
display: flex;
align-items: center;
gap: 4rpx;
}
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="pitch_list">
<view v-for="item in pitchList" :key="item.groundId" class="pitch_item" @click="goRouter(`/pages_arenaControl/addArena/addArena?groundId=${item.groundId}`)">
<view class="left">
<image class="cover_img" :src="item.groundPhotos"></image>
</view>
<view class="right">
<view class="right_text">
<text class="f-w-500 f-28 l-h-38 col-3d mb-10">{{ item.groundNum }}号包间</text>
<text>{{ item.isOutdoor === 0 ? '室内' : '室外' }}<text class="m-l-20">{{ item.price }}¥/小时</text></text>
</view>
</view>
</view>
</view>
</template>
<script>
import { pro_http } from '@/utils/baseUrl.js'
export default {
name:"pitchCard",
props: {
pitchList: {
type: Array,
require: true
}
},
data() {
return {pro_http}
},
computed: {
formatPhoto(){
return (groundPhotos) => {
let imgList = groundPhotos.split(',')
return imgList[0]
}
}
},
methods: {
goRouter(path){
uni.navigateTo({
url: path
})
}
}
}
</script>
<style lang="scss" scoped>
.pitch_list{
display: flex;
flex-direction: column;
padding: 30rpx 20rpx;
.pitch_item{
position: relative;
display: flex;
align-items: center;
overflow: hidden;
margin-bottom: 20rpx;
&:last-child {
margin-bottom: 0;
}
.left{
width: 120rpx;
height: 120rpx;
border-radius: 12rpx;
margin-right: 40rpx;
overflow: hidden;
.cover_img{
width: 100%;
height: 100%;
}
}
.right{
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
.right_text{
display: flex;
flex-direction: column;
justify-content: center;
font-size: 24rpx;
line-height: 32rpx;
color: #FFD900;
}
.QRCode{
right: 60rpx;
width: 72rpx;
height: 72rpx;
}
}
}
.add_mode{
display: flex;
align-items: center;
justify-content: center;
font-size: 28rpx;
line-height: 38rpx;
color: #999;
height: 120rpx;
background: #FFFFFF;
margin-top: 20rpx;
border-radius: 12rpx;
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="play_list">
<view v-for="(item, index) in navList" :key="index" :class="{active: index === current}" class="play_item" @click="toggle(item.id,index)">
<text>{{ item.title }}</text>
<image class="bg_nav" :src="item.bgImg" mode="widthFix"></image>
</view>
</view>
</template>
<script>
import bg1 from '@/static/homeImg/bg_1.png'
import bg2 from '@/static/homeImg/bg_2.png'
import bg3 from '@/static/homeImg/bg_3.png'
export default {
data() {
return {
current: 0,
navList: [
{ id: 1, title: '狼人杀', bgImg: bg1},
{ id: 2, title: '剧本杀', bgImg: bg2},
{ id: 3, title: '密室逃脱', bgImg: bg3}
]
}
},
methods: {
toggle(id, index){
this.current = index
this.$emit('playName', id)
}
}
}
</script>
<style lang="scss" scoped>
.play_list{
display: flex;
align-items: flex-end;
justify-content: space-between;
min-height: 100rpx;
margin: 20rpx 0;
.play_item{
position: relative;
width: 200rpx;
height: 80rpx;
text-align: center;
line-height: 80rpx;
color: #fff;
font-size: 28rpx;
background: linear-gradient( 45deg, #966CFF 0%, #C3ACFF 59%);
border-radius: 12rpx;
transition: all .3s ease;
&:nth-child(2){
.bg_nav{
width: 96rpx;
right: -11%;
}
}
&:nth-child(3){
.bg_nav{
width: 78rpx;
right: -8%;
}
}
.bg_nav{
position: absolute;
top: 0;
right: -20%;
width: 135rpx;
}
&.active{
width: 250rpx;
height: 100rpx;
line-height: 100rpx;
font-weight: 500;
font-size: 36rpx;
.bg_nav{
transform: scale(1.5);
top: 20rpx;
right: -32rpx;
}
}
&:nth-child(2) {
background: linear-gradient( 45deg, #FF9B8A 0%, #FFCBC2 68%);
}
&:nth-child(3) {
background: linear-gradient( 45deg, #75ACFF 0%, #A0C6FF 57%);
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="scriptList">
<view v-for="item in 3" :key="item" class="scritp_item" @click="goRouter">
<view class="left">
<image class="cover_img" src="@/static/homeImg/bgimg.webp" mode=""></image>
<text class="people_num">6人本</text>
</view>
<view class="right">
<text class="f-32 col-3d f-w-500 l-h-38 mb-10">北宋奇案·汴京</text>
<text class="col-9">古风/推理/悬疑/高阶</text>
<text class="rate">8.1分</text>
<text class="u-line-1 col-9">一段北宋时期耻辱的历史,两个南宋同朝...</text>
</view>
</view>
</view>
</template>
<script>
export default {
methods: {
goRouter(){
uni.navigateTo({
url: '/pages/bureauDetail/bureauDetail'
})
}
}
}
</script>
<style lang="scss" scoped>
.scriptList{
padding: 0 20rpx;
.scritp_item{
display: flex;
align-items: center;
padding: 30rpx 0;
border-bottom: 1px solid #eee;
&:last-child{
border-bottom: 0;
}
.left{
position: relative;
width: 140rpx;
height: 180rpx;
border-radius: 8rpx;
overflow: hidden;
margin-right: 20rpx;
.cover_img{
width: 100%;
height: 100%;
}
.people_num{
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 32rpx;
background-color: rgba(0, 0, 0, 0.7);
line-height: 32rpx;
color: #fff;
text-align: center;
font-size: 24rpx;
}
}
.right{
display: flex;
flex-direction: column;
flex: 1;
font-size: 24rpx;
line-height: 32rpx;
.rate{
color: #FFD900;
margin-top: 18rpx;
margin-bottom: 14rpx;
}
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="head_box">
<u-navbar title="商城管理" leftIconSize="0" placeholder :autoBack="true" bgColor="transparent" :titleStyle="{fontSize: '36rpx', color: '#333', fontWeight: 500}" />
<view class="dis-flex flex-x-around mt-60">
<view class="dis-flex flex-dir-column flex-y-center col-3d">
<text class="f-28 l-h-38 mb-10">今日预计收入/元</text>
<view class="f-48 f-w-500">487<text class="f-24">.05</text></view>
</view>
<view class="dis-flex flex-dir-column flex-y-center col-3d">
<text class="f-28 l-h-38 mb-10">有效订单/单</text>
<view class="f-48 f-w-500">50<text class="f-24"></text></view>
</view>
</view>
<view class="function_list">
<view v-for="item in funcionList" :key="item.id" class="dis-flex flex-dir-column flex-y-center" @click="goRouter(item.routerPath)">
<image style="width: 80rpx;" class="mb-10" :src="item.iconName" mode="widthFix"></image>
<text class="l-h-32 col-3d f-24">{{ item.text }}</text>
</view>
</view>
</view>
</template>
<script>
import add from '@/static/mallImg/add_goods.png'
import edit from '@/static/mallImg/edit_goods.png'
import del from '@/static/mallImg/del_goods.png'
import info from '@/static/mallImg/info_goods.png'
export default {
name:"mallHeatar",
data() {
return {
funcionList: [
{ id: 1, text: '新建商品', iconName: add, routerPath: '/pages_mall/goods/addGoods' },
{ id: 2, text: '商品编辑', iconName: edit, routerPath: '/pages_mall/goods/edidGoods' },
{ id: 3, text: '下架商品', iconName: del, routerPath: '/pages_mall/goods/underGoods' },
{ id: 4, text: '库存信息', iconName: info, routerPath: '/pages_mall/goods/stockInformation' },
]
};
},
methods: {
goRouter(path){
uni.navigateTo({
url: path
})
}
}
}
</script>
<style lang="scss" scoped>
.head_box{
height: 596rpx;
background: linear-gradient(to right, #F7ECEC, #ECF1F7);
.function_list{
display: flex;
justify-content: space-between;
margin: 26rpx 30rpx 0;
padding: 40rpx 38rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="goods_show">
<view class="show_title">商品预览</view>
<view class="cate-content">
<!-- 左侧 一级分类 -->
<scroll-view class="cate-left" :scroll-y="true" :style="{ height: `${scrollHeight}px` }">
<text v-for="(item, index) in classifyList" :key="index" class="type-nav" :class="{ selected: curIndex == index }" @click="handleSelectNav(index)">{{ item.name }}</text>
</scroll-view>
<!-- 右侧 二级分类 -->
<scroll-view class="cate-right" :scroll-y="true" :style="{ height: `${scrollHeight}px` }">
<!-- 分类显示列表 -->
<GoodsList :goodsList="showProductList" />
<!-- 空数据显示 -->
<view v-show="showProductList.length === 0" >
<u-empty mode="list" />
</view>
</scroll-view>
</view>
</view>
</template>
<script>
import GoodsList from '@/components/goodsList.vue'
export default {
name:"mallSelect",
components: { GoodsList },
props: {
scrollHeight: {
type: Number,
default: 0
}
},
data() {
return {
// 商品分类列表
classifyList: [
{name: '篮球'}, {name: '饮品'}, {name: '足球'}, {name: '羽毛球'}, {name: '乒乓球'}, {name: '棒球'}, {name: '排球'}, {name: '网球'}
],
showProductList: [
{id: 1, pic: 'https://cbu01.alicdn.com/img/ibank/2016/759/755/3743557957_600065101.jpg', name: '今麦郎熟水凉白开饮用核实过后广寒深宫hi哦干哈...'},
{id: 2, pic: 'https://cbu01.alicdn.com/img/ibank/2016/759/755/3743557957_600065101.jpg', name: '今麦郎熟水凉白开饮用核实过后广寒深宫hi哦干哈...'},
{id: 4, pic: 'https://cbu01.alicdn.com/img/ibank/2016/759/755/3743557957_600065101.jpg', name: '今麦郎熟水凉白开饮用核实过后广寒深宫hi哦干哈...'},
{id: 5, pic: 'https://cbu01.alicdn.com/img/ibank/2016/759/755/3743557957_600065101.jpg', name: '今麦郎熟水凉白开饮用核实过后广寒深宫hi哦干哈...'},
{id: 6, pic: 'https://cbu01.alicdn.com/img/ibank/2016/759/755/3743557957_600065101.jpg', name: '今麦郎熟水凉白开饮用核实过后广寒深宫hi哦干哈...'},
{id: 7, pic: 'https://cbu01.alicdn.com/img/ibank/2016/759/755/3743557957_600065101.jpg', name: '今麦郎熟水凉白开饮用核实过后广寒深宫hi哦干哈...'},
{id: 8, pic: 'https://cbu01.alicdn.com/img/ibank/2016/759/755/3743557957_600065101.jpg', name: '今麦郎熟水凉白开饮用核实过后广寒深宫hi哦干哈...'}
], // 当前展示商品列表
curIndex: 0, // 一级分类
activeIndex: 0, // 二级分类
}
},
methods: {
// 一级分类:选中分类
handleSelectNav(index) {
this.curIndex = index
this.activeIndex = 0
},
// 获取商品列表
async getShopList() {
},
// 显示当前商品列表
showProduct() {
},
onCellect(id) {
}
}
}
</script>
<style lang="scss" scoped>
.goods_show{
border-radius: 20rpx 20rpx 0 0;
overflow: hidden;
.show_title{
position: relative;
height: 84rpx;
box-sizing: border-box;
border-bottom: 2rpx solid #eee;
padding-left: 46rpx;
font-size: 32rpx;
font-weight: 500;
line-height: 84rpx;
background-color: #fff;
&::before{
content: '';
position: absolute;
top: 50%;
left: 30rpx;
transform: translateY(-50%);
width: 6rpx;
height: 24rpx;
border-radius: 20rpx;
background-color: #FFB336;
}
}
}
// 分类内容
.cate-content {
display: flex;
z-index: 1;
background: #fff;
}
// 一级分类+二级分类 20
.cate-left {
height: 100%;
display: flex;
flex-direction: column;
flex: 0 0 23%;
background: #f8f8f8;
color: #444;
}
.cate-right {
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
.secondary-nav{
position: relative;
height: 110rpx;
padding: 30rpx;
.nav-list{
display: inline-block;
font-size: 24rpx;
color: #666;
padding: 10rpx;
white-space: nowrap;
background-color: #EDEFF2;
border-radius: 6rpx;
margin-right: 12rpx;
&.activeStyle{
color: #333;
background-color: rgba(64, 174, 54, .2);
}
}
.showAll{
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 0;
right: 0;
width: 76rpx;
height: 110rpx;
background-color: #fff;
}
}
.cate-right-cont {
width: 100%;
display: flex;
flex-flow: row wrap;
align-content: flex-start;
.cate-two-box {
width: 100%;
}
}
}
// 左侧一级分类
.type-nav {
position: relative;
width: 180rpx;
height: 110rpx;
z-index: 10;
display: block;
font-size: 28rpx;
display: flex;
justify-content: center;
align-items: center;
&.selected {
background: #fff;
color: #FFB336;
border-right: none;
font-size: 28rpx;
&::before{
content: '';
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 6rpx;
height: 24rpx;
border-radius: 20rpx;
background-color: #FFB336;
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="function_card">
<view class="col-3d f-28 l-h-38 f-w-500 px-20 mb-20">门店管理</view>
<view class="function_list">
<view class="function_item" v-for="(item, index) in myMenu" :key="index" @click="goRouter(item.routerPath)">
<view class="list_img">
<image class="list_icon" :src="item.icon" mode="widthFix"></image>
</view>
<text class="col-3d f-24 l-h-32 m-top10">{{ item.text }}</text>
</view>
</view>
</view>
</template>
<script>
import Script from '@/static/myImg/script.png'
import Store from '@/static/myImg/store.png'
import Employee from '@/static/myImg/employee.png'
import Vip from '@/static/myImg/vip.png'
export default {
data(){
return {
myMenu: [
{ text: '剧本/主题', icon: Script, routerPath: '/pages_my/ScriptControl/ScriptControl' },
{ text: '门店管理', icon: Store, routerPath: '/pages_my/courtManage/courtManage' },
{ text: '员工管理', icon: Employee, routerPath: '/pages_my/employeeControl/employeeControl'},
{ text: '会员管理', icon: Vip, routerPath: '/pages_my/myVip/myVip'}
]
}
},
methods: {
goRouter(path){
uni.navigateTo({
url: path
})
}
}
}
</script>
<style scoped lang="scss">
.function_card{
background: #FFFFFF;
margin: 20rpx 30rpx 0;
border-radius: 12rpx;
padding: 20rpx 0;
.function_title{
line-height: 84rpx;
height: 84rpx;
padding-left: 36rpx;
font-size: 28rpx;
color: #333;
border-bottom: 2rpx solid #E1E1E1;
box-sizing: border-box;
}
.function_list{
display: flex;
gap: 28rpx;
flex-wrap: wrap;
padding: 22rpx 30rpx;
.function_item{
width: calc((100% - 90rpx) / 4);
display: flex;
flex-direction: column;
align-items: center;
font-size: 28rpx;
line-height: 40rpx;
color: #3d3d3d;
.list_img{
display: flex;
align-items: center;
justify-content: center;
width: 48rpx;
height: 48rpx;
margin-bottom: 14rpx;
.list_icon{
width: 100%;
}
}
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="function_card">
<view class="function_list">
<view class="function_item" v-for="(item, index) in myMenu" :key="index" @click="goRouter(item.routerPath)">
<view class="list_img">
<image class="list_icon" :src="item.icon" mode="widthFix"></image>
</view>
<text class="col-3d f-24 l-h-32 m-top10">{{ item.text }}</text>
</view>
</view>
</view>
</template>
<script>
import Reflects from '@/static/myImg/reflect.png'
import Recharge from '@/static/myImg/recharge.png'
import BankCard from '@/static/myImg/bank-card.png'
export default {
data(){
return {
myMenu: [
{ text: '提现', icon: Reflects, routerPath: '/pages_my/myReflect/myReflect?type='+ 0 },
{ text: '充值', icon: Recharge, routerPath: '/pages_my/myReflect/myReflect?type=' + 1 },
{ text: '银行卡', icon: BankCard, routerPath: '/pages_my/bankCard/bankCard'}
]
}
},
methods: {
goRouter(path){
uni.navigateTo({
url: path
})
}
}
}
</script>
<style scoped lang="scss">
.function_card{
background: #FFFFFF;
height: 140rpx;
box-sizing: border-box;
.function_title{
line-height: 84rpx;
height: 84rpx;
padding-left: 36rpx;
font-size: 28rpx;
color: #333;
border-bottom: 2rpx solid #E1E1E1;
box-sizing: border-box;
}
.function_list{
display: flex;
gap: 28rpx;
flex-wrap: wrap;
padding: 22rpx 30rpx;
.function_item{
width: calc((100% - 90rpx) / 3);
display: flex;
flex-direction: column;
align-items: center;
font-size: 28rpx;
line-height: 40rpx;
color: #3d3d3d;
.list_img{
display: flex;
align-items: center;
justify-content: center;
width: 48rpx;
height: 48rpx;
margin-bottom: 14rpx;
.list_icon{
width: 100%;
}
}
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="header_box">
<!-- 未登录用户信息 -->
<view v-if="!token" class="userInfo">
<u-avatar src="" size="120rpx"></u-avatar>
<view class="right" @click="goRouter('/pages/login/index')">
<view class="username">登录/注册</view>
</view>
</view>
<!-- 用户信息 -->
<view v-else class="userInfo">
<u-avatar :src="userInfo.avatar" size="120rpx"></u-avatar>
<view class="right">
<view class="username" @click="goRouter('/pages_my/editUserInfo/editUserInfo')">
<text class="col-3d f-28 l-h-38 my-20 m-r-10">猎人事务所</text>
<u-icon name="arrow-right" size="10" color="#333"></u-icon>
</view>
<view class="intro">
<image style="width: 32rpx;" src="@/static/homeImg/QRCode.png" mode="widthFix" @click="showQRcode = true"></image>
</view>
</view>
</view>
<!-- 场地管理 -->
<view class="pay_pitch" @click="goRouter('/pages_my/arenaControl/arenaControl')">
<text>{{ isPay ? '续费门店' : '激活门店' }}</text>
</view>
<text v-show="isPay" class="tip">【剧本杀】2025-06-20到期</text>
<!-- 出示二维码 -->
<u-popup :show="showQRcode" round="20" mode="center" closeable overlayOpacity="0" @close="showQRcode = false">
<view class="QRcode_box">
<view class="QRCoce_img">
<image style="width: 270rpx;height: 270rpx;" src="@/static/homeImg/big_QRCode.png" mode="widthFix"></image>
</view>
<view class="btn">保存二维码</view>
</view>
</u-popup>
</view>
</template>
<script>
import { getUserInfo } from '@/api/user.js'
import { mapGetters } from 'vuex'
export default {
props: {
userInfo: {
type: Object,
require: true
}
},
data() {
return {
isPay: false,
showQRcode: false,
}
},
computed: { ...mapGetters(['token']) },
methods: {
goRouter(path){
uni.navigateTo({
url: path
})
}
}
}
</script>
<style scoped lang="scss">
// 头部盒子
.header_box{
position: relative;
height: 376rpx;
box-sizing: border-box;
background-size: cover;
// 用户信息
.userInfo{
position: absolute;
top: 216rpx;
left: 30rpx;
display: flex;
align-items: center;
z-index: 10;
.right{
display: flex;
flex-direction: column;
justify-content: space-between;
flex: 1;
margin-left: 20rpx;
height: 100%;
font-size: 24rpx;
color: #fff;
.username{
display: flex;
align-items: center;
font-size: 32rpx;
line-height: 48rpx;
font-weight: 500;
}
.intro{
display: flex;
align-items: center;
gap: 4rpx;
}
}
}
// 购买场地
.pay_pitch{
position: absolute;
top: 248rpx;
right: 30rpx;
display: flex;
align-items: center;
justify-content: center;
width: 140rpx;
height: 56rpx;
color: #fff;
font-size: 28rpx;
line-height: 38rpx;
background: linear-gradient( 270deg, #001020 0%, #4A4E64 100%);
border-radius: 8rpx;
clip-path: polygon(0% 0%, 100% 0%, 100% 94%, 50% 100%, 0% 94%);
}
.tip{
position: absolute;
top: 306rpx;
right: 30rpx;
font-size: 20rpx;
line-height: 26rpx;
color: #3d3d3d;
}
// 显示二维码
.QRcode_box{
width: 500rpx;
height: 550rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0,0,0,0.2);
border-radius: 20rpx;
padding: 40rpx;
.QRCoce_img{
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
width: 360rpx;
height: 360rpx;
}
.btn{
width: 280rpx;
height: 60rpx;
line-height: 60rpx;
background: #FFB336;
border-radius: 12rpx;
text-align: center;
color: #fff;
font-size: 28rpx;
margin: 0 auto;
}
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="userList">
<view class="col-3d f-28 l-h-38 f-w-500 px-20 mb-20">功能中心</view>
<u-cell-group :border="false">
<u-cell
v-for="(item, index) in userList"
:key="index" :titleStyle="titleStyle"
:rightIconStyle="rightIconStyle"
:title="item.title"
:border="false"
:isLink="true"
@click="goRouter(item.routerPath)"
>
<image class="userList_icon" slot="icon" :src="item.icon" mode="widthFix"></image>
</u-cell>
</u-cell-group>
</view>
</template>
<script>
import Message from '@/static/myImg/message.png'
import Comment from '@/static/myImg/comment.png'
import Data from '@/static/myImg/data.png'
import Safe from '@/static/myImg/safe.png'
export default {
data(){
return {
userList: [
{ title: '消息设置', icon: Message, routerPath: '/pages_my/msgSetting/msgSetting' },
{ title: '场地评论', icon: Comment, routerPath: '/pages/arenaComment/arenaComment' },
{ title: '资料设置', icon: Data, routerPath: '/pages_my/dataSetting/dataSetting' },
{ title: '账号与安全', icon: Safe, routerPath: '/pages_my/userInfo/userInfo' }
],
titleStyle: {
fontSize: '28rpx',
color: '#3d3d3d',
marginLeft: '20rpx'
},
rightIconStyle: {
color: '#333',
fontSize: '24rpx'
}
}
},
methods: {
goRouter(path){
uni.navigateTo({
url: path
})
}
}
}
</script>
<style lang="scss" scoped>
.userList{
padding: 20rpx 0;
margin: 20rpx 30rpx 0;
background-color: #fff;
border-radius: 12rpx;
}
.userList_icon{
width: 48rpx;
height: 48rpx;
}
</style>
\ No newline at end of file
... ...
<template>
<view class="order_card mb-20">
<view class="header_bg">
<text class="col-f f-36 l-h-48 f-w-500">狼人杀</text>
<image class="bg_nav" src="@/static/homeImg/bg_1.png" mode="widthFix"></image>
</view>
<u-cell-group>
<u-cell
v-for="(value, key, index) in formatObj"
:title="key"
:titleStyle="{fontSize: '26rpx', color: '#666', lineHeight: '34rpx'}"
:key="index"
:border="index < ObjectLength - 1"
>
<text slot="value" class="f-26 col-6 l-h-32">{{ value }}</text>
</u-cell>
<u-cell title="订单状态" :titleStyle="{fontSize: '26rpx', color: '#666', lineHeight: '34rpx'}" :value="stateValue" />
</u-cell-group>
<slot name="refund"></slot>
<slot name="comment"></slot>
<view v-if="orderList.refundReason" class="btn_list m-top30">
<view v-if="orderList.state === 0" class="btn_right cancel" @click="lookRefund(0)">拒绝退款</view>
<view v-if="orderList.state === 0" class="btn_right" @click="lookRefund(1)">同意退款</view>
</view>
<view v-else-if="orderList.commentContent" class="btn_list m-top30">
<view class="btn_right cancel">回复评价</view>
<view class="btn_right">恶意差评申诉</view>
</view>
<view v-else class="btn_list m-top30">
<view class="btn_left">
<u-icon name="phone" size="20" color="#3D3D3D"></u-icon>
<text class="m-l-10 col-3d f-28 f-w-500">顾客</text>
</view>
<view class="btn_right cancel">取消订单</view>
<view class="btn_right">确认订单</view>
</view>
</view>
</template>
<script>
import { businessAppealReason, businessReply, businessLookRefund } from '@/api/order.js'
export default {
name:"orderCard",
props: {
orderList: {
type: Object,
require: true
},
// 订单状态
stateValue: {
type: String,
require: true
}
},
computed: {
// 订单背景
formatBgColor(){
let colorObj = {
0: '#FFA100',
1: '#0096E7',
2: '#DF0000'
}
return colorObj[this.orderStatus]
},
// 格式化球场订单名称
formatBallName(){
return (keyValue) => {
let obj = {
orderNo: '订单流水号',
peopelNum: '参与人数',
belongGym: '场馆',
groundNum: '场地号',
appointmentStartTime: "预约开始时间",
appointmentEndTime: "预约结束时间",
orderType: '订单类型',
serviceCharge: '手续费',
commission: '抽佣',
contacts: '联系人',
contactsPhone: '联系方式',
commentName: '评论人',
envRank: '环境评价',
serviceRank: '服务评价',
priceRank: '性价比评价'
}
return obj[keyValue]
}
},
// 格式化遍历对象
formatObj() {
let keys = Object.keys(this.orderList)
let arrs = keys.filter(item => this.formatBallName(item))
let keysNames = arrs.map(item => this.formatBallName(item))
let values = arrs.map(item => this.orderList[item])
const combinedObject = keysNames.reduce((obj, key, index) => {
if(key === '订单类型'){
obj[key] = values[index] === 0 ? '整租' : '约球'
} else {
obj[key] = values[index]
}
return obj
}, {})
return combinedObject
},
// 获取对象长度
ObjectLength(){
return Object.keys(this.orderList).length
}
},
methods: {
// 商家审核退款
lookRefund(num) {
if(num === 0) {
uni.showModal({
title: '提示',
content: '是否拒绝用户退款',
success: async function (res) {
if (res.confirm) {
await businessLookRefund(num)
uni.$u.toast('拒绝成功')
} else if (res.cancel) {
uni.$u.toast('取消退款')
}
}
})
} else {
this.$emit('showRefund', true)
}
}
}
}
</script>
<style lang="scss" scoped>
.order_card{
padding-bottom: 38rpx;
background: #FFFFFF;
border-radius: 20rpx;
overflow: hidden;
.header_bg{
position: relative;
padding: 26rpx 32rpx;
box-sizing: border-box;
height: 100rpx;
overflow: hidden;
background: linear-gradient( 270deg, #966CFF 0%, #C3ACFF 100%);
.bg_nav{
position: absolute;
width: 170rpx;
top: 0;
right: 0;
}
}
.order_title{
display: flex;
align-items: center;
height: 100rpx;
color: #fff;
line-height: 100rpx;
font-size: 32rpx;
font-weight: 600;
background-color: #FFA100;
padding-left: 20rpx;
}
.btn_list{
display: flex;
align-items: center;
gap: 30rpx;
padding: 0 40rpx;
.btn_left{
display: flex;
align-items: center;
justify-content: center;
width: 200rpx;
height: 80rpx;
background: #F0F0F2;
border-radius: 200rpx;
}
.btn_right{
width: 200rpx;
height: 80rpx;
color: #fff;
line-height: 80rpx;
text-align: center;
font-weight: 500;
font-size: 28rpx;
background: linear-gradient( 270deg, #FCBF1C 0%, #FFAE00 100%);
border-radius: 200rpx;
&.cancel{
background: #F0F0F2;
color: #333;
}
}
}
}
</style>
\ No newline at end of file
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<script>
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
CSS.supports('top: constant(a)'))
document.write(
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
</script>
<title></title>
<!--preload-links-->
<!--app-context-->
</head>
<body>
<div id="app"><!--app-html--></div>
<script type="module" src="/main.js"></script>
</body>
</html>
... ...
import App from './App'
import CommonTabbar from '@/components/commonTabbar.vue'
// #ifndef VUE3
import Vue from 'vue'
import './uni.promisify.adaptor'
Vue.config.productionTip = false
import uView from '@/uni_modules/uview-ui'
import store from './store/index.js'
Vue.component('CommonTabbar', CommonTabbar)
Vue.use(uView)
App.mpType = 'app'
const app = new Vue({
...App,
store
})
// 引入请求封装,将app参数传递到配置中
require('./utils/request.js')(app)
app.$mount()
// #endif
// #ifdef VUE3
import { createSSRApp } from 'vue'
export function createApp() {
const app = createSSRApp(App)
return {
app
}
}
// #endif
\ No newline at end of file
... ...
{
"name" : "运动中国",
"appid" : "__UNI__EFBA169",
"description" : "",
"versionName" : "1.0.0",
"versionCode" : "100",
"transformPx" : false,
/* 5+App特有相关 */
"app-plus" : {
"usingComponents" : true,
"nvueStyleCompiler" : "uni-app",
"compilerVersion" : 3,
"splashscreen" : {
"alwaysShowBeforeRender" : true,
"waiting" : true,
"autoclose" : true,
"delay" : 0
},
/* 模块配置 */
"modules" : {
"Payment" : {}
},
/* 应用发布信息 */
"distribute" : {
/* android打包配置 */
"android" : {
"permissions" : [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
/* ios打包配置 */
"ios" : {},
/* SDK配置 */
"sdkConfigs" : {
"maps" : {},
"payment" : {
"weixin" : {
"__platform__" : [ "ios", "android" ],
"appid" : "wx7902d7df47ea6739",
"UniversalLinks" : ""
}
}
}
}
},
/* 快应用特有相关 */
"quickapp" : {},
/* 小程序特有相关 */
"mp-weixin" : {
"appid" : "wx7902d7df47ea6739",
"setting" : {
"urlCheck" : false,
"es6" : true,
"postcss" : true,
"minified" : true
},
"usingComponents" : true,
"lazyCodeLoading" : "requiredComponents",
"optimization" : {
"subPackages" : true
},
"permission" : {
"scope.userLocation" : {
"desc" : "获取你当前的位置信息"
}
},
"unipush" : {
"enable" : false
}
},
"mp-alipay" : {
"usingComponents" : true
},
"mp-baidu" : {
"usingComponents" : true
},
"mp-toutiao" : {
"usingComponents" : true
},
"uniStatistics" : {
"enable" : false
},
"vueVersion" : "2"
}
... ...
export default {
data() {
return {
query: {
pageNum: 1,
pageSize: 10
},
isRefresh: false,
flag: false, // 上拉触底开关
}
},
// 下拉刷新页面
onPullDownRefresh() {
this.query.pageSize = 10
this.total = 0
this.flag = false
this.showList = []
this.getList()
},
// 上拉触底函数
onReachBottom() {
if(this.flag) return
if(this.query.pageSize >= this.total) return uni.showToast({title: '内容已全部加载完成',duration: 1000})
this.query.pageSize += 10
this.getList()
},
}
\ No newline at end of file
... ...
import { pro_http } from '@/utils/baseUrl.js'
export default {
data() {
return {
mainCoverList: [], // 主图列表
detailList: [] // 详情列表
}
},
onReady() {
//如果需要兼容微信小程序,并且校验规则中含有方法等,只能通过setRules方法设置规则。
this.$refs.uForm.setRules(this.rules)
},
methods: {
// 删除视频或图片
deletePic(event) {
if(event.name === 'mainCover') {
this.mainCoverList.splice(event.index, 1)
} else {
this.detailList.splice(event.index, 1)
}
},
// 新增视频或图片
async afterRead(event) {
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
let lists = [].concat(event.file)
let list = event.name === 'mainCover' ? this.mainCoverList : this.detailList
let fileListLen = list.length
lists.map((item) => {
list.push({
...item,
status: 'uploading',
message: '上传中'
})
})
for (let i = 0; i < lists.length; i++) {
const result = await this.uploadFilePromise(lists[i].url)
let item = list[fileListLen]
list.splice(fileListLen, 1, Object.assign(item, {
status: 'success',
message: '',
url: result.fileName,
fileName: result.fileName,
}))
fileListLen++
}
},
uploadFilePromise(url) {
return new Promise((resolve, reject) => {
let a = uni.uploadFile({
url: pro_http + '/common/upload',
filePath: url,
name: 'file',
formData: {
user: 'test'
},
success: (res) => {
setTimeout(() => {
const result = JSON.parse(res.data)
resolve(result)
}, 1000)
}
});
})
},
// 获取当前位置
getMapLocation(){
let _this = this
uni.chooseLocation({
success:(res)=> {
_this.form.address = res.address
_this.form.latitude = res.latitude
_this.form.longitude = res.longitude
}
})
}
}
}
\ No newline at end of file
... ...
{
"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
{
"path" : "pages/login/login",
"style" :
{
"navigationBarTitleText" : "",
"navigationStyle": "custom",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/home/home",
"style" :
{
"navigationBarTitleText" : "",
"navigationBarBackgroundColor": "#fff",
"navigationStyle": "custom",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/mall/mall",
"style" :
{
"navigationBarTitleText" : "",
"navigationStyle": "custom",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/order/order",
"style" :
{
"navigationBarTitleText" : "",
"navigationStyle": "custom",
"enablePullDownRefresh" : true,
"onReachBottomDistance": 180
}
},
{
"path" : "pages/data/data",
"style" :
{
"navigationBarTitleText" : "经营数据",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/my/my",
"style" :
{
"navigationBarTitleText" : "",
"navigationStyle": "custom",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/login/index",
"style" :
{
"navigationBarTitleText" : "用户名登录",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/register/register",
"style" :
{
"navigationBarTitleText" : "用户注册",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/arenaComment/arenaComment",
"style" :
{
"navigationBarTitleText" : "场地评论",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/bureauDetail/bureauDetail",
"style" :
{
"navigationBarTitleText" : "",
"navigationStyle": "custom"
}
}
],
// 分包加载规则
"subPackages": [
// 场地分包
{
"root": "pages_arenaControl",
"pages": [
{
"path" : "arenaControl/arenaControl",
"style" :
{
"navigationBarTitleText" : "场地管理",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "addArena/addArena",
"style" :
{
"navigationBarTitleText" : "新建场地",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "lockArena/lockArena",
"style" :
{
"navigationBarTitleText" : "预约锁定",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
}
]
},
// 我的分包
{
"root": "pages_my",
"pages": [
{
"path" : "myWallet/myWallet",
"style" :
{
"navigationBarTitleText" : "我的钱包",
"enablePullDownRefresh" : false
}
},
{
"path" : "myReflect/myReflect",
"style" :
{
"navigationBarTitleText" : "我的操作",
"enablePullDownRefresh" : false
}
},
{
"path" : "myVip/myVip",
"style" :
{
"navigationBarTitleText" : "会员管理",
"enablePullDownRefresh" : false
}
},
{
"path" : "editSuccess/editSuccess",
"style" :
{
"navigationBarTitleText" : "",
"enablePullDownRefresh" : false
}
},
{
"path" : "bankCard/bankCard",
"style" :
{
"navigationBarTitleText" : "银行卡",
"enablePullDownRefresh" : false
}
},
{
"path" : "dataSetting/dataSetting",
"style" :
{
"navigationBarTitleText" : "资料设置",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "arenaControl/arenaControl",
"style" :
{
"navigationBarTitleText" : "场地管理",
"navigationStyle": "custom",
"enablePullDownRefresh" : false
}
},
{
"path" : "employeeControl/employeeControl",
"style" :
{
"navigationBarTitleText" : "员工管理",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "courtManage/courtManage",
"style" :
{
"navigationBarTitleText" : "门店管理",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "msgSetting/msgSetting",
"style" :
{
"navigationBarTitleText" : "消息设置",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "userInfo/userInfo",
"style" :
{
"navigationBarTitleText" : "账号与安全",
"navigationBarBackgroundColor": "#F6F7FB",
"enablePullDownRefresh" : false
}
},
{
"path" : "editUserInfo/editUserInfo",
"style" :
{
"navigationBarTitleText" : "编辑信息",
"navigationBarBackgroundColor": "#F6F7FB",
"enablePullDownRefresh" : false
}
},
{
"path" : "editPassword/editPassword",
"style" :
{
"navigationBarTitleText" : "修改密码",
"navigationBarBackgroundColor": "#F6F7FB",
"enablePullDownRefresh" : false
}
},
{
"path" : "ScriptControl/ScriptControl",
"style" :
{
"navigationBarTitleText" : ""
}
},
{
"path" : "uploadPrimary/uploadPrimary",
"style" :
{
"navigationBarTitleText" : "",
"navigationStyle": "custom"
}
},
{
"path" : "addPrimary/addPrimary",
"style" :
{
"navigationBarTitleText" : "添加主题"
}
},
{
"path" : "myStore/myStore",
"style" :
{
"navigationBarTitleText" : "我的门店",
"navigationStyle": "custom"
}
}
]
},
// 数据分包
{
"root": "pages_data",
"pages": [
{
"path": "dataDetail/dataDetail",
"style": {
"navigationBarTitleText" : "数据详情",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
}
]
},
// 商城分包
{
"root": "pages_mall",
"pages": [
{
"path" : "goods/addGoods",
"style" :
{
"navigationBarTitleText" : "新建商品",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "goods/edidGoods",
"style" :
{
"navigationBarTitleText" : "编辑商品",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "goods/underGoods",
"style" :
{
"navigationBarTitleText" : "下架商品",
"navigationBarBackgroundColor": "#fff",
"enablePullDownRefresh" : false
}
},
{
"path" : "goods/stockInformation",
"navigationBarBackgroundColor": "#fff",
"style" :
{
"navigationBarTitleText" : "商品信息",
"enablePullDownRefresh" : false
}
},
{
"path" : "goodsDetail/goodsDetail",
"style" :
{
"navigationBarTitleText" : "",
"enablePullDownRefresh" : false
}
}
]
}
],
// 分包预下载规则
"preloadRule": {
"pages/my/my": {
"network": "all",
"packages": ["pages_my"]
},
"pages/mall/mall": {
"network": "all",
"packages": ["pages_mall"]
}
},
// 底部导航管理
"tabBar": {
"color": "#999",
"selectedColor": "#333",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"list": [
{
"pagePath": "pages/home/home",
"iconPath": "static/tabbarIcon/home.png",
"selectedIconPath": "static/tabbarIcon/home_active.png",
"text": "首页"
},
{
"pagePath": "pages/mall/mall",
"iconPath": "static/tabbarIcon/mall.png",
"selectedIconPath": "static/tabbarIcon/mall_active.png",
"text": "商城"
},
{
"pagePath": "pages/order/order",
"iconPath": "static/tabbarIcon/order.png",
"selectedIconPath": "static/tabbarIcon/order_active.png",
"text": "订单"
},
{
"pagePath": "pages/data/data",
"iconPath": "static/tabbarIcon/data.png",
"selectedIconPath": "static/tabbarIcon/data_active.png",
"text": "数据"
},{
"pagePath": "pages/my/my",
"iconPath": "static/tabbarIcon/my.png",
"selectedIconPath": "static/tabbarIcon/my_active.png",
"text": "我的"
}]
},
"globalStyle": {
// #ifdef H5
// "navigationStyle": "custom",
"maxWidth": 750,
"rpxCalcMaxDeviceWidth": 750, // rpx 计算所支持的最大设备宽度,单位 px,默认值为 960
"rpxCalcBaseDeviceWidth": 560, // rpx 计算使用的基准设备宽度,设备实际宽度超出 rpx 计算所支持的最大设备宽度时将按基准宽度计算,单位 px,默认值为 375
"rpxCalcIncludeWidth": 9999, // rpx 计算特殊处理的值,始终按实际的设备宽度计算,单位 rpx,默认值为 750
// #endif
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTitleText": "",
"navigationBarTextStyle": "black",
"backgroundTextStyle": "dark"
},
"uniIdRouter": {},
"easycom": {
"^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue"
}
}
... ...
不能预览此文件类型
<template>
<view class="more_comment">
<CommentCard v-for="item in 5" :key="item" :isPadding="true"></CommentCard>
</view>
</template>
<script>
import CommentCard from '@/components/commentCard.vue'
export default {
components: { CommentCard },
data() {
return {
};
}
}
</script>
<style lang="scss" scoped>
.more_comment{
padding: 30rpx;
background-color: #F6F6F6;
}
</style>
... ...
<template>
<view class="bureau_detail">
<!-- 详情头部 -->
<view class="bureau_header">
<u-navbar placeholder :autoBack="true" leftIconColor="#fff" bgColor="transparent" />
<view class="detail_info">
<view class="left">
<image class="cover_img" src="@/static/homeImg/bgimg.webp" mode=""></image>
</view>
<view class="right">
<text class="f-32 l-h-38 f-w-500">北宋奇案·汴京</text>
<view class="top">
<text class="col-primary">8.6分</text>
<text>古风/推理/悬疑/其他</text>
</view>
<view class="top">
<text>4男2女</text>
<text>8小时</text>
<text>高阶</text>
</view>
<view class="top">
<text class="col-primary f-w-500 f-36 l-h-48">¥148元/人</text>
<text>1号包间</text>
</view>
</view>
</view>
<!-- 门店 -->
<view class="store">
<image class="logo_img" src="@/static/homeImg/home.png" mode="widthFix"></image>
<text>门店:猎人事务所</text>
</view>
</view>
<!-- 组局人员 -->
<view class="bureau_body">
<view class="people_box">
<view class="people_header">
<view class="left">
<view class="col-9 f-24 l-h-32 mb-10">开始时间</view>
<view class="col-f f-28 l-h-38">06月06日 周四 14:00</view>
</view>
<view class="right">
<image style="width: 120rpx;height: 80rpx;" src="@/static/homeImg/cat.png" mode=""></image>
<view>
<view class="col-9 f-24 l-h-32 mb-10">空余车位</view>
<view class="col-f f-28 l-h-38">等<text class="col-primary">1</text>男<text class="col-primary">1</text>女</view>
</view>
</view>
</view>
<view class="people_body">
<image v-for="(item, index) in urls" :key="index" class="avatar" :src="item" mode=""></image>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
urls: [
'https://cdn.uviewui.com/uview/album/1.jpg',
'https://cdn.uviewui.com/uview/album/2.jpg',
'https://cdn.uviewui.com/uview/album/3.jpg',
'https://cdn.uviewui.com/uview/album/4.jpg',
'https://cdn.uviewui.com/uview/album/7.jpg',
'https://cdn.uviewui.com/uview/album/6.jpg',
'https://cdn.uviewui.com/uview/album/5.jpg'
]
};
}
}
</script>
<style lang="scss" scoped>
.bureau_header{
position: relative;
height: 600rpx;
background: radial-gradient(ellipse, #fff -110%, #1d2a3a 60%);
.detail_info{
display: flex;
align-items: center;
margin-top: 40rpx;
padding-left: 30rpx;
.left{
width: 180rpx;
height: 240rpx;
border-radius: 8rpx;
overflow: hidden;
margin-right: 20rpx;
.cover_img{
width: 100%;
height: 100%;
}
}
.right{
display: flex;
flex-direction: column;
flex: 1;
font-size: 24rpx;
line-height: 32rpx;
color: #fff;
.top{
display: flex;
align-items: center;
gap: 20rpx;
margin-top: 30rpx;
}
}
}
.store{
display: flex;
align-items: center;
justify-content: center;
position: absolute;
left: 30rpx;
bottom: 40rpx;
width: 340rpx;
height: 60rpx;
font-size: 24rpx;
color: #fff;
background: linear-gradient(270deg, rgba(51,51,51,0.6) 0%, rgba(34,34,34,0.6) 51%, rgba(51,51,51,0.6) 100%);
border-radius: 8rpx;
.logo_img{
width: 32rpx;
margin-right: 10rpx;
}
}
}
.bureau_body{
height: calc(100vh - 590rpx);
border-radius: 10rpx;
margin-top: -10rpx;
padding: 40rpx 30rpx;
box-sizing: border-box;
.people_box{
padding: 20rpx;
background: #333333;
border-radius: 20rpx;
.people_header{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20rpx;
.right{
display: flex;
align-items: center;
gap: 20rpx;
}
}
.people_body{
display: flex;
flex-wrap: wrap;
gap: 26rpx;
height: 260rpx;
padding: 20rpx;
background: #FFFFFF;
border-radius: 12rpx;
.avatar{
width: 100rpx;
height: 100rpx;
border-radius: 50%;
}
}
}
}
</style>
... ...
<template>
<view class="data_container">
<!-- 头部模块 -->
<u-sticky >
<view class="nav-header">
<view class="nav_box" :class="{active: currentData === 0}" @click="currentData = 0">总览</view>
<view class="nav_box" :class="{active: currentData === 1}" @click="currentData = 1">收入明细</view>
</view>
</u-sticky>
<!-- 内容模块 -->
<view class="content">
<!-- 数据总览 -->
<DataPandect v-show="currentData === 0" />
<!-- 数据明细 -->
<DataDetail v-show="currentData === 1" />
</view>
</view>
</template>
<script>
import DataPandect from '@/components/data/dataPandect.vue'
import DataDetail from '@/components/data/dataDetail.vue'
export default {
components: { DataPandect, DataDetail },
data(){
return {
currentData: 0, // 切换数据
}
}
}
</script>
<style lang="scss" scoped>
.data_container {
background-color: #F6F7FB;
padding-bottom: 180rpx;
min-height: 100vh;
// 头部模块
.nav-header{
display: flex;
align-items: center;
justify-content: center;
height: 80rpx;
background-color: #fff;
.nav_box{
position: relative;
flex: 1;
height: 100%;
color: #BBBBBB;
font-size: 32rpx;
text-align: center;
line-height: 80rpx;
&.active{
font-weight: 500;
color: #333;
&::after{
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
content: '';
width: 40rpx;
height: 8rpx;
background-color: #FFA100;
border-radius: 20rpx;
}
}
}
}
}
</style>
... ...
<template>
<view class="main_container">
<!-- 自定义头部模块 -->
<u-navbar placeholder>
<view class="u-nav-slot" slot="left" >
<text style="color: #333;font-size: 36rpx;font-weight: 500;">猎人事务所</text>
</view>
</u-navbar>
<!-- 搜索 -->
<u-search
v-model="keyword"
placeholder="搜索场地"
:showAction="false"
height="80rpx"
shape="square"
bgColor="#F6F6F6"
margin="20rpx 0"
:inputStyle="{fontSzie: '28rpx',color: '#999'}"
@custom="vadile"
@search="vadile"
/>
<!-- 访问量 -->
<AccessCard />
<!-- 玩法列表 -->
<PlayNav @playName="onPlayName" />
<!-- 房间列表 -->
<view class="room">
<!-- 头部导航 -->
<view class="nav_header">
<view
v-if="!(playId === 1 && item.title=== '剧本')" class="nav_item"
v-for="(item, index) in navList"
:key="index"
:class="{active: expertActive === index}"
@click="toggleList(item, index)"
>
<view class="nav_content">
<text>{{ item.title }}</text>
<text class="badge">({{ item.number }})</text>
</view>
</view>
</view>
<!-- 内容列表 -->
<view class="expert_content">
<swiper class="swiper" :current="expertActive" @animationfinish="toggleSwiper">
<swiper-item>
<view class="swiper-item">
<scroll-view scroll-y="true" class="scroll-history">
<!-- 场地 -->
<PitchList :pitchList="showList" />
</scroll-view>
</view>
</swiper-item>
<swiper-item v-if="playId !== 1">
<view class="swiper-item">
<scroll-view scroll-y="true" class="scroll-history">
<!-- 剧本 -->
<ScriptList />
</scroll-view>
</view>
</swiper-item>
<swiper-item>
<view class="swiper-item">
<scroll-view scroll-y="true" class="scroll-history">
<!-- 已有组局 -->
<ExistingBureau />
</scroll-view>
</view>
</swiper-item>
</swiper>
</view>
<u-loadmore
:loading-text="loadingText"
:loadmore-text="loadmoreText"
:nomore-text="nomoreText"
/>
</view>
<!-- 新建场地 -->
<view v-if="showList.length === 0" class="add_mode" @click="goRouter">
<u-icon name="plus-circle"></u-icon>
<text class="m-l-20">新建场地</text>
</view>
<!-- 没有填写商家信息时提示 -->
<u-popup :show="showTip" round="20" mode="center" closeable @close="showTip = false">
<view class="tip_container">
<view class="tip_title">- 温馨提示 -</view>
<view class="tip_content">
请设置企业资料 方可使用小程序
</view>
<view class="btn">去设置</view>
<image class="bg_img" src="@/static/logo_start.png" mode="widthFix"></image>
</view>
</u-popup>
</view>
</template>
<script>
import { getGroundList, getSportList } from '@/api/sport.js'
import AccessCard from '@/components/home/AccessCard.vue'
import PlayNav from '@/components/home/PlayNav.vue'
import PitchList from '@/components/home/PitchList.vue'
import ScriptList from '@/components/home/ScriptList.vue'
import ExistingBureau from '@/components/home/ExistingBureau.vue'
import { mapGetters } from 'vuex'
import { pro_http } from '@/utils/baseUrl.js'
import loadMore from '@/mixins/loadMore.js'
export default {
components: { AccessCard, PlayNav, PitchList, ScriptList, ExistingBureau },
data() {
return {
pro_http,
keyword: null, // 输入场地号
sportsRange: null, //运动类型
showTip: true, // 提示信息
expertActive: 0,
playId: 1, // 1,2,3分别表示狼人杀,剧本杀,密室逃脱
loadingText: '努力加载中',
loadmoreText: '点击加载更多',
nomoreText: '实在没有了',
navList: [
{ title: '场地', number: 9, componentName: 'PitchList' },
{ title: '剧本', number: 10, componentName: 'ScriptList' },
{ title: '已有组局', number: 6, componentName: 'ExistingBureau' },
],
showList: [
{ groundId: 1, groundPhotos: 'https://cdn.uviewui.com/uview/album/1.jpg', groundNum: 1, price: '160', isOutdoor: 0},
{ groundId: 2, groundPhotos: 'https://cdn.uviewui.com/uview/album/1.jpg', groundNum: 2, price: '160', isOutdoor: 0},
{ groundId: 3, groundPhotos: 'https://cdn.uviewui.com/uview/album/1.jpg', groundNum: 3, price: '160', isOutdoor: 0},
{ groundId: 4, groundPhotos: 'https://cdn.uviewui.com/uview/album/1.jpg', groundNum: 4, price: '160', isOutdoor: 0}
]
}
},
async onShow() {
},
computed: {
...mapGetters(['userInfo'])
},
// 下拉刷新页面
onPullDownRefresh() {
this.query.pageSize = 10
this.total = 0
this.flag = false
this.sportsRange = null
this.keyword = null
this.current = -9
this.showList = []
this.getList()
},
methods: {
// 切换显示列表
toggleList(item, index){
if(this.playId === 1 && index === 2) {
this.expertActive = 1
}else {
this.expertActive = index
}
},
// 获取玩法名称
onPlayName(id){
this.playId = id
this.expertActive = 0
},
// 检测手机滑动
toggleSwiper(event){
this.expertActive = event.detail?.current
}
}
}
</script>
<style lang="scss" scoped>
.main_container{
padding: 0 30rpx;
min-height: 100vh;
padding-bottom: 30rpx;
background: linear-gradient(to bottom, #FFFFFF -20%, #F5F6FA);
.room {
background: #FFFFFF;
border-radius: 20rpx;
padding-bottom: 10rpx;
.nav_header{
display: flex;
align-items: center;
justify-content: space-around;
height: 80rpx;
border-bottom: 2rpx solid #eee;
.nav_item{
position: relative;
text-align: center;
line-height: 80rpx;
color: #999;
.nav_content{
position: relative;
font-size: 28rpx;
.badge{
position: absolute;
top: 50%;
right: -50rpx;
color: #999;
transform: translateY(-50%);
}
}
&.active{
color: #333333;
&::after{
position: absolute;
left: 50%;
bottom: 0;
content: '';
width: 40rpx;
height: 6rpx;
transform: translateX(-50%);
background-color: #333;
border-radius: 200rpx;
}
}
}
}
}
// 新建场地
.add_mode{
display: flex;
align-items: center;
justify-content: center;
font-size: 28rpx;
line-height: 38rpx;
color: #999;
height: 120rpx;
background: #FFFFFF;
margin-top: 20rpx;
border-radius: 12rpx;
}
// 提示信息
.tip_container{
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
flex-direction: column;
width: 690rpx;
height: 480rpx;
background: #FFFFFF;
border-radius: 24rpx;
padding: 40rpx 0;
box-sizing: border-box;
.tip_title{
text-align: center;
color: #333;
font-size: 32rpx;
line-height: 42rpx;
}
.tip_content{
width: 196rpx;
height: 76rpx;
font-size: 28rpx;
color: #3D3D3D;
line-height: 38rpx;
text-align: center;
}
.btn{
width: 372rpx;
height: 76rpx;
background: #333333;
border-radius: 686rpx;
text-align: center;
line-height: 76rpx;
color: #fff;
font-size: 28rpx;
}
.bg_img{
position: absolute;
top: 70rpx;
left: 262rpx;
object-fit: cover;
}
}
// 二维码显示
.QRcode_box{
width: 690rpx;
height: 690rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0,0,0,0.2);
border-radius: 20rpx;
padding: 40rpx;
box-sizing: border-box;
.QRCoce_img{
display: flex;
align-items: center;
justify-content: center;
margin: 40rpx auto 0;
width: 360rpx;
height: 360rpx;
}
.btn{
width: 280rpx;
height: 60rpx;
line-height: 60rpx;
background: #F5F7FA;
border-radius: 12rpx;
text-align: center;
color: #333;
font-weight: 500;
font-size: 32rpx;
margin: 0 auto;
}
}
}
// 滑动区域模块
.expert_content{
padding: 20rpx 30rpx;
}
.scroll-history {
height: 500rpx;
}
.swiper {
height: 500rpx;
}
.swiper-item {
display: block;
}
.scroll-item {
margin-bottom: 10px;
}
</style>
... ...
<template>
<view class="login-container">
<view class="login-title">手机号码或用户名登录</view>
<u-form :model="logForm" ref="logForm">
<u-form-item prop="username">
<u-input v-model="logForm.username" border="bottom" fontSize="36rpx" color="#333" :adjustPosition="false" placeholder="请输入用户名" />
</u-form-item>
<u-form-item prop="password">
<u-input v-model="logForm.password" border="bottom" fontSize="36rpx" color="#333" type="password" :adjustPosition="false" placeholder="请输入密码" />
</u-form-item>
<u-form-item>
<u-checkbox-group v-model="checked">
<u-checkbox shape="circle" size="16" activeColor="#333"></u-checkbox>
<text class="agreement">我已阅读并同意《用户协议》及《隐私协议》</text>
</u-checkbox-group>
</u-form-item>
</u-form>
<view class="btn" @click="submit">登录</view>
<view class="tip">
没有账号?<text style="color: #FFD900;" @click="goReg">去注册</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
logForm: { username: '', password: ''},
checked: [],
logRules: {
username: [
{ required: true, message: '请填写用户名', trigger: ['blur']},
// { pattern: /^[0-9a-zA-Z]*$/g, transform(value) { return String(value) }, message: '只能包含字母或数字', trigger: 'change' },
{ min: 4, max: 12, message: '长度在6-12个字符之间', trigger: 'change' }
],
password: [
{ required: true, message: '请填写密码', trigger: ['blur']},
// { pattern: /^(?=.*[A-Z])[a-zA-Z0-9]+$/, transform(value) { return String(value) }, message: '字母数字组成且必须包含大写字母', trigger: ['change', 'blur'] },
{ min: 6, max: 16, message: '长度在6-16个字符之间', trigger: ['change'] },
]
}
}
},
// 必须要在onReady生命周期,因为onLoad生命周期组件可能尚未创建完毕
onReady() {
this.$refs.logForm.setRules(this.logRules);
},
methods: {
goReg(){
uni.navigateTo({
url: '/pages/register/register'
})
},
// 提交登录
submit() {
if(this.checked.length > 0) {
this.$refs.logForm.validate().then(valid => {
if (valid) {
this.$store.dispatch('Login', this.logForm).then(res => {
uni.switchTab({
url: '/pages/home/home'
})
})
}
})
} else {
uni.$u.toast('请勾选用户协议和隐私协议')
}
}
}
}
</script>
<style scoped lang="scss">
.login-container{
position: relative;
padding: 0 30rpx;
box-sizing: border-box;
height: calc(100vh - 88rpx);
max-height: 100vh;
.login-title{
color: #3d3d3d;
font-size: 56rpx;
margin: 40rpx 0 80rpx 0;
line-height: 74rpx;
font-weight: 500;
}
.agreement{
color: #333;
line-height: 38rpx;
font-size: 28rpx;
}
.btn{
width: 100%;
height: 88rpx;
text-align: center;
line-height: 88rpx;
font-size: 32rpx;
background-color: #333;
border-radius: 12rpx;
color: #fff;
margin-top: 30rpx;
}
.tip{
position: absolute;
bottom: 44rpx;
left: 50%;
font-size: 36rpx;
color: #333;
transform: translateX(-50%);
}
}
</style>
\ No newline at end of file
... ...
<template>
<view class="login-container">
<image class="login-bg" src="@/static/logo_start.png" mode="widthFix"></image>
<view class="login-btn">
<u-button shape="circle" style="color: #111;font-size: 32rpx;" @click="goLogin">手机号码或用户名登录/注册</u-button>
</view>
<view class="agreement">
<u-checkbox-group v-model="checked">
<u-checkbox name="agreement" size="16" shape="circle" labelColor="#333" labelSize="14" activeColor="#333" label="我已阅读并同意《用户协议》及《隐私协议》"></u-checkbox>
</u-checkbox-group>
</view>
<!-- 弹出框 -->
<u-modal :show="show" :content='content' showCancelButton closeOnClickOverlay @close="show = false" @cancel="show = false" @confirm="onConfirm"></u-modal>
</view>
</template>
<script>
export default {
data(){
return {
checked: [],
show: false,
content: '请勾选用户协议和隐私协议'
}
},
methods: {
goLogin(){
if(this.checked.length > 0) {
uni.redirectTo({
url: '/pages/login/index'
})
} else {
this.show = true
}
},
onConfirm(){
uni.redirectTo({
url: '/pages/login/index'
})
}
}
}
</script>
<style lang="scss" scoped>
.login-container {
position: relative;
height: 100vh;
background-color: #F3CA32;
.login-bg{
position: absolute;
width: 972rpx;
top: 204rpx;
left: 96rpx;
}
.login-btn{
position: absolute;
top: 60%;
left: 50%;
width: 600rpx;
transform: translateX(-50%);
}
.agreement{
display: flex;
align-items: center;
justify-content: center;
position: absolute;
bottom: 68rpx;
left: 50%;
width: 100%;
transform: translateX(-50%);
}
}
</style>
... ...
<template>
<view class="mall_container">
<!-- 头部模块 -->
<MallHeared />
<!-- 商品展示 -->
<MallSelect :scrollHeight="scrollHeight" />
</view>
</template>
<script>
import { rpx2px } from '@/utils/util.js'
import MallSelect from '@/components/mall/mallSelect.vue'
import MallHeared from '@/components/mall/mallHeared.vue'
export default {
components: { MallHeared, MallSelect },
data() {
return {
scrollHeight: 0, // 计算当前可用高度
};
},
onLoad() {
this.setListHeight()
},
methods: {
// 设置列表内容的高度
setListHeight() {
const { windowHeight } = uni.getSystemInfoSync()
this.scrollHeight = windowHeight - rpx2px(700)
},
}
}
</script>
<style lang="scss" scoped>
.mall_container{
min-height: 100vh;
}
</style>
... ...
不能预览此文件类型
<template>
<view class="my_pages">
<!-- 头部模块 -->
<MyHeader :userInfo="userInfo" />
<!-- 用户菜单 -->
<view class="user_menu">
<view class="user_money">
<view class="dis-flex flex-y-center flex-x-between">
<view class="dis-flex flex-y-center mb-20">
<text class="f-28 l-h-38 f-w-500 m-r-10">账户总览</text>
<u-icon :name="showMoney ? 'eye' : 'eye-off'" size="12" color="#fff" @click="showMoney = !showMoney"></u-icon>
</view>
<view class="dis-flex flex-y-center" @click="goRouter('/pages_my/myWallet/myWallet')">
<u-icon name="rmb-circle" size="14" color="#fff"></u-icon>
<text class="f-24 l-h-32 m-l-10 m-r-10">我的钱包</text>
<u-icon name="arrow-right" size="10" color="#fff"></u-icon>
</view>
</view>
<view style="color: #ddd;" class="dis-flex flex-dir-column">
<text class="mb-10 f-24 l-h-32">余额</text>
<text class="col-f f-36 l-h-48">{{ showMoney ? '¥2000' : hideDigits('2000') }}</text>
</view>
</view>
<!-- 菜单列表 -->
<FunctionList />
</view>
<!-- 门店管理 -->
<StoreControl />
<!-- 功能中心 -->
<UserList />
</view>
</template>
<script>
import FunctionList from '@/components/my/functionList.vue'
import UserList from '@/components/my/userList.vue'
import MyHeader from '@/components/my/myHeader.vue'
import StoreControl from '@/components/my/StoreControl.vue'
import { getUserAmout, getUserInfo } from '@/api/user.js'
import { pro_http } from '@/utils/baseUrl.js'
export default {
components: { FunctionList, UserList, MyHeader, StoreControl },
data() {
return{
pro_http,
showMoney: true, // 是否显示余额
userAmout: 0, // 用户余额
userInfo: {}
}
},
computed: {
hideDigits() {
return (amount) => {
// 使用正则表达式替换数字为星号
return amount.replace(/\d/g, '*');
}
}
},
// async onLoad() {
// const { money } = await getUserAmout()
// this.userAmout = money
// },
// async onShow() {
// this.userInfo = await getUserInfo()
// this.userInfo.avatar = uni.$u.test.url(this.userInfo.avatar) ? this.userInfo.avatar : pro_http + this.userInfo.avatar
// },
methods: {
goRouter(path){
uni.navigateTo({
url: path
})
}
}
}
</script>
<style lang="scss" scoped>
.my_pages{
min-height: 100vh;
padding-bottom: 40rpx;
background: linear-gradient(to left bottom, #DEF2FF, #F4F5F9, #FFDDC2);
}
// 用户菜单
.user_menu{
position: relative;
height: 340rpx;
background: #FFFFFF;
box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0,0,0,0.1);
border-radius: 12rpx;
margin: 0 30rpx;
z-index: 20;
overflow: hidden;
.user_money{
height: 200rpx;
box-sizing: border-box;
padding: 20rpx 30rpx;
background: linear-gradient( 45deg, #676D93 0%, #9DACC7 100%);
color: #fff;
}
}
</style>
... ...
<template>
<view class="order_container">
<!-- 订单头部 -->
<u-sticky>
<!-- 自定义头部 -->
<u-navbar
:title="orderType === 'mall' ? '商城订单' : '门店订单'"
leftIcon="list"
bgColor="#24262B"
:placeholder="true"
leftIconColor="#fff"
:titleStyle="{color: '#fff'}"
@leftClick="show = !show"
/>
<!-- 头部导航栏 -->
<view class="order_header">
<u-tabs
:list="orderType === 'mall' ? mallNavlist : bookingNavlist"
lineColor="#FFA100"
:activeStyle="{ color: '#fff' }"
:inactiveStyle="{ color: '#BBB' }"
@click="toggleOrder"
/>
<!-- 下拉选项 -->
<u-transition :show="show" :duration="300">
<view class="selectOrder">
<view class="select_item" :class="{active: orderType === 'mall'}" @click="orderType = 'mall'">
<text>商城订单</text>
</view>
<view class="select_item" :class="{active: orderType === 'booking'}" @click="orderType = 'booking'">
<text>球场订单</text>
</view>
<view class="select_item" v-for="(item, index) in employeeList" :key="index">
<u-icon :name="item.iconNane" size="20"></u-icon>
<text class="m-l-10">{{ item.title }}</text>
</view>
</view>
</u-transition>
</view>
</u-sticky>
<!-- 下拉选择订单类型列表 -->
<view class="px-30 my-30">
<uni-data-select
v-model="stateVlue"
placeholder="请选择订单的状态"
:localdata="stateList"
@change="getList"
/>
</view>
<!-- 订单列表 -->
<view v-if="stateList.length > 0" class="px-30 m-top20">
<BookingOrderCard
v-for="(item, index) in showList"
:key="index"
:orderList="item"
:number="index + 1"
:stateValue="formatState(item.state)"
@showRefund="(value) => showRefund = value"
>
<!-- 退款 -->
<template #refund>
<view class="m-top30 px-30" v-show="item.refundReason">
<text class="col-6 f-26 l-h-32">退款原因</text>
<view class="m-top30">
<u--textarea v-model="item.refundReason" disabled placeholder="请输入内容" ></u--textarea>
</view>
</view>
</template>
<!-- 评价 -->
<template #comment>
<view class="m-top30 px-30" v-show="item.commentContent">
<text class="col-6 f-26 l-h-32">评论内容</text>
<view class="m-top30">
<u--textarea v-model="item.commentContent" disabled placeholder="请输入内容" ></u--textarea>
</view>
</view>
</template>
</BookingOrderCard>
<view v-show="!showList.length > 0" >
<u-empty text="暂无订单" />
</view>
</view>
<!-- 遮罩层 -->
<u-overlay :show="show" zIndex="98" opacity="0" @click="show = false"></u-overlay>
<!-- 选择退款比例 -->
<u-modal
:show="showRefund"
:title="title" showCancelButton
@cancel="showRefund = false"
@close="showRefund = false"
@confirm="sendRefund"
>
<view class="slot-content">
<u-radio-group
v-model="radiovalue"
placement="row"
>
<u-radio
:customStyle="{marginBottom: '8px', marginRight: '10px'}"
v-for="(item, index) in radiolist"
:key="index"
:value="item.value"
:label="item.name"
:name="item.value"
>
</u-radio>
</u-radio-group>
</view>
</u-modal>
</view>
</template>
<script>
import BookingOrderCard from '@/components/order/bookingOrderCard.vue'
import { getOrderList, getAftersalesOrder, getCommentOrder, getOrderState, getRefundState, getCommentState, businessLookRefund } from '@/api/order.js'
import loadMore from '../../mixins/loadMore'
import { mapGetters } from 'vuex'
export default {
components: { BookingOrderCard },
mixins: [loadMore],
data() {
return {
show: false, // 是否显示遮罩层
title: '确定允许退款吗,请选择退款比例',
showRefund: false,
total: 0, //订单数量
name: '实时订单', //订单状态名
orderType: 'booking', // 订单类型 商家订单或者球场订单
stateVlue: null, //当前选择状态码
stateList: [], // 显示订单列表
orderState: [], // 订单类型数据
refundState: [], // 退货订单类型数据
commentState: [], // 评价订单类型数据
// 基本案列数据
radiolist: [{name: '退全款', value: 1}, {name: '退款50%', value: 2}],
// u-radio-group的v-model绑定的值如果设置为某个radio的name,就会被默认选中
radiovalue: 1,
// 商城导航列表
mallNavlist: [
{ name: '自提', badge: { value: 2 } },
{ name: '待配送', badge: { value: 2 } },
{ name: '退款', badge: { value: 2 } },
{ name: '已完成', badge: { isDot: true } },
],
// 球场导航列表
bookingNavlist: [
{ name: '实时订单', badge: { value: 0 } },
{ name: '退款售后', badge: { value: 0 } },
{ name: '订单评价', badge: { value: 0 } }
],
// 订单列表
showList: [], // 显示订单列表
// 商家订单功能列表
mallList: [
{title: '扫一扫', iconNane: 'scan'}
],
// 员工订单功能列表
employeeList: [
{title: '扫一扫', iconNane: 'scan'},
{title: '张三', iconNane: 'account'},
{title: '18172289999', iconNane: 'phone'},
{title: '退出登录', iconNane: 'share-square'}
]
}
},
computed: {
...mapGetters(['userInfo']),
formatState(){
return (stateNum) => {
let stateValue = ''
this.stateList.forEach(item => {
if(Number(item.value) === stateNum) {
stateValue = item.text
}
})
return stateValue
}
}
},
// async onLoad() {
// // 获取三种订单状态
// const [ orderState, refundState, commentState ] = await Promise.all([
// getOrderState(),
// getRefundState(),
// getCommentState()
// ])
// this.orderState = orderState
// this.refundState = refundState
// this.commentState = commentState
// this.stateList = this.getStatus(this.orderState)
// },
// 获取订单列表
// mounted() {
// this.getList()
// },
methods: {
// 选择订单类型
selectMode(){},
// 切换订单获取相应列表
toggleOrder(item){
this.name = item.name
this.getList()
},
// 显示列表
getList(){
let query = { ...this.query, businessId: this.userInfo.businessId, state: this.stateVlue }
if(this.name === '实时订单') {
this.getNewList(query)
this.stateList = this.getStatus(this.orderState)
} else if(this.name === '退款售后') {
this.getRefundList(query)
this.stateList = this.getStatus(this.refundState)
} else {
this.getCommentList(query)
this.stateList = this.getStatus(this.commentState)
}
uni.stopPullDownRefresh()
},
// 获取订单状态
getStatus(arr){
return arr.map(item => {
return {
value: item.dictValue,
text: item.dictLabel
}
})
},
// 获取实时订单列表
async getNewList(query) {
const { rows, total } = await getOrderList(query)
this.showList = rows
this.total = total
this.bookingNavlist[0].badge.value = total
},
// 获取退款订单列表
async getRefundList(query){
const { rows, total } = await getAftersalesOrder(query)
this.showList = rows
this.total = total
this.bookingNavlist[1].badge.value = total
},
// 获取订单评论列表
async getCommentList(query){
const { rows, total } = await getCommentOrder(query)
this.showList = rows
this.total = total
this.bookingNavlist[2].badge.value = total
},
// 发起退款
async sendRefund(){
await businessLookRefund(this.radiovalue)
uni.$u.toast('退款成功')
this.showRefund = false
}
}
}
</script>
<style lang="scss" scoped>
@import '@/static/css/order.scss'
</style>
... ...