From 4b80c98ef5fda8d6358778f2efe8bb35cb20ccf9 Mon Sep 17 00:00:00 2001
From: queenwuli <942534046@qq.com>
Date: Fri, 15 Jan 2021 16:18:21 +0800
Subject: [PATCH] gx
---
hive-app/pages/workbench/serviceOrderList.vue | 280 +++++++++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 258 insertions(+), 22 deletions(-)
diff --git a/hive-app/pages/workbench/serviceOrderList.vue b/hive-app/pages/workbench/serviceOrderList.vue
index 3093ccb..0f7267f 100644
--- a/hive-app/pages/workbench/serviceOrderList.vue
+++ b/hive-app/pages/workbench/serviceOrderList.vue
@@ -1,11 +1,13 @@
<template>
<view>
<view class="header">
- <search-bar class="mb-0" placeholder="输入会员姓名、手机号、订单号查询"></search-bar>
+ <search-bar @confirm="search" class="mb-0" placeholder="输入会员姓名、手机号、订单号查询"></search-bar>
</view>
<view>
<h-tabs
class="tab"
+ :activeIndex="orderStatus"
+ @tabClick="tabChange"
:tabData="tabs"
:config="{
color: '#abb1cc',
@@ -17,42 +19,62 @@
}"
/>
<view class="list">
- <navigator url="./serviceOrderDetail" class="list-item" v-for="item in 4">
+ <navigator :url="'./serviceOrderDetail?id='+item.id" class="list-item" v-for="item in list">
<view class="list-header">
- <text>订单号: N202012123556</text>
- <text class="gray">2020-12-15 18:11:01</text>
+ <text>订单号: {{item.serviceNo}}</text>
+ <text class="gray">{{item.time}}</text>
</view>
<view class="list-content">
<view class="flex flex-v">
<view>
<image src="../../static/images/order-icon1.png" class="icon"></image>
- <text>李广</text>
+ <text>{{item.vipName}}</text>
</view>
<view class="flex mt-10">
<image src="../../static/images/order-icon2.png" class="icon" style="padding-top: 3px;"></image>
<view>
- <text>肽补水·无创水光管理</text>
- <text class="block mt-5">肽补水·无创水光管理</text>
+ <text class="block" :class="index===0?'':'mt-5'" v-for="(op, index) in item.projs">{{op.projName}}</text>
</view>
</view>
<view class="mt-10">
<image src="../../static/images/order-icon3.png" class="icon"></image>
- <text>VIP-2（星海店）</text>
+ <text>{{item.bed || '-'}}</text>
</view>
</view>
- <view class="flex flex-v right">
- <text class="gray">90分钟</text>
- <text class="gray mt-10">莉莉</text>
- <text class="gray mt-5">雯雯</text>
- <text class="blue mt-10">待付款</text>
+ <view class="flex flex-v right" style="flex: 0 0 70px;">
+ <text class="gray mb-5">{{item.timeLength}}分钟</text>
+ <text class="gray mt-5" v-for="(op, index) in item.projs">{{op.beautyName || '-'}}</text>
+ <text class="mt-10" :class="item.status==7 || item.status==8?'gray':'blue'">{{item.status | formatStatus}}</text>
</view>
</view>
- <view class="list-footer">
- <text class="white-btn small-btn">取消</text>
- <text class="blue-btn small-btn ml-10">开始服务</text>
+ <view :class="isShowFooter(item.status, item.projs, item.staffId)?'list-footer':''">
+ <text class="white-btn small-btn"
+ v-if="isShowCancelBtn(item.status, item.projs, item.staffId)"
+ @click.stop="cancelOrder(item.id)">
+ 取消
+ </text>
+ <text class="blue-btn small-btn ml-10"
+ v-if="isShowOrder(item.status)"
+ @click.stop="confirmServiceOrder(item.id)">
+ 确认预约
+ </text>
+ <text class="blue-btn small-btn ml-10"
+ v-if="isShowStartServiceBtn(item.status, item.projs)"
+ @click.stop="startService(item.id)">
+ 开始服务
+ </text>
+ <text class="blue-btn small-btn ml-10"
+ v-if="isShowEndServiceBtn(item.status, item.projs)"
+ @click.stop="endService(item.id)">
+ 结束服务
+ </text>
</view>
</navigator>
+ <no-record :isShow="!list.length" txt="暂无服务单记录"></no-record>
+ <view v-if="list.length">
+ <uni-load-more :status="loadStatus" color="#a5abaf"></uni-load-more>
+ </view>
</view>
</view>
</view>
@@ -61,21 +83,29 @@
<script>
import HTabs from "@/components/liuyuno-tabs/liuyuno-tabs.vue";
import searchBar from '../../components/searchBar/index.vue';
+ import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
export default {
components: {
HTabs,
- searchBar
+ searchBar,
+ uniLoadMore
},
data() {
return {
+ queryKey: '',
+ orderStatus: 0,
tabs:[
{
- state: 1,
+ state: 0,
name: '全部'
},
{
+ state: 1,
+ name: '待确认'
+ },
+ {
state: 2,
- name: '待预约'
+ name: '待排班'
},
{
state: 3,
@@ -94,7 +124,212 @@
name: '已完成'
}
],
+ list: [],
+ userId: '',
+ loadStatus: 'more',
+ pageNum: 1
}
+ },
+ onLoad(options) {
+ if(options.status){
+ this.orderStatus = Number(options.status);
+ }
+ if(options.queryKey){
+ this.queryKey = options.queryKey;
+ }
+ this.loadList();
+ this.userId = this.$httpUtils.getRoleInfo().id;
+ // 判断权限
+ // #ifdef APP-PLUS
+ if(!this.$utils.hasPermission('fwdgl.add')){
+ let webView = this.$mp.page.$getAppWebview();
+ webView.setTitleNViewButtonStyle(0, {
+ width: 0,
+ });
+ }
+ // #endif
+ },
+ onPullDownRefresh(){
+ this.reloadData();
+ let timer = setTimeout(function () {
+ uni.startPullDownRefresh();
+ clearTimeout(timer);
+ timer = null;
+ }, 800);
+ },
+ onReachBottom(){
+ this.loadList()
+ },
+ onNavigationBarButtonTap(Object){
+ if(Object.key === 'add'){
+ uni.navigateTo({
+ url: './selectCustomer?type=2'
+ })
+ }
+ },
+ methods:{
+ reloadData(){
+ this.list = [];
+ this.pageNum = 1;
+ this.loadStatus = 'more';
+ this.loadList();
+ },
+ loadList(){
+ if(this.loadStatus!=='more'){
+ return;
+ }
+ this.$httpUtils.request('/api/serviceOrder/findServiceOrderList', {
+ pageNum: this.pageNum,
+ pageSize: 10,
+ queryKey: this.queryKey,
+ status: this.orderStatus
+ }, 'POST').then((res) => {
+ if(res.status == 200){
+ let result = res.rows;
+ if(result.length < 10){
+ this.loadStatus = 'noMore';
+ } else {
+ this.pageNum ++ ;
+ this.loadStatus = 'more';
+ }
+ this.list = this.list.concat(result);
+ }
+ })
+ },
+ // 是否显示操作按钮
+ isShowFooter(status, items, staffId){
+ return this.isShowCancelBtn(status, items, staffId) ||
+ this.isShowStartServiceBtn(status, items) ||
+ this.isShowEndServiceBtn(status, items) ||
+ this.isShowOrder(status)
+ },
+ // 是否显示取消按钮
+ isShowCancelBtn(status, items, staffId){
+ // 美疗师和下单顾问可以取消服务
+ let isEnable = (items.some((item) => item.id == this.userId)) || (this.userId == staffId);
+ return status != 5 && status != 6 && status != 7 && status != 8 && isEnable && this.$utils.hasPermission('fwdgl.cancel');
+ },
+ // 是否显示确认预约
+ isShowOrder(status){
+ return status == 9 && this.$utils.hasPermission('fwdgl.qryy');
+ },
+ // 是否显示开始服务按钮
+ isShowStartServiceBtn(status, items){
+ // 只有美疗师本人才可以开始服务
+ let isEnable = items.some((item) => item.id == this.userId)
+ return status == 4 && isEnable && this.$utils.hasPermission('fwdgl.begin');
+ },
+ // 是否显示结束服务按钮
+ isShowEndServiceBtn(status, items){
+ // 只有美疗师本人才可以开始服务
+ let isEnable = items.some((item) => item.id == this.userId)
+ return status == 5 && isEnable && this.$utils.hasPermission('fwdgl.end');
+ },
+ search(val){
+ this.queryKey = val;
+ this.reloadData();
+ },
+ tabChange(index){
+ if(this.orderStatus === index){
+ return;
+ }
+ this.orderStatus = index;
+ this.reloadData();
+ },
+ // 取消订单
+ cancelOrder(id){
+ uni.showModal({
+ title: '提示',
+ content: '确定取消服务吗？',
+ success: (res) => {
+ if (res.confirm) {
+ this.$httpUtils.request('/api/serviceOrder/cancelService/'+id).then((res) => {
+ if(res.status == 200){
+ this.reloadData()
+ }
+ this.$toast.info(res.info);
+ })
+ }
+ }
+ });
+ },
+ // 确认预约
+ confirmServiceOrder(id){
+ uni.showModal({
+ title: '提示',
+ content: '确认预约吗？',
+ success: (res) => {
+ if (res.confirm) {
+ this.$httpUtils.request('/api/serviceOrder/confirmServiceOrder', {
+ id:id
+ }, 'POST').then((res) => {
+ if(res.status == 200){
+ this.reloadData()
+ }
+ this.$toast.info(res.info);
+ })
+ }
+ }
+ });
+ },
+ //开始服务
+ startService(id){
+ uni.showModal({
+ title: '提示',
+ content: '确定开始服务吗？',
+ success: (res) => {
+ if (res.confirm) {
+ this.$httpUtils.request('/api/serviceOrder/startService/'+id).then((res) => {
+ if(res.status == 200){
+ this.reloadData()
+ }
+ this.$toast.info(res.info);
+ })
+ }
+ }
+ });
+ },
+ // 结束服务
+ endService(id){
+ uni.showModal({
+ title: '提示',
+ content: '确定结束服务吗？',
+ success: (res) => {
+ if (res.confirm) {
+ this.$httpUtils.request('/api/serviceOrder/stopService/'+id).then((res) => {
+ if(res.status == 200){
+ this.reloadData()
+ }
+ this.$toast.info(res.info);
+ })
+ }
+ }
+ });
+ }
+ },
+ filters:{
+ // 状态 1-待预约 2-待派单 3-待配料 4-待服务 5-服务中 6-服务完成 7-服务单结束 8-服务单取消
+ formatStatus(val){
+ if(val==1){
+ return '待预约'
+ } else if(val == 2){
+ return '待派单'
+ } else if(val == 3){
+ return '待配料'
+ } else if(val == 4){
+ return '待服务'
+ } else if(val == 5){
+ return '服务中'
+ } else if(val == 6){
+ return '已完成'
+ } else if(val == 7){
+ return '服务单结束'
+ } else if(val == 9){
+ return '待确认'
+ } else {
+ return '已取消'
+ }
+ },
}
}
</script>
@@ -116,11 +351,12 @@
border-radius: 4px;
margin: 10px;
color: #3a3f3f;
+ padding: 0 10px;
}
.list-header{
display: flex;
justify-content: space-between;
- padding: 12px 15px;
+ padding: 12px 0;
font-size: 15px;
border-bottom: 1px solid #EDEAF4;
}
@@ -128,7 +364,7 @@
display: flex;
justify-content: space-between;
align-items: center;
- padding: 12px 15px;
+ padding: 12px 0;
font-size: 14px;
}
.list-content .icon{
@@ -140,7 +376,7 @@
.list-footer{
display: flex;
justify-content: flex-end;
- padding: 10px 15px;
+ padding: 10px 0;
border-top: 1px solid #EDEAF4;
}
</style>
--
Gitblit v1.9.1