This commit is contained in:
2024-09-10 10:49:08 +08:00
parent b5fd06b800
commit dd4f5938da
6391 changed files with 722800 additions and 0 deletions

View File

@@ -0,0 +1,311 @@
<template>
<view>
<view class=" u-font-28 min-page bg-gray default-box-padding">
<view class="bg-fff border-r-18 default-box-padding">
<view class="u-m-t-24">
<view class="font-bold">开班时间</view>
<view class="u-m-t-16 u-flex u-row-between u-p-b-24 border-bottom">
<view>
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="form.kaibanTime"></uni-dateformat>
<text></text>
</view>
<view class="u-flex">
<uni-icons type="right" color="#999" size="16"></uni-icons>
</view>
</view>
</view>
<view class="u-m-t-24">
<view class="font-bold">交班时间</view>
<view class="u-m-t-16 u-flex u-row-between u-p-b-24 border-bottom">
<view>
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="form.jiaobanTime"></uni-dateformat>
<text></text>
</view>
</view>
</view>
<view class="u-m-t-24">
<view class="font-bold">交班人</view>
<view class="u-m-t-16 u-flex u-row-between u-p-b-24 border-bottom">
<view>
<text class="color-999" v-if="form.banciItem===''">暂未选择</text>
<text v-else>
{{form.banciItem.name}}
</text>
</view>
<view class="u-flex">
<uni-icons type="right" color="#999" size="16"></uni-icons>
</view>
</view>
</view>
<view class="u-m-t-24">
<view class="font-bold">班次</view>
<view class="u-m-t-16 u-flex u-row-between u-p-b-24 ">
<view>
<text class="color-999" v-if="form.banciItem===''">暂未选择</text>
<text v-else>
{{form.banciItem.name}}
</text>
</view>
<view class="u-flex">
<uni-icons type="right" color="#999" size="16"></uni-icons>
</view>
</view>
</view>
</view>
<view class="bg-fff u-m-t-32 border-r-18 default-box-padding">
<view class="u-flex list u-text-center u-flex-wrap">
<view class="item u-m-b-32" v-for="(item,index) in form.infolists" :key="index">
<view class="color-666 u-font-24">{{item.name}}</view>
<view class="u-m-t-8 color-333">{{item.value}}</view>
</view>
</view>
</view>
<view style="height: 200rpx;"></view>
</view>
</view>
<view class="u-fixed bottom u-flex bg-fff ">
<view class="u-absolute u-flex" @tap="toggleIsDayin">
<label class="radio">
<radio @tap.stop="toggleIsDayin" :checked="form.isDayin" class="scale7" />
</label>
<text class="color-333 u-font-32">打印</text>
</view>
<view class="u-flex-1">
<my-button bgColor="#333" color="#fff" borderRadius="100rpx 0 0 100rpx" shape="circle" plain type="primary"
@tap="back">返回</my-button>
</view>
<view class="u-flex-1">
<my-button borderRadius="0 100rpx 100rpx 0" shape="circle" type="primary" @tap="jiaoban">确认交班</my-button>
</view>
</view>
</template>
<script setup>
import {
reactive
} from 'vue';
import myButton from '@/components/my-components/my-button';
const form = reactive({
isDayin:false,
kaibanTime: '2024-07-29 11:47:28',
jiaobanTime: '2024-07-29 11:47:28',
banciItem: {
name: '班次'
},
infolists: [{
name: '微信实际到账',
value: 0
},
{
name: '支付宝实际到账',
value: 0
},
{
name: '订单总数',
value: 0
},
{
name: '订单总额',
value: 0
},
{
name: '订单微信支付额',
value: 0
},
{
name: '订单支付宝支付额',
value: 0
},
{
name: '订单余额支付额',
value: 0
},
{
name: '订单线下支付额',
value: 0
},
{
name: '订单退款成功数',
value: 0
},
{
name: '订单退款成功额',
value: 0
},
{
name: '支付宝退款金额',
value: 0
},
{
name: '余额退款金额',
value: 0
},
{
name: '线下退款金额',
value: 0
},
{
name: '堂食订单数',
value: 0
},
{
name: '自取订单额',
value: 0
},
{
name: '外卖订单数',
value: 0
},
{
name: '外卖订单额',
value: 0
},
{
name: '满减金额',
value: 0
},
{
name: '积分抵扣金额',
value: 0
},
{
name: '优惠券抵扣金额',
value: 0
},
{
name: '会员抵扣金额',
value: 0
},
{
name: '堂食退款金额',
value: 0
},
{
name: '堂食实际收入',
value: 0
},
{
name: '外卖实际收入',
value: 0
},
{
name: '外卖退款金额',
value: 0
},
{
name: '自取退款金额',
value: 0
},
{
name: '自取实际收入',
value: 0
},
{
name: '配送费收入',
value: 0
},
{
name: '配送费退款金额',
value: 0
},
{
name: '配送费实际收入',
value: 0
},
{
name: '挂账金额',
value: 0
},
{
name: '商家减免金额',
value: 0
},
{
name: '开通会员数',
value: 0
},
{
name: '开通会员收入',
value: 0
},
{
name: '充值数',
value: 0
},
{
name: '充值赠送额',
value: 0
},
{
name: '收银笔数',
value: 0
},
{
name: '收银金额',
value: 0
},
{
name: '充值额',
value: 0
},
{
name: '微信收银金额',
value: 0
},
{
name: '余额收银金额',
value: 0
},
{
name: '支付宝收银金额',
value: 0
},
]
})
function toggleIsDayin(){
form.isDayin=!form.isDayin
}
function back(){
uni.navigateBack()
}
function jiaoban(){
}
</script>
<style lang="scss" scoped>
.list {
.item {
width: 33.333%;
}
}
.bottom {
background-color: transparent;
bottom: 84rpx;
left: 28rpx;
right: 28rpx;
.u-absolute{
bottom: 100%;
margin-bottom: 32rpx;
right: 0;
}
}
</style>

View File

@@ -0,0 +1,298 @@
<template>
<view>
<view class=" u-font-28 color-333 min-page bg-gray default-box-padding">
<view class="bg-fff border-r-18 default-box-padding u-flex">
<view class="">交班人:</view>
<view class=" u-flex u-m-l-24 ">
<text class="color-999" v-if="form.banciItem===''">暂未选择</text>
<text v-else>
{{form.banciItem.name}}
</text>
</view>
</view>
<view class="bg-fff u-m-t-32 border-r-18 u-flex default-box-padding">
<view class="u-flex-1 border-r">
<view>
<view>班次号</view>
<view class="color-666 u-font-24 u-m-t-8">10001</view>
</view>
<view class="u-m-t-32">
<view>班次</view>
<view class="color-666 u-font-24 u-m-t-8">早班</view>
</view>
</view>
<view class="u-flex-1">
<view>
<view>开班时间</view>
<view class="color-666 u-font-24 u-m-t-8">2024-05-17 14:44:50</view>
</view>
<view class="u-m-t-32">
<view>交班时间</view>
<view class="color-666 u-font-24 u-m-t-8">2024-05-17 14:44:56</view>
</view>
</view>
</view>
<view class="u-font-32 u-m-t-32 u-m-b-32">数据统计</view>
<view class="bg-fff u-m-t-32 border-r-18 default-box-padding">
<view class="u-flex list u-text-center u-flex-wrap">
<view class="item u-m-b-32" v-for="(item,index) in form.infolists" :key="index">
<view class="color-666 u-font-24">{{item.name}}</view>
<view class="u-m-t-8 color-333">{{item.value}}</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script setup>
import {
reactive
} from 'vue';
import myButton from '@/components/my-components/my-button';
const form = reactive({
isDayin: false,
kaibanTime: '2024-07-29 11:47:28',
jiaobanTime: '2024-07-29 11:47:28',
banciItem: {
name: '班次'
},
infolists: [{
name: '订单数',
value: 0
},
{
name: '订单额',
value: 0
},
{
name: '订单微信支付额',
value: 0
},
{
name: '订单余额支付金额',
value: 0
},
{
name: '订单线下支付金额',
value: 0
},
{
name: '订单支付宝支付额',
value: 0
},
{
name:'堂食订单数',
value: 0
},
{
name:'堂食订单金额',
value: 0
},
{
name:'自取订单数',
value: 0
},
{
name:'自取订单金额',
value: 0
},
{
name:'外卖订单数',
value: 0
},
{
name:'外卖订单金额',
value: 0
},
{
name:'退款订单数',
value: 0
},
{
name:'成功退款金额',
value: 0
},
{
name:'微信成功退款金额',
value: 0
},
{
name:'余额成功退款金额',
value: 0
},
{
name:'线下成功退款金额',
value: 0
},
{
name:'支付宝成功退款金额',
value: 0
},
{
name:'充值数',
value: 0
},
{
name:'充值金额',
value: 0
},
{
name:'开通会员数',
value: 0
},
{
name:'开通会员金额',
value: 0
},
{
name:'配送费',
value: 0
},
{
name:'收银笔数',
value: 0
},
{
name:'收银金额',
value: 0
},
{
name:'订单满减优惠金额',
value: 0
},
{
name:'订单积分兑换金额',
value: 0
},
{
name:'订单优惠券减免金额',
value: 0
},
{
name:'订单会员优惠金额',
value: 0
},
{
name:'充值赠送金额',
value: 0
},
{
name:'堂食退款金额',
value: 0
},
{
name:'外卖退款金额',
value: 0
},
{
name:'自取退款金额',
value: 0
},
{
name:'堂食订单金额',
value: 0
},
{
name:'外卖订单金额',
value: 0
},
{
name:'配送费退款',
value: 0
},
{
name:'配送费总额',
value: 0
},
{
name:'微信到账金额',
value: 0
},
{
name:'支付宝到账金额',
value: 0
},
{
name:'收银支付金额',
value: 0
},
{
name:'收银余额支付金额',
value: 0
},
{
name:'收银微信支付金额',
value: 0
},
{
name:'挂账金额',
value: 0
},
{
name:'商家减免',
value: 0
}
]
})
function toggleIsDayin() {
form.isDayin = !form.isDayin
}
function back() {
uni.navigateBack()
}
function jiaoban() {
}
</script>
<style lang="scss" scoped>
.border-r {
position: relative;
&::after {
position: absolute;
display: block;
content: '';
width: 1px;
border-radius: 1px;
right: 100rpx;
top: 32rpx;
bottom: 32rpx;
background-color: #E5E5E5;
;
}
}
.list {
.item {
width: 33.333%;
}
}
.bottom {
background-color: transparent;
bottom: 84rpx;
left: 28rpx;
right: 28rpx;
.u-absolute {
bottom: 100%;
margin-bottom: 32rpx;
right: 0;
}
}
</style>

View File

@@ -0,0 +1,372 @@
<template>
<view class="top fixed-top bg-fff">
<my-tabs :list="tabs.list" @change="tabsChange"></my-tabs>
<view class="u-flex color-main u-m-t-32 " v-if="tabs.current===1">
<view class="u-flex u-p-l-20 " @tap="showJiaobanPickerView">
<view class=" u-flex u-row-between ">
<view>
<text class="" v-if="filters.jiaobanSelItem===''">暂未选择</text>
<text v-else>
{{filters.jiaobanSelItem.name}}
</text>
</view>
<view class="u-flex u-p-l-20 u-flex-1">
<image src="/pageWorkControl/static/images/icon-arrow-down-fill.svg"
class="icon-arrow-down-fill " mode=""></image>
</view>
</view>
</view>
<view class="u-flex u-p-l-20 u-flex-1 u-row-center">
<view @tap="timeToggle">
<view class=" u-font-24 color-main u-flex" v-if="filters.time.start&&filters.time.end">
<uni-dateformat format="yyyy-MM-dd" :date="filters.time.start"></uni-dateformat>
<text class="u-p-l-10 u-p-r-10"></text>
<uni-dateformat format="yyyy-MM-dd" :date="filters.time.end"></uni-dateformat>
<!-- <view class="u-m-l-10 u-flex" @tap="clearTime">
<uni-icons type="clear" size="18" :color="color.ColorMain"></uni-icons>
</view> -->
</view>
<view class="" v-else>所有时间</view>
</view>
<view class="u-flex u-m-l-12">
<image src="/pageWorkControl/static/images/icon-arrow-down-fill.svg" class="icon-arrow-down-fill "
mode=""></image>
</view>
</view>
</view>
</view>
<template v-if="tabs.current===0">
<view class="color-333 u-font-28 min-page bg-gray default-box-padding" style="padding-top: 83px;">
<view class="bg-fff border-r-12 default-box-padding">
<view>
<view class="font-bold">班次</view>
<view class="u-m-t-16 u-flex u-row-between u-p-b-24 border-bottom" @tap="showJiaobanPickerView">
<view>
<text class="color-999" v-if="banci.selItem===''">暂未选择</text>
<text v-else>
{{banci.selItem.name}}
</text>
</view>
<view class="u-flex">
<uni-icons type="right" color="#999" size="16"></uni-icons>
</view>
</view>
<!-- <picker @change="banciChange" :value="banci.current" range-key="name" :range="banci.list">
<view class="u-m-t-16 u-flex u-row-between u-p-b-24 border-bottom">
<view>
<text class="color-999" v-if="banci.current===''">暂未选择</text>
<text v-else>
{{banci.list[banci.current].name}}
</text>
</view>
<view class="u-flex">
<uni-icons type="right" color="#999" size="16"></uni-icons>
</view>
</view>
</picker> -->
</view>
<view class="u-m-t-24">
<view class="font-bold">开班时间</view>
<view class="u-m-t-16 u-flex u-row-between u-p-b-24 border-bottom" @tap="jiaobanStartShow">
<view>
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="form.kaibanTime"></uni-dateformat>
<text></text>
</view>
<view class="u-flex">
<uni-icons type="right" color="#999" size="16"></uni-icons>
</view>
</view>
</view>
<view class="u-m-t-24">
<view class="font-bold">交班时间</view>
<view class="u-m-t-16 u-flex u-row-between u-p-b-24 border-bottom">
<view>
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="form.jiaobanTime"></uni-dateformat>
<text></text>
</view>
<!-- <view class="u-flex">
<uni-icons type="right" color="#999" size="16"></uni-icons>
</view> -->
</view>
</view>
</view>
</view>
</template>
<template v-if="tabs.current===1">
<view class="color-333 u-font-28 min-page bg-gray default-box-padding" style="padding-top: 116px;">
<scroll-view :scroll-x="true" class="bg-fff table u-text-center">
<view class="bg-fff border-r-12 u-flex no-wrap u-col-top">
<view class="">
<view class="head">班次号</view>
<view class="item" @tap="toDetail(item)" v-for="(item,index) in 10" :key="index">10002</view>
</view>
<view class="">
<view class="head">班次</view>
<view class="item" @tap="toDetail(item)" v-for="(item,index) in 10" :key="index">早班</view>
</view>
<view class="">
<view class="head">交班人</view>
<view class="item" @tap="toDetail(item)" v-for="(item,index) in 10" :key="index">交班人</view>
</view>
<view class="">
<view class="head">开班时间</view>
<view class="item" @tap="toDetail(item)" v-for="(item,index) in 10" :key="index">2024-05-29 11:15:18</view>
</view>
<view class="">
<view class="head">交班时间</view>
<view class="item" @tap="toDetail(item)" v-for="(item,index) in 10" :key="index">2024-05-29 11:15:18</view>
</view>
<view class="">
<view class="head">订单数</view>
<view class="item" @tap="toDetail(item)" v-for="(item,index) in 10" :key="index">0</view>
</view>
<view class="">
<view class="head">订单金额</view>
<view class="item u-flex u-row-between" @tap="toDetail(item)" v-for="(item,index) in 10" :key="index">
<text>0.00</text>
<uni-icons type="right" color="#999" size="16"></uni-icons>
</view>
</view>
</view>
</scroll-view>
<uni-load-more :status="table.status"></uni-load-more>
<view style="height: 100px;"></view>
</view>
</template>
<view class="u-fixed bottom u-flex bg-fff ">
<view class="u-flex-1">
<my-button bgColor="#333" color="#fff" borderRadius="100rpx 0 0 100rpx" shape="circle" plain type="primary"
@tap="toSetting">设置</my-button>
</view>
<view class="u-flex-1">
<my-button borderRadius="0 100rpx 100rpx 0" shape="circle" type="primary" @tap="jiaoban">开始交班</my-button>
</view>
</view>
<!-- 交班开班时间选择 -->
<my-date-pickerview @confirm="jiaobanPickerConfirm" :defaultTime="jiaobanDateIndex" :isArea="false"
ref="jiaobanDatePicker"></my-date-pickerview>
<!-- 交班记录时间筛选 -->
<my-date-pickerview @confirm="datePickerConfirm" mode="date" ref="datePicker"></my-date-pickerview>
<!-- 班次选择 -->
<my-pickerview autoClear @confirm="banciConfirm" :showTitle="false" range-key="name" ref="jiaobanPickerView"
:list="banci.list"></my-pickerview>
</template>
<script setup>
import {
onLoad,
onReady,
onHide,
onShow,
onPageScroll,
onPullDownRefresh
} from '@dcloudio/uni-app';
import {
computed,
reactive,
ref,
watch
} from 'vue';
import myButton from '@/components/my-components/my-button';
import myTabs from '@/components/my-components/my-tabs';
import color from '@/commons/color.js';
import myDatePickerview from '@/components/my-components/my-date-pickerview'
import myPickerview from '@/components/my-components/my-pickerview'
import go from '@/commons/utils/go.js'
function toDetail(){
go.to('PAGES_WORK_HANDOVER_DETAIL')
}
function toSetting() {
go.to('PAGES_WORK_SETTING')
}
function jiaoban() {
if (banci.selItem === '') {
return uni.showToast({
title: '请选择班次',
icon: 'none'
})
}
go.to('PAGES_WORK_HANDOVER_CONFIRM')
}
const jiaobanDatePicker = ref(null)
function jiaobanStartShow() {
jiaobanDatePicker.value.open()
}
const jiaobanPickerView = ref(null)
function showJiaobanPickerView() {
jiaobanPickerView.value.open()
}
function jiaobanPickerConfirm(e) {
form.kaibanTime = e
}
const form = reactive({
kaibanTime: new Date(),
jiaobanTime: new Date()
})
const jiaobanDateIndex = ref([
form.kaibanTime.getFullYear(),
form.kaibanTime.getMonth(),
form.kaibanTime.getDate(),
form.kaibanTime.getHours(),
form.kaibanTime.getMinutes(),
form.kaibanTime.getSeconds(),
])
let timer = null
function updateJiaoban() {
clearInterval(timer)
timer = setInterval(() => {
form.jiaobanTime = new Date()
}, 1000)
}
const banci = reactive({
list: [{
name: '早班',
value: 1
},
{
name: '中班',
value: 2
},
{
name: '晚班',
value: 3
},
],
selItem: '',
current: ''
})
function banciConfirm(e) {
if (tabs.current) {
filters.jiaobanSelItem = e[0]
} else {
banci.selItem = e[0]
}
}
function banciChange(e) {
banci.current = e.detail.value
}
const tabs = reactive({
list: ['交班', '交班记录'],
current: 0
})
function tabsChange(i) {
tabs.current = i
}
const table = reactive({
status: 'noMore'
})
const filters = reactive({
jiaobanCurrent: '',
jiaobanSelItem: '',
time: {
start: '',
end: ''
}
})
function clearTime() {
filters.time.start = ''
filters.time.end = ''
}
function timeToggle() {
datePicker.value.toggle()
}
const datePicker = ref(null)
function datePickerConfirm(e) {
console.log(e);
filters.time.start = e.start
filters.time.end = e.end
}
function filterBanciChange(e) {
filters.jiaobanCurrent = e.detail.value
}
onShow(() => {
form.jiaobanTime = new Date()
updateJiaoban()
})
onHide(() => {
clearInterval(timer)
})
watch(() => tabs.current, (newval) => {
if (newval) {
clearInterval(timer)
filters.jiaobanSelItem = ''
} else {
banci.selItem = ''
updateJiaoban()
}
})
</script>
<style lang="scss" scoped>
.min-page {}
.fixed-top {
padding: 32rpx 28rpx;
z-index: 100;
}
.bottom {
background-color: transparent;
bottom: 84rpx;
left: 28rpx;
right: 28rpx;
}
.table {
border-radius: 12rpx 12rpx 0rpx 0rpx;
overflow: hidden;
font-size: 24rpx;
.head {
padding: 24rpx;
background: #AEBAD2;
color: #fff;
font-size: 24rpx;
}
.item {
padding: 24rpx;
}
.item:nth-of-type(2n+1) {
background-color: rgb(249, 249, 249);
}
}
</style>

View File

@@ -0,0 +1,250 @@
<template>
<my-model ref="model" :borderRadius="18" :title="title" iconColor="#000" @close="resetForm">
<template #desc>
<view class="u-text-left u-p-30 ">
<view class="u-m-t-40 ">
<view>班名次</view>
<view class="u-p-l-32 border u-m-t-24 u-flex-1">
<uni-easyinput paddingNone :inputBorder="false" v-model="form.name"
placeholder="请输入班次名称"></uni-easyinput>
</view>
</view>
<template v-if="active!=1">
<view class="u-m-t-40 " @tap="timePickerShow(form.start,'start')">
<view>开始时间</view>
<view class="u-p-l-32 border lh35 u-flex u-m-t-24 u-flex-1">
<view class="u-flex">
<image src="/pageWorkControl/static/images/icon-time.svg" class="icon-time" mode=""></image>
</view>
<view class="u-m-l-12">
<text v-if="!form.start" class="color-666">请选择开始时间</text>
<text v-else>{{form.start}}</text>
</view>
</view>
</view>
<view class="u-m-t-40 " @tap="timePickerShow(form.end,'end')">
<view>结束时间</view>
<view class="u-p-l-32 border lh35 u-flex u-m-t-24 u-flex-1">
<view class="u-flex">
<image src="/pageWorkControl/static/images/icon-time.svg" class="icon-time" mode=""></image>
</view>
<view class="u-m-l-12">
<text v-if="!form.end" class="color-666">请选择结束时间</text>
<text v-else>{{form.end}}</text>
</view>
</view>
</view>
</template>
</view>
</template>
<template #btn>
<view class="u-p-30">
<view class="u-m-t-10">
<my-button @tap="confirm" shape="circle" showShadow>{{props.title==='添加'?'添加':'提交'}}</my-button>
<my-button type="cancel" bgColor="#fff" @tap="close">取消</my-button>
</view>
</view>
</template>
</my-model>
<my-pickerview autoClear :isLink="false" mode="time" @confirm="timeConfirm" :showTitle="false" ref="timePicker"
:defaultIndex="times.defaultIndex"
></my-pickerview>
</template>
<script setup>
import {
reactive,
nextTick,
ref
} from 'vue';
import myPickerview from '@/components/my-components/my-pickerview'
import myModel from '@/components/my-components/my-model.vue'
import myButton from '@/components/my-components/my-button.vue'
const props = defineProps({
active:{
type:[String,Number],
default:1
},
mode:{
//time none
type:String,
default:'none'
},
title: {
type: String,
default: ''
},
data: {
type: Array,
default: []
}
})
function timeConfirm(e){
form[times.selType]=e.join(':')
}
const times=reactive({
defaultIndex:[0,0],
selType:'',
})
const timePicker = ref(null)
function timePickerShow(time,timeshowKey){
times.selType=timeshowKey
const date=new Date()
if(time===''){
times.defaultIndex=[date.getHours(),date.getMinutes()]
}else{
console.log(time.split(':').map(v=>parseInt(v)));
times.defaultIndex=time.split(':').map(v=>parseInt(v))
}
timePicker.value.open()
}
function currentPriceChange(newval){
nextTick(()=>{
form.discount=(newval*100/form.price).toFixed()
})
}
function discountChange(newval){
nextTick(()=>{
form.currentPrice=(form.price*newval/100).toFixed(2)
})
}
const $form = {
name:'',
start:'',
end:'',
}
const form = reactive({
...$form
})
function resetForm() {
Object.assign(form, {
...$form
})
}
const model = ref(null)
function open(item) {
if(item){
Object.assign(form,item)
}
model.value.open()
emits('open')
}
function close() {
model.value.close()
resetForm()
emits('close')
}
const emits = defineEmits(['confirm','close','open'])
function confirm() {
const {
name,start,end
} = form
if(!name){
return uni.showToast({
title:'请输入班次名',
icon:'none'
})
}
if(props.active==0){
if(!start){
return uni.showToast({
title:'请选择开始时间',
icon:'none'
})
}
if(!end){
return uni.showToast({
title:'请选择结束时间',
icon:'none'
})
}
}
emits('confirm',{...form})
close()
}
defineExpose({
open,
close
})
</script>
<style lang="scss">
.lh35{
line-height: 35px;
}
.icon-time{
width: 28rpx;
height: 28rpx;
}
.border{
border-radius: 8rpx;
}
.lh34 {
line-height: 34rpx;
}
.tag {
background-color: #fff;
border: 1px solid #E5E5E5;
line-height: inherit;
font-size: 24rpx;
color: #666666;
padding: 6rpx 20rpx;
border-radius: 8rpx;
&.active {
border-color: #E6F0FF;
color: $my-main-color;
}
}
.hover-class {
background-color: #E5E5E5;
}
.discount {
.u-absolute {
top: 0;
bottom: 0;
right: 0;
}
}
.bg1 {
background: #F7F7FA;
}
.tab {
padding: 0 80rpx;
}
.border {
border: 1px solid #E5E5E5;
border-radius: 4rpx;
}
.input-box {
padding: 22rpx 32rpx;
font-size: 28rpx;
color: #666;
}
.placeholder-class {
font-size: 28rpx;
}
</style>

View File

@@ -0,0 +1,235 @@
<template>
<view class="min-page bg-gray u-p-30 u-font-28 color-333">
<view class="bg-fff border-r-12 default-box-padding">
<view class="font-bold">交班模式</view>
<view class="u-m-t-24">
<radio-group @change="jiaobanModelChange">
<label class="radio u-m-r-60" v-for="(item,index) in jiaobanModel.list" :key="index">
<radio :value="''+index" :checked="index == jiaobanModel.active" class="scale7 " />
<text>{{item.label}}</text>
</label>
</radio-group>
</view>
</view>
<template v-if="jiaobanModel.active==0">
<view v-for="(item,index) in bancis.timeList" :key="index" >
<view class="bg-fff u-m-t-32 border-r-12 default-box-padding">
<view class="color-666">班次</view>
<view class="u-flex u-m-t-24 u-p-b-24 border-bottom u-row-between" @tap="addBanciOpen(item,index)">
<view class="">
<text>{{item.name}}</text>
<text></text>
<text>{{item.start}}</text>
<text>-</text>
<text>{{item.end}}</text>
</view>
<view class="u-flex">
<uni-icons type="right" color="#999"></uni-icons>
</view>
</view>
<view class="u-flex u-m-t-28" @tap="listDel(bancis.timeList,index)">
<view class="u-flex">
<uni-icons size="20" type="minus-filled" :color="$colorRed"></uni-icons>
</view>
<view class="u-m-l-12 red">删除</view>
</view>
</view>
</view>
</template>
<template v-if="jiaobanModel.active==1">
<view v-for="(item,index) in bancis.list" :key="index">
<view class="bg-fff u-m-t-32 border-r-12 default-box-padding">
<view class="color-666">班次</view>
<view class="u-flex u-m-t-24 u-p-b-24 border-bottom u-row-between" @tap="addBanciOpen(item,index)">
<view class="">
{{item.name}}
</view>
<view class="u-flex">
<uni-icons type="right" color="#999"></uni-icons>
</view>
</view>
<view class="u-flex u-m-t-28" @tap="listDel(bancis.list,index)">
<view class="u-flex">
<uni-icons size="20" type="minus-filled" :color="$colorRed"></uni-icons>
</view>
<view class="u-m-l-12 red">删除</view>
</view>
</view>
</view>
</template>
<view class="bg-fff u-flex u-m-t-32 border-r-12 default-box-padding" @tap="addBanciOpen">
<uni-icons type="plus-filled" :color="color.ColorMain" size="20"></uni-icons>
<view class="u-m-l-16">添加选项</view>
</view>
<view class="bg-fff u-m-t-32 border-r-18 default-box-padding">
<view class="" v-for="(radios,index) in radioGroups" :key="index">
<view class="font-bold">{{radios.title}}</view>
<view class="u-m-t-24 u-p-b-24 u-m-b-24" :class="{'border-bottom':index<radioGroups.length-1}">
<radio-group @change="radioGroupChange($event,radios)">
<label class="radio u-m-r-60" v-for="(item,itemindex) in radios.list" :key="itemindex">
<radio :value="''+itemindex" :checked="itemindex === radios.active" class="scale7 " />
<text>{{item.label}}</text>
</label>
</radio-group>
</view>
</view>
</view>
</view>
<view class="u-fixed bottom u-flex bg-fff ">
<view class="u-flex-1">
<my-button bgColor="#333" color="#fff" borderRadius="100rpx 0 0 100rpx" shape="circle" plain type="primary"
@tap="back">返回</my-button>
</view>
<view class="u-flex-1">
<my-button @tap="confirm" borderRadius="0 100rpx 100rpx 0" shape="circle" type="primary">确定</my-button>
</view>
</view>
<add-banci @confirm="addBanciConfirm" :active="jiaobanModel.active" :title="refAddBanciTitle" ref="refAddBanci"></add-banci>
</template>
<script setup>
import color from '@/commons/color.js'
import myButton from '@/components/my-components/my-button';
import addBanci from './components/add-banci';
import {
reactive, ref
} from 'vue';
const refAddBanci=ref(null)
const refAddBanciTitle=ref('添加')
function addBanciOpen(item,index){
bancis.selIndex=index
refAddBanciTitle.value=item.hasOwnProperty('name')?'编辑':'添加'
refAddBanci.value.open(item.hasOwnProperty('name')?item:null)
}
function addBanciConfirm(e){
console.log(e);
if(refAddBanciTitle.value==='添加'){
if(jiaobanModel.active==1){
bancis.list.push(e)
}else{
bancis.timeList.push(e)
}
}
}
function listDel(list,index){
uni.showModal({
title: '提示',
content: '确定删除【'+list[index].name+'】吗?',
success: function (res) {
if (res.confirm) {
list.splice(index,1)
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
}
const $colorRed = '#EB4F4F'
const bancis = reactive({
selIndex:'',
timeList: [{
name: '测试',
start: '6:00',
end: '12:00'
}],
list: [{
name: '早班'
},
{
name: '中班'
},
{
name: '晚班'
}
]
})
function back() {
uni.navigateBack()
}
function confirm() {
}
const jiaobanModel = reactive({
list: [{
label: '按时间段',
value: 0
},
{
label: '自定义',
value: 1
},
],
active: 1
})
const radioBasicArr = [{
label: '统计',
value: 0
},
{
label: '不统计',
value: 1
},
]
function returnRadioGroups(arr) {
return arr.map(v => {
return {
title: v,
active: 0,
list: [...radioBasicArr],
}
})
}
const textlists = [
'订单数', '订单额', '订单微信支付金额', '订单余额支付金额', '订单线下支付金额', '订单支付宝金额',
'堂食订单数', '堂食订单金额', '自取订单数', '自取订单金额', '外卖订单数', '外卖订单金额', '退款订单数',
'成功退款金额', '微信成功退款金额', '余额成功退款金额', '线下成功退款金额', '支付宝成功退款金额', '充值数',
'充值金额', '开通会员数', '开通会员金额', '配送费', '收银笔数', '收银金额', '订单满减优惠金额', '订单积分兑换金额',
'订单优惠券减免金额', '订单会员优惠金额', '充值赠送金额', '堂食退款金额', '外卖退款金额', '自取退款金额', '配送费退款',
'配送费总额', '微信到账金额', '支付宝到账金额', '收银支付宝金额', '收银余额支付金额', '收银微信支付金额'
]
const radioGroups = reactive(returnRadioGroups(textlists))
function radioGroupChange(e, item) {
console.log(e);
console.log(item);
item.active = e.detail.value
console.log(radioGroups);
}
function jiaobanModelChange(e) {
jiaobanModel.active = e.detail.value
}
</script>
<style scoped lang="scss">
$red: #EB4F4F;
.red {
color: $red;
}
.bottom {
background-color: transparent;
bottom: 84rpx;
left: 28rpx;
right: 28rpx;
}
</style>

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="8.42" height="4.945" viewBox="0 0 8.42 4.945"><defs><style>.a{fill:#318afe;}</style></defs><path class="a" d="M230.634,368.187a.7.7,0,0,0-.513-.187l-7,.047a.7.7,0,0,0-.513.187.676.676,0,0,0,0,.979l3.5,3.5c.047.047.14.093.187.14l.047.047a.731.731,0,0,0,.746-.14l3.5-3.546A.735.735,0,0,0,230.634,368.187Z" transform="translate(-222.4 -368)"/></svg>

After

Width:  |  Height:  |  Size: 393 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14"><defs><style>.a{fill:#999;}</style></defs><g transform="translate(-96 -96)"><path class="a" d="M103,108.923A5.923,5.923,0,1,0,97.077,103,5.923,5.923,0,0,0,103,108.923ZM103,110a7,7,0,1,1,7-7A7,7,0,0,1,103,110Z"/><path class="a" d="M449.069,260.812h3.208a.535.535,0,1,1,0,1.069h-3.743a.535.535,0,0,1-.535-.535v-4.812a.535.535,0,0,1,1.069,0Z" transform="translate(-346.162 -157.146)"/></g></svg>

After

Width:  |  Height:  |  Size: 475 B